/* ========== Night mode toggle ========== */

.night-mode-btn {
    background: none;
    border: 1px solid var(--border-subtle);
    border-radius: 50%;
    width: 32px;
    height: 32px;
    font-size: 1rem;
    cursor: pointer;
    color: var(--text-secondary);
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 4px;
}

.night-mode-btn:hover {
    color: var(--accent);
    border-color: var(--accent);
}

body.night-red .night-mode-btn {
    color: #cc3333;
    border-color: rgba(204, 51, 51, 0.3);
    background: none;
}

@media (max-width: 767px) {
    .night-mode-btn {
        width: 28px;
        height: 28px;
        font-size: 0.85rem;
    }
}

/* ========== Sélecteur de thème ========== */

.theme-picker {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
    gap: 10px;
}
.theme-swatch {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 14px 8px 10px;
    border: 2px solid transparent;
    border-radius: var(--radius-md);
    background: var(--bg-card);
    color: var(--text-muted);
    font-size: 0.72rem;
    cursor: pointer;
    transition: all 0.25s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.theme-swatch .swatch-dot {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--swatch);
    box-shadow: 0 0 0 3px rgba(0,0,0,0.3), 0 2px 8px rgba(0,0,0,0.3);
    transition: all 0.25s ease;
}
.theme-swatch:hover {
    background: rgba(255, 255, 255, 0.03);
    color: var(--text-secondary);
}
.theme-swatch:hover .swatch-dot {
    box-shadow: 0 0 0 3px rgba(0,0,0,0.3), 0 0 12px var(--swatch);
    transform: scale(1.1);
}
.theme-swatch.active {
    border-color: var(--swatch);
    background: rgba(255, 255, 255, 0.04);
    color: var(--text-primary);
    font-weight: 600;
}
.theme-swatch.active .swatch-dot {
    box-shadow: 0 0 0 3px rgba(0,0,0,0.2), 0 0 16px var(--swatch), 0 0 32px var(--swatch);
}

/* ========== Thèmes planétaires ========== */

/* Astralis (défaut) = :root — violet #7B5FE7 */

body.theme-mars {
    --emoji-hue: 0deg;
    --accent: #e06830;
    --accent-hover: #e87840;
    --accent-bg: rgba(224, 104, 48, 0.08);
    --accent-bg-strong: rgba(224, 104, 48, 0.15);
    --accent-border: rgba(224, 104, 48, 0.15);
    --accent-border-strong: rgba(224, 104, 48, 0.3);
    --accent-glow: rgba(224, 104, 48, 0.4);
    --accent-glow-strong: rgba(224, 104, 48, 0.6);
    --logo-filter: none;
    --tw-day: #7a3b1a; --tw-civil: #60280e; --tw-nautical: #481808; --tw-astro: #301004; --tw-night: #1a0802;
}

body.theme-venus {
    --emoji-hue: 10deg;
    --accent: #d4a830;
    --accent-hover: #ddb840;
    --accent-bg: rgba(212, 168, 48, 0.08);
    --accent-bg-strong: rgba(212, 168, 48, 0.15);
    --accent-border: rgba(212, 168, 48, 0.15);
    --accent-border-strong: rgba(212, 168, 48, 0.3);
    --accent-glow: rgba(212, 168, 48, 0.4);
    --accent-glow-strong: rgba(212, 168, 48, 0.6);
    --logo-filter: none;
    --tw-day: #7a6a1a; --tw-civil: #604e0e; --tw-nautical: #483808; --tw-astro: #302404; --tw-night: #1a1402;
}

body.theme-terre {
    --emoji-hue: 180deg;
    --accent: #3a7bd5;
    --accent-hover: #4a8be5;
    --accent-bg: rgba(58, 123, 213, 0.08);
    --accent-bg-strong: rgba(58, 123, 213, 0.15);
    --accent-border: rgba(58, 123, 213, 0.15);
    --accent-border-strong: rgba(58, 123, 213, 0.3);
    --accent-glow: rgba(58, 123, 213, 0.4);
    --accent-glow-strong: rgba(58, 123, 213, 0.6);
    --logo-filter: none;
    --tw-day: #1a3b7a; --tw-civil: #0e2860; --tw-nautical: #081848; --tw-astro: #041030; --tw-night: #02081a;
}

body.theme-neptune {
    --emoji-hue: 150deg;
    --accent: #2090c0;
    --accent-hover: #30a0d0;
    --accent-bg: rgba(32, 144, 192, 0.08);
    --accent-bg-strong: rgba(32, 144, 192, 0.15);
    --accent-border: rgba(32, 144, 192, 0.15);
    --accent-border-strong: rgba(32, 144, 192, 0.3);
    --accent-glow: rgba(32, 144, 192, 0.4);
    --accent-glow-strong: rgba(32, 144, 192, 0.6);
    --logo-filter: none;
    --tw-day: #1a5a7a; --tw-civil: #0e4060; --tw-nautical: #082e48; --tw-astro: #041e30; --tw-night: #02101a;
}

body.theme-titan {
    --emoji-hue: 80deg;
    --accent: #4a9050;
    --accent-hover: #5aa060;
    --accent-bg: rgba(74, 144, 80, 0.08);
    --accent-bg-strong: rgba(74, 144, 80, 0.15);
    --accent-border: rgba(74, 144, 80, 0.15);
    --accent-border-strong: rgba(74, 144, 80, 0.3);
    --accent-glow: rgba(74, 144, 80, 0.4);
    --accent-glow-strong: rgba(74, 144, 80, 0.6);
    --logo-filter: none;
    --tw-day: #2a5a2a; --tw-civil: #1e401e; --tw-nautical: #142e14; --tw-astro: #0a1e0a; --tw-night: #041004;
}

body.theme-encelade {
    --emoji-hue: 200deg;
    --accent: #8090a8;
    --accent-hover: #90a0b8;
    --accent-bg: rgba(128, 144, 168, 0.08);
    --accent-bg-strong: rgba(128, 144, 168, 0.15);
    --accent-border: rgba(128, 144, 168, 0.15);
    --accent-border-strong: rgba(128, 144, 168, 0.3);
    --accent-glow: rgba(128, 144, 168, 0.4);
    --accent-glow-strong: rgba(128, 144, 168, 0.6);
    --logo-filter: none;
    --tw-day: #3a3a44; --tw-civil: #2a2a32; --tw-nautical: #1c1c22; --tw-astro: #101014; --tw-night: #08080a;
}

body.theme-orion {
    --emoji-hue: 290deg;
    --accent: #d94080;
    --accent-hover: #e05090;
    --accent-bg: rgba(217, 64, 128, 0.08);
    --accent-bg-strong: rgba(217, 64, 128, 0.15);
    --accent-border: rgba(217, 64, 128, 0.15);
    --accent-border-strong: rgba(217, 64, 128, 0.3);
    --accent-glow: rgba(217, 64, 128, 0.4);
    --accent-glow-strong: rgba(217, 64, 128, 0.6);
    --logo-filter: none;
    --tw-day: #5a1a3a; --tw-civil: #400e28; --tw-nautical: #2e081c; --tw-astro: #1e0410; --tw-night: #100208;
}

/* ========== Night red mode ========== */

body.night-red {
    --bg-primary: #0a0000;
    --bg-secondary: #120000;
    --bg-card: #1a0505;
    --bg-input: rgba(10, 0, 0, 0.3);
    --border: transparent;
    --border-subtle: rgba(204, 51, 51, 0.2);
    --moon-lit: #d07070;
    --moon-dark: #1a0505;
    --moon-rim: #772222;
    /* Contraste boosté (avant : 1.4:1 — maintenant AA Large ≥ 3:1) */
    --text-primary: #e86666;       /* ~5.5:1 sur #0a0000 */
    --text-secondary: #c25050;     /* ~4:1 */
    --text-muted: #a04242;         /* ~3:1 (AA Large) */
    --accent: #e04444;
    --accent-hover: #e85555;
    --accent-bg: rgba(204, 51, 51, 0.06);
    --accent-bg-strong: rgba(204, 51, 51, 0.12);
    --accent-border: rgba(204, 51, 51, 0.15);
    --accent-border-strong: rgba(204, 51, 51, 0.25);
    --accent-glow: rgba(204, 51, 51, 0.4);
    --accent-glow-strong: rgba(204, 51, 51, 0.6);
    --score-high: #e06666;
    --score-medium: #c25050;
    --score-low: #7a2222;
    --warning: #c24a22;
    --success: #a04422;
}

body.night-red .brand-name {
    color: var(--accent);
    text-shadow: 0 0 8px var(--accent-glow);
}

body.night-red .card-score.high {
    background: rgba(204, 68, 68, 0.15);
    color: #cc4444;
}

body.night-red .card-score.medium {
    background: rgba(170, 51, 51, 0.15);
    color: #aa3333;
}

body.night-red .card-score.low {
    background: rgba(102, 34, 34, 0.15);
    color: #662222;
}

body.night-red .mag-dot.filled {
    background: #cc4444;
    box-shadow: 0 0 3px rgba(204, 68, 68, 0.4);
}

body.night-red .dur-bar {
    background: #cc4444;
}

body.night-red .sort-btn.active,
body.night-red .sort-btn.flipped {
    border-color: #cc4444;
    background: rgba(204, 68, 68, 0.08);
}

body.night-red .ang-dot.on {
    background: rgba(204, 68, 68, 0.15);
    border-color: #cc4444;
}

body.night-red .ang-dot.s1 {
    background: rgba(204, 68, 68, 0.15) !important;
    border-color: #cc4444 !important;
}

body.night-red .dur-bars-inline .dur-bar.on {
    background: #cc4444;
}

body.night-red .season-bar-wrap {
    border-color: rgba(204, 68, 68, 0.2);
}

body.night-red .moon-phase-pct {
    color: #cc4444;
}

body.night-red .moon-trend {
    color: #cc3333;
    text-shadow: 0 0 8px rgba(204, 51, 51, 0.5), 0 0 16px rgba(204, 51, 51, 0.3);
}

body.night-red .setup-filter-type.narrowband {
    background: rgba(170, 51, 51, 0.15);
    color: #aa4444;
}

body.night-red .setup-filter-type.broadband {
    background: rgba(170, 68, 51, 0.15);
    color: #aa5544;
}

body.night-red .twilight-segment.day     { background: #3a1515; }
body.night-red .twilight-segment.civil   { background: #2a0e0e; }
body.night-red .twilight-segment.nautical { background: #1a0808; }
body.night-red .twilight-segment.astro   { background: #100404; }
body.night-red .twilight-segment.night   { background: #080202; }
body.night-red .twilight-segment         { color: #883333; }
body.night-red .twilight-label           { color: #883333; }
body.night-red .twilight-dot             { background: #662222 !important; }

body.night-red .score-bar-fill.high   { background: #cc4444; }
body.night-red .score-bar-fill.medium { background: #aa3333; }
body.night-red .score-bar-fill.low    { background: #662222; }

body.night-red .night-summary-title     { color: #cc4444; }
body.night-red .night-summary-block .time { color: #cc4444; }
body.night-red .night-summary-block .label { color: #883333; }
body.night-red .night-summary-duration  { color: #cc4444; }
body.night-red .night-summary-reco-note { color: #883333; }
body.night-red .night-summary-pose      { border-color: #331111; }
body.night-red .night-summary-pose .pose-count { color: #cc4444; }
body.night-red .night-summary-pose .pose-label { color: #883333; }
body.night-red .night-summary-pose.recommended {
    border-color: #cc3333;
    background: rgba(204, 51, 51, 0.08);
}

body.night-red img {
    filter: saturate(0) brightness(0.6) sepia(1) hue-rotate(-30deg);
}

body.night-red .seeing-dot {
    background: #883333 !important;
}

body.night-red .seeing-dot:first-child {
    background: #cc4444 !important;
}

body.night-red .seeing-value {
    color: #cc4444 !important;
}

body.night-red .nav-divider,
body.night-red .section-divider span {
    background: linear-gradient(90deg, transparent, #cc3333, transparent);
}

body.night-red #nav-date-label {
    color: #883333;
}

body.night-red .spinner-dots .dot {
    background: var(--accent);
}

body.night-red .skymap-svg circle,
body.night-red .skymap-svg line {
    opacity: 0.7;
}

body.night-red .skymap-svg text {
    fill: #cc4444;
    opacity: 0.6;
}

/* --- Night-red: formulaires, modales, boutons, gear --- */

body.night-red .field-required {
    border-color: #993333 !important;
    box-shadow: 0 0 0 1px rgba(153, 51, 51, 0.3);
}
body.night-red .field-required.field-ok,
body.night-red .gear-form .field-required.field-ok {
    border-color: #cc4444 !important;
    box-shadow: 0 0 0 1px rgba(204, 68, 68, 0.3);
}
body.night-red .form-group.gear-link {
    border-color: rgba(204, 68, 68, 0.25);
    background: rgba(204, 68, 68, 0.04);
}
body.night-red .form-group.gear-link label {
    color: #cc4444;
}
body.night-red .form-group.gear-link select {
    border-color: rgba(204, 68, 68, 0.3);
}
body.night-red .gear-reducer-section {
    border-color: rgba(204, 68, 68, 0.15);
}
body.night-red fieldset {
    border-color: rgba(204, 68, 68, 0.2) !important;
}
body.night-red legend {
    color: #cc4444 !important;
}

/* --- Night-red: couleurs calibration → nuances de rouge --- */

body.night-red .cal-active-badge.cal-color-0 { color: #cc4444; }
body.night-red .cal-active-badge.cal-color-1 { color: #aa3333; }
body.night-red .cal-active-badge.cal-color-2 { color: #993322; }
body.night-red .cal-active-badge.cal-color-3 { color: #884444; }

body.night-red .site-item.active.cal-border-0 { border-color: #cc4444; }
body.night-red .site-item.active.cal-border-1 { border-color: #aa3333; }
body.night-red .site-item.active.cal-border-2 { border-color: #993322; }
body.night-red .site-item.active.cal-border-3 { border-color: #884444; }

body.night-red .site-cal-badge.cal-color-0 { color: #cc4444; border-color: #cc4444; }
body.night-red .site-cal-badge.cal-color-1 { color: #aa3333; border-color: #aa3333; }
body.night-red .site-cal-badge.cal-color-2 { color: #993322; border-color: #993322; }
body.night-red .site-cal-badge.cal-color-3 { color: #884444; border-color: #884444; }

body.night-red .site-item.cal-border-0 { border-color: #cc4444; }
body.night-red .site-item.cal-border-1 { border-color: #aa3333; }
body.night-red .site-item.cal-border-2 { border-color: #993322; }
body.night-red .site-item.cal-border-3 { border-color: #884444; }

body.night-red .cal-status-ok.cal-color-0 { color: #cc4444; border-left-color: #cc4444; background: rgba(204, 68, 68, 0.06); }
body.night-red .cal-status-ok.cal-color-1 { color: #aa3333; border-left-color: #aa3333; background: rgba(170, 51, 51, 0.06); }
body.night-red .cal-status-ok.cal-color-2 { color: #993322; border-left-color: #993322; background: rgba(153, 51, 34, 0.06); }
body.night-red .cal-status-ok.cal-color-3 { color: #884444; border-left-color: #884444; background: rgba(136, 68, 68, 0.06); }

/* --- Night-red: statuts, badges, indicateurs verts/oranges --- */

body.night-red .meteoblue-status.ok { color: #cc4444; }
body.night-red .sampling-ok { color: #cc4444; }
body.night-red .sampling-warn { color: #993322; }

/* --- Night-red: poses recommandées --- */

body.night-red .night-summary-pose.recommended {
    border-color: #cc3333;
    background: rgba(204, 51, 51, 0.08);
}
body.night-red .night-summary-pose .pose-recommended,
body.night-red .night-summary-pose .pose-topt {
    color: #cc4444;
}

/* --- Night-red: checklist, solar, altitude, sampling --- */

body.night-red .checklist-group.done .checklist-group-title { color: #cc4444; }
body.night-red .solar-card.high { border-left-color: #cc4444; }
body.night-red .solar-status.high { background: rgba(204, 68, 68, 0.15); color: #cc4444; }
body.night-red .alt-legend-green { color: #cc4444; }
body.night-red .sampling-quality.ideal { color: #cc4444; }
body.night-red .sampling-quality.warn { color: #993322; }

/* --- Night-red: recommandations --- */

body.night-red .reco-item {
    border-left-color: #cc3333;
    background: rgba(204, 51, 51, 0.04);
}
body.night-red .reco-dot {
    background: #cc3333;
}