/* ============================================
   OpsMed Resource Guide — Medical Journal Typography
   Scoped to .parent-pageid-84 (resource child pages only)
   Inline styles on content wrapper, h1, table th/td require !important
   ============================================ */

/* ===================== CLS FIX — FALLBACK FONT METRICS ===================== */
/* Size-adjust matches Source Serif 4's cap-height and line metrics so that
   when the web font swaps in, text dimensions change minimally → CLS ≈ 0. */
@font-face {
    font-family: 'Source Serif 4 Fallback';
    src: local('Georgia'), local('Times New Roman');
    size-adjust: 106%;
    ascent-override: 81%;
    descent-override: 21%;
    line-gap-override: 0%;
}

/* ===================== BASE TYPOGRAPHY ===================== */

.parent-pageid-84 main > .container {
    max-width: 720px !important;
}

.parent-pageid-84 main > .container > div {
    font-family: 'Source Serif 4', 'Source Serif 4 Fallback', Georgia, 'Times New Roman', serif !important;
    font-size: 18px !important;
    line-height: 1.78 !important;
    color: #1a1a2e !important;
    font-optical-sizing: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.parent-pageid-84 main > .container > div p {
    margin-bottom: 1.4em;
    orphans: 3;
    widows: 3;
}

/* ===================== PAGE TITLE ===================== */

.parent-pageid-84 main > .container > h1 {
    font-size: 2.2rem !important;
    font-weight: 700;
    line-height: 1.2;
    color: #0d1b3e !important;
    margin-bottom: 0.6em !important;
    letter-spacing: -0.02em;
}

/* ===================== HEADINGS ===================== */
/* Sans-serif headings against serif body — journal contrast */

.parent-pageid-84 main > .container > div h2 {
    font-family: 'Inter', sans-serif;
    font-size: 1.65rem;
    font-weight: 700;
    line-height: 1.25;
    color: #0d1b3e;
    margin-top: 2.8em;
    margin-bottom: 0.7em;
    padding-top: 1.2em;
    border-top: 1px solid #e2e6ec;
    letter-spacing: -0.01em;
}

/* H2 after hr — no double border */
.parent-pageid-84 main > .container > div hr + h2 {
    border-top: none;
    padding-top: 0;
    margin-top: 2em;
}

/* Subtitle — first h2 if it's the first child of the content wrapper */
.parent-pageid-84 main > .container > div > h2:first-child:not(#table-of-contents) {
    font-size: 1.35rem;
    font-weight: 400;
    font-style: italic;
    color: #3a4a6a;
    border-top: none;
    padding-top: 0;
    margin-top: 0.5em;
    margin-bottom: 1.2em;
    line-height: 1.5;
    font-family: 'Source Serif 4', 'Source Serif 4 Fallback', Georgia, serif;
}

.parent-pageid-84 main > .container > div h3 {
    font-family: 'Inter', sans-serif;
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 1.3;
    color: #1a2a4a;
    margin-top: 2em;
    margin-bottom: 0.5em;
}

.parent-pageid-84 main > .container > div h4 {
    font-family: 'Inter', sans-serif;
    font-size: 1.1rem;
    font-weight: 600;
    line-height: 1.35;
    color: #2a3a5a;
    margin-top: 1.6em;
    margin-bottom: 0.4em;
}

/* ===================== LINKS ===================== */

.parent-pageid-84 main > .container > div a {
    color: #2b6cb0;
    text-decoration: underline;
    text-decoration-color: #90cdf4;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
    transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

.parent-pageid-84 main > .container > div a:hover {
    color: #1a4e8a;
    text-decoration-color: #1a4e8a;
}

/* ===================== TABLE OF CONTENTS ===================== */

.parent-pageid-84 #table-of-contents {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
    color: #5a6a7a;
    border-top: none;
    padding-top: 0;
    margin-bottom: 0.5em;
    font-family: 'Inter', sans-serif;
}

.parent-pageid-84 #table-of-contents + ul {
    background: #f7f8fa;
    border: 1px solid #e2e6ec;
    border-radius: 6px;
    padding: 1.5em 2em 1.5em 2.5em;
    margin: 0 0 2.5em;
    list-style: none;
    counter-reset: toc-counter;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 0.92rem;
    line-height: 1.9;
}

.parent-pageid-84 #table-of-contents + ul li {
    counter-increment: toc-counter;
    padding: 0.15em 0;
    margin-bottom: 0;
}

.parent-pageid-84 #table-of-contents + ul li::before {
    content: counter(toc-counter, decimal-leading-zero);
    font-weight: 600;
    color: #8a9ab0;
    margin-right: 0.6em;
    font-size: 0.85em;
    font-variant-numeric: tabular-nums;
}

.parent-pageid-84 #table-of-contents + ul li a {
    text-decoration: none;
    color: #2b6cb0;
}

.parent-pageid-84 #table-of-contents + ul li a:hover {
    color: #1a4e8a;
    text-decoration: underline;
}

/* ===================== TABLES ===================== */
/* Content tables have inline styles on table, th, td — !important needed */

.parent-pageid-84 main > .container > div table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.8em 0 2.2em !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 0.88rem !important;
    line-height: 1.5;
}

.parent-pageid-84 main > .container > div table thead th {
    background: #0d1b3e !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    text-align: left !important;
    padding: 0.85em 1em !important;
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border: none !important;
}

.parent-pageid-84 main > .container > div table thead th:first-child {
    border-radius: 4px 0 0 0;
}

.parent-pageid-84 main > .container > div table thead th:last-child {
    border-radius: 0 4px 0 0;
}

.parent-pageid-84 main > .container > div table tbody td {
    padding: 0.75em 1em !important;
    border: none !important;
    border-bottom: 1px solid #e8ecf0 !important;
    color: #2a2a3a;
    vertical-align: top !important;
}

.parent-pageid-84 main > .container > div table tbody tr:nth-child(even) {
    background: #f8f9fb;
}

.parent-pageid-84 main > .container > div table tbody tr:hover {
    background: #eef2f7;
}

.parent-pageid-84 main > .container > div table td strong {
    color: #0d1b3e;
    font-weight: 700;
}

/* ===================== BLOCKQUOTES ===================== */

.parent-pageid-84 main > .container > div blockquote {
    border-left: 4px solid #1a5276;
    background: #f7f8fa;
    margin: 2em 0;
    padding: 1.4em 1.8em;
    border-radius: 0 6px 6px 0;
    font-style: italic;
    color: #2a3a4a;
    font-size: 1.02em;
    line-height: 1.7;
}

.parent-pageid-84 main > .container > div blockquote p {
    margin-bottom: 0.6em;
}

.parent-pageid-84 main > .container > div blockquote p:last-child {
    margin-bottom: 0;
}

.parent-pageid-84 main > .container > div blockquote strong {
    font-style: normal;
    color: #1a2a3a;
}

/* ===================== LISTS ===================== */

.parent-pageid-84 main > .container > div ul,
.parent-pageid-84 main > .container > div ol {
    margin: 1.2em 0 1.6em;
    padding-left: 1.6em;
}

.parent-pageid-84 main > .container > div li {
    margin-bottom: 0.5em;
    line-height: 1.65;
}

.parent-pageid-84 main > .container > div li ul,
.parent-pageid-84 main > .container > div li ol {
    margin-top: 0.4em;
    margin-bottom: 0.4em;
}

/* ===================== HORIZONTAL RULES ===================== */

.parent-pageid-84 main > .container > div hr {
    border: none;
    height: 1px;
    background: linear-gradient(to right, transparent, #c8d0dc, transparent);
    margin: 2.5em 0;
}

/* ===================== BOLD TEXT ===================== */

.parent-pageid-84 main > .container > div strong {
    font-weight: 600;
    color: #0d1b3e;
}

/* ===================== TABLE MOBILE OVERFLOW FIX ===================== */
/* Tables inside the_content() have no wrapper div — force overflow handling */

.parent-pageid-84 main > .container > div table {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100% !important;
}

/* ===================== RESPONSIVE ===================== */

@media (max-width: 768px) {
    .parent-pageid-84 main > .container > div {
        font-size: 16.5px !important;
        line-height: 1.72 !important;
    }

    .parent-pageid-84 main > .container > h1 {
        font-size: 1.75rem !important;
    }

    .parent-pageid-84 main > .container > div h2 {
        font-size: 1.4rem;
        margin-top: 2.2em;
    }

    .parent-pageid-84 main > .container > div h3 {
        font-size: 1.15rem;
    }

    .parent-pageid-84 #table-of-contents + ul {
        padding: 1.2em 1.4em 1.2em 1.8em;
    }

    .parent-pageid-84 main > .container > div table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        font-size: 0.82rem !important;
    }

    .parent-pageid-84 main > .container > div table thead th {
        padding: 0.6em 0.7em !important;
    }

    .parent-pageid-84 main > .container > div table tbody td {
        padding: 0.55em 0.7em !important;
    }

    .parent-pageid-84 main > .container > div blockquote {
        padding: 1em 1.2em;
        margin: 1.5em 0;
    }
}

@media (max-width: 480px) {
    .parent-pageid-84 main > .container > div {
        font-size: 16px !important;
        line-height: 1.68 !important;
    }

    .parent-pageid-84 main > .container > h1 {
        font-size: 1.5rem !important;
    }

    .parent-pageid-84 main > .container > div h2 {
        font-size: 1.25rem;
    }
}

/* ===================== PRINT ===================== */

@media print {
    .parent-pageid-84 main > .container > div {
        font-size: 11pt !important;
        line-height: 1.6 !important;
        color: #000 !important;
    }

    .parent-pageid-84 main > .container {
        max-width: none !important;
    }

    .parent-pageid-84 main > .container > div a {
        color: #000;
        text-decoration: underline;
    }

    .parent-pageid-84 main > .container > div blockquote {
        border-left-color: #000;
        background: none;
    }

    .parent-pageid-84 main > .container > div table thead th {
        background: #ddd !important;
        color: #000 !important;
    }
}

/* ===================== GUIDE CODE LINKS ===================== */

.guide-code-link {
    font-family: 'SFMono-Regular', Consolas, 'Lucida Console', monospace;
    font-size: 0.88em;
    background: #f0f4f8;
    padding: 0.1em 0.35em;
    border-radius: 3px;
    text-decoration: none;
    color: #1a56db;
    border: 1px solid #e2e8f0;
}

.guide-code-link:hover {
    background: #e3ecf7;
    border-color: #bfdbfe;
    text-decoration: underline;
}

/* =================== GUIDE TOOL CALLOUTS =================== */

.guide-tool-callout {
    background: #f8fafc;
    border-left: 3px solid #1a56db;
    padding: 0.75rem 1rem;
    margin: 1.5rem 0;
    font-size: 0.93rem;
    border-radius: 0 4px 4px 0;
    color: #374151;
}

.guide-tool-callout a {
    color: #1a56db;
    font-weight: 600;
}

.guide-tool-callout a:hover {
    text-decoration: underline;
}
