:root {
            --slot-h: 48px;
        }

        .scrollbar-thin::-webkit-scrollbar {
            height: 6px;
            width: 6px;
        }

        .scrollbar-thin::-webkit-scrollbar-thumb {
            background: #cbd5e1;
            border-radius: 9999px;
        }

        .touch-scroll {
            -webkit-overflow-scrolling: touch;
        }

        @keyframes pulseHighlight {

            0%,
            100% {
                box-shadow: 0 0 0 0 rgba(34, 197, 94, .0)
            }

            50% {
                box-shadow: 0 0 0 6px rgba(34, 197, 94, .35)
            }
        }

        .highlight {
            animation: pulseHighlight 1.2s ease-in-out 4;
        }

        .tooltip-card {
            position: fixed !important;
            /* ← était absolute */
            z-index: 9999 !important;
            background: rgba(11, 17, 26, .98);
            border: 1px solid #1f2937;
            border-radius: 12px;
            box-shadow: 0 18px 50px rgba(0, 0, 0, .45);
            width: min(360px, 92vw);
            pointer-events: none;
            /* ← important pour ne jamais “retenir” la souris */
            color: #e5e7eb;
            padding: 12px 14px;
            transform-origin: top left;
            animation: pop .12s ease-out;
        }

        @keyframes pop {
            from {
                transform: scale(.96);
                opacity: .6
            }

            to {
                transform: scale(1);
                opacity: 1
            }
        }

        .tooltip-row {
            display: flex;
            gap: 8px;
            align-items: flex-start;
            padding: 4px 0
        }

        .tooltip-label {
            width: 118px;
            color: #9ca3af;
            font-size: .9rem
        }

        .tooltip-value {
            flex: 1;
            font-size: .95rem
        }

        .tooltip-chip {
            display: inline-block;
            border: 1px solid #223144;
            border-radius: 999px;
            padding: 2px 8px;
            font-size: .8rem;
            color: #b8d6e8;
        }

        .tooltip-sep {
            border-top: 1px solid #1f2937;
            margin: 8px -14px;
        }

        .tooltip-close {
            position: absolute;
            top: 6px;
            right: 8px;
            cursor: pointer;
            color: #9ca3af;
        }

        .tooltip-skel {
            height: 10px;
            background: linear-gradient(90deg, #0f1a28, #0f1e30, #0f1a28);
            border-radius: 6px;
            animation: shine 1.1s infinite;
        }

        @keyframes shine {
            0% {
                background-position: -150px
            }

            100% {
                background-position: 150px
            }
        }


        /* Les 7 colonnes de jours : laisses le navigateur ignorer le layout offscreen */
.week-grid, .calendar-day {
  content-visibility: auto;          /* saute le layout tant que non visible */
  contain-intrinsic-size: 1200px;    /* taille de réserve pour éviter les sauts */
  contain: layout paint style;       /* isole le reflow dans la colonne */
}

/* N'active l'accélération que pendant le drag (tu poses/retire via une classe JS) */
[data-assign-id].dragging {
  will-change: transform;
}

/* Animation — réduire si l'utilisateur préfère moins d'animations */
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}


/* =========================
   CASERNA — Impression calendrier (A4 paysage)
   ========================= */
@page {
  size: A4;
  margin: 6mm; /* ajuste 6–12mm si besoin */
}

@media print {
  /* Couleurs au max (si le navigateur le permet) */
  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Page claire même si l'app est en dark */
  html, body {
    background: #ffffff !important;
    color: #111827 !important;
  }

  /* Cache l'UI non utile */
  header, nav, aside, footer,
  .topbar, .sidebar,
  .calendar-toolbar, .filters, .legend, .who-has-what,
  .tooltip-card, [data-print="hide"] {
    display: none !important;
  }


  .week-grid { gap: 0 !important; }             /* évite le dimanche coupé */
  .calendar-day { break-inside: avoid; }        /* force la non-coupure */


  /* Racine calendrier : centrée et adaptée à la page.
     (Le scale exact est appliqué en JS avant print) */
  .calendar-print-root {
    display: block !important;
    background: #fff !important;
    transform-origin: top center !important;
    margin: 0 auto !important;
    padding: 0 !important;
    max-width: none !important;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Évite les débordements liés aux gaps/paddings */
  .calendar-print-root .week-grid { gap: 0 !important; }
  .calendar-print-root .container { padding: 0 !important; margin: 0 !important; }

  /* Empêcher les coupures internes */
  .calendar-print-root .week-grid,
  .calendar-print-root .day-column,
  .calendar-print-root .calendar-day {
    box-sizing: border-box !important;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Blocs d’affectation : peints par box-shadow inset.
     ⚠️ PAS de fallback gris si --print-bg absent → transparent pour éviter le “carré gris”. */
  [data-assign-id]{
    box-shadow: inset 0 0 0 9999px var(--print-bg, transparent) !important;
    opacity: 1 !important;
    mix-blend-mode: normal !important;
    filter: none !important;
    box-sizing: border-box !important;
    border-radius: 12px;
    outline: 0.5pt solid rgba(0,0,0,.15);
    break-inside: avoid;
    page-break-inside: avoid;
    font-size: 12px;
  }

  /* Pas d’overlays */
  .sticky, .fixed { position: static !important; }
  .overflow-y-auto, .overflow-auto { overflow: visible !important; }
}

/* Popover interactif (édition) */
.popover-card{
  position: fixed;
  z-index: 2000;
  pointer-events: auto;             /* ← interactif (contraire de tooltip-card) */
  width: 360px;
  padding: 12px;
  background: #0f172a;              /* slate-900 */
  color: #e5e7eb;                   /* slate-200 */
  border: 1px solid #334155;        /* slate-700 */
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}

/* Petits éléments internes, si tu veux le même look que la tooltip */
.popover-card .text-xs { color:#94a3b8; }   /* slate-400 */