/*
 * Horiaty Typography Overrides
 * Loaded last — overrides Bootstrap + theme defaults
 *
 * Applies to: all article/post pages
 * Excludes:   home, about, contact, blog archive, team pages
 */

/* =====================================================
   SCOPE — all article content wrappers
   single posts, pages (non-excluded), custom posts
   ===================================================== */

/* =====================================================
   1. Body text — paragraphs, list items, table cells
   ===================================================== */
.article-entry-content p,
.article-entry-content li,
.article-entry-content td,
.article-entry-content th {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
}

.article-entry-content p {
    margin-bottom: 14px;
}

/* Links — keep highlight color, match size */
.article-entry-content a {
    font-size: 14px !important;
    line-height: 2 !important;
}

/* =====================================================
   2. Article description + author/reviewer info → 13px
   ===================================================== */
.post-hero-section p,
.post-hero-section .font-14 {
    font-size: 13px !important;
    color: #2a3f45 !important;
    line-height: 1.9 !important;
}
.article-trust-line__text,
.article-trust-line__meta,
.article-trust-line__label {
    font-size: 13px !important;
}

/* =====================================================
   3. Intro box — TOC / Medical Summary / Key Points
   ===================================================== */
.atabs__summary {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
}
.atabs__points li,
.atabs__points li span {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
}

/* =====================================================
   4. FAQ accordion — force over Bootstrap, no bold
   ===================================================== */
.customaccordion .card-header a,
.customaccordion .card-header .collapsed,
.service-faqs .card-header a,
.service-faqs .card-header .collapsed {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
    font-weight: 400 !important;
}
.customaccordion .card-body,
.customaccordion .card-body p,
.customaccordion .card-body li,
.customaccordion .card-body span,
.service-faqs .card-body,
.service-faqs .card-body p,
.service-faqs .card-body li,
.service-faqs .card-body span {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
}

/* =====================================================
   5. Section headings — FAQ box + Related posts
      match article heading color #0d7d95
   ===================================================== */
.article-section__heading {
    color: #0d7d95 !important;
}

/* =====================================================
   6. Heading sizes
   ===================================================== */
.article-entry-content h2 { font-size: 22px !important; }
.article-entry-content h3 { font-size: 20px !important; }
.article-entry-content h4 { font-size: 18px !important; }
.article-entry-content h5 { font-size: 17px !important; }
.article-entry-content h6 { font-size: 16px !important; }

/* =====================================================
   7. Heading ladder indentation
   H2=0  H3=1.5rem  H4=3rem  H5=4.5rem  H6=6rem
   ===================================================== */
.article-entry-content h2 {
    margin-inline-start: 0 !important;
    margin-top: 40px !important;
    margin-bottom: 10px;
}
.article-entry-content h3 {
    margin-inline-start: 1.5rem !important;
    margin-top: 30px !important;
    margin-bottom: 8px;
}
.article-entry-content h4 {
    margin-inline-start: 3rem !important;
    margin-top: 22px !important;
    margin-bottom: 6px;
}
.article-entry-content h5 {
    margin-inline-start: 4.5rem !important;
    margin-top: 16px !important;
    margin-bottom: 4px;
}
.article-entry-content h6 {
    margin-inline-start: 6rem !important;
    margin-top: 12px !important;
    margin-bottom: 4px;
}

/* =====================================================
   8. Content indent — set by JS class (content-under-hX)
      Lists: remove extra padding-inline-start, use margin only
   ===================================================== */
.article-entry-content .content-under-h2 {
    margin-inline-start: 0 !important;
}
.article-entry-content .content-under-h3 {
    margin-inline-start: 1.5rem !important;
}
.article-entry-content .content-under-h4 {
    margin-inline-start: 3rem !important;
}
.article-entry-content .content-under-h5 {
    margin-inline-start: 4.5rem !important;
}
.article-entry-content .content-under-h6 {
    margin-inline-start: 6rem !important;
}

/* Remove default padding so margin alone controls list position */
.article-entry-content ul[class*="content-under-"],
.article-entry-content ol[class*="content-under-"] {
    padding-inline-start: 0 !important;
}

/* =====================================================
   Lists go ONE level deeper than their section heading:
   list after H2 → H3 indent (1.5rem)
   list after H3 → H4 indent (3rem)
   list after H4 → H5 indent (4.5rem)
   list after H5 → H6 indent (6rem)
   ===================================================== */
.article-entry-content ul.list-under-h2,
.article-entry-content ol.list-under-h2 {
    margin-inline-start: 1.5rem !important;
}
.article-entry-content ul.list-under-h3,
.article-entry-content ol.list-under-h3 {
    margin-inline-start: 3rem !important;
}
.article-entry-content ul.list-under-h4,
.article-entry-content ol.list-under-h4 {
    margin-inline-start: 4.5rem !important;
}
.article-entry-content ul.list-under-h5,
.article-entry-content ol.list-under-h5,
.article-entry-content ul.list-under-h6,
.article-entry-content ol.list-under-h6 {
    margin-inline-start: 6rem !important;
}

/* =====================================================
   Fix: multi-line list items — icon stays at top
   ===================================================== */
.article-entry-content ul li,
.article-entry-content ol li {
    align-items: flex-start !important;
}

/* =====================================================
   Images inside articles — no indentation, full width
   ===================================================== */
.article-entry-content figure,
.article-entry-content img,
.article-entry-content .wp-block-image,
.article-entry-content .wp-block-embed,
.article-entry-content .wp-block-video,
.article-entry-content .video-container {
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
}

/* =====================================================
   Video embeds — centered, 16:9, max-width, elegant
   ===================================================== */
.article-entry-content .video-container,
.article-entry-content .wp-block-embed__wrapper,
.article-entry-content [class*="embed-responsive"] {
    position: relative;
    width: 100%;
    max-width: 800px;
    margin: 24px auto !important;
    padding-bottom: 0 !important;
    height: auto;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(0,0,0,0.13);
}

.article-entry-content .video-container iframe,
.article-entry-content .wp-block-embed__wrapper iframe,
.article-entry-content [class*="embed-responsive"] iframe {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 16 / 9;
    height: auto !important;
    border: none;
    border-radius: 12px;
    display: block;
}

/* =====================================================
   Fix: multi-line list items with <br> inside <li>
   Switch from flex to block + absolute icon so ALL
   lines (including after <br>) indent consistently
   ===================================================== */

/* UL */
.article-entry-content ul li {
    display: block !important;
    position: relative !important;
    padding-inline-start: 1.6rem !important;
    align-items: unset !important;
}
.article-entry-content ul li::before {
    position: absolute !important;
    inset-inline-start: 0 !important;
    top: 0.3em !important;
    flex-shrink: unset !important;
}

/* OL */
.article-entry-content ol li {
    display: block !important;
    position: relative !important;
    padding-inline-start: 2.2rem !important;
    align-items: unset !important;
}
.article-entry-content ol li::before {
    position: absolute !important;
    inset-inline-start: 0 !important;
    top: 0.25em !important;
    flex-shrink: unset !important;
}

/* =====================================================
   Article H1 title — 25px
   ===================================================== */
.post-hero-section h1 {
    font-size: 25px !important;
}

/* =====================================================
   Programs & Services hero — no guide-bar
   Close the card bottom properly (full border-radius)
   ===================================================== */
.post-hero-section .member-profile__card--no-guide .post-hero__img-clip {
    margin-bottom: calc(-1 * var(--card-pad)) !important;
    border-radius: var(--main-radius) !important;
}

/* =====================================================
   Mobile: add bottom breathing room in no-guide cards
   (programs & services) — desktop unaffected
   ===================================================== */
@media (max-width: 991px) {
    .post-hero-section .member-profile__card--no-guide .col-lg-7 {
        padding-bottom: 20px;
    }
}

/* =====================================================
   Doctor profile breadcrumb — match article breadcrumb
   ===================================================== */
.hospital-breadcrumb span:not(.bc-sep) {
    color: #636e72;
    font-size: 13px;
}
.hospital-breadcrumb .bc-home {
    font-size: 14px !important;
    color: #1a8ba2 !important;
}
.hospital-breadcrumb a:not(.bc-home) {
    font-size: 13px !important;
    color: #2d3436 !important;
}
.hospital-breadcrumb .bc-sep {
    font-size: 12px !important;
    color: #b2bec3 !important;
}

/* =======================================================
   UNIVERSAL TYPOGRAPHY — all post types
   Matches article body: 14px / #2a3f45 / line-height 2
   ======================================================= */

/* ── Doctor profile (single-team) ── */
/* H1 name */
.member-profile__name {
    font-size: 25px !important;
}
/* Title/position below name */
.member-profile__title {
    font-size: 13px !important;
    color: #2a3f45 !important;
}
/* Bio short text (نبذة تعريفية) */
.member-profile__bio,
.member-profile__bio p,
.member-profile__bio li {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
}
/* Full team content (التفاصيل الكاملة) */
body.single-team .team-member-content,
body.single-team .team-member-content p,
body.single-team .team-member-content li {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
}
/* FAQ in team profile */
body.single-team .customaccordion .card-header a,
body.single-team .service-faqs .card-header a {
    font-size: 14px !important;
    color: #2a3f45 !important;
    font-weight: 400 !important;
}
body.single-team .customaccordion .card-body,
body.single-team .customaccordion .card-body p,
body.single-team .service-faqs .card-body,
body.single-team .service-faqs .card-body p {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
}

/* ── Tests (single-test) ── */
body.single-test h1 {
    font-size: 25px !important;
}
body.single-test .font-18.line-19,
body.single-test p.font-18 {
    font-size: 13px !important;
    color: #2a3f45 !important;
    line-height: 1.9 !important;
}
body.single-test .singlecontentbg p,
body.single-test .singlecontentbg li,
body.single-test .font-14.line-19 {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
}
body.single-test .customaccordion .card-header a,
body.single-test .service-faqs .card-header a {
    font-size: 14px !important;
    color: #2a3f45 !important;
    font-weight: 400 !important;
}
body.single-test .customaccordion .card-body,
body.single-test .customaccordion .card-body p,
body.single-test .service-faqs .card-body,
body.single-test .service-faqs .card-body p {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
}

/* ── Recovery stories (single-story) ── */
body.single-story h1,
body.single-story .medical-story__title {
    font-size: 25px !important;
}
body.single-story .medical-story__excerpt,
body.single-story p.font-18 {
    font-size: 13px !important;
    color: #2a3f45 !important;
    line-height: 1.9 !important;
}
body.single-story .medical-story__content p,
body.single-story .medical-story__content li,
body.single-story .singlecontentbg p,
body.single-story .singlecontentbg li {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
}
body.single-story .customaccordion .card-header a,
body.single-story .service-faqs .card-header a {
    font-size: 14px !important;
    color: #2a3f45 !important;
    font-weight: 400 !important;
}
body.single-story .customaccordion .card-body p,
body.single-story .service-faqs .card-body p {
    font-size: 14px !important;
    color: #2a3f45 !important;
    line-height: 2 !important;
}

/* =====================================================
   List styles — match article-entry-content
   Applied to: team profile, tests, stories
   ===================================================== */

/* Shared targets */
.team-member-content ul,
.singlecontentbg ul,
.medical-story__content ul {
    list-style: none !important;
    padding-inline-start: 0 !important;
}
.team-member-content ul li,
.singlecontentbg ul li,
.medical-story__content ul li {
    display: block !important;
    position: relative !important;
    padding-inline-start: 1.6rem !important;
    align-items: unset !important;
}
.team-member-content ul li::before,
.singlecontentbg ul li::before,
.medical-story__content ul li::before {
    content: "\f058" !important;
    font-family: "fa5_f" !important;
    font-weight: 900 !important;
    color: #0ea7c6 !important;
    font-size: 14px !important;
    position: absolute !important;
    inset-inline-start: 0 !important;
    top: 0.3em !important;
}

/* OL — numbered with teal badge */
.team-member-content ol,
.singlecontentbg ol,
.medical-story__content ol {
    list-style: none !important;
    counter-reset: article-ol !important;
    padding-inline-start: 0 !important;
}
.team-member-content ol li,
.singlecontentbg ol li,
.medical-story__content ol li {
    counter-increment: article-ol !important;
    display: block !important;
    position: relative !important;
    padding-inline-start: 2.2rem !important;
    align-items: unset !important;
}
.team-member-content ol li::before,
.singlecontentbg ol li::before,
.medical-story__content ol li::before {
    content: counter(article-ol) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 24px !important;
    height: 24px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #0ea7c6 !important;
    background: #ebf5f7 !important;
    border-radius: 6px !important;
    position: absolute !important;
    inset-inline-start: 0 !important;
    top: 0.25em !important;
}
