/* --- CHARTE FRANCHISES : Daylight (clair) / Afterhours (sombre), docs/franchises/09-lot7-identite.md --- */
:root {
    /* Zones (cascade) : barre latérale encre, fond gris froid, blanc pour ce qui se lit */
    --fr-sidebar:   #111114;
    --fr-sidebar-2: #1C1C21;
    --fr-ground:    #F5F5F7;
    --fr-surface:   #FFFFFF;
    --fr-surface-2: #F3F3F6;
    --fr-input:     #F3F3F6;
    --fr-thead:     #F8F8FA;
    --fr-hover:     color-mix(in srgb, var(--fr-accent) 4%, white); /* survol de ligne */
    --fr-btn:       #F3F3F6; /* bouton secondaire */
    --fr-btn-hover: #E8E8ED; /* survol, puce, segment actif */

    /* Filets : repos / défaut / survol */
    --fr-line:   rgba(17,17,20,.07);
    --fr-line-2: rgba(17,17,20,.12);
    --fr-line-3: rgba(17,17,20,.24);

    /* Texte */
    --fr-ink:   #111114;
    --fr-ink-2: #55565E;
    --fr-ink-3: #6A6B74; /* maquette #7E7F88, assombri pour 4,5:1 */

    /* Accent de plateforme fixe ; --fr-brand = couleur de la franchise (pastille seulement, posée par head.ejs) */
    --fr-accent:       #FF8C00;
    --fr-on-accent:    #0B0B0D;
    --fr-brand:        #FF8C00;
    --fr-accent-soft:  color-mix(in srgb, var(--fr-accent) 12%, white);
    --fr-accent-hover: color-mix(in srgb, var(--fr-accent) 88%, black);
    --fr-accent-ink:   color-mix(in srgb, var(--fr-accent) 64%, black); /* texte accent sur fond clair (4,5:1) */
    --fr-ring:         color-mix(in srgb, var(--fr-accent) 28%, transparent);
    --fr-highlight:    color-mix(in srgb, var(--fr-accent) 10%, white); /* ligne sélectionnée, jour courant */
    --ibiza:        #EFFF02; /* marqueur « source Ibiza » uniquement */

    /* Statuts : plus aucun bleu (attention jaune, info lavande) */
    --ok:      #12A160;
    --warn:    #EDB100;
    --stop:    #E5484D;
    --info:    #6E56CF;
    --neutral: #6F7079;

    /* Élévation */
    --fr-hi:       inset 0 0 0 transparent; /* reflet haut des cartes : sombre seulement */
    --fr-shadow:   0 1px 2px rgba(17,17,20,.06), 0 6px 16px -6px rgba(17,17,20,.08);
    --fr-shadow-2: 0 2px 4px rgba(17,17,20,.06), 0 18px 40px -16px rgba(17,17,20,.22);
    --ease: cubic-bezier(.2,.8,.2,1);

    /* Couleurs de module (barre latérale 7.6, pastilles « module ») */
    --mod-venues:    #4ADEB0;
    --mod-events:    #FF7EB0;
    --mod-artists:   #B9A8FF;
    --mod-brands:    #FFC56B;
    --mod-tags:      #E8A6FF;
    --mod-ads:       #FF9470;
    --mod-ticketing: #6EDCEB;
    --mod-ibiza:     #EFFF02;
    --mod-admin:     #A3A4AB;
    --mod-dashboard: var(--fr-accent);

    --font-title: 'Unbounded', 'Geist', sans-serif;
    --font-body:  'Geist', 'Segoe UI', system-ui, sans-serif;
    --font-mono:  'Geist Mono', ui-monospace, monospace;

    /* Lot 6 : échelle de texte (13 px) et hauteurs */
    --t-2xs: 10.5px;
    --t-xs:  11px;
    --t-sm:  12px;
    --t-base: 13px;
    --t-md:  13.5px;
    --t-lg:  14.5px;
    --t-h1:  22px;
    --h-btn: 36px;
    --h-btn-sm: 30px;
    --h-btn-xs: 26px;
    --h-in:  38px;
    --h-row: 52px;
    --bs-body-font-size: var(--t-base);
    --bs-body-font-family: var(--font-body);

    /* Bootstrap : primaire = accent, liens lisibles, plus de bleu par défaut */
    --bs-primary: var(--fr-accent);
    --bs-primary-rgb: 255, 140, 0;
    --bs-primary-text-emphasis: var(--fr-accent-ink);
    --bs-primary-bg-subtle: var(--fr-accent-soft);
    --bs-primary-border-subtle: color-mix(in srgb, var(--fr-accent) 40%, white);
    --bs-link-color: var(--fr-accent-ink);
    --bs-link-color-rgb: 163, 90, 0;
    --bs-link-hover-color: var(--fr-ink);
    --bs-link-hover-color-rgb: 17, 17, 20;
    --bs-focus-ring-color: var(--fr-ring);
}

/* --- THÈME SOMBRE (Afterhours) : data-bs-theme posé par partials/head.ejs --- */
[data-bs-theme="dark"] {
    /* Cascade : chaque niveau d'imbrication monte d'un cran de clarté */
    --fr-sidebar:   #08090B;
    --fr-sidebar-2: #101115;
    --fr-ground:    #0E0F12;
    --fr-surface:   #141519;
    --fr-surface-2: #1B1C21;
    --fr-input:     #1B1C21;
    --fr-thead:     #17181C;
    --fr-hover:     #191A1F;
    --fr-btn:       #1B1C21;
    --fr-btn-hover: #25272D;
    --fr-line:   rgba(255,255,255,.06);
    --fr-line-2: rgba(255,255,255,.11);
    --fr-line-3: rgba(255,255,255,.20);
    --fr-ink:   #EEEEF0;
    --fr-ink-2: #A3A4AB;
    --fr-ink-3: #8C8D95; /* maquette #74757D, éclairci pour 4,5:1 */
    --fr-accent-soft:  color-mix(in srgb, var(--fr-accent) 14%, transparent);
    --fr-accent-hover: color-mix(in srgb, var(--fr-accent) 86%, white);
    --fr-accent-ink:   color-mix(in srgb, var(--fr-accent) 85%, white);
    --fr-ring:         color-mix(in srgb, var(--fr-accent) 30%, transparent);
    --fr-highlight:    color-mix(in srgb, var(--fr-accent) 12%, #141519);
    --ok:      #3DD68C;
    --warn:    #FFD23F;
    --stop:    #FF6369;
    --info:    #A99BFF;
    --neutral: #8B8C94;
    --fr-hi:       inset 0 1px 0 rgba(255,255,255,.045);
    --fr-shadow:   0 1px 3px rgba(0,0,0,.5);
    --fr-shadow-2: 0 14px 34px -14px rgba(0,0,0,.8);

    /* Composants Bootstrap (form-control, modal, dropdown, table, card…) */
    --bs-body-bg: var(--fr-surface);
    --bs-body-color: var(--fr-ink);
    --bs-emphasis-color: #fff;
    --bs-secondary-color: var(--fr-ink-2);
    --bs-tertiary-color: var(--fr-ink-3);
    --bs-secondary-bg: var(--fr-surface-2);
    --bs-tertiary-bg: var(--fr-surface-2);
    --bs-border-color: var(--fr-line-2);
    --bs-border-color-translucent: rgba(255,255,255,.08);
    --bs-primary-text-emphasis: var(--fr-accent-ink);
    --bs-primary-bg-subtle: var(--fr-accent-soft);
    --bs-primary-border-subtle: color-mix(in srgb, var(--fr-accent) 40%, transparent);
    --bs-link-color: var(--fr-accent);
    --bs-link-color-rgb: 255, 140, 0;
    --bs-link-hover-color: var(--fr-ink);
    --bs-link-hover-color-rgb: 238, 238, 240;
    color-scheme: dark;
}

/* Fonds doux des statuts : recalculés par thème (posés sur la surface) */
:root, [data-bs-theme] {
    --ok-soft:      color-mix(in srgb, var(--ok) 14%, var(--fr-surface));
    --warn-soft:    color-mix(in srgb, var(--warn) 16%, var(--fr-surface));
    --stop-soft:    color-mix(in srgb, var(--stop) 13%, var(--fr-surface));
    --info-soft:    color-mix(in srgb, var(--info) 14%, var(--fr-surface));
    --neutral-soft: color-mix(in srgb, var(--neutral) 14%, var(--fr-surface));
}

/* Texte de statut lisible (4,5:1) : la couleur pleine sert aux points, filets et fonds */
:root, [data-bs-theme="light"] {
    --ok-ink:   color-mix(in srgb, var(--ok) 72%, black);
    --warn-ink: color-mix(in srgb, var(--warn) 56%, black);
    --stop-ink: color-mix(in srgb, var(--stop) 80%, black);
    --info-ink: color-mix(in srgb, var(--info) 85%, black);
}
[data-bs-theme="dark"] {
    --ok-ink:   color-mix(in srgb, var(--ok) 85%, white);
    --warn-ink: var(--warn);
    --stop-ink: color-mix(in srgb, var(--stop) 85%, white);
    --info-ink: color-mix(in srgb, var(--info) 85%, white);
}

/* Bootstrap : info en lavande, utilitaires « primary / info » compilés en bleu (boutons : § BOUTONS) ramenés à la charte */
:root, [data-bs-theme="light"] {
    --bs-info: var(--info);
    --bs-info-rgb: 110, 86, 207;
    --bs-info-text-emphasis: var(--info-ink);
    --bs-info-bg-subtle: var(--info-soft);
    --bs-info-border-subtle: color-mix(in srgb, var(--info) 35%, white);
}
[data-bs-theme="dark"] {
    --bs-info-rgb: 169, 155, 255;
    --bs-info-border-subtle: color-mix(in srgb, var(--info) 35%, transparent);
}
.text-primary { color: var(--fr-accent-ink) !important; }
.text-info { color: var(--info-ink) !important; }
.text-secondary { color: var(--fr-ink-2) !important; }
.text-success { color: var(--ok-ink) !important; }
.text-warning { color: var(--warn-ink) !important; }
.text-danger { color: var(--stop-ink) !important; }
/* Code en ligne : orange lisible (au lieu du rose Bootstrap) */
:root, [data-bs-theme="light"] { --bs-code-color: color-mix(in srgb, var(--fr-accent) 55%, black); }
[data-bs-theme="dark"] { --bs-code-color: var(--fr-accent-ink); }
/* Badges Bootstrap pleins : texte foncé sur les couleurs vives de la charte */
.badge.bg-success { color: #04150C !important; }
[data-bs-theme="dark"] .badge:is(.bg-danger, .bg-info, .bg-secondary) { color: #0B0B0D !important; }
[data-bs-theme="dark"] .badge.bg-danger { background-color: var(--stop) !important; }
[data-bs-theme="light"] .badge.bg-danger { background-color: var(--stop-ink) !important; color: #fff !important; }
.alert { --bs-alert-border-radius: 14px; --bs-alert-border-color: transparent; }
.alert-success { --bs-alert-bg: var(--ok-soft); --bs-alert-color: var(--ok-ink); --bs-alert-link-color: var(--ok-ink); }
.alert-warning { --bs-alert-bg: var(--warn-soft); --bs-alert-color: var(--warn-ink); --bs-alert-link-color: var(--warn-ink); }
.alert-danger { --bs-alert-bg: var(--stop-soft); --bs-alert-color: var(--stop-ink); --bs-alert-link-color: var(--stop-ink); }
.alert-info { --bs-alert-bg: var(--info-soft); --bs-alert-color: var(--info-ink); --bs-alert-link-color: var(--info-ink); }
.alert-primary { --bs-alert-bg: var(--fr-accent-soft); --bs-alert-color: var(--fr-accent-ink); --bs-alert-link-color: var(--fr-accent-ink); }
@media (prefers-reduced-motion: reduce) {
    .custom-card, .cal-week-day, .cal-month-cell, .cal-timeline-content { transition: none !important; }
    .dash-card:hover, .dash-card:hover .custom-card, .cal-week-day:hover, .cal-month-cell:hover, .cal-timeline-content:hover, .cal-week-item:hover { transform: none !important; }
}
.text-bg-primary, .badge.bg-primary { color: var(--fr-on-accent) !important; }
.form-control:focus, .form-select:focus { border-color: var(--fr-accent); box-shadow: 0 0 0 .25rem var(--fr-ring); }

/* Utilitaires Bootstrap figés en clair (bg-white, bg-light, text-dark…) : lisibles en sombre */
[data-bs-theme="dark"] .bg-white { background-color: var(--fr-surface) !important; }
[data-bs-theme="dark"] .bg-light { background-color: var(--fr-surface-2) !important; }
[data-bs-theme="dark"] .text-dark:not(.bg-warning):not(.bg-info):not(.badge-ibiza) { color: var(--fr-ink) !important; }
[data-bs-theme="dark"] .text-black-50 { color: var(--fr-ink-3) !important; }
[data-bs-theme="dark"] .table-light {
    --bs-table-bg: var(--fr-thead);
    --bs-table-color: var(--fr-ink);
    --bs-table-border-color: var(--fr-line);
    --bs-table-striped-bg: var(--fr-surface-2);
    --bs-table-hover-bg: var(--fr-surface-2);
}
/* Onglets des formulaires pas encore refaits (styles locaux en #555 / #000) */
[data-bs-theme="dark"] .nav-tabs .nav-link { color: var(--fr-ink-2); }
[data-bs-theme="dark"] .nav-tabs .nav-link.active { color: var(--fr-ink); background: transparent; }

/* Bascule de thème (navbar) */
.theme-toggle {
    width: 36px; height: 36px;
    border-radius: 50%;
    border: 1px solid var(--fr-line-2);
    background: var(--fr-btn);
    color: var(--fr-ink-2);
    display: inline-grid; place-items: center;
    padding: 0;
    cursor: pointer;
    transition: color .15s, border-color .15s, background-color .15s, transform .3s var(--ease);
}
.theme-toggle:hover { color: var(--fr-ink); border-color: var(--fr-line-3); background: var(--fr-btn-hover); }
.theme-toggle:hover i { transform: rotate(-20deg); }
.theme-toggle i { transition: transform .3s var(--ease); }
.theme-toggle:active { transform: scale(.94); }
.theme-toggle:focus-visible { outline: 0; box-shadow: 0 0 0 4px var(--fr-ring); }

/* Menus déroulants : arrondis, éléments en pastille */
.dropdown-menu { --bs-dropdown-border-radius: 14px; --bs-dropdown-padding-x: 6px; --bs-dropdown-padding-y: 6px; --bs-dropdown-bg: var(--fr-surface); --bs-dropdown-border-color: var(--fr-line-2); --bs-dropdown-link-color: var(--fr-ink); --bs-dropdown-link-hover-bg: var(--fr-btn); --bs-dropdown-link-hover-color: var(--fr-ink); --bs-dropdown-link-active-bg: var(--fr-accent-soft); --bs-dropdown-link-active-color: var(--fr-accent-ink); --bs-dropdown-divider-bg: var(--fr-line); box-shadow: var(--fr-shadow-2) !important; }
.dropdown-item { border-radius: 9px; }
.dropdown-item.text-danger { color: var(--stop-ink) !important; }
@media (prefers-reduced-motion: reduce) {
    .sidebar ul li a, .sidebar ul li a i, .theme-toggle, .theme-toggle i { transition: none; }
    .sidebar--tint ul li a:hover i, .theme-toggle:hover i, .theme-toggle:active { transform: none; }
}

/* Liste des <select> : même rendu que .dropdown-menu (select personnalisable, Chromium 135+ ;
   ailleurs la liste native reste affichée). Les multiples et listbox gardent le rendu natif. */
@supports (appearance: base-select) {
    select.form-select:not([multiple]):not([size]), select.form-select[size="1"] { appearance: base-select; display: flex; align-items: center; }
    select.form-select::picker-icon { display: none; } /* la flèche reste celle de Bootstrap */
    select.form-select::picker(select) {
        appearance: base-select;
        margin-block: 6px;
        padding: 6px;
        min-width: anchor-size(width);
        max-height: min(320px, 50vh);
        border: 1px solid var(--fr-line-2);
        border-radius: 14px;
        background: var(--fr-surface);
        color: var(--fr-ink);
        box-shadow: var(--fr-shadow-2);
        scrollbar-width: thin;
        scrollbar-color: var(--fr-line-3) transparent;
        opacity: 0; translate: 0 -4px;
        transition: opacity .15s var(--ease), translate .2s var(--ease), overlay .2s allow-discrete, display .2s allow-discrete;
    }
    select.form-select:open::picker(select) { opacity: 1; translate: 0 0; }
    @starting-style { select.form-select:open::picker(select) { opacity: 0; translate: 0 -4px; } }
    select.form-select option {
        display: flex; align-items: center; gap: 8px;
        min-height: 34px;
        padding: 6px 12px;
        border-radius: 9px;
        font-size: var(--t-base);
        color: var(--fr-ink);
        background: transparent;
        cursor: pointer;
    }
    select.form-select option:hover, select.form-select option:focus-visible { background: var(--fr-btn); outline: 0; }
    select.form-select option:checked { background: var(--fr-accent-soft); color: var(--fr-accent-ink); font-weight: 600; }
    select.form-select option::checkmark { order: 1; margin-left: auto; color: var(--fr-accent-ink); }
    select.form-select option:disabled { color: var(--fr-ink-3); cursor: default; background: transparent; }
    select.form-select optgroup { padding-top: 4px; }
    select.form-select optgroup legend { padding: 6px 12px 2px; font-size: var(--t-xs); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--fr-ink-3); }
}
@media (prefers-reduced-motion: reduce) {
    select.form-select::picker(select) { transition: none; }
}

/* --- BASE & TYPOGRAPHIE --- */
body {
    font-family: var(--font-body);
    font-size: var(--t-base);
    -webkit-font-smoothing: antialiased;
    background-color: var(--fr-ground);
    color: var(--fr-ink);
    min-height: 100vh;
    margin: 0;
}

h1, h2, h3, h4, .navbar-brand-text, .kpi, .stat-number {
    font-family: var(--font-title);
}

table { font-variant-numeric: tabular-nums; }

a { text-decoration: none; }

/* Champs et menus Bootstrap (écrans non refaits compris) à l'échelle 13 px */
.form-control, .form-select { font-size: var(--t-base); }
.form-control-sm, .form-select-sm { font-size: var(--t-sm); }
.form-control-lg, .form-select-lg { font-size: var(--t-lg); }
.dropdown-menu { --bs-dropdown-font-size: var(--t-base); }

/* --- LOGIN PAGE SPECIFIC --- */
.login-body {
    background: radial-gradient(720px 420px at 50% 38%, color-mix(in srgb, var(--fr-accent) 14%, transparent), transparent 70%), var(--fr-sidebar); /* Fond encre UNIQUEMENT pour la page de login */
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 20px;
}

.login-container {
    max-width: 400px;
    width: 100%;
}

.card-login {
    background-color: var(--fr-surface);
    border: 1px solid var(--fr-line-2);
    color: var(--fr-ink);
    box-shadow: 0 30px 70px -20px rgba(0,0,0,.85), var(--fr-hi);
    padding: 28px;
    border-radius: 22px;
}
.card-login h3, .card-login h4 { font-size: 17px; letter-spacing: .02em; }
.card-login .form-label { font-size: var(--t-sm); font-weight: 500; color: var(--fr-ink); }
.card-login :is(.form-control, .form-select) { min-height: var(--h-in); border: 1px solid var(--fr-line-2); border-radius: 999px; background-color: var(--fr-input); color: var(--fr-ink); padding: 0 16px; transition: border-color .15s, box-shadow .2s var(--ease), background-color .15s; }
.card-login .form-control-lg { min-height: 52px; }
[data-bs-theme="light"] .card-login :is(.form-control, .form-select) { border-color: transparent; }
.card-login :is(.form-control, .form-select):focus { border-color: var(--fr-accent); box-shadow: 0 0 0 4px var(--fr-ring); background-color: var(--fr-surface); }
[data-bs-theme="light"] .card-login :is(.form-control, .form-select):focus { border-color: var(--fr-ink); }
.card-login .input-group > .form-control { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.card-login .input-group-text { border-radius: 0 999px 999px 0; background: var(--fr-input) !important; border: 1px solid var(--fr-line-2); padding: 0 16px; color: var(--fr-ink-3); }
[data-bs-theme="light"] .card-login .input-group-text { border-color: transparent; }
.card-login .alert.rounded-0 { border-radius: 14px !important; }
.card-login .btn-lg { min-height: 46px; letter-spacing: .04em; }
.card-login .form-control::placeholder { color: var(--fr-ink-3); opacity: 1; }
/* Hors carte, la page reste encre dans les deux thèmes */
.login-body > .login-container > .text-muted, .login-body > .text-muted { color: #8B8C94 !important; }

.login-logo-img {
    display: block;
    margin: 0 auto 30px auto;
    max-width: 250px; /* Ajuste selon la taille réelle de ton PNG */
    height: auto;
}

/* --- LAYOUT DASHBOARD --- */
.wrapper {
    display: flex;
    width: 100%;
    align-items: stretch;
}

/* =============================================
   COQUE (lot 7, 09-lot7-identite.md § 7.6)
   Barre latérale encre dans les deux thèmes, éléments en pilule.
   Le contenu est un panneau arrondi posé sur l'encre de la barre latérale,
   dans les deux thèmes (même géométrie : pas de décalage au changement de
   thème). Sombre : filet autour du panneau, le fond étant proche de l'encre.
   ============================================= */
.sidebar {
    min-width: 250px;
    max-width: 250px;
    background: var(--fr-sidebar);
    color: #fff;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 0 12px 12px;
}

.sidebar-header {
    padding: 20px;
    text-align: center;
}

.sidebar-logo-img {
    max-width: 150px;
    height: auto;
}

/* Haut de barre latérale : nom de la plateforme ; groupes de navigation titrés (maquette Afterhours) */
.sidebar-brand {
    font-family: var(--font-title);
    font-weight: 700;
    font-size: 13px;
    color: #fff;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 22px 12px 6px;
}
.sidebar .nav-l {
    font-size: 10.5px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #8B8C94;
    padding: 16px 12px 6px;
}

/* Navigation : pilules ; actif en relief (sombre) ou en blanc (clair), icône accent */
.sidebar ul.components {
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.sidebar ul li a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 36px;
    padding: 0 12px;
    border-radius: 999px;
    font-size: var(--t-md);
    color: #B4B4BC;
    text-decoration: none;
    transition: background-color .15s, color .15s, box-shadow .2s;
}
.sidebar ul li a:hover { color: #fff; background: rgba(255,255,255,.06); }
.sidebar ul li a:focus-visible { outline: 0; box-shadow: 0 0 0 4px var(--fr-ring); }
.sidebar ul li a.active { background: #1B1C21; color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 0 0 1px rgba(255,255,255,.11); }
.sidebar ul li a.active i { color: var(--fr-accent); filter: drop-shadow(0 0 6px var(--fr-accent)); }
[data-bs-theme="light"] .sidebar ul li a.active { background: #fff; color: var(--fr-ink); font-weight: 600; box-shadow: none; }
[data-bs-theme="light"] .sidebar ul li a.active i { filter: none; }
.sidebar ul li a i {
    width: 20px;
    flex-shrink: 0;
    text-align: center;
    transition: background-color .2s, color .2s, transform .25s var(--ease);
}

/* Essai 7.6 : icônes colorées par module (--c posé sur chaque <li>), activées par .sidebar--tint sur <nav> */
.sidebar--tint ul li a { padding-left: 6px; }
.sidebar--tint ul li a i { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; background: color-mix(in srgb, var(--c, #A3A4AB) 16%, transparent); color: var(--c, #A3A4AB); }
.sidebar--tint ul li a:hover i { transform: scale(1.08); }
.sidebar--tint ul li a.active i { background: var(--c, var(--fr-accent)); color: #0B0B0D; filter: none; box-shadow: 0 0 14px -3px var(--c, var(--fr-accent)); }
[data-bs-theme="light"] .sidebar--tint ul li a.active i { box-shadow: none; }

/* Pied de la barre latérale : « Voir le site » en pilule discrète */
.sidebar .btn-outline-light {
    --bs-btn-color: #C9C9CF;
    --bs-btn-bg: transparent;
    --bs-btn-border-color: rgba(255,255,255,.12);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: rgba(255,255,255,.06);
    --bs-btn-hover-border-color: rgba(255,255,255,.24);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: rgba(255,255,255,.1);
    --bs-btn-active-border-color: rgba(255,255,255,.24);
}

/* Zone de contenu (cascade : fond --fr-ground, cartes --fr-surface) */
.content-wrapper {
    width: 100%;
    min-width: 0; /* lot 6 : un tableau large défile dans sa carte au lieu d'élargir la page */
    background-color: var(--fr-ground);
    display: flex;
    flex-direction: column;
}
.wrapper { background: var(--fr-sidebar); }
.content-wrapper { margin: 8px 8px 8px 0; border-radius: 18px; min-height: calc(100vh - 16px); }
[data-bs-theme="dark"] .content-wrapper { box-shadow: 0 0 0 1px var(--fr-line-2); }

/* Barre du haut : sur le fond de page, filet bas, sans liseré */
.top-navbar {
    background: transparent;
    border-bottom: 1px solid var(--fr-line);
    padding: 14px 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--fr-ink);
}

.navbar-brand-text {
    font-weight: 700;
    font-size: 17px;
    text-transform: uppercase;
    letter-spacing: .02em;
    color: var(--fr-ink);
    margin: 0;
}

/* Sélecteur de franchise (navbar) : pilule pastille + nom + fuseau, menu des franchises accessibles */
.fr-picker-btn {
    display: flex; align-items: center; gap: 10px;
    min-height: 40px;
    padding: 3px 14px 3px 4px;
    border: 1px solid var(--fr-line-2);
    border-radius: 999px;
    background: var(--fr-btn);
    color: var(--fr-ink);
    text-align: left;
    transition: background-color .15s, border-color .15s;
}
.fr-picker-btn:not(:disabled):hover { background: var(--fr-btn-hover); border-color: var(--fr-line-3); }
.fr-picker-btn:focus-visible { outline: 0; box-shadow: 0 0 0 4px var(--fr-ring); }
.fr-picker-btn:disabled { opacity: 1; cursor: default; }
.fr-picker-btn.dropdown-toggle::after { margin-left: 4px; color: var(--fr-ink-2); }
.fr-logo {
    width: 32px; height: 32px; flex-shrink: 0;
    border-radius: 50%;
    background: var(--fr-brand);
    color: #fff;
    font-family: var(--font-title);
    font-weight: 700;
    font-size: 11px;
    letter-spacing: .02em;
    display: grid; place-items: center;
}
.fr-logo-img { object-fit: cover; background: #fff; }
.fr-picker-txt { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.fr-picker-txt b { font-size: var(--t-md); font-weight: 600; }
.fr-picker-txt small { font-size: 11px; color: var(--fr-ink-3); font-family: var(--font-mono); white-space: nowrap; }
.fr-picker-menu { min-width: 260px; }
.fr-picker-menu .dropdown-header { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--fr-ink-3); }
.fr-picker-menu .dropdown-item { display: flex; align-items: center; gap: 10px; padding: 6px 10px 6px 6px; }
.fr-picker-menu .dropdown-item .fr-logo { width: 28px; height: 28px; font-size: 10px; }
.fr-picker-menu .dropdown-item.active .fr-picker-txt small { color: var(--fr-accent-ink); }
.fr-picker-menu .dropdown-item .fa-check { font-size: 11px; }

/* Profil : pilule au survol, pastille d'initiales accent, carte nom / email / rôle */
.user-dropdown .dropdown-toggle {
    color: var(--fr-ink);
    font-weight: 600;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    padding: 3px 12px 3px 4px;
    border-radius: 999px;
    transition: background-color .15s;
}
.user-dropdown .dropdown-toggle:hover { background: var(--fr-btn); }
.user-dropdown .dropdown-toggle:focus-visible { outline: 0; box-shadow: 0 0 0 4px var(--fr-ring); }
.user-dropdown .dropdown-toggle::after { margin-left: 0; color: var(--fr-ink-2); }
.me-avatar {
    width: 32px; height: 32px; flex-shrink: 0;
    border-radius: 50%;
    background: var(--fr-accent);
    color: var(--fr-on-accent);
    font-family: var(--font-title);
    font-weight: 700;
    font-size: 11px;
    display: grid; place-items: center;
}
.me-name { font-size: var(--t-md); max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.me-card { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 8px 10px 4px; min-width: 220px; }
.me-card b { font-size: var(--t-md); }
.me-card small { color: var(--fr-ink-3); }
@media (max-width: 900px) { .me-name, .fr-picker-txt small { display: none; } }

/* MAIN CONTENT PADDING */
.main-content {
    padding: 30px;
    flex-grow: 1;
}

/* --- CARDS & TABLES (Fond Blanc) --- */
.custom-card {
    background-color: var(--fr-surface);
    border: 1px solid var(--fr-line);
    border-radius: 18px;
    padding: 22px;
    margin-bottom: 20px;
    box-shadow: var(--fr-hi), var(--fr-shadow);
    color: var(--fr-ink);
    transition: transform .25s var(--ease), border-color .25s, box-shadow .25s, background-color .25s;
}

.card-title {
    color: var(--fr-ink-2);
    margin-bottom: 15px;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.stat-number {
    font-size: 32px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.02em;
    color: var(--fr-ink);
    font-variant-numeric: tabular-nums;
}

/* Override Tableaux pour fond blanc */
.table-custom {
    width: 100%;
    margin-bottom: 1rem;
    color: var(--fr-ink);
    border-color: var(--fr-line);
}
.table-custom th {
    background-color: var(--fr-thead);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85rem;
    padding: 15px;
}
.table-custom td {
    padding: 15px;
    vertical-align: middle;
    border-bottom: 1px solid var(--fr-line);
}

/* =============================================
   BOUTONS (lot 7, 09-lot7-identite.md § Effets ; hiérarchie du lot 6 inchangée)
   Restylage global par variables --bs-btn-* : les écrans non refaits
   en profitent. Classes des vues refaites : btn-primary (un par écran),
   btn-tonal, btn-soft, btn-ghost, btn-ghost-danger, btn-danger, btn-icon.
   Pilule, appui à 96 %, halo de focus 4 px, désactivé à 40 %.
   ============================================= */
.btn {
    --bs-btn-padding-x: 16px;
    --bs-btn-padding-y: 6px;
    --bs-btn-font-family: var(--font-body);
    --bs-btn-font-size: var(--t-base);
    --bs-btn-font-weight: 500;
    --bs-btn-border-radius: 999px;
    --bs-btn-focus-box-shadow: 0 0 0 4px var(--fr-ring);
    --bs-btn-disabled-opacity: .4;
    min-height: var(--h-btn);
    transition: transform .15s var(--ease), box-shadow .25s var(--ease), background-color .2s, border-color .2s, color .25s;
}
.btn:active { transform: scale(.96); }
.btn:focus-visible { outline: 0; }
/* Tailles redéfinies après .btn (même spécificité) */
.btn-sm, .btn-group-sm > .btn {
    --bs-btn-padding-x: 13px;
    --bs-btn-padding-y: 5px;
    --bs-btn-font-size: var(--t-sm);
    min-height: var(--h-btn-sm);
}
.btn-xs {
    --bs-btn-padding-x: 10px;
    --bs-btn-padding-y: 4px;
    --bs-btn-font-size: var(--t-xs);
    min-height: var(--h-btn-xs);
}
.btn-lg, .btn-group-lg > .btn {
    --bs-btn-padding-x: 20px;
    --bs-btn-padding-y: 8px;
    --bs-btn-font-size: var(--t-lg);
    min-height: 40px;
}

/* Principal (un par écran). Sombre : plein accent, reflet qui balaie le bouton, montée et halo au survol */
.btn-primary {
    --bs-btn-bg: var(--fr-accent);
    --bs-btn-border-color: var(--fr-accent);
    --bs-btn-color: var(--fr-on-accent);
    --bs-btn-hover-bg: var(--fr-accent);
    --bs-btn-hover-border-color: var(--fr-accent);
    --bs-btn-hover-color: var(--fr-on-accent);
    --bs-btn-active-bg: var(--fr-accent-hover);
    --bs-btn-active-border-color: var(--fr-accent-hover);
    --bs-btn-active-color: var(--fr-on-accent);
    --bs-btn-disabled-bg: var(--fr-accent);
    --bs-btn-disabled-border-color: var(--fr-accent);
    --bs-btn-disabled-color: var(--fr-on-accent);
    position: relative;
    isolation: isolate;
    overflow: hidden;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 1px 2px rgba(0,0,0,.4);
}
.btn-primary::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%);
    transform: translateX(-130%);
    transition: transform .7s var(--ease);
}
.btn-primary:hover { transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 0 0 4px var(--fr-ring), 0 10px 28px -8px var(--fr-accent); }
.btn-primary:hover::before { transform: translateX(130%); }
.btn-primary:active { transform: scale(.96); }
.btn-primary:focus-visible { box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 0 0 4px var(--fr-ring); }

/* Clair : encre noire, disque accent qui jaillit du centre au survol */
[data-bs-theme="light"] .btn-primary {
    --bs-btn-bg: var(--fr-ink);
    --bs-btn-border-color: var(--fr-ink);
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: var(--fr-ink);
    --bs-btn-hover-border-color: var(--fr-accent);
    --bs-btn-hover-color: var(--fr-on-accent);
    --bs-btn-active-bg: var(--fr-accent);
    --bs-btn-active-border-color: var(--fr-accent);
    --bs-btn-active-color: var(--fr-on-accent);
    --bs-btn-disabled-bg: var(--fr-ink);
    --bs-btn-disabled-border-color: var(--fr-ink);
    --bs-btn-disabled-color: #fff;
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.12);
}
[data-bs-theme="light"] .btn-primary::before {
    inset: auto;
    left: 50%; top: 50%;
    width: 12px; height: 12px;
    border-radius: 50%;
    background: var(--fr-accent);
    transform: translate(-50%, -50%) scale(0);
    transition: transform .45s var(--ease);
}
[data-bs-theme="light"] .btn-primary:hover { transform: none; box-shadow: 0 10px 24px -10px var(--fr-accent); }
[data-bs-theme="light"] .btn-primary:hover::before,
[data-bs-theme="light"] .btn-primary:focus-visible::before { transform: translate(-50%, -50%) scale(30); }
[data-bs-theme="light"] .btn-primary:active { transform: scale(.96); }
[data-bs-theme="light"] .btn-primary:focus-visible { --bs-btn-color: var(--fr-on-accent); box-shadow: 0 0 0 2px var(--fr-surface), 0 0 0 4px var(--fr-accent); }

/* Secondaire : aplat avec filet (sombre), blanc cerclé qui se soulève (clair) */
.btn-tonal, .btn-secondary, .btn-outline-secondary, .btn-outline-dark, .btn-light, .btn-dark {
    --bs-btn-bg: var(--fr-btn);
    --bs-btn-color: var(--fr-ink);
    --bs-btn-border-color: var(--fr-line-2);
    --bs-btn-hover-bg: var(--fr-btn-hover);
    --bs-btn-hover-color: var(--fr-ink);
    --bs-btn-hover-border-color: var(--fr-line-3);
    --bs-btn-active-bg: var(--fr-btn-hover);
    --bs-btn-active-color: var(--fr-ink);
    --bs-btn-active-border-color: var(--fr-line-3);
    --bs-btn-disabled-bg: var(--fr-btn);
    --bs-btn-disabled-color: var(--fr-ink-2);
    --bs-btn-disabled-border-color: var(--fr-line-2);
    box-shadow: var(--fr-hi);
}
[data-bs-theme="light"] :is(.btn-tonal, .btn-secondary, .btn-outline-secondary, .btn-outline-dark, .btn-light, .btn-dark) {
    --bs-btn-bg: var(--fr-surface);
    --bs-btn-hover-bg: var(--fr-surface);
    --bs-btn-active-bg: var(--fr-btn);
    --bs-btn-disabled-bg: var(--fr-surface);
    box-shadow: 0 1px 2px rgba(17,17,20,.05);
}
[data-bs-theme="light"] :is(.btn-tonal, .btn-secondary, .btn-outline-secondary, .btn-outline-dark, .btn-light, .btn-dark):hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px -8px rgba(17,17,20,.3);
}
:is(.btn-tonal, .btn-secondary, .btn-outline-secondary, .btn-outline-dark, .btn-light, .btn-dark):focus-visible { box-shadow: 0 0 0 4px var(--fr-ring); }

/* Accent doux ; coché (btn-check, jours, segmentés hors .f-seg) = plein accent */
.btn-soft, .btn-outline-primary {
    --bs-btn-bg: var(--fr-accent-soft);
    --bs-btn-color: var(--fr-accent-ink);
    --bs-btn-border-color: transparent;
    --bs-btn-hover-bg: color-mix(in srgb, var(--fr-accent) 22%, var(--fr-surface));
    --bs-btn-hover-color: var(--fr-accent-ink);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-bg: var(--fr-accent);
    --bs-btn-active-color: var(--fr-on-accent);
    --bs-btn-active-border-color: var(--fr-accent);
    --bs-btn-disabled-bg: var(--fr-accent-soft);
    --bs-btn-disabled-color: var(--fr-accent-ink);
    --bs-btn-disabled-border-color: transparent;
}

/* Discret : sans fond (Annuler, Effacer, Tout cocher) */
.btn-ghost, .btn-link {
    --bs-btn-bg: transparent;
    --bs-btn-color: var(--fr-ink-2);
    --bs-btn-border-color: transparent;
    --bs-btn-hover-bg: var(--fr-btn);
    --bs-btn-hover-color: var(--fr-ink);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-bg: var(--fr-btn-hover);
    --bs-btn-active-color: var(--fr-ink);
    --bs-btn-active-border-color: transparent;
    --bs-btn-disabled-color: var(--fr-ink-3);
    --bs-btn-disabled-border-color: transparent;
    text-decoration: none;
}

/* Danger discret : texte rouge, fond teinté au survol */
.btn-ghost-danger, .btn-outline-danger {
    --bs-btn-bg: transparent;
    --bs-btn-color: var(--stop-ink);
    --bs-btn-border-color: transparent;
    --bs-btn-hover-bg: var(--stop-soft);
    --bs-btn-hover-color: var(--stop-ink);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--stop) 25%, transparent);
    --bs-btn-active-bg: var(--stop-soft);
    --bs-btn-active-color: var(--stop-ink);
    --bs-btn-active-border-color: color-mix(in srgb, var(--stop) 40%, transparent);
    --bs-btn-disabled-color: var(--stop-ink);
    --bs-btn-disabled-border-color: transparent;
}
:is(.btn-ghost-danger, .btn-outline-danger, .btn-danger):focus-visible { box-shadow: 0 0 0 4px color-mix(in srgb, var(--stop) 30%, transparent); }

/* Danger (confirmation d'une suppression) : teinté, rouge plein au survol */
.btn-danger {
    --bs-btn-bg: var(--stop-soft);
    --bs-btn-color: var(--stop-ink);
    --bs-btn-border-color: color-mix(in srgb, var(--stop) 25%, transparent);
    --bs-btn-hover-bg: var(--stop);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-border-color: var(--stop);
    --bs-btn-active-bg: color-mix(in srgb, var(--stop) 88%, black);
    --bs-btn-active-color: #fff;
    --bs-btn-active-border-color: color-mix(in srgb, var(--stop) 88%, black);
    --bs-btn-disabled-bg: var(--stop-soft);
    --bs-btn-disabled-color: var(--stop-ink);
    --bs-btn-disabled-border-color: color-mix(in srgb, var(--stop) 25%, transparent);
}
.btn-danger:hover { box-shadow: 0 8px 24px -10px var(--stop); }
[data-bs-theme="dark"] .btn-danger { --bs-btn-hover-color: #1A0506; --bs-btn-active-color: #1A0506; }

/* Marqueur Ibiza : jaune réservé à l'origine Ibiza */
.btn-ibiza {
    --bs-btn-bg: var(--ibiza);
    --bs-btn-color: #111114;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-bg: #E2F200;
    --bs-btn-hover-color: #111114;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-bg: #E2F200;
    --bs-btn-active-color: #111114;
    --bs-btn-active-border-color: transparent;
}

/* Actions de ligne : icône ronde 30 px sans fond, teintée au survol */
.btn-icon {
    --bs-btn-padding-x: 0;
    --bs-btn-padding-y: 0;
    --bs-btn-bg: transparent;
    --bs-btn-color: var(--fr-ink-3);
    --bs-btn-border-color: transparent;
    --bs-btn-border-radius: 50%;
    --bs-btn-hover-bg: var(--fr-btn-hover);
    --bs-btn-hover-color: var(--fr-ink);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-bg: var(--fr-btn-hover);
    --bs-btn-active-color: var(--fr-ink);
    --bs-btn-active-border-color: transparent;
    width: 30px;
    height: 30px;
    min-height: 0;
    display: inline-grid;
    place-items: center;
    font-size: 14px;
    line-height: 1;
    box-shadow: none;
}
.btn-icon--danger { --bs-btn-hover-bg: var(--stop-soft); --bs-btn-hover-color: var(--stop-ink); --bs-btn-active-bg: var(--stop-soft); --bs-btn-active-color: var(--stop-ink); }

@media (prefers-reduced-motion: reduce) {
    .btn, .btn::before { transition: none !important; }
    .btn:hover, .btn:active { transform: none !important; }
    .btn-primary::before { display: none; }
    [data-bs-theme="light"] .btn-primary { --bs-btn-hover-bg: var(--fr-accent); --bs-btn-hover-border-color: var(--fr-accent); }
    [data-bs-theme="light"] .btn-primary:focus-visible { --bs-btn-bg: var(--fr-accent); }
}

/* =============================================
   BULK SCHEDULING (AD MANAGER) - Compact Version
   ============================================= */
.bulk-preview-box-compact {
    padding: 0.75rem;
    background: var(--fr-surface-2);
    border: 1px solid var(--fr-line);
    border-radius: 4px;
    margin-top: 0.5rem;
}

.bulk-preview-list-compact {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.5rem;
}

.preview-date-compact {
    display: inline-block;
    padding: 0.2rem 0.5rem;
    background: var(--fr-highlight);
    border-left: 2px solid var(--fr-accent);
    font-size: 0.75rem;
    border-radius: 2px;
    font-weight: 500;
}

.preview-collapsed {
    max-height: 60px;
    overflow: hidden;
}

.preview-expanded {
    max-height: 300px;
    overflow-y: auto;
}

.alert-sm {
    font-size: 0.85rem;
    padding: 0.5rem 0.75rem;
}

/* Cases cochées : règles communes dans forms.css (lot 7) */

/* Réduction des espacements pour le mode bulk */
#bulkModeForm .form-label.small {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--fr-ink-2);
}

#bulkModeForm .form-select-sm,
#bulkModeForm .form-control-sm {
    font-size: 0.875rem;
}

/* =============================================
   BULK SELECTION MODE
   ============================================= */
.bulk-checkbox-col {
    vertical-align: middle;
}

.bulk-checkbox-col input[type="checkbox"] {
    cursor: pointer;
    width: 18px;
    height: 18px;
}

#bulkActionBar {
    position: sticky;
    top: 0;
    z-index: 100;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

#bulkUpdateForm {
    border-left: 4px solid var(--warn);
}

.table-custom tbody tr.bulk-selected {
    background-color: var(--fr-highlight);
}

/* Animation pour la barre d'actions */
#bulkActionBar {
    animation: slideDown 0.3s ease-out;
}
@media (prefers-reduced-motion: reduce) { #bulkActionBar { animation: none; } }

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* =============================================
   VUE CALENDRIER
   ============================================= */

/* Légende */
.cal-legend-box {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    margin-right: 5px;
}

/* VUE JOUR (Timeline) */
.cal-day-view {
    max-width: 900px;
    margin: 0 auto;
}

.cal-day-timeline {
    position: relative;
}

.cal-timeline-item {
    display: flex;
    gap: 1rem;
    margin-bottom: 0.75rem;
    border-left: 3px solid var(--fr-line-2);
    padding-left: 1rem;
}

.cal-timeline-time {
    min-width: 60px;
    font-weight: 600;
    color: var(--fr-ink-2);
    padding-top: 0.5rem;
}

.cal-timeline-content {
    flex: 1;
    padding: 0.75rem;
    border-radius: 14px;
    border: 2px solid;
    cursor: pointer;
    transition: transform .2s var(--ease), box-shadow .2s;
}

.cal-timeline-content:hover {
    transform: translateX(5px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

/* VUE SEMAINE */
.cal-week-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0.5rem;
}

.cal-week-day {
    border: 1px solid var(--fr-line);
    border-radius: 16px;
    overflow: hidden;
    min-height: 180px;
    background: var(--fr-btn);
    transition: transform .2s var(--ease), box-shadow .2s, border-color .2s;
}
.cal-week-day:hover { border-color: var(--fr-line-3); box-shadow: var(--fr-shadow-2); transform: translateY(-2px); }

.cal-week-day-today {
    border-color: var(--fr-accent);
    box-shadow: 0 0 0 3px var(--fr-ring);
}

.cal-week-day-header {
    background: transparent;
    padding: 0.5rem;
    text-align: center;
    font-weight: 600;
    font-size: 0.85rem;
    border-bottom: 1px solid var(--bs-border-color);
}

.cal-week-day-today .cal-week-day-header {
    background: var(--fr-accent);
    color: var(--fr-on-accent);
}
[data-bs-theme="light"] .cal-week-day { background: var(--fr-ground); border-color: transparent; }
[data-bs-theme="light"] .cal-week-day:hover { background: var(--fr-surface); }
[data-bs-theme="light"] .cal-week-day-today { border-color: var(--fr-ink); box-shadow: none; }
[data-bs-theme="light"] .cal-week-day-today .cal-week-day-header { background: var(--fr-ink); color: #fff; }

.cal-week-item {
    margin: 0.4rem;
    padding: 0.4rem 0.55rem;
    border-radius: 10px;
    border: 2px solid;
    color: white;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.25rem;
}

.cal-week-item:hover {
    transform: scale(1.05);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

.cal-week-item-initial {
    background: rgba(0, 0, 0, 0.2);
    padding: 0.15rem 0.3rem;
    border-radius: 3px;
}

.cal-priority-badge {
    background: rgba(255, 255, 255, 0.3);
    padding: 0.1rem 0.3rem;
    border-radius: 10px;
    font-size: 0.7rem;
}

.cal-week-empty {
    text-align: center;
    padding: 2rem 0;
    color: var(--fr-line-2);
    font-size: 1.5rem;
}

/* VUE MOIS */
.cal-month-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 5px;
}

.cal-month-header {
    background: transparent;
    color: var(--fr-ink-3);
    text-transform: uppercase;
    letter-spacing: .07em;
    font-size: var(--t-2xs) !important;
    padding: 0.5rem;
    text-align: center;
    font-weight: 600;
    font-size: 0.85rem;
}

.cal-month-cell {
    background: var(--fr-btn);
    border: 1px solid var(--fr-line);
    border-radius: 12px;
    min-height: 100px;
    padding: 0.5rem 0.6rem;
    position: relative;
    transition: transform .15s var(--ease), border-color .15s, background-color .15s, box-shadow .2s;
}
.cal-month-cell:not(.cal-month-cell-empty):hover { border-color: var(--fr-line-3); background: var(--fr-btn-hover); transform: scale(1.02); }

.cal-month-cell-empty {
    background: transparent;
    border-style: dashed;
    opacity: .5;
}

.cal-month-cell-today {
    border-color: var(--fr-accent);
    box-shadow: 0 0 0 3px var(--fr-ring);
}
[data-bs-theme="light"] .cal-month-cell { background: var(--fr-ground); border-color: transparent; border-radius: 14px; }
[data-bs-theme="light"] .cal-month-cell:not(.cal-month-cell-empty):hover { background: var(--fr-surface); box-shadow: var(--fr-shadow-2); transform: translateY(-2px); }
[data-bs-theme="light"] .cal-month-cell-empty { background: transparent; border: 1px dashed var(--fr-line-2); }
[data-bs-theme="light"] .cal-month-cell-today { background: var(--fr-ink); box-shadow: none; }
[data-bs-theme="light"] .cal-month-cell-today .cal-month-day-number { color: #fff; }

.cal-month-day-number {
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
    color: var(--fr-ink);
}

.cal-month-cell-today .cal-month-day-number {
    color: var(--fr-accent-ink);
    font-weight: 700;
}

.cal-month-events {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cal-month-event {
    height: 6px;
    border-radius: 999px;
    cursor: pointer;
    transition: all 0.2s;
}

.cal-month-event:hover {
    height: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.cal-month-more {
    font-size: 0.7rem;
    color: var(--fr-ink-2);
    text-align: center;
    margin-top: 2px;
    font-weight: 600;
}

/* Modal détails */
.schedule-detail p {
    margin-bottom: 0.5rem;
}

.schedule-detail strong {
    display: inline-block;
    min-width: 120px;
}

/* Responsive */
@media (max-width: 992px) {
    .cal-week-grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .cal-month-cell {
        min-height: 80px;
    }
}

@media (max-width: 768px) {
    .cal-week-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .cal-month-grid {
        font-size: 0.8rem;
    }

    .cal-month-cell {
        min-height: 60px;
        padding: 0.3rem;
    }
}

/* ============================================= */
/* MODE AUTO - Styles pour le nouveau système */
/* ============================================= */

/* Badges mode de diffusion */
.badge.bg-success {
    background-color: var(--ok) !important;
}

.badge.bg-primary {
    background-color: var(--fr-accent) !important;
    color: var(--fr-on-accent) !important;
}

.badge.bg-warning {
    background-color: var(--warn) !important;
    color: #000 !important;
}

/* Progress bar impressions */
.progress {
    border-radius: 4px;
    overflow: hidden;
}

.progress-bar {
    transition: width 0.6s ease;
}

/* Checkboxes emplacements dans le formulaire */
.placement-checkboxes {
    background-color: var(--fr-surface-2);
}

.placement-checkboxes .form-check {
    padding: 0.5rem;
    border-radius: 4px;
    transition: background-color 0.2s;
}

.placement-checkboxes .form-check:hover {
    background-color: var(--fr-line);
}

.placement-checkboxes .form-check-input:checked ~ .form-check-label {
    font-weight: 600;
    color: var(--fr-accent-ink);
}

/* Alerte mode auto sur page planning (couleurs : alert-primary de Bootstrap, suit le thème) */
.alert-primary .card {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Tableau campagnes - colonne progression */
table td .progress {
    margin-bottom: 4px;
}

table td .progress-bar.bg-info {
    background-color: var(--info) !important;
}

table td .progress-bar.bg-warning {
    background-color: var(--warn) !important;
}

table td .progress-bar.bg-success {
    background-color: var(--ok) !important;
}

/* Animation fade pour sections conditionnelles */
#autoModeFields,
#scheduledModeFields {
    transition: opacity 0.3s ease, height 0.3s ease;
}

/* Responsive */
@media (max-width: 768px) {
    .placement-checkboxes {
        max-height: 200px !important;
    }

    table .progress {
        min-width: 100px;
    }
}