/* Paleta compartilhada do tema escuro. O tema claro e a impressão usam os estilos originais. */
@media screen {
    html.dark {
        --dark-canvas: #101416;
        --dark-surface: #192124;
        --dark-surface-raised: #222d30;
        --dark-input: #121a1d;
        --dark-border: #334145;
        --dark-border-hover: #527568;
        --dark-heading: #f0f4f3;
        --dark-text: #c5cfcd;
        --dark-muted: #a4b3ae;
        --dark-accent: #85d0ae;
        --dark-accent-soft: rgba(133, 208, 174, 0.09);
        --dark-button: #7bc8a4;
        --dark-button-hover: #9cdbba;
        --dark-button-ink: #10251a;
        --dark-shadow: 0 16px 40px rgba(0, 0, 0, 0.2);
        --platform-dark-surface: #1c2528;
        --platform-dark-surface-strong: var(--dark-surface);
        --platform-dark-surface-soft: var(--dark-surface-raised);
        --platform-dark-border: var(--dark-border);
        --platform-dark-border-strong: var(--dark-border-hover);
        --platform-dark-text: var(--dark-heading);
        --platform-dark-muted: var(--dark-text);
        --platform-dark-subtle: var(--dark-muted);
        --platform-dark-shadow: var(--dark-shadow);
        --card-bg-dark-rgb: 25, 33, 36;
        --site-scrollbar-thumb: #485b55;
        --site-scrollbar-thumb-hover: #647f73;
        --site-scrollbar-track: var(--dark-canvas);
        --site-scrollbar-border: var(--dark-canvas);
        background: var(--dark-canvas);
        color-scheme: dark;
    }

    html.dark body:is(.platform-body, .platform-page-body, .service-page) {
        background: var(--dark-canvas);
        color: var(--dark-text);
    }

    html.dark body:is(.platform-body, .platform-page-body, .service-page)::before,
    html.dark body:is(.platform-body, .platform-page-body, .service-page)::after {
        content: none;
    }

    html.dark ::selection {
        background: #345c49;
        color: var(--dark-heading);
    }

    /* Texto neutro e destaques da marca, sem alterar as cores de avisos e erros. */
    html.dark :is([class~="dark:text-white"], [class~="dark:text-gray-100"]) {
        color: var(--dark-heading);
    }

    html.dark :is([class~="dark:text-gray-200"], [class~="dark:text-gray-300"]) {
        color: var(--dark-text);
    }

    html.dark :is([class~="dark:text-gray-400"], [class~="dark:text-gray-500"]) {
        color: var(--dark-muted);
    }

    html.dark :is(.text-jusneural-green, .services-eyebrow, .service-card-cta,
        [class~="dark:text-green-400"], [class~="dark:text-emerald-300"]) {
        color: var(--dark-accent);
    }

    html.dark :is(.glassmorphism.site-header, .service-page .glassmorphism.site-header) {
        background: rgba(17, 23, 26, 0.94);
        border-bottom-color: var(--dark-border);
        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.16);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
    }

    html.dark :is(.site-mobile-menu, .service-page .site-mobile-menu) {
        background: var(--dark-surface);
        border-bottom-color: var(--dark-border);
        box-shadow: var(--dark-shadow);
    }

    html.dark :is(.site-header, .service-page .site-header)::after {
        background: linear-gradient(90deg, transparent, rgba(133, 208, 174, 0.2), transparent);
    }

    html.dark :is(#mobile-menu-button, .service-page #mobile-menu-button) {
        background: var(--dark-surface-raised);
        border-color: var(--dark-border);
        color: var(--dark-text);
        box-shadow: none;
    }

    html.dark :is(#mobile-menu-button, .service-page #mobile-menu-button):hover {
        background: #2c393c;
        border-color: var(--dark-border-hover);
        color: var(--dark-heading);
    }

    /* Imagens de abertura com uma cobertura uniforme, sem o fundo preto estampado. */
    html.dark .hero-background-image,
    html.dark .service-page .hero::before {
        filter: saturate(0.5) brightness(0.68);
        opacity: 0.5;
    }

    html.dark .hero-background-overlay,
    html.dark .service-page .hero::after {
        background: linear-gradient(180deg, rgba(16, 20, 22, 0.45), rgba(16, 20, 22, 0.7) 55%, var(--dark-canvas));
    }

    html.dark .hero-background-fade {
        background: linear-gradient(180deg, transparent, var(--dark-canvas));
    }

    html.dark .service-page .hero {
        background: var(--dark-canvas);
    }

    html.dark :is(.hero-platform-card, .service-page .hero-copy) {
        background: linear-gradient(145deg, rgba(34, 45, 48, 0.96), rgba(25, 33, 36, 0.94));
        border-color: #42534f;
        box-shadow: 0 20px 56px rgba(0, 0, 0, 0.24);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
    }

    html.dark :is(.platform-shell, .platform-article-card, .platform-data-card,
        .platform-step-card, .platform-map-shell, .platform-convenios-grid > div,
        .platform-steps-grid > div, .download-platform-card, .platform-stat-card,
        .innovative-card, details.group, .contact-platform-card,
        .service-page .hero-feature-card, .service-page .card, .service-page .list li,
        .service-page .cta-band) {
        background: linear-gradient(160deg, var(--platform-dark-surface), var(--dark-surface));
        border-color: var(--dark-border) !important;
        box-shadow: var(--dark-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.025);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    html.dark :is(.hero-platform-card, .platform-shell, .platform-article-card,
        .platform-data-card, .platform-step-card, .platform-map-shell,
        .platform-convenios-grid > div, .platform-steps-grid > div,
        .download-platform-card, .contact-platform-card)::before {
        background: none;
    }

    html.dark :is(.innovative-card, .platform-data-card, .platform-step-card,
        .platform-convenios-grid > div, .platform-steps-grid > div,
        .service-page .hero-feature-card, .service-page .card, .service-page .list li):hover {
        border-color: var(--dark-border-hover) !important;
        box-shadow: 0 20px 44px rgba(0, 0, 0, 0.24);
    }

    html.dark .service-page :is(.hero h1, .section h2, .cta-band h2,
        .hero-feature-card strong, .related-card strong) {
        color: var(--dark-heading);
    }

    html.dark .service-page .hero h1 span {
        color: var(--dark-accent);
    }

    html.dark .service-page :is(.lead, .hero-feature-card p, .card p, .list li, .cta-band p) {
        color: var(--dark-text);
    }

    html.dark .service-card-points {
        color: var(--dark-text);
    }

    html.dark .service-page .section:nth-of-type(3) {
        background: #141b1e;
        border-color: #29363a;
    }

    html.dark :is(.service-card-topline, .service-page .eyebrow,
        .service-page .service-icon, .page-legal .legal-summary-icon,
        .page-legal .legal-summary-toggle) {
        background: var(--dark-accent-soft);
        border-color: #3c6150;
        color: var(--dark-accent);
        filter: none;
    }

    html.dark .service-page :is(.hero-feature-card span, .card-number) {
        background: #273e34;
        color: #a9dfc3;
    }

    /* Botões com contraste constante, inclusive no cabeçalho e nos cartões. */
    html.dark :is(.platform-primary-cta, .service-page .platform-primary-cta,
        .service-page .button.primary) {
        background: var(--dark-button) !important;
        border-color: #92d4b4 !important;
        color: var(--dark-button-ink) !important;
        box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16);
    }

    html.dark :is(.platform-primary-cta, .service-page .platform-primary-cta,
        .service-page .button.primary):hover {
        background: var(--dark-button-hover) !important;
        color: var(--dark-button-ink) !important;
        box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
    }

    html.dark :is(.platform-secondary-cta, .service-page .button.secondary) {
        background: var(--dark-surface-raised) !important;
        border-color: #4b5e60 !important;
        color: var(--dark-heading) !important;
        box-shadow: none;
    }

    html.dark :is(.platform-secondary-cta, .service-page .button.secondary):hover {
        background: #2c393c !important;
        border-color: #739e89 !important;
    }

    html.dark :is(a, button, input, select, textarea, summary):focus-visible {
        outline: 2px solid var(--dark-accent);
        outline-offset: 4px;
    }

    html.dark :is(.platform-shot-shell, .image-slider-container, .platform-step-image-shell) {
        background: var(--dark-surface);
        border-color: var(--dark-border) !important;
        box-shadow: var(--dark-shadow);
    }

    html.dark .image-slider-container::after {
        background: none;
    }

    html.dark .platform-shell :is(thead, [class~="dark:bg-gray-700"]) {
        background: var(--dark-surface-raised);
    }

    html.dark .platform-shell :is(th, td, tbody, thead) {
        border-color: var(--dark-border);
        --tw-divide-opacity: 1;
    }

    html.dark .platform-shell tbody > tr + tr {
        border-color: var(--dark-border);
    }

    html.dark .platform-shell tbody tr:hover {
        background: var(--dark-accent-soft);
    }

    html.dark .platform-search-input,
    html.dark #convenios-search,
    html.dark .api-page :is(input[type="number"], select, textarea) {
        background: var(--dark-input);
        border-color: #4b605c;
        color: var(--dark-heading);
        box-shadow: none;
    }

    html.dark :is(.platform-search-input, #convenios-search)::placeholder,
    html.dark .api-page textarea::placeholder {
        color: var(--dark-muted);
        opacity: 1;
    }

    html.dark .services-slider-btn {
        background: var(--dark-surface-raised);
        border-color: var(--dark-border);
        color: var(--dark-heading);
        box-shadow: var(--dark-shadow);
    }

    html.dark .services-slider-btn:hover {
        background: #2c393c;
        border-color: var(--dark-border-hover);
    }

    html.dark .services-gradient-edge::before {
        background: linear-gradient(to right, var(--dark-canvas), transparent);
    }

    html.dark .services-gradient-edge::after {
        background: linear-gradient(to left, var(--dark-canvas), transparent);
    }

    html.dark :is(.download-security-note, .platform-info-banner) {
        background: #1c302a !important;
        border-color: #426553 !important;
        color: #c5e6d5 !important;
        box-shadow: none;
    }

    html.dark :is(.platform-info-badge, .platform-inline-note, .contact-copy-row) {
        background: var(--dark-surface-raised) !important;
        border-color: var(--dark-border) !important;
        color: var(--dark-text) !important;
        box-shadow: none;
    }

    html.dark .download-qr-panel {
        border-color: #b8c5be;
        box-shadow: none;
    }

    html.dark .platform-convenios-grid > div > .absolute {
        background: #294435;
        color: #bce9cf;
        box-shadow: none;
    }

    html.dark .plan-toggle-shell {
        background: var(--dark-surface);
        border-color: var(--dark-border);
        box-shadow: none;
    }

    html.dark #plan-slider-thumb {
        background: var(--dark-button);
        box-shadow: none;
    }

    html.dark .plan-toggle-shell button {
        color: var(--dark-muted);
    }

    html.dark .plan-toggle-shell button.text-white {
        color: var(--dark-button-ink);
    }

    html.dark .plan-token-highlight {
        background: var(--dark-accent-soft);
        border-color: #527c65;
        color: #bce9cf;
        box-shadow: none;
    }

    html.dark #faq-section details {
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    }

    html.dark #faq-section details[open] {
        border-color: var(--dark-border-hover) !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
    }

    html.dark #faq-section details[open] summary {
        color: var(--dark-accent);
    }

    html.dark :is(.new-footer-style, .service-page .new-footer-style) {
        background: #141b1e;
        border-color: var(--dark-border);
        color: var(--dark-text);
        box-shadow: none;
    }

    html.dark :is(.new-footer-style .footer-link, .service-page .new-footer-style .footer-link) {
        color: var(--dark-text);
    }

    html.dark :is(.new-footer-style .footer-link, .service-page .new-footer-style .footer-link):hover {
        color: var(--dark-accent);
    }

    html.dark :is(.new-footer-style .footer-text, .service-page .new-footer-style .footer-text) {
        color: var(--dark-muted);
    }

    html.dark :is(.footer-separator, .service-page .footer-separator) {
        border-color: var(--dark-border);
    }

    html.dark :is(#contact-popup, .service-page #contact-popup) {
        background: rgba(8, 12, 14, 0.76);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
    }

    html.dark :is(#google-play-tooltip, #apple-store-tooltip) {
        background: var(--dark-surface-raised);
        border-color: var(--dark-border);
        color: var(--dark-text);
        box-shadow: var(--dark-shadow);
    }

    html.dark .google-play-tooltip-arrow {
        border-top-color: var(--dark-surface-raised);
    }

    /* Documentos: texto confortável e navegação lateral discreta. */
    html.dark .platform-prose {
        --tw-prose-invert-body: var(--dark-text);
        --tw-prose-invert-headings: var(--dark-heading);
        --tw-prose-invert-lead: var(--dark-text);
        --tw-prose-invert-links: var(--dark-accent);
        --tw-prose-invert-bold: var(--dark-heading);
        --tw-prose-invert-counters: var(--dark-muted);
        --tw-prose-invert-bullets: #668074;
        --tw-prose-invert-hr: var(--dark-border);
        --tw-prose-invert-quotes: var(--dark-text);
        --tw-prose-invert-quote-borders: var(--dark-border-hover);
        --tw-prose-invert-code: var(--dark-accent);
        --tw-prose-invert-th-borders: var(--dark-border);
        --tw-prose-invert-td-borders: var(--dark-border);
    }

    html.dark :is(.platform-prose a, .platform-data-card a:not(.platform-primary-cta),
        .platform-shell a:not(.platform-primary-cta)) {
        color: var(--dark-accent);
    }

    html.dark :is(.platform-prose a, .platform-data-card a:not(.platform-primary-cta),
        .platform-shell a:not(.platform-primary-cta)):hover {
        color: #b3e4ca;
    }

    html.dark .page-legal .legal-summary {
        background: var(--dark-surface-raised);
        border-color: var(--dark-border);
        box-shadow: none;
    }

    html.dark .page-legal .legal-summary .legal-summary-title {
        color: var(--dark-heading);
    }

    html.dark .page-legal .platform-prose .legal-summary-list a {
        background: transparent;
        border-color: var(--dark-border);
        color: var(--dark-muted);
    }

    html.dark .page-legal .legal-summary-list a > span {
        color: var(--dark-accent);
    }

    html.dark .page-legal .platform-prose .legal-summary-list a:hover,
    html.dark .page-legal .platform-prose .legal-summary-list a[aria-current="location"] {
        background: var(--dark-accent-soft);
        border-color: #426553;
        color: var(--dark-heading);
    }

    html.dark :is(.leaflet-popup-content-wrapper, .leaflet-popup-tip) {
        background: var(--dark-surface-raised);
        color: var(--dark-text);
    }

    html.dark .leaflet-control-zoom a {
        background: var(--dark-surface);
        border-color: var(--dark-border);
        color: var(--dark-heading);
    }

    /* API: mesma paleta nos formulários, tabelas, exemplos e navegação. */
    html.dark .api-page {
        --api-surface: var(--dark-surface);
        --api-subtle: var(--dark-surface-raised);
        --api-border: var(--dark-border);
        --api-muted: var(--dark-text);
        --api-accent: var(--dark-accent);
        --api-ink: var(--dark-heading);
    }

    html.dark .api-page .api-price-accent {
        background: linear-gradient(145deg, #243b30, var(--dark-surface));
        border-color: #6b9c7f !important;
    }

    html.dark :is(.api-terminal, .api-code-panel, .api-doc-page .api-code-panel pre) {
        background: var(--dark-input);
        border-color: #3c504b;
        box-shadow: none;
    }

    html.dark :is(.api-terminal-top, .api-code-toolbar) {
        background: var(--dark-surface-raised);
        border-color: #3c504b;
        color: var(--dark-text);
    }

    html.dark .api-small-button {
        background: #293f34;
        border-color: #527c65;
        color: #bce9cf;
    }

    html.dark .api-small-button:hover {
        background: #345641;
        border-color: #79ab8d;
    }

    html.dark .api-doc-sidebar a {
        color: var(--dark-muted);
    }

    html.dark .api-doc-sidebar a:hover,
    html.dark .api-doc-sidebar a[aria-current="location"] {
        background: var(--dark-accent-soft);
        border-color: var(--dark-accent);
        color: var(--dark-accent);
    }
}

@media screen and (min-width: 1200px) {
    html.dark .page-legal .legal-document > .legal-summary {
        background: transparent;
        border-right-color: var(--dark-border);
    }

    html.dark .page-legal .platform-prose .legal-summary-list a {
        border-color: transparent;
    }
}

/* Alternância de tema compartilhada por todas as páginas. */
@media screen {
    html .site-header #theme-toggle,
    html.dark .site-header #theme-toggle {
        display: grid;
        place-items: center;
        flex-shrink: 0;
        width: 32px;
        height: 32px;
        padding: 0;
        border: 0;
        border-radius: 6px;
        background: transparent;
        color: #1f2937;
        box-shadow: none;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        transition: background-color 150ms ease, color 150ms ease;
    }

    html.dark .site-header #theme-toggle {
        color: var(--dark-heading, #fafafa);
    }

    html .site-header #theme-toggle:focus-visible {
        outline: 2px solid #287650;
        outline-offset: 3px;
    }

    html.dark .site-header #theme-toggle:focus-visible {
        outline-color: var(--dark-accent, #85d0ae);
    }

    /* A raiz define o ícone visível já na primeira renderização. */
    html .site-header #theme-toggle :is(#theme-toggle-dark-icon, #theme-toggle-light-icon) {
        display: block;
        grid-area: 1 / 1;
        width: 16px;
        height: 16px;
        pointer-events: none;
        transform-origin: center;
        transition: opacity 150ms ease, transform 150ms ease;
    }

    html .site-header #theme-toggle-light-icon,
    html.dark .site-header #theme-toggle-dark-icon {
        opacity: 1;
        transform: rotate(0) scale(1);
    }

    html .site-header #theme-toggle-dark-icon {
        opacity: 0;
        transform: rotate(90deg) scale(0);
    }

    html.dark .site-header #theme-toggle-light-icon {
        opacity: 0;
        transform: rotate(-90deg) scale(0);
    }
}

@media screen and (hover: hover) {
    html .site-header #theme-toggle:hover {
        background: rgba(244, 244, 245, 0.8);
    }

    html.dark .site-header #theme-toggle:hover {
        background: rgba(255, 255, 255, 0.08);
    }
}

@media screen and (prefers-reduced-motion: reduce) {
    html .site-header #theme-toggle,
    html.dark .site-header #theme-toggle,
    html .site-header #theme-toggle :is(#theme-toggle-dark-icon, #theme-toggle-light-icon) {
        transition: none;
    }
}
