/* Landing pages dark mode — synced with React dashboard via html.dark + data-bs-theme */

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

html.dark {
    color-scheme: dark;
}

html.dark [data-theme-icon="moon"] {
    display: none;
}

html:not(.dark) [data-theme-icon="sun"] {
    display: none;
}

html.dark body {
    background-color: #0f172a;
    color: #e2e8f0;
}

html.dark .bg-white {
    background-color: #1e293b !important;
}

html.dark .bg-gray-50 {
    background-color: #334155 !important;
}

html.dark .bg-gray-100 {
    background-color: #0f172a !important;
}

html.dark .bg-warm-sand {
    background-color: #292524 !important;
}

html.dark .text-dark-gray {
    color: #f1f5f9 !important;
}

html.dark .text-medium-gray {
    color: #94a3b8 !important;
}

html.dark .text-gray-600 {
    color: #cbd5e1 !important;
}

html.dark .text-gray-700 {
    color: #e2e8f0 !important;
}

html.dark header.bg-white {
    background-color: #1e293b !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.35);
}

html.dark .border-gray-200,
html.dark .border-gray-300 {
    border-color: #475569 !important;
}

html.dark .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: #475569;
}

html.dark .hover\:bg-gray-50:hover {
    background-color: #334155 !important;
}

html.dark .hover\:bg-gray-100:hover {
    background-color: #334155 !important;
}

html.dark .hover\:bg-gray-200:hover {
    background-color: #475569 !important;
}

html.dark .landing-theme-toggle,
html.dark [data-lang-switcher] button {
    background-color: #334155 !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}

html.dark .landing-theme-toggle:focus-visible {
    outline-color: #2dd4bf;
}

html.dark [data-lang-switcher] [role="listbox"] {
    background-color: #1e293b !important;
    border-color: #475569 !important;
}

html.dark [data-lang-switcher] [role="option"]:hover,
html.dark [data-lang-switcher] [role="option"]:focus {
    background-color: #334155 !important;
}

html.dark [data-lang-switcher] [role="option"].bg-gray-50 {
    background-color: #334155 !important;
}

html.dark .ring-gray-200 {
    --tw-ring-color: #475569;
}

html.dark .faq-details summary:hover {
    background-color: #334155;
}

html.dark a.bg-white,
html.dark button.bg-white {
    background-color: #334155 !important;
}

html.dark a.bg-white:hover,
html.dark button.bg-white:hover {
    background-color: #475569 !important;
}

html.dark .landing-hero-secondary-cta {
    color: #ffffff !important;
}

html.dark .landing-hero-secondary-cta:hover {
    color: #ffffff !important;
}

.landing-logo-link {
    width: 96px;
}

.landing-logo {
    width: 96px;
    height: auto;
    display: block;
}

.landing-logo-dark {
    display: none;
}

html.dark .landing-logo-light {
    display: none;
}

html.dark .landing-logo-dark {
    display: block;
}

html.dark footer.bg-gray-950 {
    background-color: #020617 !important;
}

html.dark .border-t.border-gray-200 {
    border-color: #475569 !important;
}

html.dark .shadow-sm,
html.dark .shadow-md,
html.dark .shadow-lg,
html.dark .shadow-xl,
html.dark .shadow-2xl {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.35), 0 4px 6px -4px rgba(0, 0, 0, 0.35) !important;
}

/* Information pages: About, Privacy, Terms, Laws, Pricing, Security & Hosting */
html.dark .about-wrapper,
html.dark .page-wrapper,
html.dark .legal-wrapper {
    color: #cbd5e1;
}

html.dark .about-box,
html.dark .page-box,
html.dark .legal-box {
    background: #1e293b !important;
    border-color: #475569 !important;
    color: #e2e8f0;
}

html.dark .about-title,
html.dark .page-title,
html.dark .legal-title,
html.dark .about-box .section-title,
html.dark .page-box .section-title,
html.dark .legal-box .section-title {
    color: #7dd3fc !important;
}

html.dark .center-note,
html.dark .consult-link {
    color: #f1f5f9 !important;
}

html.dark .about-box p,
html.dark .page-box p,
html.dark .legal-box p,
html.dark .about-box li,
html.dark .page-box li,
html.dark .legal-box li,
html.dark .about-box h3,
html.dark .page-box h3,
html.dark .legal-box h3,
html.dark .about-box h5,
html.dark .page-box h5,
html.dark .legal-box h5,
html.dark .about-box h6,
html.dark .page-box h6,
html.dark .legal-box h6 {
    color: #e2e8f0;
}

html.dark .about-box b,
html.dark .page-box b,
html.dark .page-box strong,
html.dark .legal-box b,
html.dark .legal-box strong,
html.dark .about-box strong {
    color: #f8fafc;
}

html.dark .about-box a,
html.dark .page-box a,
html.dark .legal-box a {
    color: #2dd4bf !important;
}

html.dark .about-box a:hover,
html.dark .page-box a:hover,
html.dark .legal-box a:hover {
    color: #5eead4 !important;
}

html.dark .page-logo,
html.dark .about-logo,
html.dark .legal-logo {
    filter: brightness(0) invert(1);
}

html.dark .rocket-bg-img {
    opacity: 0.15;
}

html.dark .icon-right {
    filter: brightness(0) invert(1);
    opacity: 0.9;
}
