@charset "UTF-8";

/* Thème clair/sombre de la page de connexion. */
/* Palette claire par défaut. */
body.login-page {
    --theme-surface: rgba(255, 255, 255, 0.98);
    --theme-surface-strong: #ffffff;
    --theme-border: rgba(8, 42, 146, 0.12);
    --theme-ink: #1b2530;
    --theme-muted: #687386;
    --theme-title: #082a92;
    --theme-shadow: 0 28px 70px rgba(8, 42, 146, 0.24);
    --theme-topbar-bg: rgba(8, 42, 146, 0.05);
    --theme-topbar-border: rgba(8, 42, 146, 0.12);
    --theme-topbar-shadow: 0 12px 24px rgba(8, 42, 146, 0.08);
    --theme-switch-bg: rgba(8, 42, 146, 0.05);
    --theme-switch-border: rgba(8, 42, 146, 0.12);
    --theme-switch-shadow: 0 10px 24px rgba(8, 42, 146, 0.08);
    --theme-control-bg: linear-gradient(180deg, #fbfcfe, #f3f7fb);
    --theme-control-border: #e7edf5;
    --theme-control-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    --theme-input: #1b2530;
    --theme-placeholder: #b7bfcb;
    --theme-icon: rgba(8, 42, 146, 0.42);
    --theme-action: #082a92;
    --theme-action-hover: #0f41dd;
    --theme-action-shadow: 0 16px 28px rgba(8, 42, 146, 0.34);
    --theme-feedback: #4f6b85;
    --theme-footer: #c0c7d1;
    --theme-card-shine: 0.2;
    --theme-mark-glow: radial-gradient(circle at 32% 28%, rgba(255, 255, 255, 0.34), transparent 38%);
    --theme-sky-filter: none;
    --theme-scene-glow: 0.72;
    --theme-scene-mist: 0.55;
    color-scheme: light;
}

body.login-page[data-theme-mode="dark"] {
    --theme-surface: rgba(8, 12, 22, 0.92);
    --theme-surface-strong: rgba(7, 10, 18, 0.98);
    --theme-border: rgba(148, 163, 184, 0.18);
    --theme-ink: #eef4ff;
    --theme-muted: #a9b7cc;
    --theme-title: #eff4ff;
    --theme-shadow: 0 28px 72px rgba(0, 0, 0, 0.38);
    --theme-topbar-bg: rgba(10, 15, 26, 0.68);
    --theme-topbar-border: rgba(148, 163, 184, 0.18);
    --theme-topbar-shadow: 0 16px 34px rgba(0, 0, 0, 0.16);
    --theme-switch-bg: rgba(10, 15, 26, 0.76);
    --theme-switch-border: rgba(148, 163, 184, 0.24);
    --theme-switch-shadow: 0 16px 34px rgba(0, 0, 0, 0.24);
    --theme-control-bg: rgba(8, 12, 22, 0.78);
    --theme-control-border: rgba(148, 163, 184, 0.18);
    --theme-control-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
    --theme-input: #eef4ff;
    --theme-placeholder: #7f8da4;
    --theme-icon: #82a6ff;
    --theme-action: #9bbcff;
    --theme-action-hover: #7aa2ff;
    --theme-action-shadow: 0 18px 34px rgba(0, 0, 0, 0.32);
    --theme-feedback: #a7bfd9;
    --theme-footer: rgba(191, 204, 223, 0.72);
    --theme-card-shine: 0.1;
    --theme-mark-glow: radial-gradient(circle at 32% 28%, rgba(255, 255, 255, 0.16), transparent 38%);
    --theme-sky-filter: brightness(0.76) saturate(0.92) contrast(1.02);
    --theme-scene-glow: 0.44;
    --theme-scene-mist: 0.42;
    color-scheme: dark;
}

/* Ajustements de la scène selon le thème. */
body.login-page[data-theme-mode] .time-scene__sky {
    filter: var(--theme-sky-filter);
    transition: background 700ms ease, opacity 700ms ease, filter 700ms ease;
}

body.login-page[data-theme-mode] .time-scene__glow {
    opacity: var(--theme-scene-glow);
}

body.login-page[data-theme-mode] .time-scene__mist {
    opacity: var(--theme-scene-mist);
}

/* Carte, contenu et fond principal. */
body.login-page[data-theme-mode] .login-card {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: var(--theme-shadow);
}

body.login-page[data-theme-mode] .login-card::before {
    opacity: var(--theme-card-shine);
}

body.login-page[data-theme-mode] .login-card__media {
    background: linear-gradient(180deg, var(--theme-surface-strong), var(--theme-surface));
}

body.login-page[data-theme-mode="dark"] .login-card__media {
    background: linear-gradient(180deg, rgba(7, 10, 18, 0.96), rgba(10, 16, 30, 0.92));
}

body.login-page[data-theme-mode] .login-card__content {
    background: linear-gradient(180deg, var(--theme-surface), var(--theme-surface-strong));
    border-left-color: var(--theme-border);
}

/* Sélecteur de langue et bouton de thème. */
body.login-page[data-theme-mode] .login-panel__topbar {
    justify-content: space-between;
    gap: 10px 12px;
    flex-wrap: wrap;
}

body.login-page[data-theme-mode] .lang-switch {
    border-color: var(--theme-topbar-border);
    background: var(--theme-topbar-bg);
    box-shadow: var(--theme-topbar-shadow);
    backdrop-filter: blur(14px);
}

body.login-page[data-theme-mode] .lang-switch__btn {
    color: var(--theme-muted);
}

body.login-page[data-theme-mode] .lang-switch__btn.is-active {
    background: linear-gradient(180deg, #0f41dd, #082a92);
    color: #fff;
    box-shadow: 0 8px 16px rgba(8, 42, 146, 0.28);
}

body.login-page[data-theme-mode] .theme-switch {
    display: inline-flex;
    align-items: center;
}

body.login-page[data-theme-mode] .theme-switch__btn {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 38px;
    padding: 8px 14px 8px 10px;
    border: 1px solid var(--theme-switch-border);
    border-radius: 999px;
    background: var(--theme-switch-bg);
    color: var(--theme-ink);
    box-shadow: var(--theme-switch-shadow);
    white-space: nowrap;
    backdrop-filter: blur(16px);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease, color 0.22s ease;
}

body.login-page[data-theme-mode] .theme-switch__btn::before {
    content: "";
    position: absolute;
    inset: -20% -35%;
    background: linear-gradient(120deg, transparent 24%, rgba(255, 255, 255, 0.2) 50%, transparent 76%);
    transform: translateX(-60%) rotate(8deg);
    transition: transform 0.55s ease, opacity 0.22s ease;
    opacity: 0.65;
    pointer-events: none;
}

body.login-page[data-theme-mode] .theme-switch__btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 34px rgba(8, 42, 146, 0.16);
}

body.login-page[data-theme-mode] .theme-switch__btn:hover::before {
    transform: translateX(60%) rotate(8deg);
}

body.login-page[data-theme-mode] .theme-switch__btn:focus-visible {
    outline: 3px solid rgba(8, 42, 146, 0.16);
    outline-offset: 3px;
}

body.login-page[data-theme-mode] .theme-switch__icon {
    width: 1.02rem;
    height: 1.02rem;
    display: inline-grid;
    place-items: center;
    transition: opacity 0.24s ease, transform 0.24s ease, color 0.24s ease;
    color: var(--theme-icon);
}

body.login-page[data-theme-mode] .theme-switch__icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;
}

body.login-page[data-theme-mode] .theme-switch__label {
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.login-page[data-theme-mode] .theme-switch__btn[data-mode="light"] .theme-switch__icon--sun,
body.login-page[data-theme-mode] .theme-switch__btn[data-mode="dark"] .theme-switch__icon--moon {
    opacity: 1;
    transform: scale(1.04);
}

body.login-page[data-theme-mode] .theme-switch__btn[data-mode="light"] .theme-switch__icon--moon,
body.login-page[data-theme-mode] .theme-switch__btn[data-mode="dark"] .theme-switch__icon--sun {
    opacity: 0.42;
    transform: scale(0.92);
}

/* Titre, champs et action principale. */
body.login-page[data-theme-mode] .login-panel__title {
    color: var(--theme-title);
    text-shadow: 0 10px 24px rgba(8, 42, 146, 0.16);
}

body.login-page[data-theme-mode="dark"] .login-panel__title {
    text-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
}

body.login-page[data-theme-mode] .login-panel__title-mark {
    box-shadow: 0 16px 28px rgba(8, 42, 146, 0.28);
}

body.login-page[data-theme-mode="dark"] .login-panel__title-mark {
    box-shadow: 0 18px 30px rgba(0, 0, 0, 0.28);
}

body.login-page[data-theme-mode] .login-panel__title-mark::after {
    background: var(--theme-mark-glow);
}

body.login-page[data-theme-mode] .field label {
    color: var(--theme-muted);
}

body.login-page[data-theme-mode] .field__control {
    border-color: var(--theme-control-border);
    background: var(--theme-control-bg);
    box-shadow: var(--theme-control-shadow);
}

body.login-page[data-theme-mode] .field__control:focus-within {
    border-color: rgba(8, 42, 146, 0.44);
    box-shadow: 0 0 0 4px rgba(8, 42, 146, 0.12);
}

body.login-page[data-theme-mode] .field__icon {
    color: var(--theme-icon);
}

body.login-page[data-theme-mode] .field input {
    color: var(--theme-input);
}

body.login-page[data-theme-mode] .field input::placeholder {
    color: var(--theme-placeholder);
}

body.login-page[data-theme-mode] .password-toggle,
body.login-page[data-theme-mode] .text-link {
    color: var(--theme-action);
}

body.login-page[data-theme-mode] .submit-button {
    background: linear-gradient(135deg, var(--theme-action-hover) 0%, var(--theme-action) 52%, #061f6a 100%);
    box-shadow: var(--theme-action-shadow);
}

body.login-page[data-theme-mode] .submit-button::before {
    opacity: 0.72;
}

body.login-page[data-theme-mode="dark"] .submit-button::before {
    opacity: 0.38;
}

body.login-page[data-theme-mode] .submit-button:hover {
    box-shadow: 0 22px 36px rgba(8, 42, 146, 0.4);
}

body.login-page[data-theme-mode] .form-feedback {
    color: var(--theme-feedback);
}

body.login-page[data-theme-mode] .login-panel__footer {
    color: var(--theme-footer);
}

/* Zone promotionnelle et état vide. */
body.login-page[data-theme-mode] .promo-stage,
body.login-page[data-theme-mode] .promo-empty {
    box-shadow: 0 22px 44px rgba(0, 0, 0, 0.12);
}

body.login-page[data-theme-mode] .promo-stage__frame {
    background: var(--theme-surface-strong);
}

body.login-page[data-theme-mode] .promo-nav {
    background: rgba(255, 255, 255, 0.72);
    border-color: var(--theme-topbar-border);
    color: var(--theme-ink);
}

body.login-page[data-theme-mode] .promo-dot {
    background: rgba(8, 42, 146, 0.22);
}

body.login-page[data-theme-mode] .promo-dot.is-active {
    background: linear-gradient(180deg, var(--theme-action-hover), var(--theme-action));
}

body.login-page[data-theme-mode] .promo-progress {
    background: rgba(8, 42, 146, 0.12);
}

body.login-page[data-theme-mode] .promo-progress > span {
    background: linear-gradient(90deg, var(--theme-action-hover), var(--theme-action));
}

body.login-page[data-theme-mode] .promo-empty__badge,
body.login-page[data-theme-mode] .promo-empty__title,
body.login-page[data-theme-mode] .promo-empty__copy {
    color: var(--theme-ink);
}

body.login-page[data-theme-mode="dark"] .promo-nav {
    background: rgba(10, 15, 26, 0.82);
    color: #eef4ff;
}

body.login-page[data-theme-mode="dark"] .promo-dot {
    background: rgba(148, 163, 184, 0.34);
}

body.login-page[data-theme-mode="dark"] .promo-progress {
    background: rgba(148, 163, 184, 0.14);
}

body.login-page[data-theme-mode="dark"] .promo-empty__badge,
body.login-page[data-theme-mode="dark"] .promo-empty__title,
body.login-page[data-theme-mode="dark"] .promo-empty__copy {
    color: #eef4ff;
}

body.login-page[data-theme-mode="dark"] .promo-empty__card {
    background: rgba(8, 12, 22, 0.82);
    border-color: rgba(148, 163, 184, 0.16);
}

/* Ajustements mobiles. */
@media (max-width: 720px) {
    /* Sélecteur de langue et bouton de thème. */
    body.login-page[data-theme-mode] .login-panel__topbar {
        justify-content: center;
    }

    body.login-page[data-theme-mode] .theme-switch__btn {
        min-height: 34px;
        padding-inline: 10px;
    }

    body.login-page[data-theme-mode] .theme-switch__label {
        font-size: 0.68rem;
    }
}

body.login-page[data-theme-mode] .login-panel__topbar--controls {
    margin-top: clamp(28px, 2.4vw, 36px);
    margin-bottom: 0;
    justify-content: center;
    align-items: center;
    gap: 12px;
}

body.login-page[data-theme-mode] .login-panel__topbar--controls .lang-switch {
    min-height: 38px;
    align-items: stretch;
}

body.login-page[data-theme-mode] .login-panel__topbar--controls .lang-switch__btn {
    min-width: 48px;
}

body.login-page[data-theme-mode] .login-panel__topbar--controls .theme-switch__btn {
    min-width: 132px;
    justify-content: center;
}

@media (max-width: 720px) {
    body.login-page[data-theme-mode] .login-panel__topbar--controls {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        margin-top: 22px;
    }

    body.login-page[data-theme-mode] .login-panel__topbar--controls .lang-switch,
    body.login-page[data-theme-mode] .login-panel__topbar--controls .theme-switch,
    body.login-page[data-theme-mode] .login-panel__topbar--controls .theme-switch__btn {
        width: 100%;
    }

    body.login-page[data-theme-mode] .login-panel__topbar--controls .lang-switch__btn {
        flex: 1 1 0;
        min-width: 0;
    }
}

body.login-page[data-theme-mode] .login-panel__eyebrow {
    color: #082a92;
    border-color: rgba(8, 42, 146, 0.14);
    background: linear-gradient(180deg, rgba(8, 42, 146, 0.08), rgba(8, 42, 146, 0.02));
    box-shadow: 0 14px 28px rgba(8, 42, 146, 0.1);
}

body.login-page[data-theme-mode="dark"] .login-panel__eyebrow {
    color: #dbe7ff;
    border-color: rgba(148, 163, 184, 0.24);
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.86), rgba(15, 23, 42, 0.6));
    box-shadow: 0 18px 30px rgba(0, 0, 0, 0.28);
}

@media (max-width: 768px) {
    body.login-page[data-theme-mode] .login-card__media::before {
        background: linear-gradient(90deg, transparent, var(--theme-border), transparent);
    }
}
