/*
 * SITE SEO ANALYZER — COMPLETE THEME COMPATIBILITY 2027
 * Version: 1.1.0
 *
 * This file is intentionally loaded from footer.php after page-level styles.
 * It normalizes legacy Diamond and modern tool templates without modifying
 * individual tool behavior or semantic status colors.
 */

/* =========================================================
   SHARED DESIGN TOKENS
   ========================================================= */

:root,
html[data-ssa-theme="modern"] {
    --ssa-page-bg: #f5f7fb;
    --ssa-page-bg-alt: #eef3fa;
    --ssa-final-surface: #ffffff;
    --ssa-final-surface-raised: #ffffff;
    --ssa-final-surface-soft: #f7f9fc;
    --ssa-final-border: rgba(15, 35, 80, .11);
    --ssa-final-text: #101828;
    --ssa-final-muted: #526176;
    --ssa-final-heading: #102552;
    --ssa-final-link: #1d5fd1;
    --ssa-final-field: #ffffff;
    --ssa-final-field-border: #cfd8e6;
    --ssa-final-header: rgba(255, 255, 255, .94);
    --ssa-final-shadow: 0 18px 48px rgba(21, 42, 84, .10);
    --ssa-final-shadow-soft: 0 8px 26px rgba(21, 42, 84, .07);
    --ssa-final-hover: rgba(37, 99, 235, .055);
    --ssa-final-code: #eef3fa;
    --ssa-final-overlay: rgba(15, 23, 42, .58);
    --ssa-final-radius: 20px;
    --ssa-final-radius-small: 12px;
}

html[data-ssa-theme="dark"] {
    --ssa-page-bg: #070b14;
    --ssa-page-bg-alt: #0a1020;
    --ssa-final-surface: #101827;
    --ssa-final-surface-raised: #141f33;
    --ssa-final-surface-soft: #172338;
    --ssa-final-border: rgba(158, 178, 209, .18);
    --ssa-final-text: #edf3ff;
    --ssa-final-muted: #b1bed2;
    --ssa-final-heading: #f7f9ff;
    --ssa-final-link: #7db8ff;
    --ssa-final-field: #0c1423;
    --ssa-final-field-border: #35445d;
    --ssa-final-header: rgba(8, 13, 24, .95);
    --ssa-final-shadow: 0 24px 60px rgba(0, 0, 0, .42);
    --ssa-final-shadow-soft: 0 10px 30px rgba(0, 0, 0, .28);
    --ssa-final-hover: rgba(96, 165, 250, .10);
    --ssa-final-code: #080e19;
    --ssa-final-overlay: rgba(0, 0, 0, .74);
}

html[data-ssa-theme="glass"] {
    --ssa-page-bg: #eaf3ff;
    --ssa-page-bg-alt: rgba(234, 243, 255, .48);
    --ssa-final-surface: rgba(255, 255, 255, .58);
    --ssa-final-surface-raised: rgba(255, 255, 255, .72);
    --ssa-final-surface-soft: rgba(239, 246, 255, .54);
    --ssa-final-border: rgba(255, 255, 255, .78);
    --ssa-final-text: #102342;
    --ssa-final-muted: #435978;
    --ssa-final-heading: #102b5c;
    --ssa-final-link: #164fc4;
    --ssa-final-field: rgba(255, 255, 255, .78);
    --ssa-final-field-border: rgba(113, 146, 196, .34);
    --ssa-final-header: rgba(255, 255, 255, .68);
    --ssa-final-shadow: 0 26px 70px rgba(37, 72, 130, .17);
    --ssa-final-shadow-soft: 0 12px 38px rgba(37, 72, 130, .11);
    --ssa-final-hover: rgba(255, 255, 255, .38);
    --ssa-final-code: rgba(237, 244, 255, .68);
    --ssa-final-overlay: rgba(27, 47, 82, .54);
}

/* =========================================================
   DOCUMENT FOUNDATION
   ========================================================= */

html[data-ssa-theme] {
    background: var(--ssa-page-bg) !important;
}

html[data-ssa-theme] body {
    background-color: var(--ssa-page-bg) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme="dark"] body {
    background-image:
        radial-gradient(circle at 10% 8%, rgba(37, 99, 235, .08), transparent 32rem),
        radial-gradient(circle at 92% 24%, rgba(6, 182, 212, .06), transparent 34rem) !important;
}

html[data-ssa-theme="glass"] body {
    background-image:
        radial-gradient(circle at 8% 5%, rgba(56, 189, 248, .25), transparent 30rem),
        radial-gradient(circle at 92% 17%, rgba(139, 92, 246, .20), transparent 35rem),
        radial-gradient(circle at 48% 88%, rgba(34, 211, 238, .16), transparent 38rem),
        linear-gradient(145deg, #edf7ff, #e9edff 52%, #effcff) !important;
    background-attachment: fixed !important;
}

html[data-ssa-theme] body,
html[data-ssa-theme] body :where(button, input, select, textarea) {
    font-family: var(--ssa-font, "Poppins", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif) !important;
}

html[data-ssa-theme] body :where(main, .main-content, .page-content, .content-wrapper) {
    color: var(--ssa-final-text);
}

html[data-ssa-theme="dark"] body :where(main, .main-content, .page-content, .content-wrapper) {
    background-color: transparent !important;
}

html[data-ssa-theme="glass"] body :where(main, .main-content, .page-content, .content-wrapper) {
    background: transparent !important;
}

/* Modern spacing and sizing stay intentionally conservative for legacy tools. */

html[data-ssa-theme] *,
html[data-ssa-theme] *::before,
html[data-ssa-theme] *::after {
    box-sizing: border-box;
}

html[data-ssa-theme] :where(img, svg, video, canvas) {
    max-width: 100%;
}

/* =========================================================
   HEADER, NAVIGATION AND MENUS
   ========================================================= */

html[data-ssa-theme] body .modern-header {
    background: var(--ssa-final-header) !important;
    border-color: var(--ssa-final-border) !important;
    box-shadow: 0 1px 0 var(--ssa-final-border), var(--ssa-final-shadow-soft) !important;
    -webkit-backdrop-filter: blur(20px) saturate(145%);
    backdrop-filter: blur(20px) saturate(145%);
}

html[data-ssa-theme="dark"] body .modern-header
    :where(
        .ssa-nav-link,
        .ssa-nav-action,
        .navbar-nav > li > a,
        #modern-navigation a
    ) {
    color: #dce8fb !important;
}

html[data-ssa-theme="dark"] body .modern-header
    :where(
        .ssa-nav-link,
        .ssa-nav-action,
        .navbar-nav > li > a,
        #modern-navigation a
    ):hover,
html[data-ssa-theme="dark"] body .modern-header
    :where(
        .ssa-nav-link,
        .ssa-nav-action,
        .navbar-nav > li > a,
        #modern-navigation a
    ):focus {
    background: rgba(96, 165, 250, .11) !important;
    color: #ffffff !important;
}

html[data-ssa-theme] body :where(.dropdown-menu, .dropdown-content, .popover) {
    background: var(--ssa-final-surface-raised) !important;
    border: 1px solid var(--ssa-final-border) !important;
    border-radius: var(--ssa-final-radius-small) !important;
    box-shadow: var(--ssa-final-shadow) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme] body :where(.dropdown-menu, .dropdown-content, .popover)
    :where(a, button) {
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme] body :where(.dropdown-menu, .dropdown-content, .popover)
    :where(a, button):hover {
    background: var(--ssa-final-hover) !important;
    color: var(--ssa-final-link) !important;
}

/* =========================================================
   PAGE SECTIONS AND HERO PROTECTION
   ========================================================= */

html[data-ssa-theme="dark"] body
    :where(main, .main-content, .page-content)
    :where(section, [class$="-section"], [class*="-section "]):not(
        [class*="hero"],
        [class*="cta"],
        [class*="banner"]
    ) {
    background-color: transparent !important;
    border-color: var(--ssa-final-border) !important;
}

html[data-ssa-theme="glass"] body
    :where(main, .main-content, .page-content)
    :where(section, [class$="-section"], [class*="-section "]):not(
        [class*="hero"],
        [class*="cta"],
        [class*="banner"]
    ) {
    background: transparent !important;
    border-color: transparent !important;
}

/* Retain readable light text inside branded heroes in every mode. */

html[data-ssa-theme] body
    :where(.headturbo, #headturbo, .modern-page-header, [class*="-hero"])
    :where(h1, h2, h3) {
    color: #ffffff !important;
}

html[data-ssa-theme] body
    :where(.headturbo, #headturbo, .modern-page-header, [class*="-hero"])
    :where(p, .lead, .subtitle) {
    color: rgba(255, 255, 255, .84) !important;
}

/* Directory hero is a light/glass information surface, not a branded hero. */

html[data-ssa-theme="dark"] body .ssa-tools-hero {
    background: var(--ssa-final-surface) !important;
    border: 1px solid var(--ssa-final-border) !important;
}

html[data-ssa-theme="dark"] body .ssa-tools-hero :where(h1, h2, h3) {
    color: var(--ssa-final-heading) !important;
}

html[data-ssa-theme="dark"] body .ssa-tools-hero p {
    color: var(--ssa-final-muted) !important;
}

html[data-ssa-theme="glass"] body .ssa-tools-hero {
    background: var(--ssa-final-surface) !important;
    border: 1px solid var(--ssa-final-border) !important;
    box-shadow: var(--ssa-final-shadow-soft) !important;
    -webkit-backdrop-filter: blur(22px) saturate(150%);
    backdrop-filter: blur(22px) saturate(150%);
}

/* =========================================================
   UNIVERSAL SEMANTIC SURFACES
   ========================================================= */

/* Limiting these patterns to structural elements avoids styling icon classes
   such as .fa-credit-card while covering hundreds of tool-specific cards. */

html[data-ssa-theme] body
    :where(div, section, article, aside, form, fieldset, details, li):where(
        .card,
        .panel,
        .well,
        .thumbnail,
        .widget,
        .widget-box,
        .modal-content,
        [class$="-card"],
        [class*="-card "],
        [class$="__card"],
        [class*="__card "],
        [class$="-panel"],
        [class*="-panel "],
        [class$="__panel"],
        [class*="__panel "],
        [class$="-box"],
        [class*="-box "],
        [class$="Box"],
        [class*="Box "]
    ):not(
        [class*="hero"],
        [class*="icon"],
        [class*="badge"],
        [class*="score"],
        [class*="status"],
        [class*="progress"],
        [class*="alert"],
        [class*="ad-"],
        [class*="captcha"],
        [class*="loader"]
    ) {
    border-color: var(--ssa-final-border) !important;
    border-radius: var(--ssa-final-radius) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme="modern"] body
    :where(div, section, article, aside, form, fieldset, details, li):where(
        .card,
        .panel,
        .well,
        .thumbnail,
        .widget,
        .widget-box,
        .modal-content,
        [class$="-card"], [class*="-card "],
        [class$="__card"], [class*="__card "],
        [class$="-panel"], [class*="-panel "],
        [class$="-box"], [class*="-box "],
        [class$="Box"], [class*="Box "]
    ):not(
        [class*="hero"], [class*="icon"], [class*="badge"],
        [class*="score"], [class*="status"], [class*="progress"],
        [class*="alert"], [class*="ad-"], [class*="captcha"],
        [class*="loader"]
    ) {
    box-shadow: var(--ssa-final-shadow-soft);
}

html[data-ssa-theme="dark"] body
    :where(div, section, article, aside, form, fieldset, details, li):where(
        .card,
        .panel,
        .well,
        .thumbnail,
        .widget,
        .widget-box,
        .modal-content,
        [class$="-card"], [class*="-card "],
        [class$="__card"], [class*="__card "],
        [class$="-panel"], [class*="-panel "],
        [class$="__panel"], [class*="__panel "],
        [class$="-box"], [class*="-box "],
        [class$="Box"], [class*="Box "]
    ):not(
        [class*="hero"], [class*="icon"], [class*="badge"],
        [class*="score"], [class*="status"], [class*="progress"],
        [class*="alert"], [class*="ad-"], [class*="captcha"],
        [class*="loader"]
    ) {
    background: var(--ssa-final-surface) !important;
    box-shadow: var(--ssa-final-shadow-soft) !important;
}

html[data-ssa-theme="glass"] body
    :where(div, section, article, aside, form, fieldset, details, li):where(
        .card,
        .panel,
        .well,
        .thumbnail,
        .widget,
        .widget-box,
        .modal-content,
        [class$="-card"], [class*="-card "],
        [class$="__card"], [class*="__card "],
        [class$="-panel"], [class*="-panel "],
        [class$="__panel"], [class*="__panel "],
        [class$="-box"], [class*="-box "],
        [class$="Box"], [class*="Box "]
    ):not(
        [class*="hero"], [class*="icon"], [class*="badge"],
        [class*="score"], [class*="status"], [class*="progress"],
        [class*="alert"], [class*="ad-"], [class*="captcha"],
        [class*="loader"]
    ) {
    background: var(--ssa-final-surface) !important;
    border-color: var(--ssa-final-border) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .78), var(--ssa-final-shadow-soft) !important;
    -webkit-backdrop-filter: blur(18px) saturate(145%);
    backdrop-filter: blur(18px) saturate(145%);
}

/* Explicit high-use components that do not follow a suffix convention. */

html[data-ssa-theme="dark"] body :where(
    .ssa-feature-card,
    .ssa-analysis-card,
    .ssa-advanced-seo-item,
    .ssa-how-card,
    .ssa-faq-item,
    .ssa-testimonials .item,
    .ssa-home-methodology,
    .ssa-site-card,
    .ssa-tool-card,
    .app-rank-answer,
    .app-rank-step,
    .app-rank-faq-accordion
) {
    background: var(--ssa-final-surface) !important;
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme="glass"] body :where(
    .ssa-feature-card,
    .ssa-analysis-card,
    .ssa-advanced-seo-item,
    .ssa-how-card,
    .ssa-faq-item,
    .ssa-testimonials .item,
    .ssa-home-methodology,
    .ssa-site-card,
    .ssa-tool-card,
    .app-rank-answer,
    .app-rank-step,
    .app-rank-faq-accordion
) {
    background: var(--ssa-final-surface) !important;
    border-color: var(--ssa-final-border) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .78), var(--ssa-final-shadow-soft) !important;
    -webkit-backdrop-filter: blur(18px) saturate(145%);
    backdrop-filter: blur(18px) saturate(145%);
}

/* =========================================================
   TYPOGRAPHY AND SEMANTIC COLORS
   ========================================================= */

html[data-ssa-theme] body
    :where(main, .main-content, .page-content, .modal-content, .dropdown-menu)
    :where(h1, h2, h3, h4, h5, h6) {
    color: var(--ssa-final-heading) !important;
}

html[data-ssa-theme] body
    :where(main, .main-content, .page-content, .modal-content, .dropdown-menu)
    :where(p, li, label, dd, figcaption, .help-block, .text-muted) {
    color: var(--ssa-final-muted) !important;
}

/* Restore hero typography after the general content rule. */

html[data-ssa-theme] body
    :where(.headturbo, #headturbo, .modern-page-header, [class*="-hero"])
    :where(h1, h2, h3) {
    color: #ffffff !important;
}

html[data-ssa-theme] body
    :where(.headturbo, #headturbo, .modern-page-header, [class*="-hero"])
    :where(p, li, label, .help-block) {
    color: rgba(255, 255, 255, .84) !important;
}

/* The tools-directory hero is deliberately a light information panel. */

html[data-ssa-theme] body .ssa-tools-hero :where(h1, h2, h3) {
    color: var(--ssa-final-heading) !important;
}

html[data-ssa-theme] body .ssa-tools-hero :where(p, li) {
    color: var(--ssa-final-muted) !important;
}

html[data-ssa-theme] body a:not(.btn):not([class*="button"]) {
    color: var(--ssa-final-link);
}

html[data-ssa-theme] body :where(.text-success, .success, [class*="success-text"]) {
    color: var(--ssa-success, #22a06b) !important;
}

html[data-ssa-theme] body :where(.text-danger, .danger, .error, [class*="error-text"]) {
    color: var(--ssa-danger, #dc3545) !important;
}

html[data-ssa-theme] body :where(.text-warning, .warning, [class*="warning-text"]) {
    color: #d97706 !important;
}

html[data-ssa-theme="dark"] body :where(.text-warning, .warning, [class*="warning-text"]) {
    color: #fbbf24 !important;
}

/* =========================================================
   FORMS, FILE UPLOADS AND EDITORS
   ========================================================= */

html[data-ssa-theme] body :where(
    input[type="text"],
    input[type="url"],
    input[type="email"],
    input[type="password"],
    input[type="number"],
    input[type="search"],
    input[type="date"],
    input[type="time"],
    textarea,
    select,
    .form-control,
    .input-group-addon
) {
    background-color: var(--ssa-final-field) !important;
    border-color: var(--ssa-final-field-border) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme] body :where(input, textarea, select, .form-control)::placeholder {
    color: var(--ssa-final-muted) !important;
    opacity: .72;
}

html[data-ssa-theme] body :where(input, textarea, select, button, summary, a):focus-visible {
    outline: 3px solid var(--ssa-primary, #2563eb) !important;
    outline-offset: 3px !important;
}

html[data-ssa-theme] body :where(div, section, label):where(
    [class*="upload"],
    [class*="drop-zone"],
    [class*="dropzone"],
    [class*="dropbox"]
):not([class*="button"]):not([class*="progress"]) {
    background: var(--ssa-final-surface-soft) !important;
    border-color: var(--ssa-final-field-border) !important;
    color: var(--ssa-final-text) !important;
    border-radius: var(--ssa-final-radius) !important;
}

html[data-ssa-theme="glass"] body :where(div, section, label):where(
    [class*="upload"],
    [class*="drop-zone"],
    [class*="dropzone"],
    [class*="dropbox"]
):not([class*="button"]):not([class*="progress"]) {
    background: rgba(255, 255, 255, .46) !important;
    -webkit-backdrop-filter: blur(16px) saturate(140%);
    backdrop-filter: blur(16px) saturate(140%);
}

html[data-ssa-theme="dark"] body :where(.CodeMirror, .ace_editor, [class*="editor"]):not([class*="header"]) {
    background-color: #09101d !important;
    color: #e7efff !important;
    border-color: var(--ssa-final-border) !important;
}

/* =========================================================
   TABLES, RESULTS, TABS AND ACCORDIONS
   ========================================================= */

html[data-ssa-theme] body :where(table, .table, [class$="-table"], [class*="-table "]) {
    background-color: var(--ssa-final-surface) !important;
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme] body :where(table, .table, [class$="-table"], [class*="-table "])
    :where(th, td) {
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme] body :where(table, .table, [class$="-table"], [class*="-table "])
    :where(thead th, .table-heading) {
    background: var(--ssa-final-surface-soft) !important;
    color: var(--ssa-final-heading) !important;
}

html[data-ssa-theme] body :where(table, .table, [class$="-table"], [class*="-table "])
    tbody tr:nth-child(even) {
    background-color: var(--ssa-final-hover) !important;
}

html[data-ssa-theme] body :where(.nav-tabs, .nav-pills, [role="tablist"]) {
    border-color: var(--ssa-final-border) !important;
}

html[data-ssa-theme] body :where(.nav-tabs, .nav-pills, [role="tablist"])
    :where(a, button, [role="tab"]) {
    color: var(--ssa-final-muted) !important;
}

html[data-ssa-theme] body :where(.nav-tabs, .nav-pills, [role="tablist"])
    :where(.active, [aria-selected="true"]) {
    background: var(--ssa-final-surface-raised) !important;
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-link) !important;
}

html[data-ssa-theme] body :where(details, .accordion-item, .faq-item, [class*="faq-item"]) {
    border-color: var(--ssa-final-border) !important;
}

html[data-ssa-theme] body :where(summary, .accordion-button, .faq-question, [class*="faq-question"]) {
    color: var(--ssa-final-heading) !important;
}

html[data-ssa-theme] body :where(pre, code, kbd, samp) {
    background: var(--ssa-final-code) !important;
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-text) !important;
}

/* =========================================================
   MODALS, ALERTS AND OVERLAYS
   ========================================================= */

html[data-ssa-theme] body :where(.modal-backdrop, .overlay, [class*="-overlay"]) {
    background-color: var(--ssa-final-overlay) !important;
}

html[data-ssa-theme] body :where(.modal-header, .modal-footer, .panel-heading, .panel-footer) {
    background: var(--ssa-final-surface-soft) !important;
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-heading) !important;
}

html[data-ssa-theme="dark"] body :where(.close, .modal-close, [class*="close-button"]) {
    color: #ffffff !important;
    opacity: .82;
}

/* =========================================================
   COMPLETE TEMPLATE COVERAGE — LIVE QA FIXES V1.1

   Many Diamond tools define their own white page wrappers and
   gradients after the main theme stylesheet. These rules run in
   the final compatibility layer, so Dark and Glass remain coherent
   without editing the behavior of 160+ individual tool templates.
   ========================================================= */

/* Page and layout wrappers must reveal the selected document theme. */

html[data-ssa-theme="dark"] body :where(
    [class$="-page"],
    [class*="-page "],
    [class$="-wrap"],
    [class*="-wrap "],
    [class$="-wrapper"],
    [class*="-wrapper "]
) {
    background-color: transparent !important;
    border-color: var(--ssa-final-border) !important;
}

html[data-ssa-theme="glass"] body :where(
    [class$="-page"],
    [class*="-page "],
    [class$="-wrap"],
    [class*="-wrap "],
    [class$="-wrapper"],
    [class*="-wrapper "]
) {
    background-color: transparent !important;
    border-color: transparent !important;
}

/* Keep content typography readable even when a template is not inside main. */

html[data-ssa-theme="dark"] body
    :where(
        main,
        .main-content,
        .page-content,
        .content-wrapper,
        .ssa-migrated-tool,
        .ssa-analyzer-v3,
        [class$="-page"],
        [class*="-page "],
        [class$="-wrap"],
        [class*="-wrap "]
    )
    :where(h1, h2, h3, h4, h5, h6) {
    color: var(--ssa-final-heading) !important;
}

html[data-ssa-theme="dark"] body
    :where(
        main,
        .main-content,
        .page-content,
        .content-wrapper,
        .ssa-migrated-tool,
        .ssa-analyzer-v3,
        [class$="-page"],
        [class*="-page "],
        [class$="-wrap"],
        [class*="-wrap "]
    )
    :where(p, li, label, dd, figcaption, .help-block, .text-muted) {
    color: var(--ssa-final-muted) !important;
}

/* Preserve branded hero contrast after the expanded typography rule. */

html[data-ssa-theme="dark"] body
    :where(.headturbo, #headturbo, .modern-page-header)
    :where(h1, h2, h3, h4, p, li, label, .help-block) {
    color: #ffffff !important;
}

/* Dark mode must not retain light-only decorative gradients in content. */

html[data-ssa-theme="dark"] body
    :where(.ssa-ai-search-seo, .ai-search-optimization, .app-rank-wrap, .ssa-analyzer-v3)
    :where(div, section, article, aside, form, fieldset, details):not(
        [class*="icon"],
        [class*="badge"],
        [class*="score"],
        [class*="status"],
        [class*="progress"],
        [class*="alert"],
        [class*="loader"]
    ) {
    background-image: none !important;
}

/* AI Search Analyzer answer, FAQ and decision surfaces. */

html[data-ssa-theme="dark"] body :where(
    .ssa-five-layer-decision,
    .ssa-ai-question-cluster,
    .ssa-ai-search-seo details,
    .ssa-ai-question-cluster article
) {
    background: var(--ssa-final-surface) !important;
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme="dark"] body :where(
    .ssa-optimization-note,
    .ssa-five-layer-decision thead,
    .ssa-five-layer-decision th
) {
    background: var(--ssa-final-surface-soft) !important;
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-muted) !important;
}

html[data-ssa-theme="glass"] body :where(
    .ssa-five-layer-decision,
    .ssa-ai-question-cluster,
    .ssa-ai-search-seo details,
    .ssa-ai-question-cluster article
) {
    background: var(--ssa-final-surface) !important;
    border-color: var(--ssa-final-border) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .78), var(--ssa-final-shadow-soft) !important;
    -webkit-backdrop-filter: blur(18px) saturate(145%);
    backdrop-filter: blur(18px) saturate(145%);
}

/* App Rank uses the word hero for a light in-card introduction. */

html[data-ssa-theme="dark"] body :where(
    .app-rank-hero,
    .app-rank-card-header,
    .app-rank-info,
    .app-rank-comparison-wrap,
    .app-rank-callout,
    .app-rank-citation
) {
    background: var(--ssa-final-surface-soft) !important;
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme="dark"] body .app-rank-hero :where(h1, h2, h3) {
    color: var(--ssa-final-heading) !important;
}

html[data-ssa-theme="dark"] body .app-rank-hero :where(p, li) {
    color: var(--ssa-final-muted) !important;
}

html[data-ssa-theme="dark"] body .app-rank-kicker {
    background: rgba(59, 130, 246, .14) !important;
    color: #9bc7ff !important;
}

html[data-ssa-theme="glass"] body :where(
    .app-rank-hero,
    .app-rank-card-header,
    .app-rank-info,
    .app-rank-comparison-wrap,
    .app-rank-callout,
    .app-rank-citation
) {
    background: var(--ssa-final-surface) !important;
    border-color: var(--ssa-final-border) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .78), var(--ssa-final-shadow-soft) !important;
    -webkit-backdrop-filter: blur(18px) saturate(145%);
    backdrop-filter: blur(18px) saturate(145%);
}

html[data-ssa-theme="glass"] body .app-rank-hero :where(h1, h2, h3) {
    color: var(--ssa-final-heading) !important;
}

html[data-ssa-theme="glass"] body .app-rank-hero :where(p, li) {
    color: var(--ssa-final-muted) !important;
}

/* Stored Analyzer 2027 report shell and its dense diagnostic cards. */

html[data-ssa-theme="dark"] body .ssa-analyzer-v3 {
    background: var(--ssa-final-surface) !important;
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme="dark"] body .ssa-analyzer-v3 :where(
    .ssa-v3-metrics > div,
    .ssa27-report-shell,
    .ssa27-summary-wrap,
    .ssa27-priority,
    .ssa27-page-metric,
    .ssa27-category-card,
    .ssa-v2-intelligence,
    .ssa-v2-stat,
    .ssa27-check,
    .ssa27-ev-list-item
) {
    background: var(--ssa-final-surface-raised) !important;
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme="dark"] body .ssa-analyzer-v3 :where(
    .ssa27-stat,
    .ssa27-audit-tools,
    .ssa27-check-category-head,
    .ssa27-check-recommendation,
    .ssa27-evidence-body
) {
    background: var(--ssa-final-surface-soft) !important;
    border-color: var(--ssa-final-border) !important;
    color: var(--ssa-final-text) !important;
}

html[data-ssa-theme="dark"] body .ssa-analyzer-v3
    :where(.ssa27-category-card, a.ssa27-category-card) {
    color: var(--ssa-final-link) !important;
}

html[data-ssa-theme="dark"] body .ssa-analyzer-v3
    :where(.ssa-v3-status--done, .ssa-v2-empty) {
    background: rgba(16, 185, 129, .12) !important;
    border-color: rgba(52, 211, 153, .25) !important;
    color: #86efc1 !important;
}

html[data-ssa-theme="glass"] body .ssa-analyzer-v3,
html[data-ssa-theme="glass"] body .ssa-analyzer-v3 :where(
    .ssa27-report-shell,
    .ssa27-summary-wrap,
    .ssa27-check,
    .ssa-v2-intelligence
) {
    background: var(--ssa-final-surface) !important;
    border-color: var(--ssa-final-border) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .78), var(--ssa-final-shadow-soft) !important;
    -webkit-backdrop-filter: blur(18px) saturate(145%);
    backdrop-filter: blur(18px) saturate(145%);
}

/* PDF tools live outside the generic main-content landmark. */

html[data-ssa-theme="dark"] body :where(
    .merge-pdf-page,
    .pdf-tool-page,
    [class*="pdf-page"]
) :where(h1, h2, h3, h4) {
    color: var(--ssa-final-heading) !important;
}

html[data-ssa-theme="dark"] body :where(
    .merge-pdf-page,
    .pdf-tool-page,
    [class*="pdf-page"]
) :where(p, li, label, .help-block) {
    color: var(--ssa-final-muted) !important;
}

/* Never restyle third-party advertising surfaces; their palette is owned by
   the provider and changing it can make disclosures or controls unreadable. */

html[data-ssa-theme] body :where(
    [id^="aswift_"],
    [id^="google_ads_"],
    .google-anno-skip,
    .goog-rtopics
) {
    color-scheme: light;
}

/* =========================================================
   THEME SELECTOR — COMPACT, TOUCH SAFE, NON-OBSTRUCTIVE
   ========================================================= */

.ssa-theme-2027-switcher {
    max-width: calc(100vw - 24px);
    transition: width .20s ease, box-shadow .20s ease, background-color .20s ease !important;
}

.ssa-theme-2027-switcher .ssa-theme-2027-button {
    display: none;
}

.ssa-theme-2027-switcher .ssa-theme-2027-button[aria-pressed="true"],
.ssa-theme-2027-switcher.is-open .ssa-theme-2027-button,
.ssa-theme-2027-switcher:hover .ssa-theme-2027-button {
    display: inline-flex;
}

.ssa-theme-2027-switcher:not(.is-open)
    .ssa-theme-2027-button[aria-pressed="true"] {
    min-width: 96px;
}

/* =========================================================
   SCROLLBARS, SELECTION AND SMALL POLISH
   ========================================================= */

html[data-ssa-theme] ::selection {
    background: rgba(37, 99, 235, .26);
    color: var(--ssa-final-text);
}

html[data-ssa-theme="dark"] {
    scrollbar-color: #34435b #0a101c;
}

html[data-ssa-theme="glass"] {
    scrollbar-color: rgba(68, 101, 153, .54) rgba(255, 255, 255, .34);
}

html[data-ssa-theme] body hr {
    border-color: var(--ssa-final-border) !important;
}

/* =========================================================
   RTL AND RESPONSIVE SAFETY
   ========================================================= */

html[dir="rtl"] .ssa-theme-2027-switcher {
    right: auto;
    left: 18px;
}

html[dir="rtl"] body :where(input[type="url"], input[type="email"], code, pre) {
    direction: ltr;
    text-align: left;
}

@media (max-width: 991px) {
    html[data-ssa-theme="glass"] body {
        background-attachment: scroll !important;
    }

    html[data-ssa-theme="glass"] body
        :where(div, section, article, aside, form, fieldset, details, li):where(
            .card, .panel, .well, .thumbnail, .widget, .widget-box,
            .modal-content, [class$="-card"], [class*="-card "],
            [class$="-panel"], [class*="-panel "],
            [class$="-box"], [class*="-box "]
        ) {
        -webkit-backdrop-filter: blur(10px) saturate(125%);
        backdrop-filter: blur(10px) saturate(125%);
    }
}

@media (max-width: 767px) {
    .ssa-theme-2027-switcher {
        right: 10px;
        bottom: 10px;
    }

    html[dir="rtl"] .ssa-theme-2027-switcher {
        right: auto;
        left: 10px;
    }

    .ssa-theme-2027-switcher:not(.is-open)
        .ssa-theme-2027-button[aria-pressed="true"] {
        min-width: 42px;
    }

    .ssa-theme-2027-switcher.is-open .ssa-theme-2027-button {
        display: inline-flex;
    }

    html[data-ssa-theme] body
        :where(div, section, article, aside, form, fieldset, details):where(
            .card, .panel, .well, .thumbnail, .widget, .widget-box,
            .modal-content, [class$="-card"], [class*="-card "],
            [class$="-panel"], [class*="-panel "],
            [class$="-box"], [class*="-box "]
        ) {
        border-radius: 16px !important;
    }

    html[data-ssa-theme] body :where(table, .table) {
        font-size: 13px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ssa-theme-2027-switcher,
    .ssa-theme-2027-switcher * {
        transition-duration: .01ms !important;
    }
}

@media print {
    html[data-ssa-theme] body {
        background: #ffffff !important;
        color: #000000 !important;
    }

    .ssa-theme-2027-switcher {
        display: none !important;
    }
}