/* ═══════════════════════════════════════
   theme.css — Suivi Colis
   Variables mode sombre + bouton bascule
   À inclure après base.css
   ═══════════════════════════════════════ */

/* ══ MODE SOMBRE ══ */
[data-theme="dark"] {
    /* Couleurs principales inversées */
    --color-primary: #5b9cf6;
    --color-primary-dark: #90b4f0;
    --color-primary-darker: #e2eaf6;
    --color-primary-light: #1a2d4a;

    /* Couleurs neutres inversées */
    --color-white: #16213a;
    --color-bg-soft: #0f172a;
    --color-border: #2a3a55;
    --color-text-muted: #8a9bb8;

    /* Ombres plus prononcées */
    --shadow-sm: 0 2px 12px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 8px 40px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 8px 40px rgba(0, 0, 0, 0.5);
}

/* ── Fond de page en mode sombre ── */
[data-theme="dark"] body {
    background:
        radial-gradient(ellipse 80% 60% at 20% 10%, rgba(91, 156, 246, 0.12) 0%, transparent 60%),
        radial-gradient(ellipse 60% 50% at 80% 90%, rgba(26, 74, 138, 0.18) 0%, transparent 55%),
        linear-gradient(145deg, #060e1f 0%, #0a1628 50%, #0c1e35 100%);
    min-height: 100vh;
}

/* ── Inputs en mode sombre ── */
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] input[type="number"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] input[type="tel"],
[data-theme="dark"] textarea {
    background: #1e2d45;
    color: #e2eaf6;
    border-color: var(--color-border);
    color-scheme: dark;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: var(--color-text-muted);
}

[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus {
    background: #1a2840;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(91, 156, 246, 0.15);
    color: #e2eaf6;
}

/* Correction autofill navigateur en mode sombre */
[data-theme="dark"] input:-webkit-autofill,
[data-theme="dark"] input:-webkit-autofill:hover,
[data-theme="dark"] input:-webkit-autofill:focus {
    -webkit-text-fill-color: #e2eaf6;
    -webkit-box-shadow: 0 0 0px 1000px #1e2d45 inset;
    box-shadow: 0 0 0px 1000px #1e2d45 inset;
    border-color: var(--color-border);
    caret-color: #e2eaf6;
}

/* Validation inline en mode sombre */
[data-theme="dark"] .form-group.has-error .input-wrap input,
[data-theme="dark"] .form-group.has-error textarea {
    background: #2a1515;
    -webkit-box-shadow: 0 0 0px 1000px #2a1515 inset;
    box-shadow: 0 0 0px 1000px #2a1515 inset;
}

[data-theme="dark"] .form-group.is-valid .input-wrap input,
[data-theme="dark"] .form-group.is-valid textarea {
    background: #0f2a18;
    -webkit-box-shadow: 0 0 0px 1000px #0f2a18 inset;
    box-shadow: 0 0 0px 1000px #0f2a18 inset;
}

/* ══ BOUTON BASCULE THÈME ══ */
.btn-theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: var(--radius-sm);
    border: 1.5px solid var(--color-border);
    background: var(--color-white);
    color: var(--color-text-muted);
    cursor: pointer;
    transition: border-color var(--transition-base),
        color var(--transition-base),
        background var(--transition-base);
    flex-shrink: 0;
}

.btn-theme-toggle:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
    background: var(--color-primary-light);
}

.btn-theme-toggle:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.btn-theme-toggle svg {
    width: 16px;
    height: 16px;
}

/* Position sur la page login — coin supérieur droit */
.theme-toggle-login {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 50;
}