/*
 * Epion Article Presentation 0.2.3
 * Scoped only to importer-owned articles.
 * Server-generated structure mirrors the accepted Sinus article:
 * article-content-section, article-reason-list, article-step-list,
 * article-grid-list + compact article tables.
 */

.epion-imported-article {
    --eap-blue: var(--article-blue, #0876e8);
    --eap-blue-dark: var(--article-blue-dark, #0668cb);
    --eap-line: var(--article-line, #dfe4e8);
    --eap-surface: var(--article-surface, #f5f7f8);
    --eap-text: var(--article-text, #20262c);
}

/* Summary. The markup is already the same as Sinus; this mainly protects the
 * two-column layout when legacy CSS is loaded in a different order. */
.epion-imported-article .article-summary-section { margin:30px 0 52px !important; }
.epion-imported-article .article-summary.article-summary--standalone,
.epion-imported-article .article-summary {
    width:100%; max-width:100%; margin:0 !important;
    padding:34px 42px 36px !important;
    background:#fff !important; border:1px solid var(--eap-line) !important;
    box-sizing:border-box;
}
.epion-imported-article .article-summary::after { display:none !important; }
.epion-imported-article .article-summary::before {
    display:block; width:40px; height:3px; margin:0 0 18px;
    background:var(--eap-blue); content:'';
}
.epion-imported-article .article-summary__title {
    margin:0 0 22px !important; color:#15191d;
    font-size:24px !important; font-weight:500 !important; line-height:1.25 !important;
}
.epion-imported-article .article-summary__text ul,
.epion-imported-article .article-summary__text ol {
    display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px 54px; margin:0 !important; padding:0 !important; list-style:none !important;
}
.epion-imported-article .article-summary__text li {
    position:relative; margin:0 !important; padding:0 0 0 25px;
    line-height:1.6;
}
.epion-imported-article .article-summary__text li::before {
    position:absolute; top:.72em; left:3px; width:7px; height:7px;
    background:var(--eap-blue); content:''; transform:translateY(-50%);
}
.epion-imported-article .article-summary__text li::marker { content:''; font-size:0; }

/* Same vertical rhythm as the accepted article. */
.epion-imported-article .blog-single__content > .article-content-section.eap-generated-section {
    padding-top:42px; padding-bottom:42px; border-top:1px solid var(--eap-line);
}
.epion-imported-article .blog-single__content > .article-content-section.eap-generated-section:first-of-type { border-top:0; }

/* Strong table reset. It also works before JS adds helper classes. */
.epion-imported-article .blog-single__content figure.wp-block-table,
.epion-imported-article .blog-single__content figure.wp-block-table.eap-responsive-table,
.epion-imported-article .blog-single__content .article-table-scroll,
.epion-imported-article .blog-single__content .article-table-scroll.eap-responsive-table {
    display:block !important;
    width:100% !important; max-width:100% !important; min-width:0 !important;
    margin-left:0 !important; margin-right:0 !important;
    overflow-x:hidden !important; overflow-y:visible !important;
}
.epion-imported-article .blog-single__content figure.wp-block-table > table,
.epion-imported-article .blog-single__content .article-table-scroll > table,
.epion-imported-article .blog-single__content table.eap-compact-table {
    display:table !important;
    width:100% !important; max-width:100% !important; min-width:0 !important;
    height:auto !important; table-layout:fixed !important; border-collapse:collapse !important;
}
.epion-imported-article .blog-single__content figure.wp-block-table > table tr,
.epion-imported-article .blog-single__content table.eap-compact-table tr {
    height:auto !important; min-height:0 !important; block-size:auto !important; min-block-size:0 !important;
}
.epion-imported-article .blog-single__content figure.wp-block-table > table th,
.epion-imported-article .blog-single__content figure.wp-block-table > table td,
.epion-imported-article .blog-single__content table.eap-compact-table th,
.epion-imported-article .blog-single__content table.eap-compact-table td {
    height:auto !important; min-height:0 !important; min-width:0 !important; max-width:none !important;
    padding:9px 10px !important; vertical-align:top !important;
    line-height:1.38 !important; white-space:normal !important;
    overflow-wrap:break-word !important; word-break:normal !important; hyphens:auto !important; box-sizing:border-box !important;
}
.epion-imported-article table.eap-table--diagnostics th:nth-child(1),
.epion-imported-article table.eap-table--diagnostics td:nth-child(1) { width:16% !important; max-width:16% !important; }
.epion-imported-article table.eap-table--diagnostics th:nth-child(2),
.epion-imported-article table.eap-table--diagnostics td:nth-child(2) { width:10% !important; max-width:10% !important; }
.epion-imported-article table.eap-table--diagnostics th:nth-child(3),
.epion-imported-article table.eap-table--diagnostics td:nth-child(3) { width:17% !important; max-width:17% !important; }
.epion-imported-article table.eap-table--diagnostics th:nth-child(4),
.epion-imported-article table.eap-table--diagnostics td:nth-child(4) { width:24% !important; max-width:24% !important; }
.epion-imported-article table.eap-table--diagnostics th:nth-child(5),
.epion-imported-article table.eap-table--diagnostics td:nth-child(5) { width:33% !important; max-width:33% !important; }

.epion-imported-article table.eap-table--diagnostics th,
.epion-imported-article table.eap-table--diagnostics td {
    overflow:hidden !important;
    text-overflow:clip !important;
}
.epion-imported-article table.eap-table--diagnostics th {
    font-size:16px !important;
    line-height:1.3 !important;
}
.epion-imported-article table.eap-table--diagnostics td {
    font-size:17px !important;
}

/* Primary service: do not reserve an empty doctor column. */
.epion-imported-article .article-primary-service__body.article-primary-service__body--without-doctor {
    grid-template-columns:minmax(0,1fr) !important; gap:0 !important;
}
.epion-imported-article .article-primary-service__body.article-primary-service__body--without-doctor .article-primary-service__content {
    width:100%; max-width:none;
}

/* Numbered cards. Markup deliberately uses the same classes as Sinus.
 * These fallback rules are close to the reference and only supplement the
 * site's own article-reference stylesheet. */
.epion-imported-article .article-reason-list.eap-generated {
    display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px !important; width:100%; margin:28px 0 20px !important;
    padding:0 !important; list-style:none !important; counter-reset:eap-reason;
}
.epion-imported-article .article-reason-list.eap-generated[data-eap-count="3"],
.epion-imported-article .article-reason-list.eap-generated[data-eap-count="5"],
.epion-imported-article .article-reason-list.eap-generated[data-eap-count="6"] {
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}
.epion-imported-article .article-reason-list.eap-generated > li {
    position:relative; min-width:0; min-height:210px;
    margin:0 !important; padding:30px 32px 54px !important;
    background:#fff !important; border:1px solid var(--eap-line) !important;
    box-sizing:border-box; list-style:none !important; counter-increment:eap-reason;
}
.epion-imported-article .article-reason-list.eap-generated > li::before { display:none !important; content:none !important; }
.epion-imported-article .article-reason-list.eap-generated > li::after {
    position:absolute; right:18px; bottom:8px;
    color:#dfe3e6; font-size:48px; font-weight:300; line-height:1;
    content:counter(eap-reason);
}
.epion-imported-article .article-reason-list.eap-generated > li strong {
    display:block; margin:0 0 15px; color:var(--eap-blue);
    font-size:20px; font-weight:600; line-height:1.3;
}
.epion-imported-article .article-reason-list.eap-generated > li p { margin:0 0 12px !important; }
.epion-imported-article .article-reason-list.eap-generated > li > :last-child { margin-bottom:0 !important; }

/* Plain cards (classification blocks such as panoramic vs targeted image). */
.epion-imported-article .eap-card-grid {
    display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px; width:100%; margin:28px 0 20px !important; padding:0 !important;
}
.epion-imported-article .eap-card-grid--count-3,
.epion-imported-article .eap-card-grid--count-6 { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
.epion-imported-article .eap-card-grid__item {
    min-width:0; min-height:180px; margin:0 !important; padding:28px 30px !important;
    background:#fff !important; border:1px solid var(--eap-line) !important; box-sizing:border-box;
}
.epion-imported-article .eap-card-grid__item h3,
.epion-imported-article .eap-card-grid__item .article-subsection-title {
    margin:0 0 14px !important; padding:0 !important; border:0 !important;
    color:var(--eap-blue) !important; font-size:20px !important; font-weight:600 !important;
    line-height:1.3 !important; text-align:left !important;
}
.epion-imported-article .eap-card-grid__item h3::before,
.epion-imported-article .eap-card-grid__item h3::after { display:none !important; content:none !important; }
.epion-imported-article .eap-card-grid__item p { margin-top:0 !important; }
.epion-imported-article .eap-card-grid__item > :last-child { margin-bottom:0 !important; }

/* Soft full-width surface, matching the reasons/diagnosis sections in Sinus. */
.epion-imported-article .article-content-section.eap-surface-section,
.epion-imported-article .article-content-section.article-content-section--surface.eap-generated-section {
    width:100vw !important; max-width:100vw !important;
    margin-right:calc(50% - 50vw) !important; margin-left:calc(50% - 50vw) !important;
    padding:56px max(20px,calc((100vw - 1170px)/2)) 52px !important;
    background:var(--eap-surface) !important; border-top:0 !important; box-sizing:border-box;
}

/* Existing benchmark list classes are kept intentionally. */
.epion-imported-article .article-grid-list.eap-generated {
    display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr));
    gap:13px 42px; width:100%; max-width:860px !important;
    margin:26px auto 28px !important; padding:25px 36px 25px 42px !important;
    background:#fff; border:1px solid var(--eap-line); list-style:none !important; box-sizing:border-box;
}
.epion-imported-article .article-grid-list.eap-generated > li {
    position:relative; margin:0 !important; padding-left:24px; list-style:none !important;
}
.epion-imported-article .article-grid-list.eap-generated > li::before {
    position:absolute; top:.7em; left:0; width:8px; height:8px;
    background:var(--eap-blue); content:''; transform:translateY(-50%);
}

/* Related services are intentionally not restyled: single-blog.php should render
 * the same additional-services-links markup as the benchmark article. */

@media (max-width:1000px) {
    .epion-imported-article .article-reason-list.eap-generated[data-eap-count="3"],
    .epion-imported-article .article-reason-list.eap-generated[data-eap-count="5"],
    .epion-imported-article .article-reason-list.eap-generated[data-eap-count="6"],
    .epion-imported-article .eap-card-grid--count-3,
    .epion-imported-article .eap-card-grid--count-6 {
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}

@media (max-width:900px) {
    .epion-imported-article .article-summary__text ul,
    .epion-imported-article .article-summary__text ol,
    .epion-imported-article .article-reason-list.eap-generated,
    .epion-imported-article .eap-card-grid,
    .epion-imported-article .article-grid-list.eap-generated {
        grid-template-columns:1fr !important;
    }
}

@media (max-width:760px) {
    .epion-imported-article .article-summary.article-summary--standalone,
    .epion-imported-article .article-summary { padding:26px 22px 28px !important; }

    .epion-imported-article .blog-single__content figure.wp-block-table,
    .epion-imported-article .blog-single__content .article-table-scroll {
        overflow:visible !important; border:0 !important; background:transparent !important;
    }
    .epion-imported-article table.eap-compact-table.eap-table-stack {
        display:block !important; width:100% !important; border:0 !important;
    }
    .epion-imported-article table.eap-table-stack colgroup,
    .epion-imported-article table.eap-table-stack thead { display:none !important; }
    .epion-imported-article table.eap-table-stack tbody,
    .epion-imported-article table.eap-table-stack tr { display:block !important; width:100% !important; }
    .epion-imported-article table.eap-table-stack tr {
        margin:0 0 16px !important; overflow:hidden; background:#fff; border:1px solid var(--eap-line);
    }
    .epion-imported-article table.eap-table-stack td {
        display:grid !important; grid-template-columns:minmax(105px,36%) minmax(0,1fr) !important;
        width:100% !important; gap:12px; padding:12px 14px !important;
        border-right:0 !important; border-bottom:1px solid var(--eap-line) !important;
        background:#fff !important; font-size:14px;
    }
    .epion-imported-article table.eap-table-stack td:last-child { border-bottom:0 !important; }
    .epion-imported-article table.eap-table-stack td::before {
        color:var(--eap-blue-dark); font-size:12px; font-weight:600; line-height:1.35;
        text-transform:uppercase; content:attr(data-eap-label);
    }

    .epion-imported-article .article-content-section.eap-surface-section,
    .epion-imported-article .article-content-section.article-content-section--surface.eap-generated-section {
        width:auto !important; max-width:none !important;
        margin-left:-16px !important; margin-right:-16px !important;
        padding:38px 16px 34px !important;
    }
    .epion-imported-article .article-reason-list.eap-generated > li,
    .epion-imported-article .eap-card-grid__item { min-height:0; padding:24px 22px 46px !important; }
}