/* ==========================================================
   Site-wide: language switcher + theme toggle in the header,
   and the light theme (html[data-theme="light"]).
   Dark is the original design; light only overrides colors.
   ========================================================== */

/* ── Header controls ── */
.site-controls {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: Arial, sans-serif;
}
.lang-switch {
    display: flex;
    border: 1px solid #d5dce8;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}
.nav .lang-switch a,
.lang-switch a {
    padding: 3px 8px;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.4;
    color: #555;
    text-decoration: none;
}
.nav .lang-switch a:hover { color: #2f6db5; }
.nav .lang-switch a.active,
.lang-switch a.active { background: #2f6db5; color: #fff; }
.theme-toggle {
    width: 30px;
    height: 30px;
    padding: 0;
    border: 1px solid #d5dce8;
    border-radius: 50%;
    background: #fff;
    color: #2f6db5;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.theme-toggle svg { width: 16px; height: 16px; }
.theme-toggle .icon-moon { display: none; }
html[data-theme="light"] .theme-toggle .icon-sun { display: none; }
html[data-theme="light"] .theme-toggle .icon-moon { display: block; }

/* Medium screens: the nav row reaches the right edge, so tuck the
   controls into the top-right corner above the link baseline. */
@media (max-width: 1100px) {
    .site-controls { top: 6px; transform: none; right: 8px; }
}
/* Phones: the nav stacks into rows; the logo row has room on both sides. */
@media (max-width: 768px) {
    .site-controls { position: static; transform: none; }
    .lang-switch,
    .theme-toggle { position: absolute; top: 50%; transform: translateY(-50%); }
    .lang-switch { left: 10px; }
    .theme-toggle { right: 10px; }
}

/* ==========================================================
   Light theme
   ========================================================== */
html[data-theme="light"] {
    --lt-text: #1d2433;
    --lt-heading: #0a1033;
    --lt-muted: #5a6577;
    --lt-accent: #2f6db5;
    --lt-accent-dark: #24599a;
    --lt-border: #dfe5ee;
    --lt-soft: #eef2f8;
    --lt-tint: rgba(47,109,181,0.07);
}

html[data-theme="light"] body { color: var(--lt-text); }
html[data-theme="light"] .header { border-bottom: 1px solid var(--lt-border); box-shadow: none; }

/* Home page (styles-index.css) — photo background behind a white veil */
html[data-theme="light"] body:has(> #block2 > h1) {
    background:
        linear-gradient(rgba(255,255,255,0.78), rgba(243,246,251,0.92)),
        url('/Images/lift.jpg') center / auto 100vh no-repeat fixed;
}
html[data-theme="light"] .block-two > h1,
html[data-theme="light"] .block-two > p b { color: var(--lt-accent); }
html[data-theme="light"] #block2:has(> h1) { background: rgba(255,255,255,0.6); color: var(--lt-heading); }
html[data-theme="light"] .block-two > p { color: #2b3445; }

/* Article / content pages: gray band + dark glass card → soft band + white card */
html[data-theme="light"] .block-two:has(> .text-content) { background: var(--lt-soft); }
html[data-theme="light"] .text-content {
    background: #fff;
    color: var(--lt-text);
    border: 1px solid var(--lt-border);
    box-shadow: 0 6px 24px rgba(10,16,51,0.06);
    backdrop-filter: none;
}
html[data-theme="light"] .text-content h1,
html[data-theme="light"] .text-content h2,
html[data-theme="light"] .text-content strong { color: var(--lt-accent); }
html[data-theme="light"] .text-content h3 { color: var(--lt-heading); }
html[data-theme="light"] .text-content p,
html[data-theme="light"] .text-content ul,
html[data-theme="light"] .text-content ol { color: var(--lt-text); }
html[data-theme="light"] .text-content .note,
html[data-theme="light"] .text-content .small-note,
html[data-theme="light"] .small-note { color: var(--lt-muted); }
html[data-theme="light"] .text-content hr { border-top-color: var(--lt-border); }
html[data-theme="light"] .text-content a.special-link {
    color: var(--lt-heading);
    border-bottom-color: rgba(47,109,181,0.45);
}
html[data-theme="light"] .text-content a.special-link:hover,
html[data-theme="light"] .text-content a.special-link:focus {
    color: var(--lt-accent);
    border-bottom-color: var(--lt-accent);
    background: var(--lt-tint);
}
html[data-theme="light"] .text-content .article-table th,
html[data-theme="light"] .text-content .article-table td {
    border-color: var(--lt-border);
    color: var(--lt-text);
}
html[data-theme="light"] .text-content .article-table th { background: var(--lt-tint); color: var(--lt-accent); }
html[data-theme="light"] .text-content .read-more { background: var(--lt-tint); border-left-color: var(--lt-accent); }
html[data-theme="light"] #ourToolsList strong { color: var(--lt-accent); }

/* Prices */
html[data-theme="light"] .pricing-table { color: var(--lt-text); }
html[data-theme="light"] .pricing-table th { background: var(--lt-soft); color: var(--lt-accent); }
html[data-theme="light"] .pricing-table th,
html[data-theme="light"] .pricing-table td { border-bottom-color: var(--lt-border); }
html[data-theme="light"] .pricing-table td:last-child { color: var(--lt-accent); }
html[data-theme="light"] .pricing-table tr:hover { background: var(--lt-tint); }

/* News */
html[data-theme="light"] .news-item { border-bottom-color: var(--lt-border); }
html[data-theme="light"] .news-title,
html[data-theme="light"] .more-link,
html[data-theme="light"] .hide-link { color: var(--lt-accent); }
html[data-theme="light"] .news-text,
html[data-theme="light"] .ellipsis { color: var(--lt-text); }
html[data-theme="light"] .news-text h3,
html[data-theme="light"] .news-text strong { color: var(--lt-heading); }

/* FAQ list block */
html[data-theme="light"] .block-three { background: transparent; }
html[data-theme="light"] .block-three:not(:has(.styled-list)) { background: var(--lt-soft); }
html[data-theme="light"] .block-three h2 { color: var(--lt-heading); }
html[data-theme="light"] .block-three a { color: var(--lt-accent); }
html[data-theme="light"] .styled-list li {
    background: #fff;
    border: 1px solid var(--lt-border);
    box-shadow: 0 2px 6px rgba(10,16,51,0.05);
}
html[data-theme="light"] a.special-link { color: var(--lt-heading); }
html[data-theme="light"] a.special-link:hover,
html[data-theme="light"] a.special-link:focus {
    color: var(--lt-accent);
    text-decoration-color: var(--lt-accent);
    background: var(--lt-tint);
}
html[data-theme="light"] .read-more-link,
html[data-theme="light"] .read-more-link:hover { color: var(--lt-accent) !important; }

/* Contacts */
html[data-theme="light"] .block-five {
    background: rgba(255,255,255,0.85);
    color: var(--lt-text);
    border-top: 1px solid var(--lt-border);
}
html[data-theme="light"] .btn-submit { background: var(--lt-accent); color: #fff; }
html[data-theme="light"] .btn-submit:hover { background: var(--lt-accent-dark); }
html[data-theme="light"] .social-links img { box-shadow: 0 2px 6px rgba(10,16,51,0.12); }

/* Subfooter */
html[data-theme="light"] .subfooter {
    background: var(--lt-soft);
    color: #4a5568;
    border-top: 1px solid var(--lt-border);
}
html[data-theme="light"] .subfooter a { color: var(--lt-accent); }
html[data-theme="light"] .separator { color: rgba(0,0,0,0.25); }

/* ── Calculators with the dark card UI (CSS variables) ── */
html[data-theme="light"] {
    --bg: #f3f6fb;
    --card: #ffffff;
    --card2: #f5f8fc;
    --border: #dfe5ee;
    --text: #1d2433;
    --muted: #5a6577;
    --accent: #2f6db5;
    --accent-dark: #24599a;
    --good: #1e8a4c;
    --bad: #c62828;
    --warn: #8a5a00;
}
html[data-theme="light"] .btn,
html[data-theme="light"] .card h2 .num { color: #fff; }
html[data-theme="light"] .badge { background: var(--lt-tint); border-color: #c9d7ea; }
html[data-theme="light"] .bar-track,
html[data-theme="light"] details.src { background: var(--lt-soft); }
html[data-theme="light"] .cta-box,
html[data-theme="light"] .cta-card,
html[data-theme="light"] .cta { background: #eef4fb; border-color: #c9d7ea; }
html[data-theme="light"] div.note { background: #fff8e6; border-color: #f2df9e; }
html[data-theme="light"] div.note.bad { background: #fdeeee; border-color: #f3c2c2; }
html[data-theme="light"] div.note.good { background: #effaf3; border-color: #b9e4c9; }
html[data-theme="light"] div.note.info { background: #eef4fb; border-color: #c9d7ea; }
html[data-theme="light"] .stat.win { border-color: #b9e4c9; }
html[data-theme="light"] .steps .step.total { background: var(--lt-soft); }
html[data-theme="light"] .winner-tag { color: #fff; }
html[data-theme="light"] footer.disclaimer { background: #fdf3f3; border-color: #f3c2c2; color: #7a2323; }
html[data-theme="light"] tbody tr:hover { background: var(--lt-tint); }

/* ── Calculators with the light card UI (Offer in Compromise, Social Security) ── */
html[data-theme="light"] .hero { background: var(--lt-soft); }
html[data-theme="light"] .hero .text-content h1,
html[data-theme="light"] .hero h1 { color: var(--lt-accent); }
html[data-theme="light"] .hero p { color: #2b3445; }
html[data-theme="light"] .hero .badge { background: var(--lt-accent); color: #fff; }
html[data-theme="light"] .disclaimer:not(footer) { background: var(--lt-soft); color: #4a5568; }

/* ── "Ask a Question" form extras added by site.js ── */
.hp-field {
    position: absolute !important;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
.turnstile-box { min-height: 65px; margin: 0 0 15px; }
#form-result { margin-top: 12px; font-family: Arial, sans-serif; font-size: 0.95rem; }
#form-result.ok { color: #3fb950; }
#form-result.err { color: #ff7b72; }
html[data-theme="light"] #form-result.ok { color: #1a7f37; }
html[data-theme="light"] #form-result.err { color: #cf222e; }
