/* =========================================================
   DESIGN TOKENS
   ========================================================= */

:root {
    /* Accent — modifié dynamiquement par notre thème néon */
    --neon: #FF7A1A;
    --neon-soft: #FFB066;
    --neon-rgb: 255, 122, 26;
    --neon-soft-rgb: 255, 176, 102;
    --radius-sm: 12px;
    --radius: 20px;
    --radius-lg: 30px;
    color-scheme: dark;
}


/* =========================================================
   DARK MODE
   ========================================================= */

html[data-bs-theme="dark"] {
    --bg: #0B1030;
    --bg-deep: #060819;
    --surface: #151A3D;
    --surface-soft: #1C2250;
    --ink: #F4F2FA;
    --ink-dim: #A9A5C7;
    --border: rgba(244, 242, 250, .12);
    --navbar-bg: rgba(6, 8, 25, .74);
    --control-bg: rgba(255, 255, 255, .07);
    --control-bg-focus: rgba(255, 255, 255, .10);
    --card-start: rgba(28, 34, 80, .85);
    --card-end: rgba(15, 19, 51, .85);
    --shadow: 0 20px 50px rgba(0, 0, 0, .25);
    --on-accent: #101528;
    color-scheme: dark;
}


/* =========================================================
   LIGHT MODE
   ========================================================= */

html[data-bs-theme="light"] {
    --bg: #F7F5FC;
    --bg-deep: #EEEAF7;
    --surface: #FFFFFF;
    --surface-soft: #F1EDF8;
    --ink: #1A1730;
    --ink-dim: #69627F;
    --border: rgba(26, 23, 48, .11);
    --navbar-bg: rgba(250, 248, 253, .86);
    --control-bg: rgba(255, 255, 255, .85);
    --control-bg-focus: #FFFFFF;
    --card-start: rgba(255, 255, 255, .96);
    --card-end: rgba(245, 241, 250, .96);
    --shadow: 0 18px 45px rgba(44, 35, 70, .10);
    --on-accent: #FFFFFF;
    color-scheme: light;
}

body {
    min-height: 100vh;
    margin: 0;
    font-family: "Nunito", sans-serif;
    color: var(--ink);
    background: radial-gradient( circle at 20% 10%, rgba(var(--neon-rgb), .08) 0, var(--bg) 42%, var(--bg-deep) 100% );
    background-attachment: fixed;
    -webkit-font-smoothing: antialiased;
    transition: background-color .2s ease, color .2s ease;
}

a {
    color: var(--neon-soft);
    text-decoration: none;
}

    a:hover {
        color: var(--neon);
    }

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Fredoka", sans-serif;
    color: var(--ink);
}

.text-muted {
    color: var(--ink-dim) !important;
}

main {
    min-height: calc(100vh - 150px);
}

/* =========================================================
   THEME TOGGLE
   ========================================================= */

.theme-toggle {
    width: 46px;
    height: 46px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: rgba(var(--neon-rgb), .08);
    color: var(--ink-dim);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease;
}

    .theme-toggle:hover {
        color: var(--neon);
        background: rgba(var(--neon-rgb), .14);
        border-color: rgba(var(--neon-rgb), .35);
        transform: translateY(-1px);
    }

    .theme-toggle:focus-visible {
        outline: 3px solid rgba(var(--neon-rgb), .35);
        outline-offset: 3px;
    }

.theme-toggle-icon {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity .18s ease, transform .22s ease;
}


/* Dark : montrer le soleil,
   car cliquer permettra de passer en clair */

html[data-bs-theme="dark"]
.theme-icon-sun {
    opacity: 1;
    transform: rotate(0deg) scale(1);
}

html[data-bs-theme="dark"]
.theme-icon-moon {
    opacity: 0;
    transform: rotate(-35deg) scale(.65);
}


/* Light : montrer la lune,
   car cliquer permettra de passer en sombre */

html[data-bs-theme="light"]
.theme-icon-sun {
    opacity: 0;
    transform: rotate(35deg) scale(.65);
}

html[data-bs-theme="light"]
.theme-icon-moon {
    opacity: 1;
    transform: rotate(0deg) scale(1);
}

/* =========================================================
   ACCENT COLOR TOGGLE
   ========================================================= */

.accent-swatch {
    width: 18px;
    height: 18px;
    display: block;
    border-radius: 50%;
    background: var(--neon);
    border: 2px solid rgba(255, 255, 255, .45);
    box-shadow: 0 0 10px rgba(var(--neon-rgb), .65);
    transition: background .2s ease, box-shadow .2s ease, transform .2s ease;
}


#accent-toggle:hover
.accent-swatch {
    transform: scale(1.12);
}

/* =========================================================
   NAVIGATION
   ========================================================= */

.elan-navbar {
    background: var(--navbar-bg);
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    position: sticky;
    top: 0;
    z-index: 1030;
}

    .elan-navbar .navbar-brand {
        font-family: "Damion", cursive;
        font-size: 2.1rem;
        line-height: 1;
        color: var(--neon);
        text-shadow: 0 0 20px rgba(var(--neon-rgb), .35);
    }

        .elan-navbar .navbar-brand:hover {
            color: var(--neon-soft);
        }

    .elan-navbar .nav-link {
        color: var(--ink-dim);
        font-weight: 700;
        border-radius: 999px;
        padding: .55rem .9rem !important;
        transition: color .18s ease, background .18s ease;
    }

        .elan-navbar .nav-link:hover {
            color: var(--ink);
            background: rgba(var(--neon-rgb), .10);
        }

        .elan-navbar .nav-link.active {
            color: var(--neon-soft);
        }

.navbar-toggler {
    border-color: var(--border);
}

/*.navbar-toggler-icon {
    filter: invert(1);
}*/


/* =========================================================
   LOGO / BRAND
   ========================================================= */

.elan-logo {
    font-family: "Damion", cursive;
    font-weight: 400;
    color: var(--neon);
    text-shadow: 0 0 28px rgba(var(--neon-rgb), .45);
}

.elan-logo-wiggle {
    display: inline-block;
    transform: rotate(-4deg);
}


/* =========================================================
   BUTTONS
   ========================================================= */

.btn {
    border-radius: 999px;
    font-weight: 700;
    padding: .65rem 1.25rem;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.btn-primary {
    background: var(--neon);
    border-color: var(--neon);
    color: var(--on-accent);
    box-shadow: 0 8px 24px rgba(var(--neon-rgb), .25);
}

    .btn-primary:hover,
    .btn-primary:focus {
        background: var(--neon-soft);
        border-color: var(--neon-soft);
        color: var(--on-accent);
        transform: translateY(-1px);
        box-shadow: 0 12px 30px rgba(var(--neon-rgb), .35);
    }

.btn-outline-primary {
    color: var(--neon-soft);
    border-color: rgba(var(--neon-rgb), .55);
}

    .btn-outline-primary:hover {
        color: var(--on-accent);
        background: var(--neon);
        border-color: var(--neon);
    }

.btn-outline-secondary {
    color: var(--ink-dim);
    border-color: var(--border);
}

    .btn-outline-secondary:hover {
        background: rgba(255, 255, 255, .08);
        color: var(--ink);
        border-color: rgba(255, 255, 255, .25);
    }

/* =========================================================
   BOUTONS DÉSACTIVÉS — ADMIN
   ========================================================= */

.btn:disabled,
.btn.disabled {
    opacity: 0.58;
    cursor: not-allowed;
    box-shadow: none;
}

/* Bouton danger désactivé */
.btn-outline-danger:disabled,
.btn-outline-danger.disabled {
    color: var(--bs-secondary-color);
    border-color: var(--bs-border-color);
    background-color: transparent;
}

/* Mode sombre */
[data-bs-theme="dark"] .btn-outline-danger:disabled,
[data-bs-theme="dark"] .btn-outline-danger.disabled {
    color: rgba(244, 242, 250, 0.55);
    border-color: rgba(244, 242, 250, 0.18);
    background-color: rgba(255, 255, 255, 0.025);
}

/* Mode clair */
[data-bs-theme="light"] .btn-outline-danger:disabled,
[data-bs-theme="light"] .btn-outline-danger.disabled {
    color: rgba(33, 37, 41, 0.55);
    border-color: rgba(33, 37, 41, 0.18);
    background-color: rgba(0, 0, 0, 0.015);
}


/* =========================================================
   CARDS
   ========================================================= */

.card {
    background: linear-gradient( 145deg, var(--card-start), var(--card-end) );
    color: var(--ink);
    border: 1px solid var(--border) !important;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    transition: background .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.card-body {
    position: relative;
}


/* =========================================================
   FORMS
   ========================================================= */

.form-label {
    color: var(--ink);
    font-weight: 700;
}

.form-control,
.form-select {
    background: var(--control-bg);
    border: 1px solid var(--border);
    color: var(--ink);
    border-radius: var(--radius-sm);
    min-height: 48px;
}

    .form-control:focus,
    .form-select:focus {
        background: var(--control-bg-focus);
        color: var(--ink);
        border-color: var(--neon);
        box-shadow: 0 0 0 .2rem rgba(var(--neon-rgb), .15);
    }

    .form-control::placeholder {
        color: #76739b;
    }

    .form-select option {
        background: var(--surface);
        color: var(--ink);
    }

.form-check-input {
    background-color: rgba(255, 255, 255, .08);
    border-color: rgba(255, 255, 255, .25);
}

    .form-check-input:checked {
        background-color: var(--neon);
        border-color: var(--neon);
    }

.form-check.border {
    border-color: var(--border) !important;
    border-radius: var(--radius-sm) !important;
    background: rgba(255, 255, 255, .025);
}


/* =========================================================
   BADGES / ALERTS
   ========================================================= */

.badge {
    border-radius: 999px;
    padding: .5rem .7rem;
}

.alert {
    border-radius: var(--radius-sm);
    border: 1px solid var(--border);
}

.alert-success {
    color: #bfffcf;
    background: rgba(57, 255, 106, .10);
    border-color: rgba(57, 255, 106, .25);
}

.alert-danger {
    color: #ffc2ca;
    background: rgba(255, 70, 90, .10);
    border-color: rgba(255, 70, 90, .25);
}

.alert-warning {
    color: #ffe8a1;
    background: rgba(255, 195, 60, .10);
    border-color: rgba(255, 195, 60, .25);
}

.alert-info {
    color: #b9ddff;
    background: rgba(58, 168, 255, .10);
    border-color: rgba(58, 168, 255, .25);
}


/* =========================================================
   HOME
   ========================================================= */

.home-hero {
    min-height: calc(100vh - 85px);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    overflow: hidden;
    padding: 5rem 1rem;
}

    .home-hero::before {
        content: "";
        position: absolute;
        width: 520px;
        height: 520px;
        border-radius: 50%;
        background: radial-gradient( circle, rgba(var(--neon-rgb), .12), transparent 68% );
        top: 50%;
        left: 50%;
        transform: translate(-50%, -55%);
        pointer-events: none;
    }

.home-hero-content {
    position: relative;
    z-index: 1;
    max-width: 760px;
}

.home-title {
    font-family: "Damion", cursive;
    font-weight: 400;
    font-size: clamp(5.5rem, 14vw, 9.5rem);
    line-height: .9;
    margin: 0 0 1.4rem;
    color: var(--neon);
    text-shadow: 0 0 30px rgba(var(--neon-rgb), .45);
}

.home-tagline {
    font-family: "Fredoka", sans-serif;
    color: var(--ink-dim);
    font-weight: 600;
    font-size: clamp(1.25rem, 3vw, 1.7rem);
    margin-bottom: 2.5rem;
}

.home-subhead {
    display: flex;
    align-items: center;
    gap: 1rem;
    max-width: 460px;
    margin: 0 auto 1.5rem;
    font-family: "Fredoka", sans-serif;
    font-weight: 600;
    font-size: 1.15rem;
}

    .home-subhead::before,
    .home-subhead::after {
        content: "";
        height: 1px;
        flex: 1;
        background: rgba(244, 242, 250, .25);
    }

.home-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .9rem;
}


/* =========================================================
   HOME – AUDIENCES
   ========================================================= */

.home-audiences {
    padding: 1rem 0 6rem;
}

.audience-card {
    height: 100%;
}

.audience-icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.6rem;
    background: rgba(var(--neon-rgb), .12);
    color: var(--neon);
}

/* =========================================================
   AUTOCOMPLETE ÉTABLISSEMENT
   ========================================================= */

.etablissement-autocomplete {
    position: relative;
}

.etablissement-autocomplete-results {
    position: absolute;
    z-index: 1050;
    top: calc(100% + 0.25rem);
    left: 0;
    right: 0;
    max-height: 320px;
    overflow-y: auto;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.75rem;
    background: var(--bs-body-bg);
    box-shadow: 0 0.75rem 2rem rgba(0, 0, 0, 0.18);
}

.etablissement-autocomplete-result {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    border: 0;
    border-bottom: 1px solid var(--bs-border-color);
    background: transparent;
    color: var(--bs-body-color);
    text-align: left;
    cursor: pointer;
}

    .etablissement-autocomplete-result:last-child {
        border-bottom: 0;
    }

    .etablissement-autocomplete-result:hover,
    .etablissement-autocomplete-result.active {
        background: var(--bs-tertiary-bg);
    }

.etablissement-autocomplete-name {
    font-weight: 600;
    line-height: 1.3;
}

.etablissement-autocomplete-details {
    margin-top: 0.2rem;
    color: var(--bs-secondary-color);
    font-size: 0.82rem;
    line-height: 1.35;
}

.etablissement-autocomplete-message {
    padding: 1rem;
    color: var(--bs-secondary-color);
    font-size: 0.9rem;
}


/* =========================================================
   FOOTER
   ========================================================= */

.elan-footer {
    border-top: 1px solid var(--border);
    color: #66638d;
    padding: 2rem 0;
    font-size: .9rem;
}

/* =========================================================
   FLASH MESSAGES
   ========================================================= */

.flash-container {
    padding-top: 1rem;
}

    .flash-container .alert:last-child {
        margin-bottom: 0;
    }


/* =========================================================
   SYSTEM PAGES
   ========================================================= */

.system-page {
    min-height: calc(100vh - 190px);
    display: flex;
    align-items: center;
    padding: 5rem 0;
}

.system-card {
    padding: 3rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, .025);
}

.system-code {
    font-family: "Fredoka", sans-serif;
    font-size: clamp(4rem, 12vw, 7rem);
    font-weight: 700;
    line-height: 1;
    color: var(--neon);
    text-shadow: 0 0 28px rgba(var(--neon-rgb), .35);
    margin-bottom: 1.25rem;
}


/* =========================================================
   PRIVACY
   ========================================================= */

.privacy-section {
    margin-bottom: 3rem;
}

    .privacy-section h2 {
        font-size: 1.35rem;
        margin-bottom: 1rem;
    }

    .privacy-section p,
    .privacy-section li {
        line-height: 1.75;
    }

        .privacy-section li + li {
            margin-top: .5rem;
        }


/* =========================================================
   FOOTER LINKS
   ========================================================= */

.footer-link {
    color: inherit;
    text-decoration: none;
}

    .footer-link:hover {
        color: var(--neon);
    }


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 767px) {

    .home-hero {
        min-height: calc(100vh - 70px);
        padding: 3rem 1rem;
    }

    .home-actions {
        flex-direction: column;
        align-items: stretch;
        max-width: 320px;
        margin: auto;
    }

        .home-actions .btn {
            width: 100%;
        }
}

/* =========================================================
   ACCESSIBILITY
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* =========================================================
   ACCESSIBILITÉ — CONTRASTE GLOBAL
   ---------------------------------------------------------
   Les couleurs décoratives néon restent disponibles via
   --neon, mais les éléments textuels utilisent des variantes
   calculées pour conserver un contraste suffisant en mode
   sombre ET en mode clair.
   ========================================================= */

html[data-bs-theme="dark"] {
    --accent-text: color-mix(in srgb, var(--neon) 75%, #FFFFFF 25%);
    --accent-text-hover: color-mix(in srgb, var(--neon) 88%, #FFFFFF 12%);
    --accent-solid: var(--neon);
    --accent-solid-hover: var(--neon-soft);
    --status-success-text: #BFFFCF;
    --status-success-bg: rgba(57, 255, 106, .10);
    --status-success-border: rgba(57, 255, 106, .25);
    --status-danger-text: #FFC2CA;
    --status-danger-bg: rgba(255, 70, 90, .10);
    --status-danger-border: rgba(255, 70, 90, .25);
    --status-warning-text: #FFE8A1;
    --status-warning-bg: rgba(255, 195, 60, .10);
    --status-warning-border: rgba(255, 195, 60, .25);
    --status-info-text: #B9DDFF;
    --status-info-bg: rgba(58, 168, 255, .10);
    --status-info-border: rgba(58, 168, 255, .25);
    --status-secondary-text: #DDD9EB;
    --status-secondary-bg: rgba(169, 165, 199, .10);
    --status-secondary-border: rgba(169, 165, 199, .24);
    --validation-text: #FF9DAA;
    --positive-text: #8FE8A6;
    --warning-inline-text: #FFD76A;
    --placeholder-text: #9B97B8;
    --footer-text: var(--ink-dim);
    --check-bg: rgba(255, 255, 255, .08);
    --check-border: rgba(244, 242, 250, .32);
    --input-addon-bg: rgba(255, 255, 255, .06);
}

html[data-bs-theme="light"] {
    /*
       À cause des accents configurables (orange, jaune, vert,
       bleu, etc.), une couleur néon brute peut être trop pâle
       sur fond clair. On dérive donc une variante plus foncée
       pour tout texte ou contrôle interactif.
    */
    --accent-text: color-mix(in srgb, var(--neon) 50%, #000000 50%);
    --accent-text-hover: color-mix(in srgb, var(--neon) 43%, #000000 57%);
    --accent-solid: color-mix(in srgb, var(--neon) 55%, #000000 45%);
    --accent-solid-hover: color-mix(in srgb, var(--neon) 48%, #000000 52%);
    --status-success-text: #176B35;
    --status-success-bg: rgba(57, 255, 106, .10);
    --status-success-border: rgba(23, 107, 53, .26);
    --status-danger-text: #A82132;
    --status-danger-bg: rgba(255, 70, 90, .10);
    --status-danger-border: rgba(168, 33, 50, .25);
    --status-warning-text: #6A4A00;
    --status-warning-bg: rgba(255, 195, 60, .14);
    --status-warning-border: rgba(106, 74, 0, .24);
    --status-info-text: #0A4F82;
    --status-info-bg: rgba(58, 168, 255, .12);
    --status-info-border: rgba(10, 79, 130, .24);
    --status-secondary-text: #585169;
    --status-secondary-bg: rgba(105, 98, 127, .08);
    --status-secondary-border: rgba(88, 81, 105, .20);
    --validation-text: #A82132;
    --positive-text: #176B35;
    --warning-inline-text: #765300;
    --placeholder-text: #68627F;
    --footer-text: var(--ink-dim);
    --check-bg: #FFFFFF;
    --check-border: rgba(26, 23, 48, .38);
    --input-addon-bg: var(--surface-soft);
}


/* ---------------------------------------------------------
   LIENS ET TEXTE D'ACCENT
   --------------------------------------------------------- */

a {
    color: var(--accent-text);
}

    a:hover {
        color: var(--accent-text-hover);
    }

.elan-navbar .navbar-brand,
.elan-logo,
.home-title,
.system-code {
    color: var(--accent-text);
}

    .elan-navbar .navbar-brand:hover,
    .footer-link:hover {
        color: var(--accent-text-hover);
    }

.elan-navbar .nav-link.active,
.theme-toggle:hover,
.audience-icon {
    color: var(--accent-text);
}


/* ---------------------------------------------------------
   BOUTONS PRINCIPAUX
   --------------------------------------------------------- */

.btn-primary {
    background: var(--accent-solid);
    border-color: var(--accent-solid);
    color: var(--on-accent);
}

    .btn-primary:hover,
    .btn-primary:focus {
        background: var(--accent-solid-hover);
        border-color: var(--accent-solid-hover);
        color: var(--on-accent);
    }

.btn-outline-primary {
    color: var(--accent-text);
    border-color: var(--accent-text);
}

    .btn-outline-primary:hover,
    .btn-outline-primary:focus {
        color: var(--on-accent);
        background: var(--accent-solid);
        border-color: var(--accent-solid);
    }


/* ---------------------------------------------------------
   UTILITAIRES DE TEXTE SÉMANTIQUES
   --------------------------------------------------------- */

.text-danger {
    color: var(--validation-text) !important;
}

.text-success {
    color: var(--positive-text) !important;
}

.text-warning {
    color: var(--warning-inline-text) !important;
}

.form-text {
    color: var(--ink-dim);
}


/* ---------------------------------------------------------
   FORMULAIRES
   --------------------------------------------------------- */

.form-control::placeholder {
    color: var(--placeholder-text);
    opacity: 1;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--accent-text);
}

.form-check-input {
    background-color: var(--check-bg);
    border-color: var(--check-border);
}

    /*
   Le fond plus foncé assure que le crochet blanc conserve
   assez de contraste même avec un accent jaune ou vert.
*/
    .form-check-input:checked {
        background-color: color-mix(in srgb, var(--neon) 55%, #000000 45%);
        border-color: color-mix(in srgb, var(--neon) 55%, #000000 45%);
    }

.input-group-text {
    background: var(--input-addon-bg);
    border-color: var(--border);
    color: var(--ink-dim);
}

.form-control:disabled,
.form-select:disabled {
    background: var(--surface-soft);
    color: var(--ink-dim);
    opacity: 1;
}


/* ---------------------------------------------------------
   ALERTES
   --------------------------------------------------------- */

.alert-success {
    color: var(--status-success-text);
    background: var(--status-success-bg);
    border-color: var(--status-success-border);
}

.alert-danger {
    color: var(--status-danger-text);
    background: var(--status-danger-bg);
    border-color: var(--status-danger-border);
}

.alert-warning {
    color: var(--status-warning-text);
    background: var(--status-warning-bg);
    border-color: var(--status-warning-border);
}

.alert-info {
    color: var(--status-info-text);
    background: var(--status-info-bg);
    border-color: var(--status-info-border);
}

.alert-secondary {
    color: var(--status-secondary-text);
    background: var(--status-secondary-bg);
    border-color: var(--status-secondary-border);
}

/*
   Protection contre un ancien text-dark ajouté sur une alerte.
   On ne touche PAS aux badges bg-warning text-dark, où le
   texte sombre est volontaire et accessible.
*/
.alert-success.text-dark {
    color: var(--status-success-text) !important;
}

.alert-danger.text-dark {
    color: var(--status-danger-text) !important;
}

.alert-warning.text-dark {
    color: var(--status-warning-text) !important;
}

.alert-info.text-dark {
    color: var(--status-info-text) !important;
}

.alert-secondary.text-dark {
    color: var(--status-secondary-text) !important;
}

.alert a {
    color: inherit;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: .15em;
}

html[data-bs-theme="dark"] .alert .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
    opacity: .82;
}

html[data-bs-theme="light"] .alert .btn-close {
    filter: none;
    opacity: .68;
}


/* ---------------------------------------------------------
   TABLEAUX
   --------------------------------------------------------- */

.table {
    --bs-table-color: var(--ink);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--border);
    --bs-table-striped-color: var(--ink);
    --bs-table-striped-bg: color-mix(in srgb, var(--surface-soft) 55%, transparent);
    --bs-table-hover-color: var(--ink);
    --bs-table-hover-bg: color-mix(in srgb, var(--neon) 7%, transparent);
}


/* ---------------------------------------------------------
   PIED DE PAGE
   --------------------------------------------------------- */

.elan-footer {
    color: var(--footer-text);
}


/* ---------------------------------------------------------
   FOCUS CLAVIER
   --------------------------------------------------------- */

a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible,
.form-check-input:focus-visible {
    outline: 3px solid var(--accent-text);
    outline-offset: 3px;
}