/*──────── FULLCALENDAR – thème clair compact ────────*/

/* grille : 2 px d’espace + trait gris */
#calendar .fc-scrollgrid{
  border-collapse:separate!important;
  border-spacing:2px!important;
}
#calendar .fc-scrollgrid td,
#calendar .fc-scrollgrid th{
  border:1px solid #c4c4c4!important;
}

/* barre d’en-tête grise + boutons gris foncé */
#calendar .fc-header-toolbar{
  background:#e4e4e4!important;
  padding:.4rem .6rem;
  border-radius:4px;
}
#calendar .fc .fc-button{
  background:#5f5f5f!important;
  border-color:#5f5f5f!important;
  color:#fff!important;
}
#calendar .fc-toolbar-title{color:#333;font-weight:600}

/* numéro centré, blanc */
#calendar .fc-daygrid-day-frame{
  display:flex!important;
  justify-content:center;
  align-items:center;
}
#calendar .fc-daygrid-day-number,
#calendar .fc-col-header-cell-cushion{
  font:600 14px/1 "Roboto",sans-serif;
  color:#fff!important;
}

/* ─── couleurs d'état (classe placée sur <td>) ─── */
#calendar td.confirmed{background:#c70000!important} /* corail */
#calendar td.pending  {background:#c70000!important} /* rouge   */
#calendar td.free     {background:#8fbe77!important} /* vert    */
#calendar td.free:hover{background:#aad79f!important}

/* passé libre OU hors-mois : voile noir & numéro masqué */
#calendar td.past{
  position:relative!important;
  color:transparent!important;
}
#calendar td.past::after{
  content:"";position:absolute;inset:0;background:#000;opacity:1;pointer-events:none;z-index:5;
}

/* aujourd’hui souligné */
#calendar .fc-daygrid-day.fc-day-today{
  outline:2px solid #0d6efd;
  outline-offset:-2px;
}
/* carré rouge et carré vert de la légende */

.legend-box{
  display:inline-block;
  width:16px;height:16px;
  border-radius:3px;
  margin-right:6px;
  vertical-align:middle;
  background:transparent;            /*  ✅ placé en premier  */
}

/* variantes colorées — APRES le bloc générique */
.legend-box.green { background:#8fbe77!important; }   /* libre     */
#calendar td.past .fc-daygrid-day-bg { background:#000 !important; }
/* passé libre OU hors-mois : voile noir & numéro masqué */
#calendar td.past{
  background:#000 !important;          /* ← noir assuré            */
  position:relative;
  color:transparent !important;
}
/* doit IMPÉRATIVEMENT être après la règle .free */
#calendar td.past{
  background:#000 !important;      /* noir passé et hors-mois   */
  color:transparent !important;
}
/* --- barre du mois ------------------------------------------- */
#calendar .fc-header-toolbar{
  background:#2b2b2b !important;   /* gris foncé */
}
#calendar .fc-header-toolbar .fc-toolbar-title{
  color:#fff !important;           /* texte blanc */
}
/* ► pastilles plus grandes */
#pricing .legend-box{
  display:inline-block;        /* garde la pastille visible            */
  width:25px !important;       /* largeur souhaitée (ex. 32 px)        */
  height:25px !important;      /* hauteur idem                         */
  border-radius:3px;           /* angles doux                          */
}

/* ====== Scope commun : #calendar (si tu l'as encore), #calendar-ch1, #calendar-ch2 ====== */
:where(#calendar, #calendar-ch1, #calendar-ch2) .fc-scrollgrid{
  border-collapse:separate!important;
  border-spacing:2px!important;
}
:where(#calendar, #calendar-ch1, #calendar-ch2) .fc-scrollgrid td,
:where(#calendar, #calendar-ch1, #calendar-ch2) .fc-scrollgrid th{
  border:1px solid #c4c4c4!important;
}

/* barre d’en-tête grise + boutons gris foncé */
:where(#calendar, #calendar-ch1, #calendar-ch2) .fc-header-toolbar{
  background:#e4e4e4!important;
  padding:.4rem .6rem;
  border-radius:4px;
}
:where(#calendar, #calendar-ch1, #calendar-ch2) .fc .fc-button{
  background:#5f5f5f!important;
  border-color:#5f5f5f!important;
  color:#fff!important;
}
:where(#calendar, #calendar-ch1, #calendar-ch2) .fc-toolbar-title{
  color:#333!important;
  font-weight:600;
}

/* numéro centré, blanc */
:where(#calendar, #calendar-ch1, #calendar-ch2) .fc-daygrid-day-frame{
  display:flex!important;
  justify-content:center;
  align-items:center;
}
:where(#calendar, #calendar-ch1, #calendar-ch2) .fc-daygrid-day-number,
:where(#calendar, #calendar-ch1, #calendar-ch2) .fc-col-header-cell-cushion{
  font:600 14px/1 "Roboto",sans-serif;
  color:#fff!important;
}

/* ─── couleurs d'état (classe posée sur <td>) ─── */
:where(#calendar, #calendar-ch1, #calendar-ch2) td.confirmed{background:#c70000!important;}
:where(#calendar, #calendar-ch1, #calendar-ch2) td.pending  {background:#c70000!important;}
:where(#calendar, #calendar-ch1, #calendar-ch2) td.free     {background:#8fbe77!important;}
:where(#calendar, #calendar-ch1, #calendar-ch2) td.free:hover{background:#aad79f!important;}

/* passé libre OU hors-mois : voile noir & numéro masqué */
:where(#calendar, #calendar-ch1, #calendar-ch2) td.past{
  position:relative!important;
  background:#000 !important;
  color:transparent!important;
}
:where(#calendar, #calendar-ch1, #calendar-ch2) td.past::after{
  content:"";position:absolute;inset:0;background:#000;opacity:1;pointer-events:none;z-index:5;
}

/* aujourd’hui souligné */
:where(#calendar, #calendar-ch1, #calendar-ch2) .fc-daygrid-day.fc-day-today{
  outline:2px solid #0d6efd;
  outline-offset:-2px;
}

/* légende */
.legend-box{
  display:inline-block;
  width:16px;height:16px;
  border-radius:3px;
  margin-right:6px;
  vertical-align:middle;
  background:transparent;
}
.legend-box.red   { background:#dc3545!important; }
.legend-box.green { background:#8fbe77!important; }

/* pastilles plus grandes dans la légende pricing */
#pricing .legend-box{
  width:25px !important;
  height:25px !important;
}
/* Le frame doit pouvoir porter un overlay */
#calendar td.fc-daygrid-day .fc-daygrid-day-frame{
  position:relative;
}



/* le numéro doit passer au-dessus de la diagonale */
#calendar .fc-daygrid-day-number{
  position:relative;
  z-index:2;
}

/* IMPORTANT : si la case est "past" + "checkout", on enlève le voile noir */
#calendar td.past.checkout::after{
  display:none !important;
}

/* Bases (si besoin de rappel unifiés) */
#calendar td.confirmed{ background:#dc3545 !important; } /* réservé */
#calendar td.free     { background:#8fbe77 !important; } /* libre   */
#calendar td.free:hover{ background:#aad79f !important; }
/* --- ordonnancement des couches dans chaque case --- */
#calendar td.fc-daygrid-day { position: relative; }

/* calque des événements de fond (réservations, voiles…) = dessous */
#calendar td.fc-daygrid-day .fc-daygrid-day-bg {
  position: relative;
  z-index: 1;
}

/* contenu de la case (numéro, etc.) */
#calendar td.fc-daygrid-day .fc-daygrid-day-frame {
  position: relative;
  z-index: 2;
}


/* numéro du jour = tout en haut */
#calendar .fc-daygrid-day-number { position: relative; z-index: 4; }

/* si past + checkout → enlever le voile noir posé sur le <td> */
#calendar td.past.checkout::after { display: none !important; }
/* Jour libre + départ ce jour → moitié rouge / moitié vert (diagonale) */
/* On place la diagonale SUR le <td> lui‑même pour éviter tout z-index */
#calendar td.free.checkout{
  background:

    /* fond vert libre */
    #8fbe77 !important;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  }
  :root{
  --red-reserved: #c70000;   /* <— même valeur que #calendar td.confirmed */
  --green-free:   #8fbe77;
}

/* Jours réservés / libres */
#calendar td.confirmed{ background: var(--red-reserved) !important; }
#calendar td.free     { background: var(--green-free)   !important; }

/* Jour libre + checkout → diagonale avec LE MÊME rouge que 'confirmed' */
#calendar td.free.checkout{
  background:
    linear-gradient(135deg, var(--red-reserved) 0 50%, rgba(0,0,0,0) 50% 100%),
    var(--green-free) !important;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
/* le frame doit pouvoir porter un overlay */
#calendar td.fc-daygrid-day .fc-daygrid-day-frame{ position: relative; }

/* Etats de base */
#calendar td.confirmed{ background: var(--red-reserved) !important; }
#calendar td.free     { background: var(--green-free)   !important; }

/* Diagonale checkout UNIQUEMENT sur un jour libre */
#calendar td.free.checkout{
  background:
    linear-gradient(135deg, var(--red-reserved) 0 50%, transparent 50% 100%),
    var(--green-free) !important;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

/* L’overlay de sélection doit vivre sur le <td> (plein remplissage) */
#calendar td.fc-daygrid-day{ position: relative; }               /* ancre */
#calendar td.selected::before{
  content:"";
  position:absolute; inset:0;
  background: rgba(13,110,253,.35);
  pointer-events:none;
  z-index:5;                                  /* au-dessus de la diagonale */
}

/* Le numéro reste au-dessus de tout */
#calendar .fc-daygrid-day-number{ position: relative; z-index:6; }

/* Past + checkout : pas de diagonale visible */
#calendar td.past.checkout::after{ display:none !important; }
/* === Couleurs de référence === */

/* Etats de base */
#calendar td.confirmed{ background:var(--red-reserved) !important; }
#calendar td.free     { background:var(--green-free)   !important; }

/* Checkout sur un jour libre : diagonale avec le même rouge */
#calendar td.free.checkout{
  background:
    linear-gradient(135deg, var(--red-reserved) 0 50%, transparent 50% 100%),
    var(--green-free) !important;
  background-repeat:no-repeat;
  background-size:100% 100%;
}

/* Sélection : remplissage bleu (sans contour) */
#calendar td.fc-daygrid-day{ position:relative; }
#calendar td.selected::before{
  content:"";
  position:absolute; inset:0;
  background:rgba(13,110,253,.35);   /* bleu Bootstrap */
  pointer-events:none;
  z-index:5;                          /* au-dessus des fonds */
}
#calendar .fc-daygrid-day-number{ position:relative; z-index:6; }

/* Past + checkout : pas de diagonale visible */
#calendar td.past.checkout::after{ display:none !important; }
/* === Vue annuelle (#yearCal) : mêmes codes que le mois === */
/* (garde un seul bloc :root dans toute ta feuille) */


#yearCal td.fc-daygrid-day{ position:relative; }

/* Le numéro reste visible au-dessus des overlays */
#yearCal .fc-daygrid-day-number{ position:relative; z-index:2; }

/* Option — si tu veux vraiment le même "voile noir" que le mois : */
#yearCal td.past{
  position:relative;
  color:transparent !important;
}
#yearCal td.past::after{
  content:""; position:absolute; inset:0;
  background:#000; opacity:1; pointer-events:none; z-index:1;
}
/* === Couleurs de référence (une seule fois dans toute la feuille) === */
:root{
  --red-reserved:#c70000;  /* réservé */
  --green-free:#4bb117;    /* libre   */
}

/* ====== Mois des chambres (ch1/ch2) ====== */
:where(#calendar-ch1,#calendar-ch2) td.fc-daygrid-day{ position:relative; }
:where(#calendar-ch1,#calendar-ch2) td.confirmed{ background:var(--red-reserved) !important; }
:where(#calendar-ch1,#calendar-ch2) td.free     { background:var(--green-free)   !important; }
:where(#calendar-ch1,#calendar-ch2) td.free.checkout{
  background:
    linear-gradient(135deg, var(--red-reserved) 0 50%, transparent 50% 100%),
    var(--green-free) !important;
  background-repeat:no-repeat;
  background-size:100% 100%;
}
/* passé / hors-mois (si tu veux le même “voile” que la villa) */
:where(#calendar-ch1,#calendar-ch2) td.past{
  position:relative; color:transparent !important;
}
:where(#calendar-ch1,#calendar-ch2) td.past::after{
  content:""; position:absolute; inset:0; background:#000; opacity:1; pointer-events:none; z-index:1;
}
/* numéro toujours lisible au-dessus */
:where(#calendar-ch1,#calendar-ch2) .fc-daygrid-day-number{ position:relative; z-index:2; }

/* ====== Vue annuelle des chambres ====== */
:where(#yearCal-ch1,#yearCal-ch2) td.fc-daygrid-day{ position:relative; }
:where(#yearCal-ch1,#yearCal-ch2) td.confirmed{ background:var(--red-reserved) !important; }
:where(#yearCal-ch1,#yearCal-ch2) td.free     { background:var(--green-free)   !important; }
:where(#yearCal-ch1,#yearCal-ch2) td.free.checkout{
  background:
    linear-gradient(135deg, var(--red-reserved) 0 50%, transparent 50% 100%),
    var(--green-free) !important;
  background-repeat:no-repeat;
  background-size:100% 100%;
}
:where(#yearCal-ch1,#yearCal-ch2) .fc-daygrid-day-number{ position:relative; z-index:2; }
/* optionnel : même rendu du passé que le mois */
:where(#yearCal-ch1,#yearCal-ch2) td.past{
  position:relative; color:transparent !important;
}
:where(#yearCal-ch1,#yearCal-ch2) td.past::after{
  content:""; position:absolute; inset:0; background:#000; opacity:1; pointer-events:none; z-index:1;
}

/* style compact pour les vues annuelles */
:where(#yearCal-ch1,#yearCal-ch2) .fc-multimonth-title{ font-size:14px; }
:where(#yearCal-ch1,#yearCal-ch2) .fc-daygrid-day     { font-size:12px; padding:0; }
:where(#yearCal-ch1,#yearCal-ch2) .fc-daygrid-day-frame{ min-height:18px; }
/* Masquer les événements de fond (rouges) sur les cases "hors mois" */
:where(#calendar, #calendar-ch1, #calendar-ch2)
  td.fc-daygrid-day.fc-day-other .fc-bg-event {
  display: none !important;
}

/* (optionnel) s'assurer que rien ne "teinte" la cellule hors mois */
:where(#calendar, #calendar-ch1, #calendar-ch2)
  td.fc-daygrid-day.fc-day-other .fc-daygrid-day-bg {
  background: transparent !important;
}
/* Kill switch : neutralise les anciennes diagonales "paintées" en background */
#calendar td.free.checkout,
#calendar td.free.checkin{
  background-image: none !important;
}

/* Empilement propre */
#calendar td.fc-daygrid-day{ position:relative; overflow:hidden; }
#calendar .fc-daygrid-day-number{ position:relative; z-index:6; }

/* === DIAGONALES (rotation +90°) ========================================= */

/* CHECKOUT = \ → devient / (pivote +90°) : 135deg
   Rouge IDENTIQUE à confirmed (pas d'opacité) */
#calendar td.checkout::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:3;
  background: linear-gradient(135deg, var(--red-reserved) 50%, transparent 50%);
}

/* CHECKIN = l’autre diagonale (pivote aussi +90°) : 315deg */
#calendar td.checkin::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:3;
  background: linear-gradient(315deg, var(--red-reserved) 50%, transparent 50%);
}

/* Ne pas laisser l'event de fond teinter les cases checkin/checkout */
#calendar td.checkout .fc-bg-event,
#calendar td.checkin  .fc-bg-event{ display:none !important; }

/* Option : pas de diagonales sur le passé */
#calendar td.past.checkout::after,
#calendar td.past.checkin::before{ display:none !important; }

/* Sélection bleue au dessus des diagonales */
#calendar td.selected::before{
  content:""; position:absolute; inset:0; z-index:5; pointer-events:none;
  background: rgba(13,110,253,.35);
}
/* mêmes overlays que le mois, mais pour #yearCal */
#yearCal td.fc-daygrid-day { position: relative; overflow: hidden; }
#yearCal .fc-daygrid-day-number { position: relative; z-index: 6; }

#yearCal td.checkout::after,
#yearCal td.checkin::before {
  content:"";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
  opacity: 1 !important;            /* <-- écrase les anciens .55 */
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
/* Neutralise toute ancienne diagonale “peinte” dans le background */
#yearCal td.free.checkout,
#yearCal td.free.checkin{
  background-image: none !important;
}

/* Empilement propre */
#yearCal td.fc-daygrid-day{ position: relative; overflow: hidden; }
#yearCal .fc-daygrid-day-number{ position: relative; z-index: 6; }

/* Fonds de base identiques au mois */
#yearCal td.confirmed{ background: var(--red-reserved) !important; }
#yearCal td.free     { background: var(--green-free)   !important; }

/* Diagonales sans opacité, angles unifiés */
#calendar td.checkout::after{
  content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
  background: linear-gradient(135deg, var(--red-reserved) 50%, transparent 50%);
}
#calendar td.checkin::before{
  content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
  background: linear-gradient(315deg, var(--red-reserved) 50%, transparent 50%);
}
/* ======= ANNUEL (#yearCal) ======= */
#yearCal td.confirmed { background: var(--red-reserved) !important; }
#yearCal td.free      { background: var(--green-free)   !important; }
/* Killswitch anciennes diagonales peintes */
#yearCal td.free.checkout,
#yearCal td.free.checkin { background-image: none !important; }
/* Diagonales identiques au mois (même rouge, pas d’opacité) */
#yearCal td.checkout::after{
  content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
  background: linear-gradient(135deg, var(--red-reserved) 50%, transparent 0%);
}
#yearCal td.checkin::before{
  content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
  background: linear-gradient(315deg, var(--red-reserved) 50%, transparent 0%);
}

/* Ne pas teinter les cases checkin/checkout avec les bg-events */
#yearCal td.checkout .fc-bg-event,
#yearCal td.checkin  .fc-bg-event{ display:none !important; }

/* Pas de diagonales si past/confirmed */
#yearCal td.past.checkout::after,
#yearCal td.past.checkin::before,
#yearCal td.confirmed.checkout::after,
#yearCal td.confirmed.checkin::before{
  display:none !important;
}
/* ==== Palette unique ==== */
:root { --red-reserved:#c70000; --green-free:#46a915; }

/* ====== Mensuel CH1/CH2 ====== */
:where(#calendar-ch1,#calendar-ch2) td.fc-daygrid-day{ position:relative; overflow:hidden; }
:where(#calendar-ch1,#calendar-ch2) td.confirmed{ background:var(--red-reserved) !important; }
:where(#calendar-ch1,#calendar-ch2) td.free     { background:var(--green-free)   !important; }

/* Diagonales (même rendu que la villa) */
:where(#calendar-ch1,#calendar-ch2) td.checkout::after,
:where(#calendar-ch1,#calendar-ch2) td.checkin::before{
  content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
  background-repeat:no-repeat; background-size:100% 100%; opacity:1 !important;
}
:where(#calendar-ch1,#calendar-ch2) td.checkout::after{
  /* checkout = / */
  background: linear-gradient(135deg, var(--red-reserved) 50%, transparent 50%) !important;
}
:where(#calendar-ch1,#calendar-ch2) td.checkin::before{
  /* checkin = \ */
  background: linear-gradient(315deg, var(--red-reserved) 50%, transparent 50%) !important;
}

/* Pas de diagonales si past/confirmed */
:where(#calendar-ch1,#calendar-ch2) td.past.checkout::after,
:where(#calendar-ch1,#calendar-ch2) td.past.checkin::before,
:where(#calendar-ch1,#calendar-ch2) td.confirmed.checkout::after,
:where(#calendar-ch1,#calendar-ch2) td.confirmed.checkin::before{ display:none !important; }

/* Ne pas teinter les cases à diagonales via les events rouges */
:where(#calendar-ch1,#calendar-ch2) td.checkout .fc-bg-event,
:where(#calendar-ch1,#calendar-ch2) td.checkin  .fc-bg-event{ display:none !important; }

/* Hors-mois : ne rien teinter */
:where(#calendar-ch1,#calendar-ch2) td.fc-daygrid-day.fc-day-other .fc-bg-event { display:none !important; }
:where(#calendar-ch1,#calendar-ch2) td.fc-daygrid-day.fc-day-other .fc-daygrid-day-bg{ background:transparent !important; }

/* ====== Annuel CH1/CH2 (dans les modaux) ====== */
:where(#yearCal-ch1,#yearCal-ch2) td.fc-daygrid-day{ position:relative; overflow:hidden; }
:where(#yearCal-ch1,#yearCal-ch2) td.confirmed{ background:var(--red-reserved) !important; }
:where(#yearCal-ch1,#yearCal-ch2) td.free     { background:var(--green-free)   !important; }

/* On masque les bg-events en annuel pour éviter tout “mélange” de teintes */
:where(#yearCal-ch1,#yearCal-ch2) .fc-bg-event{ display:none !important; }

/* Diagonales identiques au mensuel */
:where(#yearCal-ch1,#yearCal-ch2) td.checkout::after,
:where(#yearCal-ch1,#yearCal-ch2) td.checkin::before{
  content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
  background-repeat:no-repeat; background-size:100% 100%; opacity:1 !important;
}
:where(#yearCal-ch1,#yearCal-ch2) td.checkout::after{
  background: linear-gradient(135deg, var(--red-reserved) 50%, transparent 50%) !important;
}
:where(#yearCal-ch1,#yearCal-ch2) td.checkin::before{
  background: linear-gradient(315deg, var(--red-reserved) 50%, transparent 50%) !important;
}

/* Pas de diagonales si past/confirmed */
:where(#yearCal-ch1,#yearCal-ch2) td.past.checkout::after,
:where(#yearCal-ch1,#yearCal-ch2) td.past.checkin::before,
:where(#yearCal-ch1,#yearCal-ch2) td.confirmed.checkout::after,
:where(#yearCal-ch1,#yearCal-ch2) td.confirmed.checkin::before{ display:none !important; }
/* Sélection bleue – fonctionne pour villa, ch1 et ch2 */
:where(#calendar, #calendar-ch1, #calendar-ch2) td.selected::before{
  content:"";
  position:absolute; inset:0;
  background:rgba(13,110,253,.35);   /* bleu Bootstrap */
  pointer-events:none;
  z-index:5;
}
/* Laisse vraiment passer la souris dans toute la case */
.fc-daygrid-day-bg,          /* nappe de la cellule              */
.fc-daygrid-day-bg *,        /* …et tous ses descendants         */
.fc-bg-event                 /* la bande rouge de réservation    */
{
  pointer-events: none !important;
}
/* ───────────── MODE SOMBRE — VUE ANNUELLE ───────────── */
:where(#yearCal, #yearCal-ch1, #yearCal-ch2){
  background:#2b2b2b !important;
  color:#fff !important;
}

/* grille + cellules */
:where(#yearCal, #yearCal-ch1, #yearCal-ch2) .fc-scrollgrid,
:where(#yearCal, #yearCal-ch1, #yearCal-ch2) td,
:where(#yearCal, #yearCal-ch1, #yearCal-ch2) th{
  background:#2b2b2b !important;
  color:#fff !important;
  border-color:#444 !important;
}

/* titre de chaque mois (multi-month) + en-têtes jour/semaine */
:where(#yearCal, #yearCal-ch1, #yearCal-ch2) .fc-multimonth-title,
:where(#yearCal, #yearCal-ch1, #yearCal-ch2) .fc-col-header-cell-cushion,
:where(#yearCal, #yearCal-ch1, #yearCal-ch2) .fc-daygrid-day-number{
  color:#fff !important;
}

/* ───────────── BANNIÈRE DU CALENDRIER MENSUEL ───────────── */
/* fond gris foncé pour la barre “Mois / boutons” (déjà ok)   */
/* + fond gris pour l’étiquette qui montre les jours */
#calendar .fc-col-header-cell,
#calendar .fc-col-header-cell-cushion{
  background:#2b2b2b !important;   /* même gris foncé */
  color:#d1d1d1 !important;        /* texte gris clair */
}

/* assure aussi le titre (“Mars 2026”, etc.) en gris clair */
#calendar .fc-toolbar-title{
  color:#d1d1d1 !important;
}
/*─────────────────────────────────────────────────────────*/
/* 1)  Bannière (titre + ligne des jours) du calendrier   */
/*─────────────────────────────────────────────────────────*/
#calendar .fc-header-toolbar {                           /* bandeau “Mois / boutons” */
  background:#2b2b2b !important;
}

#calendar .fc-toolbar-title {                            /* titre “Août 2025” */
  color:#d1d1d1 !important;                             /* gris clair */
}

/* ligne des jours (Lu / Ma / Me …) */
#calendar th.fc-col-header-cell,
#calendar .fc-col-header-cell-cushion{
  background:#2b2b2b !important;                        /* même fond */
  color:#d1d1d1 !important;                             /* texte gris clair */
}

/*─────────────────────────────────────────────────────────*/
/* 2)  Fenêtre modale “Vue annuelle” : fond sombre complet */
/*─────────────────────────────────────────────────────────*/
#yearModal-ch1 .modal-content,
#yearModal-ch2 .modal-content{
  background:#2b2b2b !important;
  color:#fff !important;
  border:1px solid #444;
}

/* titre du modal */
#yearModal-ch1 .modal-title,
#yearModal-ch2 .modal-title{
  color:#fff !important;
}

/* la barre interne (multi-month header) hérite déjà du fond sombre
   grâce aux règles :where(#yearCal, ...) placées plus haut.        */