*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  /* ── Charte BAM Freesports ── */
  --bam-green: #40b030; --bam-green-dark: #35a025; --bam-green-light: #f0faf0;
  /* BAM73 Chambéry = vert BAM, BAM74 Annecy = vert légèrement plus sombre */
  --bam73: #40b030; --bam73-light: #edf7ec; --bam73-dark: #35a025;
  --bam74: #2d8a20; --bam74-light: #e8f5e6; --bam74-dark: #226618;
  --surface: #ffffff; --surface-2: #f4faf3; --surface-3: #eaf5e8;
  --text: #1a2e18; --text-2: #2d4a2c; --muted: #5a7a58; --muted-light: #9dc49a;
  --gray: #eaf5e8;
  --border: #d4ead2; --border-2: #b8d8b5;
  --danger: #dc2626; --danger-light: #fef2f2;
  --success: #40b030; --success-light: #edf7ec;
  --warning: #d97706; --warning-light: #fffbeb;
  --radius: 8px; --radius-sm: 5px; --radius-lg: 12px; --radius-xl: 16px;
  --shadow-sm: 0 1px 3px rgba(64,176,48,.08),0 1px 2px rgba(0,0,0,.04);
  --shadow: 0 4px 12px rgba(64,176,48,.1),0 2px 4px rgba(0,0,0,.04);
  --shadow-lg: 0 12px 32px rgba(0,0,0,.12),0 4px 12px rgba(64,176,48,.08);
  --t: 150ms cubic-bezier(.4,0,.2,1);
}
body { font-family: 'Inter', system-ui, -apple-system, sans-serif; font-feature-settings: 'cv11','ss01'; color: var(--text); background: var(--surface-2); }
button { cursor: pointer; font: inherit; border: none; border-radius: var(--radius); padding: .4rem .8rem; transition: all var(--t); }
input, select, textarea { font: inherit; border: 1px solid var(--border); border-radius: var(--radius); padding: .4rem .6rem; width: 100%; background: var(--surface); transition: border-color var(--t), box-shadow var(--t); }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--bam-green); box-shadow: 0 0 0 3px rgba(64,176,48,.14); }

/* ── Screens ── */
.screen { display: none !important; }
.screen.active { display: block !important; }
#screen-login.active { display: flex !important; min-height: 100vh; align-items: center; justify-content: center; }
#screen-app.active  { display: flex !important; flex-direction: column; min-height: 100vh; }

/* ── Login ── */
.login-box { background:var(--surface); border-radius:var(--radius-xl); box-shadow:var(--shadow-lg); padding:2.5rem 2rem; width:min(360px,92vw); text-align:center; }
#screen-init.active, #screen-forgot.active { display:flex !important; min-height:100vh; align-items:center; justify-content:center; }
.login-logo { display:block; font-size:2.2rem; margin-bottom:.5rem; }
.ico-tr { width:1.05em; height:1.05em; vertical-align:-.18em; }
.ic { width:1.05em; height:1.05em; vertical-align:-.15em; flex-shrink:0; }   /* #69 : icônes SVG (sprite, currentColor) */
.login-box h1 { font-size:1.5rem; font-weight:800; margin-bottom:.25rem; letter-spacing:-.03em; }
.login-box p  { color:var(--muted); font-size:.9rem; margin-bottom:1.5rem; }
.login-box input { margin-bottom:1rem; }
.btn-primary { background:var(--bam-green); color:#fff; width:100%; padding:.65rem; font-weight:700; border-radius:var(--radius); letter-spacing:.02em; box-shadow:0 2px 10px rgba(64,176,48,.4); }
.btn-primary:hover { background:var(--bam-green-dark); transform:translateY(-1px); box-shadow:0 4px 16px rgba(64,176,48,.5); }
.btn-primary:active { transform:translateY(0); }
.btn-primary:disabled { opacity:.6; cursor:wait; transform:none; }
.login-error { color:#fff; background:var(--danger); border-radius:var(--radius); padding:.5rem .75rem; font-size:.875rem; margin-top:.75rem; display:none; }
.login-error.visible { display:block; }

/* ── Header ── */
header { background:#fff; border-bottom:3px solid var(--bam-green); padding:.55rem 1rem; display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; position:sticky; top:0; z-index:10; box-shadow:0 2px 10px rgba(64,176,48,.12); }
.logo { font-weight:900; font-size:1.05rem; letter-spacing:-.04em; text-transform:uppercase; color:var(--text); }
.logo span { color:var(--bam-green); }
.site-tabs { display:flex; gap:3px; background:var(--surface-3); border-radius:8px; padding:3px; border:1px solid var(--border); }
.site-tab { padding:.28rem .8rem; border-radius:6px; font-size:.78rem; font-weight:700; background:transparent; color:var(--muted); border:none; transition:all var(--t); text-transform:uppercase; letter-spacing:.02em; }
.site-tab:hover { color:var(--text-2); background:rgba(255,255,255,.7); }
.site-tab.active-73 { background:var(--bam-green); color:#fff; box-shadow:0 2px 8px rgba(64,176,48,.4); }
.site-tab.active-74 { background:var(--bam74); color:#fff; box-shadow:0 2px 8px rgba(45,138,32,.4); }
.week-nav { display:flex; align-items:center; gap:.35rem; }
.week-nav button { background:var(--surface-3); padding:.3rem .55rem; font-size:.85rem; border-radius:var(--radius); border:1px solid var(--border); color:var(--bam-green); font-weight:700; }
.week-nav button:hover { background:var(--bam-green); color:#fff; border-color:var(--bam-green); }
.week-label { font-weight:700; font-size:.88rem; white-space:nowrap; color:var(--text-2); min-width:160px; text-align:center; }
.header-actions { display:flex; gap:.4rem; align-items:center; margin-left:auto; }
.btn-publish { background:var(--bam-green); color:#fff; font-weight:700; font-size:.82rem; padding:.35rem .75rem; box-shadow:0 2px 8px rgba(64,176,48,.4); letter-spacing:.02em; }
.btn-publish:hover { background:var(--bam-green-dark); transform:translateY(-1px); box-shadow:0 4px 12px rgba(64,176,48,.5); }
.btn-copy { background:var(--surface-3); font-size:.8rem; color:var(--text-2); padding:.35rem .65rem; border:1px solid var(--border); }
.btn-copy:hover { background:var(--border); }
/* Vue salarie (lecture seule) : masquer les controles d'edition manager du header */
#screen-app.emp-view .btn-copy,
#screen-app.emp-view #btn-horaires-toggle { display: none !important; }
.btn-icon { background:var(--surface-3); color:var(--muted); font-size:.95rem; padding:.3rem .5rem; border-radius:var(--radius-sm); border:1px solid var(--border); }
.btn-icon:hover { background:var(--bam-green-light); color:var(--bam-green); border-color:var(--bam-green); }
/* #68 : menu overflow « ⋯ » du header manager */
.hdr-menu { position:relative; display:inline-flex; }
.hdr-menu-btn { font-size:1.05rem; line-height:0; padding:.32rem .5rem; }
.hdr-menu-panel { position:absolute; right:0; top:calc(100% + 8px); background:var(--surface); border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow-lg); padding:.35rem; min-width:210px; z-index:30; display:flex; flex-direction:column; gap:2px; }
.hdr-menu-panel > button, .hdr-menu-panel > label { display:flex; align-items:center; gap:.6rem; width:100%; padding:.5rem .65rem; background:none; border:none; border-radius:8px; font-size:.86rem; font-weight:600; color:var(--text-2); text-align:left; cursor:pointer; white-space:nowrap; }
.hdr-menu-panel > button:hover, .hdr-menu-panel > label:hover { background:var(--bam-green-light); color:var(--bam-green-dark); }
.hdr-menu-panel .ic { color:var(--muted); }
.hdr-menu-panel > button:hover .ic, .hdr-menu-panel > label:hover .ic { color:var(--bam-green); }
.hdr-menu-sep { height:1px; background:var(--border); margin:.25rem .3rem; }
.hdr-menu-panel > .hdr-menu-logout { display:none; }  /* #91 : Déconnexion dans le menu = mobile seulement (desktop garde l'icône déco du header) */
.badge-published { font-size:.72rem; background:var(--success-light); color:var(--success); border:1px solid #b8d8b5; border-radius:20px; padding:.2rem .55rem; font-weight:700; }
.emp-banner { background:linear-gradient(135deg,var(--bam73-light),var(--surface)); border-bottom:3px solid var(--bam-green); padding:.5rem 1.1rem; font-size:.87rem; color:var(--bam-green-dark); display:flex; align-items:center; gap:.5rem; font-weight:700; }
.btn-ical { background:var(--bam-green); color:#fff; font-size:.8rem; font-weight:700; padding:.32rem .7rem; border-radius:var(--radius); border:none; cursor:pointer; white-space:nowrap; }
.btn-ical:hover { background:var(--bam-green-dark); }
.btn-emp-full { display:none; }   /* "semaine entière" : mobile salarié uniquement */
.btn-emp-full.active { background:var(--bam-green-dark); box-shadow:inset 0 0 0 2px rgba(255,255,255,.6); }
/* #62b : barre flottante « valider la semaine » (salarié mobile, semaine non validée) */
.emp-validate-bar { display:none; position:fixed; left:0; right:0; bottom:0; z-index:60; padding:.5rem .7rem calc(.5rem + env(safe-area-inset-bottom, 0px)); background:#fff7ed; border-top:2px solid #f59e0b; box-shadow:0 -3px 14px rgba(0,0,0,.16); }
.emp-validate-bar button { width:100%; padding:.72rem; border:none; border-radius:11px; background:#f59e0b; color:#3a2600; font-weight:800; font-size:1rem; cursor:pointer; box-shadow:0 2px 6px rgba(245,158,11,.4); }
.emp-validate-bar button:active { background:#d97706; }
#screen-app.emp-view .emp-validate-bar.show { display:block; }   /* mobile + desktop */
@media (min-width:601px){ #screen-app.validate-bar-on .main-content { padding-bottom:74px; } }  /* desktop : place sous la barre */
.emp-ro { color:var(--muted); font-size:.8rem; }
/* #64 : mode « semaine type » — masquer publication/copie/correction (la semaine type ne se publie pas) */
#screen-app.type-mode #btn-publish,
#screen-app.type-mode #btn-corriger,
#screen-app.type-mode #btn-annuler-draft,
#screen-app.type-mode #btn-wa-share,
#screen-app.type-mode #badge-published,
#screen-app.type-mode .btn-copy,
#screen-app.type-mode #btn-semaine-type,
#screen-app.type-mode #btn-copy,
#screen-app.type-mode #btn-horaires-toggle,
#screen-app.type-mode #tab-dual { display:none !important; }
#screen-app.emp-view #tab-dual { display:none; }  /* « Les 2 » = outil manager, masqué pour le salarié */
/* Vue accueil (kiosque) : que la grille lecture seule + onglets de salle */
#screen-app.accueil-mode #manager-actions,
#screen-app.accueil-mode #emp-banner,
#screen-app.accueil-mode #memo-panel,
#screen-app.accueil-mode #btn-counters-toggle,
#screen-app.accueil-mode #tab-dual,
#screen-app.accueil-mode .btn-copy,
#screen-app.accueil-mode #btn-horaires-toggle { display:none !important; }
.site-tab .tab-short { display:none; }
.btn-emp-logout { background:none; border:none; color:var(--bam-green-dark); cursor:pointer; padding:0 .15rem; display:inline-flex; align-items:center; }
#screen-app.emp-view #btn-logout { display:none !important; }  /* salarié : logout déplacé dans le bandeau du haut */
@media (max-width: 600px) {
  /* Bandeau salarié compact : 1 ligne (nom + icône agenda) */
  .emp-banner .emp-sub, .emp-banner .emp-ro, .btn-ical .ical-label { display:none; }
  .emp-banner { padding:.4rem .7rem; }
  .btn-ical { padding:.3rem .55rem; font-size:1.05rem; }
  .btn-emp-full { display:inline-flex !important; align-items:center; }   /* #53b : bouton semaine entière (mobile salarié) */
  /* En-tête forcé sur 1 ligne : onglets « 73/74 » (sans logo), logo masqué */
  .site-tab .tab-long { display:none; }
  .site-tab .tab-short { display:inline; }
  .site-tabs { gap:2px; padding:2px; }
  #screen-app.emp-view #site-tabs { display:none; }  /* #88 : vue salarié mobile = agenda cross-salle → les onglets 73/74 n'ont plus de sens (ne filtraient pas, seul le libellé changeait) */
  .logo { display:none; }
  header { flex-wrap:nowrap; gap:.3rem; }
  #btn-counters-toggle { order:-1; padding:.25rem .4rem; }  /* ✓ remonté avant les onglets 73/74 */
  /* #53 : polices réduites → salle + semaine + 🎨 tiennent sur 1 seule ligne */
  .site-tab { font-size:.66rem !important; padding:.22rem .45rem !important; }
  .week-nav { gap:.15rem; }
  .week-nav button { padding:.2rem .35rem; font-size:.78rem; }
  .week-label { min-width:auto !important; font-size:.68rem !important; }
  /* Layout « app » : haut fixe + grille scrollable → ligne des jours collante au scroll */
  #screen-app.active { display:flex !important; flex-direction:column; height:100vh; height:100dvh; }
  .emp-banner, header { flex-shrink:0; }
  .main-content { min-height:0; }
  /* Haut masquable au scroll (le bandeau a un display:flex inline → !important) */
  #screen-app.top-hidden .emp-banner, #screen-app.top-hidden header { display:none !important; }
  /* Légende = bottom-sheet déclenché par un bouton flottant (!important : la règle par défaut display:none est plus bas dans le fichier) */
  #btn-legend { display:inline-flex !important; align-items:center; padding:.3rem .45rem; font-size:1rem; line-height:1; }
  #legend-bar { position:fixed; left:0; right:0; bottom:0; max-height:45vh; overflow:auto; background:var(--surface); border-top:2px solid var(--bam-green); transform:translateY(105%); transition:transform .2s; z-index:40; box-shadow:0 -4px 16px rgba(0,0,0,.18); padding:.6rem .8rem 1rem; }
  #legend-bar.legend-open { transform:translateY(0); }
  /* #53 : badges diff (NOUVEAU/MODIFIÉ) compacts en mobile salarié — le texte déborde des colonnes étroites */
  #screen-app.emp-view .diff-badge { font-size:0 !important; top:14px !important; right:0 !important; }
  /* badge "new" = pastille ronde vert lime, écriture manuscrite, penchée ~30° (#53) */
  #screen-app.emp-view .diff-new::after {
    content:'new'; display:inline-flex; align-items:center; justify-content:center;
    width:18px; height:18px; border-radius:50%;
    background:#c6ff00; color:#14331a !important; border:1.5px solid #14331a;
    font-family:'Bradley Hand','Segoe Script','Comic Sans MS',cursive; font-style:italic;
    font-size:.46rem; font-weight:700; line-height:1; text-transform:lowercase;
    transform:rotate(-30deg); box-shadow:0 1px 3px rgba(0,0,0,.45);
  }
  /* le voile "non confirmé" désature tout le créneau → on ré-sature la pastille pour garder le lime */
  /* salarié : voile = calque blanc (overlay) au lieu d'un filtre qui grise tout → la pastille reste vive */
  #screen-app.emp-view .cell-shift.voile { filter:none !important; }
  #screen-app.emp-view .cell-shift.voile::before { content:''; position:absolute; inset:0; background:rgba(250,252,250,.55); pointer-events:none; z-index:1; }
  #screen-app.emp-view .cell-initial { z-index:2; }
  #screen-app.emp-view .diff-badge { z-index:3 !important; }
  #screen-app.emp-view .diff-mod::after { content:'M'; font-size:.66rem; font-weight:900; text-shadow:0 0 2px rgba(0,0,0,.75); }
  /* #53 : lettre du salarié lisible malgré les lignes courtes (sinon rognée) */
  #screen-app.emp-view .cell-initial { line-height:1 !important; overflow:visible !important; font-size:.62rem; }
  /* #53 : 2 vues (L/M/M/J · V/S/D) → la grille remplit la largeur, colonne d'heures au mini, jours élargis */
  #screen-app.emp-view .planning-grid { min-width:0 !important; width:100%; table-layout:fixed; }
  #screen-app.emp-view .col-time, #screen-app.emp-view .col-time-body, #screen-app.emp-view .col-time-right { min-width:30px !important; width:30px; padding:0 1px; }
  #screen-app.emp-view .slot-time-label { font-size:.58rem; }
  #screen-app.emp-view .th-day { font-size:.74rem; line-height:1.1; }
  #screen-app.emp-view .th-day small { font-size:.66rem; }
}
.btn-counters-toggle { display:none; background:var(--surface-3); color:var(--muted); font-size:.85rem; padding:.3rem .6rem; border-radius:var(--radius); border:1px solid var(--border); }

/* ── #90 : bandeau « nouvelle version déployée » (cuivre DA Dousse, jamais de reload auto) ── */
.update-banner { position:fixed; top:0; left:0; right:0; z-index:9999; display:flex; align-items:center; justify-content:center; gap:.9rem; padding:.5rem 1rem; font-size:.85rem; font-weight:700; color:#fff; background:#A66B33; box-shadow:0 2px 12px rgba(0,0,0,.28); }
.update-banner button { background:#fff; color:#A66B33; border:none; border-radius:6px; padding:.32rem .85rem; font-weight:800; font-size:.82rem; cursor:pointer; }

/* ── #71 : vue salarié mobile (agenda « Ma semaine » + frise « L'équipe ») ── */
#emp-mobile { display:none; flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; background:var(--surface-2); }
.emob-tabs { display:flex; position:sticky; top:0; z-index:3; background:var(--surface); border-bottom:1px solid var(--border); }
.emob-tab { flex:1; padding:.75rem 0; font-size:.9rem; font-weight:600; color:var(--muted); background:none; border:none; border-bottom:2px solid transparent; border-radius:0; }
.emob-tab.on { color:var(--bam-green); border-bottom-color:var(--bam-green); }
.emob-head { display:flex; align-items:center; justify-content:space-between; gap:.6rem; padding:.9rem 1rem .6rem; }
.emob-name { font-weight:800; font-size:1.02rem; letter-spacing:-.01em; }
.emob-salle { font-size:.78rem; color:var(--muted); margin-top:1px; }
.emob-pill { font-size:.72rem; font-weight:700; padding:.28rem .65rem; border-radius:20px; white-space:nowrap; }
.emob-pill.ok { background:var(--success-light); color:var(--success); }
.emob-pill.warn { background:var(--warning-light); color:var(--warning); }
.emob-list { padding:0 .85rem 1rem; }
.emob-day { display:flex; gap:.75rem; padding:.55rem 0; border-top:1px solid var(--border); }
.emob-day:first-child { border-top:none; }
.emob-daycol { width:40px; text-align:center; flex-shrink:0; padding-top:.15rem; }
.emob-dow { display:block; font-size:.66rem; color:var(--muted); text-transform:uppercase; letter-spacing:.03em; }
.emob-num { display:block; font-size:1.15rem; font-weight:700; color:var(--text-2); line-height:1.1; }
.emob-daycol.today .emob-num { color:var(--bam-green); }
.emob-daybody { flex:1; display:flex; flex-direction:column; gap:.4rem; justify-content:center; min-width:0; }
.emob-card { background:var(--bam-green-light); border-radius:11px; padding:.6rem .75rem; display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.emob-card-h { font-size:.94rem; font-weight:700; color:var(--bam73-dark); }
.emob-card-sub { font-size:.76rem; color:var(--bam-green-dark); margin-top:1px; }
.emob-card-dur { font-size:.78rem; color:var(--bam-green-dark); font-weight:700; white-space:nowrap; }
.emob-abs { background:var(--surface-3); border-radius:11px; padding:.55rem .7rem; font-size:.86rem; font-weight:600; color:var(--text-2); }
.emob-repos { font-size:.82rem; color:var(--muted-light); padding:.3rem 0; }
.emob-foot { position:sticky; bottom:0; background:var(--surface); border-top:1px solid var(--border); padding:.7rem 1rem; display:flex; align-items:center; gap:.8rem; }
.emob-foot-l { font-size:.72rem; color:var(--muted); }
.emob-foot-v { font-size:1.05rem; font-weight:800; }
.emob-cta { margin-left:auto; background:var(--bam-green); color:#fff; font-weight:700; font-size:.85rem; padding:.6rem .95rem; border-radius:11px; box-shadow:0 2px 8px rgba(64,176,48,.35); }
.emob-cta-wrap { margin-left:auto; display:flex; flex-direction:column; align-items:flex-end; gap:.35rem; }  /* #88 : Confirmer + Signaler un souci */
.emob-cta-wrap .emob-cta { margin-left:0; }
.emob-review { background:none; border:none; color:var(--muted); font-size:.75rem; font-weight:600; text-decoration:underline; padding:.15rem .3rem; cursor:pointer; }
.emob-days { display:flex; gap:4px; padding:.75rem .7rem .3rem; justify-content:space-between; }
.emob-pillday { flex:1; padding:.4rem 0; border-radius:10px; background:var(--surface-3); border:1px solid var(--border); text-align:center; color:var(--muted); }
.emob-pillday span { display:block; font-size:.58rem; text-transform:uppercase; letter-spacing:.02em; }
.emob-pillday b { display:block; font-size:.86rem; color:var(--text-2); margin-top:1px; }
.emob-pillday.on { background:var(--bam-green); border-color:var(--bam-green); }
.emob-pillday.on span, .emob-pillday.on b { color:#fff; }
.emob-team { padding:.3rem .9rem 1.5rem; display:flex; flex-direction:column; gap:.5rem; }
.emob-trow { display:flex; align-items:center; gap:.5rem; }
.emob-arow { margin-bottom:-.15rem; }
.emob-tname { width:78px; flex-shrink:0; font-size:.78rem; font-weight:600; display:flex; align-items:center; gap:5px; overflow:hidden; }
.emob-trow.me .emob-tname { color:var(--bam-green); }
.emob-tname em { color:var(--muted); font-style:normal; font-size:.66rem; white-space:nowrap; }
.emob-dot { width:9px; height:9px; border-radius:50%; flex-shrink:0; }
.emob-axis { position:relative; flex:1; height:12px; }
.emob-axis span { position:absolute; transform:translateX(-50%); top:0; font-size:.62rem; color:var(--muted-light); }
.emob-track { position:relative; flex:1; height:30px; background:var(--surface-3); border-radius:8px; }
.emob-bar { position:absolute; top:2px; bottom:2px; border-radius:6px; display:flex; align-items:center; padding:0 6px; overflow:hidden; min-width:8px; }
.emob-bar span { font-size:.67rem; font-weight:700; white-space:nowrap; }
.emob-empty { padding:1.4rem; text-align:center; color:var(--muted); font-size:.86rem; }
/* « Ma semaine » en frise (ligne/jour, barres à la couleur du salarié) */
.emob-mine { padding:.3rem .9rem 1rem; display:flex; flex-direction:column; gap:.5rem; }
.emob-mine .emob-daycol { width:38px; padding-top:0; }
.emob-mine .emob-num { font-size:1rem; }
.emob-rest { position:absolute; left:10px; top:50%; transform:translateY(-50%); font-size:.72rem; color:var(--muted-light); }
.emob-bar-abs span { color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.45); }
/* #71 fix : déclaration d'heure sup dans l'agenda */
.emob-hint { font-size:.72rem; color:var(--muted); padding:.35rem .9rem 0; display:flex; align-items:center; gap:.25rem; }
.emob-hint .ic { color:var(--warning); }
.emob-hs { flex-shrink:0; font-size:.68rem; font-weight:700; white-space:nowrap; }
.emob-hs.pending { color:var(--warning); }
.emob-hs.validated { color:var(--success); }
.emob-hs-add { flex-shrink:0; background:none; border:1px solid var(--border); border-radius:8px; padding:.28rem .34rem; color:var(--warning); line-height:0; }
.emob-hs-add:hover { background:var(--warning-light); border-color:#fcd34d; }
/* #71 : légende salle (barres colorées par salle Chambéry/Annecy) */
.emob-legend { display:flex; gap:1rem; padding:.35rem .9rem .1rem; }
.emob-lg { display:inline-flex; align-items:center; gap:.3rem; font-size:.7rem; color:var(--muted); font-weight:600; }
.emob-lg-dot { width:11px; height:11px; border-radius:3px; }
.emob-lg-ring { width:12px; height:12px; border-radius:4px; border:2px solid; background:var(--surface); }
.emob-thead { padding:.5rem .9rem .2rem; font-size:.8rem; color:var(--muted); }
.emob-thead-salle { font-weight:800; color:var(--text-2); }

/* ── Layout principal ── */
.main-content { display:flex; flex:1; overflow:hidden; }
.grid-wrapper  { flex:1; overflow:auto; padding:.75rem; }

/* ── Panneau compteurs ── */
.counters-panel {
  width: 196px; min-width: 196px; overflow-y: auto;
  background: var(--surface); border-left: 1px solid var(--border);
  padding: .6rem .65rem; font-size: .78rem;
  transition: transform var(--t);
}
.memo-panel {
  width: 240px; min-width: 240px; display: flex; flex-direction: column;
  background: var(--surface); border-left: 1px solid var(--border);
  padding: .6rem .65rem;
}
.memo-head { font-weight:700; font-size:.72rem; color:var(--muted-light); margin-bottom:.5rem; text-transform:uppercase; letter-spacing:.06em; }
.memo-panel textarea {
  flex: 1; width: 100%; resize: none; box-sizing: border-box;
  border: 1px solid var(--border); border-radius: 6px;
  padding: .55rem .6rem; font: inherit; font-size: .82rem; line-height: 1.4;
  background: #fffef7; color: var(--text); min-height: 220px;
}
.memo-panel textarea:focus { outline: none; border-color: var(--accent, #1565C0); }
.memo-status { font-size:.7rem; color:var(--muted-light); margin-top:.35rem; min-height:1em; }
.counters-title { font-weight:700; font-size:.72rem; color:var(--muted-light); margin-bottom:.6rem; text-transform:uppercase; letter-spacing:.06em; display:flex; align-items:center; gap:.4rem; }
.counter-emp { margin-bottom:.6rem; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius); padding:.5rem .6rem; transition:box-shadow var(--t); }
.counter-emp:hover { box-shadow:var(--shadow-sm); }
.counter-emp.has-conflict { border-color:var(--warning); background:var(--warning-light); }
.counter-name { display:flex; align-items:center; gap:.35rem; font-weight:700; margin-bottom:.3rem; font-size:.8rem; }
.counter-row  { display:flex; justify-content:space-between; color:var(--muted); margin:.1rem 0; font-size:.76rem; }
.counter-row b { color: var(--text-2); font-weight:600; }
.counter-total { display:flex; justify-content:space-between; border-top:1px solid var(--border); margin-top:.35rem; padding-top:.3rem; font-weight:600; font-size:.76rem; }
.counter-bar { height:4px; border-radius:3px; background:var(--surface-3); margin:.3rem 0 .2rem; overflow:hidden; }
.counter-bar-fill { height:100%; border-radius:3px; transition:width .5s cubic-bezier(.4,0,.2,1); }
.counter-conflict { font-size:.71rem; color:var(--warning); font-weight:700; margin-top:.3rem; display:flex; align-items:center; gap:.25rem; }
/* #100 — badge solde d'annualisation à date (bas-droite de la carte compteur, manager) */
.counter-annu-wrap { display:inline-flex; align-items:center; gap:.25rem; font-weight:400; font-size:.68rem; color:var(--muted); cursor:pointer; border-radius:6px; padding:0 .1rem; transition:background .12s; }
.counter-annu-wrap:hover { background:var(--surface-3); }
.counter-annu-wrap:focus-visible { outline:2px solid var(--copper, #A66B33); outline-offset:1px; }
/* #104 : drill-down depuis le tableau global → Suivi (ligne cliquable) */
.annu-global-name-click { cursor:pointer; }
.annu-global-name-click:hover { background:var(--surface-3) !important; text-decoration:underline; }
.annu-global-name-click:focus-visible { outline:2px solid var(--copper, #A66B33); outline-offset:-2px; }
/* #104 : accès rapide au prévisionnel (barre du haut du Suivi, fiche + modale) */
.annu-suivi-top { display:flex; align-items:center; gap:.5rem; margin-bottom:.6rem; }
.annu-suivi-spacer { flex:1; }
.annu-link-prev { display:inline-flex; align-items:center; gap:.35rem; font:inherit; font-size:.78rem; font-weight:600; padding:.32rem .6rem; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); color:var(--text); cursor:pointer; }
.annu-link-prev:hover { background:var(--bg); border-color:var(--muted); }
.annu-link-prev .ic { width:14px; height:14px; }
/* #104 : modale de consultation du Suivi (drill-down) — plus étroite que le grand tableau */
.modal.modal-suivi { width:min(94vw, 860px); max-height:92vh; padding:1.1rem 1.3rem; }
/* #107 : panneau Nouveautés (changelog in-app) */
.modal.modal-changelog { width:min(94vw, 480px); }
.cl-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:.5rem; }
.cl-head h3 { margin:0; font-size:1.15rem; font-weight:800; letter-spacing:-.02em; }
.cl-entry { margin-bottom:.9rem; }
.cl-entry-head { display:flex; align-items:baseline; gap:.5rem; margin-bottom:.4rem; }
.cl-titre { font-size:.8rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:var(--copper, #A66B33); }
.cl-date { font-size:.72rem; color:var(--muted); }
.cl-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.55rem; }
.cl-list li { display:flex; gap:.6rem; align-items:flex-start; }
.cl-emoji { font-size:1.1rem; line-height:1.3; flex-shrink:0; }
.cl-txt { display:flex; flex-direction:column; gap:.1rem; }
.cl-txt b { font-size:.9rem; font-weight:700; }
.cl-txt span { font-size:.82rem; color:var(--muted); line-height:1.35; }
.cl-foot { margin-top:1rem; }
.counter-annu-corr { color:var(--warning); font-size:.72rem; }
.counter-annu { font-size:.7rem; font-weight:700; border-radius:999px; padding:.05rem .5rem; }
.counter-annu.a_jour { background:var(--surface-3); color:var(--muted); }
.counter-annu.retard { background:var(--danger-light); color:var(--danger); }
.counter-annu.avance { background:var(--success-light); color:var(--success); }
.counters-backdrop { display:none; position:fixed; inset:0; background:rgba(0,0,0,.35); z-index:49; backdrop-filter:blur(2px); }

/* ── Toggle Horaires d'ouverture ── */
.toggle-horaires { display:inline-flex; align-items:center; gap:.45rem; cursor:pointer; font-size:.82rem; font-weight:700; color:var(--muted); user-select:none; padding:.1rem 0; }
.toggle-track { display:inline-flex; align-items:center; width:34px; height:20px; background:var(--border); border-radius:10px; padding:2px; transition:background var(--t); flex-shrink:0; }
.toggle-thumb { width:16px; height:16px; background:#fff; border-radius:50%; transition:transform var(--t); box-shadow:0 1px 3px rgba(0,0,0,.3); }
.toggle-horaires.active .toggle-track { background:#7c3aed; }
.toggle-horaires.active .toggle-thumb { transform:translateX(14px); }
.toggle-horaires.active { color:#7c3aed; }

/* ── Boîte à idées ── */
.btn-idea { background:var(--surface-3); border:1px solid var(--border); color:var(--muted); font-size:.8rem; font-weight:700; padding:.28rem .6rem; border-radius:var(--radius); cursor:pointer; display:inline-flex; align-items:center; gap:.3rem; transition:background var(--t),color var(--t); }
.btn-idea:hover { background:#fef9c3; color:#92400e; border-color:#fde68a; }
.idea-type-row { display:flex; gap:.5rem; margin-bottom:.85rem; }
.idea-type-btn { flex:1; padding:.4rem .5rem; border:2px solid var(--border); border-radius:var(--radius); background:var(--surface-2); font-size:.82rem; font-weight:700; cursor:pointer; text-align:center; transition:all var(--t); }
.idea-type-btn.selected-bug { border-color:#ef4444; background:#fef2f2; color:#b91c1c; }
.idea-type-btn.selected-evo { border-color:#3b82f6; background:#eff6ff; color:#1d4ed8; }
.idea-prio-row { display:flex; gap:.5rem; margin-bottom:.85rem; }
.idea-prio-btn { flex:1; padding:.35rem .4rem; border:2px solid var(--border); border-radius:var(--radius); background:var(--surface-2); font-size:.78rem; font-weight:700; cursor:pointer; text-align:center; transition:all var(--t); }
.idea-prio-btn.sel-bloquant { border-color:#ef4444; background:#fef2f2; color:#b91c1c; }
.idea-prio-btn.sel-majeur   { border-color:#f97316; background:#fff7ed; color:#c2410c; }
.idea-prio-btn.sel-mineur   { border-color:#22c55e; background:#f0fdf4; color:#15803d; }
.idea-meta { background:var(--surface-2); border-radius:var(--radius); padding:.5rem .7rem; font-size:.72rem; color:var(--muted); line-height:1.7; margin-bottom:.85rem; border:1px solid var(--border); }
.idea-meta span { color:var(--text-2); font-weight:600; }

/* Quand le mode horaires est actif : shifts grisés, curseur crosshair */
.planning-grid.horaires-mode .cell-shift { opacity:.2 !important; filter:grayscale(90%) !important; pointer-events:none !important; }
/* Shifts à l'intérieur d'un horaire : restent cliquables pour éditer l'horaire */
.planning-grid.horaires-mode .cell-shift.cell-hor { pointer-events:auto !important; cursor:pointer !important; opacity:.25 !important; }
.planning-grid.horaires-mode .cell-empty { cursor:crosshair !important; }

/* Cellule dans un bloc horaire */
.cell-hor { position:relative; }
.cell-hor.hor-s { border-top:3px solid var(--hor-color,#7c3aed) !important; }
.cell-hor.hor-e { border-bottom:3px solid var(--hor-color,#7c3aed) !important; }
/* Horaires discrets en mode shift (pas horaires-mode) */
.planning-grid:not(.horaires-mode) .cell-hor.hor-s { border-top-width:2px !important; }
.planning-grid:not(.horaires-mode) .cell-hor.hor-e { border-bottom-width:2px !important; }
/* En mode horaires : overlay pour renforcer la couleur du fond des cellules vides */
.planning-grid.horaires-mode .cell-empty.cell-hor::before {
  content:''; position:absolute; inset:0;
  background:var(--hor-color,#7c3aed); opacity:.14; pointer-events:none;
}
/* Note de l'horaire affichée en haut du bloc */
.hor-note-label {
  position:absolute; top:2px; left:3px; right:0;
  font-size:.6rem; font-weight:800; color:var(--hor-color,#7c3aed);
  white-space:nowrap; overflow:visible; pointer-events:none; z-index:4; line-height:1;
  text-shadow:0 0 3px rgba(255,255,255,.95), 0 0 6px rgba(255,255,255,.8);
}

/* Poignées de resize horaire (col 1 only) */
.hor-handle {
  position:absolute; left:0; right:0; height:6px;
  cursor:ns-resize; z-index:6; border-radius:3px;
  background:var(--hor-color,#7c3aed); opacity:0; transition:opacity .12s;
}
.hor-handle.hor-handle-top { top:0; }
.hor-handle.hor-handle-bot { bottom:0; }
.cell-hor:hover .hor-handle { opacity:.75; }

/* Preview drag horaire */
.cell-hor-preview { background:rgba(124,58,237,.12) !important; cursor:crosshair !important; }
.cell-hor-preview.hor-p-s { border-top:2px dashed #7c3aed !important; }
.cell-hor-preview.hor-p-e { border-bottom:2px dashed #7c3aed !important; }

/* Preview resize horaire */
.cell-hor-resize-preview { background:rgba(124,58,237,.18) !important; }
.cell-hor-resize-preview.hor-r-add { outline:1px solid rgba(124,58,237,.5); }
.cell-hor-resize-preview.hor-r-rm  { opacity:.25 !important; }

/* ── Bande notes du jour ── */
.row-notes td { background: #fffde7; border-bottom: 1px solid #f9e68a !important; }
.cell-note {
  padding: 2px 5px !important; vertical-align: middle;
  border: 1px solid #f9e68a !important; min-height: 20px;
  cursor: default; transition: background .12s;
}
.cell-note.editable { cursor: pointer; }
.cell-note.editable:hover { background: #fff9c4; }
.note-text { font-size: .7rem; color: #7a5c00; white-space: pre-wrap; line-height: 1.4; min-height: 16px; }
.note-placeholder { color: #d4c47a; font-size: .75rem; font-weight: 400; }

/* ── Bande absences (style Google Calendar) ── */
.row-absences td { border-bottom: 1px solid var(--border) !important; }
.cell-abs-day { padding: 2px 3px !important; vertical-align: middle; border: 1px solid var(--border) !important; min-height: 22px; }
.abs-chips-wrap { display:flex; flex-wrap:wrap; gap:2px; min-height:18px; }
.abs-chip {
  display:inline-flex; align-items:center;
  font-size:.67rem; font-weight:700; padding:1px 5px;
  border-radius:3px; white-space:nowrap;
  border-left-width: 4px !important; border-left-style: solid !important;
  cursor: pointer; line-height: 1.5;
}
.abs-chip:hover { filter: brightness(.93); }

/* ── Planning table ── */
.planning-grid {
  border-collapse: collapse;
  background: #fff;
  box-shadow: var(--shadow);
  border-radius: 8px;
  overflow: hidden;
  font-size: .78rem;
  white-space: nowrap;
}

/* Sticky time column */
.planning-grid .col-time {
  position: sticky; left: 0; z-index: 2;
  background: var(--surface-3); border: 1px solid var(--border);
  padding: .15rem .25rem; font-size: .72rem; color: var(--muted-light);
  min-width: 40px; text-align: right; font-variant-numeric: tabular-nums;
}
/* Sticky header */
.planning-grid thead tr:first-child th { position: sticky; top: 0; z-index: 3; }
.planning-grid thead .col-time { z-index: 4; }

/* Day header */
.th-day {
  border: 1px solid var(--border); padding: .3rem .4rem;
  font-size: .8rem; font-weight: 700; text-align: center;
  background: var(--surface-2);
}
.th-day.today-day { background: var(--bam-green-light); color: var(--bam-green-dark); border-bottom: 2px solid var(--bam-green) !important; }
.th-day small { font-weight: 400; font-size: .7rem; color: var(--muted); }

/* Employee header cell */
.th-emp {
  border: 1px solid var(--border); padding: .25rem .2rem;
  font-weight: 700; font-size: .85rem; text-align: center;
  min-width: 32px; width: 32px;
  cursor: default; letter-spacing: -.5px;
  background: var(--surface-2);
}

/* Zone separator within a day */
.th-emp.zone-sep { border-left: 2px solid var(--border-2); }
.td-zone-sep { border-left: 2px solid var(--border-2) !important; }

/* Séparateur de jour (1ère col de chaque jour sauf jour 0) — #50 : nettement plus marqué */
.day-sep { border-left: 4px solid var(--muted) !important; }
th.day-sep { border-left: 4px solid var(--muted) !important; }

/* Colonne heure droite (sticky right) */
.col-time-right {
  position: sticky; right: 0; z-index: 2;
  background: var(--surface-3);
  border-left: 1px solid var(--border); border-right: 1px solid var(--border);
  border-top: 1px solid #eef1f5; border-bottom: none;
  padding: 0 .25rem; font-size: .72rem; color: var(--muted-light);
  min-width: 38px; text-align: left; font-variant-numeric: tabular-nums; overflow: visible;
}
thead th.col-time-right { z-index: 4; }

/* Tooltip drag en temps réel */
#drag-tooltip {
  display: none; position: fixed; z-index: 9999; pointer-events: none;
  background: #1e293b; color: #fff; padding: 4px 10px;
  border-radius: 6px; font-size: .78rem; font-weight: 700;
  box-shadow: 0 3px 10px rgba(0,0,0,.3); white-space: nowrap;
  border: 1px solid rgba(255,255,255,.1);
}

/* Body cells */
.planning-grid td.col-time-body {
  position: sticky; left: 0; z-index: 1;
  background: var(--surface-3);
  border-left: 1px solid var(--border); border-right: 1px solid var(--border);
  border-top: 1px solid #eef1f5; border-bottom: none;
  padding: 0 .4rem; font-size: .7rem; color: var(--muted-light);
  text-align: right; overflow: visible;
}
/* Libellé d'heure : hors-flux, centré PILE sur le trait (n'agrandit aucune ligne) */
.slot-time-label {
  position: absolute; top: 0; transform: translateY(-50%);
  font-size: .7rem; line-height: 1; color: var(--muted-light);
  background: var(--surface-3); padding: 0 3px; pointer-events: none; z-index: 2;
}
.col-time-body .slot-time-label { right: 3px; }
.col-time-right .slot-time-label { left: 3px; }

/* Shift cell (filled) */
.cell-shift {
  border: 1px solid var(--border) !important;
  border-top: none !important;
  border-bottom: none !important;
  text-align: center;
  padding: 0 !important;
  height: var(--slot-h, 9px);
  cursor: pointer;
  position: relative;
}
.cell-shift:hover { filter: brightness(.92); }
.cell-shift.shift-start { border-top: 2px solid var(--shift-color, #666) !important; }
.cell-shift.shift-end   { border-bottom: 2px solid var(--shift-color, #666) !important; }
/* Cadre diff vue employé : encadre TOUT le shift dans la couleur du shift assombrie */
.cell-shift.cell-diff              { border-left: 3px solid var(--diff-color, #444); border-right: 3px solid var(--diff-color, #444); }
.cell-shift.cell-diff.shift-start  { border-top: 3px solid var(--diff-color, #444) !important; }
.cell-shift.cell-diff.shift-end    { border-bottom: 3px solid var(--diff-color, #444) !important; }
.cell-initial { position: absolute; top: 0; left: 0; right: 0; text-align: center; font-size: .7rem; font-weight: 800; line-height: var(--slot-h, 9px); pointer-events: none; overflow: hidden; }
.cell-badge {
  position: absolute; top: 1px; right: 1px;
  font-size: .55rem; background: rgba(0,0,0,.18); border-radius: 2px;
  padding: 0 2px; color: #fff; line-height: 1.3;
}

/* Empty cell — grille 10 min : lignes intermédiaires discrètes, repères marqués aux :00/:30 */
.cell-empty {
  border-left: 1px solid var(--border) !important;
  border-right: 1px solid var(--border) !important;
  border-top: 1px solid #eef1f5 !important;
  border-bottom: none !important;
  height: var(--slot-h, 9px);
  cursor: pointer;
  position: relative;
}
.planning-grid tr.slot-hour td.cell-empty, .planning-grid tr.slot-hour td.col-time-body, .planning-grid tr.slot-hour td.col-time-right { border-top: 1px solid #99a4b0 !important; }
.planning-grid tr.slot-half td.cell-empty, .planning-grid tr.slot-half td.col-time-body, .planning-grid tr.slot-half td.col-time-right { border-top: 1px solid #c0c9d3 !important; }
.cell-empty:hover { background: var(--bam-green-light) !important; }
.cell-readonly { cursor: default !important; }
.cell-readonly:hover { background: inherit !important; }

/* ── Drag-to-create (Google Calendar style) ── */
.planning-grid { user-select: none; }
.cell-drag-preview {
  background: rgba(64,176,48,.15) !important;
  outline: 1px solid rgba(64,176,48,.4);
  position: relative; z-index: 1;
}
.cell-drag-preview.drag-first { border-top: 2px solid var(--bam-green) !important; }
.cell-drag-preview.drag-last  { border-bottom: 2px solid var(--bam-green) !important; }

/* ── Drag-to-resize (Google Calendar style) ── */
.shift-resize-handle {
  position: absolute; left: 0; right: 0; height: 6px;
  cursor: ns-resize; z-index: 3; border-radius: 2px;
  opacity: 0; transition: opacity .12s ease;
}
.shift-resize-top    { top: 0; }
.shift-resize-bottom { bottom: 0; }
.cell-shift:hover .shift-resize-handle { opacity: 1; }
.shift-resize-handle:hover { background: rgba(0,0,0,.28); }
.resize-preview-add {
  background: rgba(21,101,192,.2) !important;
  outline: 1px dashed rgba(21,101,192,.55);
  position: relative; z-index: 1;
}
.resize-preview-remove { opacity: .25 !important; }

/* ── Drag & Drop ── */
.cell-shift[draggable="true"] { cursor: grab; }
.cell-shift[draggable="true"]:active { cursor: grabbing; }
.cell-shift.shift-drag-src { opacity: .25; }  /* pas de pointer-events:none : sinon le dragover ne trouve plus la cellule en glissant sur le bloc lui-meme (bloque le deplacement vers le bas) */
.drag-over {
  background: #BBDEFB !important;
  border-left: 2px dashed #1565C0 !important;
  border-right: 2px dashed #1565C0 !important;
  position: relative; z-index: 1;
}
.drag-over.drag-over-start { border-top: 2px dashed #1565C0 !important; }
.drag-over.drag-over-end   { border-bottom: 2px dashed #1565C0 !important; }
/* ── Vue duale « Les 2 salles » (lecture seule, compacte) ── */
#planning-dual { display:none; overflow-x:auto; }
#screen-app.dual-mode #grid-single,
#screen-app.dual-mode #memo-panel { display:none !important; }
/* #76 : les compteurs (cross-salle) restent visibles en vue « 2 salles » */
#screen-app.dual-mode #planning-dual { display:block; }
#screen-app.dual-mode .btn-copy,
#screen-app.dual-mode #btn-horaires-toggle,
#screen-app.dual-mode #btn-publish,
#screen-app.dual-mode #btn-corriger,
#screen-app.dual-mode #btn-wa-share,
#screen-app.dual-mode #btn-annuler-draft { display:none !important; }
.site-tab.active-dual { background:#475569; color:#fff; font-weight:700; }
.dual-grid { border-collapse:collapse; font-variant-numeric:tabular-nums; }
.dual-grid th, .dual-grid td { border:1px solid var(--border); }
.dual-grid .dual-salle { background:var(--surface-3); font-size:.78rem; font-weight:800; color:var(--text-2); padding:3px 0; text-align:center; }
.dual-grid .dual-salle.dual-salle-a { background:var(--bam73); color:#fff; }            /* Chambéry = vert */
.dual-grid .dual-salle.dual-salle-b { background:#7c3aed; color:#fff; }                  /* Annecy = violet */
.dual-grid th.dual-day.dual-a { background:var(--bam73-light); }
.dual-grid th.dual-day.dual-b { background:#f1ecfd; }
.dual-grid td.dual-empty { background:#fff; }                                            /* cases vides : blanc */
.dual-grid .dual-sep { border-left:2px solid #cfd6dd; border-right:2px solid #cfd6dd; }
.dual-grid .dual-day { background:var(--surface-2); font-size:.66rem; font-weight:700; color:var(--muted); padding:1px 0; text-align:center; }
.dual-grid td.dual-time, .dual-grid th.dual-time { position:sticky; left:0; z-index:2; background:var(--surface-3); min-width:44px; width:44px; text-align:right; padding-right:3px; font-size:.66rem; color:var(--muted); }
.dual-grid .dual-sep { min-width:10px; width:10px; background:var(--surface-2); border-top:none; border-bottom:none; }
.dual-grid td.dual-cell, .dual-grid td.dual-empty { min-width:24px; width:24px; height:9px; padding:0; position:relative; }
/* #70 : créneaux en blocs comme la grille mono (bordures haut/bas à la couleur du salarié) */
.dual-grid td.dual-cell { border-top:none !important; border-bottom:none !important; }
.dual-grid td.dual-cell.shift-start { border-top:2px solid var(--shift-color,#666) !important; }
.dual-grid td.dual-cell.shift-end   { border-bottom:2px solid var(--shift-color,#666) !important; }
.dual-grid .dual-init { position:absolute; top:0; left:0; right:0; text-align:center; font-size:.68rem; font-weight:800; line-height:9px; pointer-events:none; }
.dual-grid td.dual-conflict { outline:2px solid #dc2626; outline-offset:-2px; z-index:1; }
.dual-grid td.dual-cell.day-sep, .dual-grid td.dual-empty.day-sep { border-left:3px solid var(--muted); }
.dual-grid tr.slot-hour td { border-top:1px solid #99a4b0; }
.dual-grid tr.slot-half td { border-top:1px solid #c0c9d3; }
.dual-grid td.dual-cell[draggable="true"] { cursor:grab; }
.dual-grid td.dual-drop { background:#BBDEFB !important; border-left:2px dashed #1565C0 !important; border-right:2px dashed #1565C0 !important; }
.dual-grid td.dual-drop.dual-drop-s { border-top:2px dashed #1565C0 !important; }
.dual-grid td.dual-drop.dual-drop-e { border-bottom:2px dashed #1565C0 !important; }
.dual-grid .dual-abs-row td { background:#fffaf0; vertical-align:top; padding:1px; }
.dual-grid td.dual-abs-cell { text-align:center; line-height:1; }
.dual-abs-chip { display:inline-block; font-size:.54rem; font-weight:700; padding:0 2px; margin:1px; border:1px solid #999; border-radius:3px; line-height:1.35; color:#333; opacity:.9; white-space:nowrap; }
/* #72 : vue « 2 salles » = 2 vraies grilles mono côte à côte (scroll horizontal) */
.dual2-wrap { display:flex; gap:20px; overflow-x:auto; padding:.5rem .5rem 1rem; align-items:flex-start; }
.dual2-col { flex:0 0 auto; }
.dual2-title { font-size:.85rem; font-weight:800; color:#fff; padding:.3rem .7rem; border-radius:8px 8px 0 0; display:flex; align-items:center; gap:.35rem; }
.dual2-title.dual2-a { background:var(--bam73); }
.dual2-title.dual2-b { background:#7c3aed; }
.dual2-title .ico-tr { color:#fff; }
/* chunk 3 (#76) : notes du jour + horaires cliquables en duale ; absences restent non interactives */
.dual2-grid .cell-abs-day { pointer-events:none; }

/* ── Extend grid buttons ── */
.row-extend-ctrl td { border: none; }
.btn-extend {
  padding: 0 5px; line-height: 1.6; font-size: .72rem; font-weight: 700;
  background: #E3F2FD; color: #1565C0;
  border: 1px solid #90CAF9; border-radius: 3px;
}
.btn-extend:hover { background: #BBDEFB; }
.btn-extend-rm { background: #FFF3E0; color: #E65100; border-color: #FFCC80; }
.btn-extend-rm:hover { background: #FFE0B2; }

/* Séparateur de jour dans les cellules de shift (spécificité 2 classes) */
.cell-shift.day-sep, .cell-empty.day-sep { border-left: 4px solid var(--muted) !important; }

/* Totals */
.row-total td {
  font-size: .72rem; font-weight: 700; text-align: center;
  border: 1px solid var(--border); padding: .2rem .1rem;
  background: #f9f9f9;
}
.row-total td.col-time-body { font-size: .7rem; color: var(--muted); }
.total-val { font-weight: 700; }
.total-zero { color: #ccc; }
/* Ligne totaux par jour */
.row-day-total td { background: var(--bam-green-light); }
.total-day { font-weight: 800; color: var(--bam-green-dark); font-size: .8rem; }
.total-week { font-weight: 800; color: var(--bam-green-dark); font-size: .8rem; }

/* Legend */
.legend { padding: .4rem .75rem .75rem; display:flex; gap:.5rem; flex-wrap:wrap; font-size:.75rem; color:var(--muted); align-items:center; }
.leg-dot { display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:.2rem; }
#btn-legend { display:none; }
.leg-refact { font-size:.75rem; }

/* ── Modal ── */
.modal-overlay { display:none; position:fixed; inset:0; background:rgba(15,23,42,.5); backdrop-filter:blur(4px); z-index:100; align-items:center; justify-content:center; }
.modal-overlay.open { display:flex; animation:fadeIn .15s ease; }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
.modal { background:var(--surface); border-radius:var(--radius-xl); box-shadow:var(--shadow-lg); padding:1.5rem; width:390px; max-width:95vw; max-height:90vh; overflow-y:auto; animation:slideUp .2s cubic-bezier(.34,1.56,.64,1); }
@keyframes slideUp { from { transform:translateY(16px) scale(.97); opacity:0; } to { transform:none; opacity:1; } }
.modal h3 { margin-bottom:1rem; font-size:1.05rem; font-weight:700; letter-spacing:-.02em; }
.form-row { margin-bottom:.85rem; }
.form-row label { display:block; font-size:.8rem; font-weight:600; margin-bottom:.3rem; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.form-row-2 { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-bottom:.85rem; }
.modal-actions { display:flex; gap:.5rem; margin-top:1.25rem; justify-content:flex-end; }
.btn-save { background:var(--bam73); color:#fff; font-weight:700; padding:.45rem .9rem; }
.btn-save:hover { background:var(--bam73-dark); }
.btn-delete { background:var(--danger-light); color:var(--danger); margin-right:auto; font-weight:600; }
.btn-delete:hover { background:#fecaca; }
.btn-cancel { background:var(--surface-3); color:var(--text-2); }
.btn-cancel:hover { background:var(--border); }
.hor-swatch { display:inline-block; width:26px; height:26px; border-radius:5px; cursor:pointer; border:3px solid transparent; transition:transform .12s,border-color .12s; }
.hor-swatch:hover { transform:scale(1.15); }
.hor-swatch.selected { border-color:#1a1a1a; transform:scale(1.2); }
.refact-warn { background:var(--warning-light); border:1px solid #fcd34d; border-radius:var(--radius); padding:.5rem .75rem; font-size:.8rem; color:var(--warning); margin-bottom:.85rem; display:none; }
.pub-history { margin-top:1rem; }
.pub-history h4 { font-size:.85rem; color:var(--muted); margin-bottom:.5rem; }
.pub-entry { font-size:.8rem; padding:.4rem .6rem; background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-sm); margin-bottom:.3rem; }

/* Conflict shift highlight */
.cell-shift.conflict-shift { outline:2px solid var(--warning) !important; outline-offset:-2px; z-index:1; }

/* Toast */
#toast { position:fixed; bottom:1.5rem; left:50%; transform:translateX(-50%) translateY(80px); background:#1e293b; color:#fff; border-radius:var(--radius-lg); padding:.55rem .75rem .55rem 1.1rem; font-size:.875rem; z-index:999; transition:transform .28s cubic-bezier(.34,1.3,.64,1); white-space:nowrap; display:flex; align-items:center; gap:.65rem; box-shadow:var(--shadow-lg); }
#toast.show { transform:translateX(-50%) translateY(0); }
#toast.err { background:var(--danger); }
#toast-msg { flex:1; }
#toast-action { background:rgba(255,255,255,.18); color:#fff; font-size:.8rem; font-weight:700; padding:.25rem .6rem; border-radius:var(--radius-sm); border:1px solid rgba(255,255,255,.25); display:none; flex-shrink:0; }
#toast-action:hover { background:rgba(255,255,255,.28); }
#toast-action.vis { display:inline-block; }

/* ── Mobile responsive ── */
@media (max-width: 768px) {
  /* Header : wrap en 2 lignes */
  header { flex-wrap: wrap; padding: .4rem .6rem; gap: .3rem; align-items: center; }
  .logo { font-size: .9rem; flex-shrink: 0; }
  .emp-banner { width: 100%; order: -1; font-size: .8rem; padding: .4rem .75rem; }
  .site-tabs { order: 1; }
  .week-nav { order: 2; margin-left: 0; }
  .btn-copy { order: 3; }
  .toggle-horaires { order: 3; }
  .week-label { min-width: 110px; font-size: .8rem; }
  #manager-actions { order: 4; width: 100%; flex-wrap: wrap; gap: .3rem; }
  .btn-counters-toggle { display:flex !important; align-items:center; gap:.35rem; order:5; }
  /* Grid scroll horizontal */
  .grid-wrapper { overflow-x: auto; -webkit-overflow-scrolling: touch; padding: .4rem; }
  .planning-grid { min-width: 560px; }
  /* Compteurs panel */
  .counters-panel {
    position: fixed; right: 0; top: 0; bottom: 0;
    transform: translateX(110%);
    z-index: 50; min-width: 220px; width: 220px;
    box-shadow: var(--shadow-lg);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
  }
  .counters-panel.mob-open { transform: translateX(0); }
  .counters-backdrop.vis { display: block; }
  .memo-panel { display: none !important; } /* mémo manager : desktop uniquement */
}
@media (max-width: 480px) {
  .logo { font-size: .85rem; }
  .btn-copy, .btn-icon:not(#btn-config):not(.btn-publish):not(.hdr-menu-btn) { display: none; }  /* #91 : garder le menu ⋯ (accès Config/Déconnexion) sur mobile manager */
  .hdr-menu-panel > .hdr-menu-logout { display: flex; }  /* #91 : entrée Déconnexion visible dans le menu sur mobile */
  .badge-published { font-size: .68rem; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* ── Vue jour (public mobile) ── */
#day-view-container { width: 100%; display: none; }
.day-view { padding: .65rem; background: var(--surface-2); min-height: calc(100vh - 120px); }
.day-nav { display: flex; align-items: center; justify-content: space-between; padding: .55rem .85rem; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); margin-bottom: .65rem; }
.day-nav-label { font-weight: 700; font-size: .95rem; color: var(--text-1); }
.day-nav-btn { background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); width: 36px; height: 36px; font-size: 1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background var(--t); }
.day-nav-btn:hover:not(:disabled) { background: var(--bam-green-light); border-color: var(--bam-green); }
.day-nav-btn:disabled { opacity: .3; cursor: default; }
.day-emp-card { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); margin-bottom: .45rem; padding: .55rem .75rem; display: flex; align-items: flex-start; gap: .6rem; }
.day-emp-avatar { width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: .85rem; flex-shrink: 0; margin-top: .1rem; }
.day-emp-info { flex: 1; min-width: 0; }
.day-emp-name { font-weight: 700; font-size: .88rem; color: var(--text-1); margin-bottom: .18rem; }
.day-shift-tag { display: inline-flex; align-items: center; gap: .2rem; border-radius: 20px; padding: .18rem .55rem; font-size: .78rem; font-weight: 600; margin-right: .2rem; margin-bottom: .15rem; }
.day-no-shift { font-size: .75rem; color: var(--muted); }
.day-abs-tag { display: inline-flex; align-items: center; border-radius: 20px; padding: .18rem .55rem; font-size: .78rem; font-weight: 600; background: #fef9c3; color: #92400e; margin-right: .2rem; margin-bottom: .15rem; }

/* ── Heures supplémentaires ── */
.hs-badge {
  position:absolute; bottom:2px; left:2px;
  background:#f59e0b; color:#fff;
  font-size:.6rem; font-weight:800; letter-spacing:.02em;
  border-radius:3px; padding:1px 4px; line-height:1.4;
  cursor:pointer; z-index:3;
  box-shadow:0 1px 3px rgba(0,0,0,.22);
  pointer-events:auto;
}
.hs-badge:hover { background:#d97706; }
.hs-badge.hs-pending {
  background:transparent; color:#f59e0b;
  border:1px dashed #f59e0b;
  box-shadow:none;
}
.hs-badge.hs-pending:hover { background:#fef3c7; }
/* Cellule vide cliquable pour saisie HS (vue employé) */
.cell-hs-entry { cursor:cell !important; }
.cell-hs-entry:hover { background:rgba(245,158,11,.08) !important; }
/* Bloc HS étendu : fond couleur employé + cadre rouge vif (façon shift) */
.cell-hs-block            { background:var(--hs-bg,#fde2e2) !important; position:relative; cursor:pointer;
                            border-left:2px solid #dc2626 !important; border-right:2px solid #dc2626 !important; }
.cell-hs-block.hs-first   { border-top:2px solid #dc2626 !important; }
.cell-hs-block.hs-last    { border-bottom:2px solid #dc2626 !important; }
.cell-hs-block.hs-pending { border-style:dashed !important; }   /* en attente de validation */
/* Badge rouge sur bouton compteurs */
.hs-pending-dot {
  position:absolute; top:2px; right:2px;
  background:#ef4444; color:#fff;
  font-size:.55rem; font-weight:800;
  border-radius:10px; padding:1px 4px; min-width:16px;
  text-align:center; line-height:1.4; pointer-events:none;
}
/* Section validation HS dans le panel compteurs */
.hs-val-section { border-bottom:1px solid var(--border); padding:.6rem .75rem .75rem; margin-bottom:.4rem; }
.hs-val-title { font-size:.78rem; font-weight:700; color:#b45309; margin-bottom:.5rem; }
.hs-val-item { background:#fffbeb; border:1px solid #fde68a; border-radius:var(--radius-sm); padding:.45rem .6rem; margin-bottom:.4rem; display:flex; gap:.5rem; align-items:flex-start; }
.hs-val-info { flex:1; font-size:.78rem; line-height:1.4; }
.hs-val-info strong { color:var(--text-1); }
.hs-val-note { display:block; color:var(--muted); font-style:italic; margin-top:.1rem; }
.hs-val-btns { display:flex; gap:.35rem; flex-shrink:0; margin-top:.15rem; }
.hs-val-btns button { font-size:.78rem; padding:.2rem .5rem; border-radius:var(--radius-sm); cursor:pointer; font-weight:700; }
.btn-hs-ok { background:#d1fae5; color:#065f46; border:1px solid #6ee7b7; }
.btn-hs-ok:hover { background:#a7f3d0; }
.btn-hs-ko { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }
.btn-hs-ko:hover { background:#fecaca; }

/* ── Voile confirmation (shifts non confirmés sur semaine publiée) ── */
.cell-shift.voile {
  filter: saturate(0.22) brightness(1.08);
  transition: filter 0.45s ease;
}

/* ── Panneau confirmations (réutilise counters-panel pour public/emp) ── */
.conf-emp-row {
  margin-bottom: .5rem; background: var(--surface-2);
  border: 1px solid var(--border); border-radius: var(--radius);
  padding: .45rem .55rem; transition: border-color var(--t);
}
.conf-emp-row.conf-pending { border-color: #fcd34d; background: var(--warning-light); }
.conf-emp-row.conf-ok { border-color: var(--border); }
.conf-emp-head { display: flex; align-items: center; gap: .4rem; }
.conf-emp-dot {
  width: 22px; height: 22px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .7rem; font-weight: 700; flex-shrink: 0;
}
.conf-emp-name { font-size: .82rem; font-weight: 600; flex: 1; }
.conf-btn {
  margin-top: .4rem; width: 100%; padding: .32rem;
  background: var(--bam-green); color: #fff; border-radius: var(--radius-sm);
  font-weight: 700; font-size: .78rem; border: none; cursor: pointer;
  transition: background var(--t);
}
.conf-btn:hover { background: var(--bam-green-dark); }
.conf-ok-label { font-size: .72rem; color: var(--success); text-align: center; margin-top: .15rem; font-weight: 600; }

/* ── Config screen ── */
#screen-config.active { display:flex !important; flex-direction:column; min-height:100vh; }
.cfg-header { background:rgba(255,255,255,.92); backdrop-filter:blur(12px); border-bottom:1px solid var(--border); padding:.6rem 1rem; display:flex; align-items:center; gap:.75rem; position:sticky; top:0; z-index:10; }
.cfg-header .logo { font-size:1rem; }
.cfg-body { flex:1; overflow-y:auto; background:#fafafa; }
.cfg-view { max-width:860px; margin:0 auto; padding:1rem 1.25rem; }
.cfg-toolbar { display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem; }
.cfg-page-title { font-size:1.1rem; font-weight:700; margin:0; }
.cfg-section { background:#fff; border-radius:8px; box-shadow:var(--shadow); padding:1.25rem; margin-bottom:1rem; }
.cfg-section-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:.75rem; }
.cfg-section-title { font-size:.9rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; margin:0 0 .85rem; }
.cfg-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:.6rem .85rem; margin-bottom:.75rem; }
.cfg-label { display:flex; flex-direction:column; gap:.25rem; font-size:.8rem; font-weight:600; color:var(--muted); }
.cfg-input { font:inherit; border:1px solid var(--border); border-radius:var(--radius); padding:.4rem .6rem; width:100%; }
.cfg-input:focus { outline:2px solid var(--bam73); outline-offset:1px; }
.cfg-checks { display:flex; gap:1.25rem; margin-bottom:.85rem; flex-wrap:wrap; }
.cfg-check { display:flex; align-items:center; gap:.4rem; font-size:.88rem; cursor:pointer; }
.cfg-form-footer { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; }
.btn-cfg-secondary { padding:.4rem .85rem; border:1px solid var(--border); background:#fff; border-radius:var(--radius); font-size:.85rem; cursor:pointer; }
.btn-cfg-secondary:hover { background:var(--gray); }
.btn-cfg-danger { border-color:#FFB74D; background:#fff3e0; color:#E65100; }
.btn-cfg-danger:hover { background:#ffe0b2; }
.btn-cfg-restore { border-color:#A5D6A7; background:#E8F5E9; color:#2E7D32; }
.btn-cfg-restore:hover { background:#C8E6C9; }
/* Employee table */
/* #106 : liste Config groupée par société employeur */
.cfg-soc-group { margin-bottom:1.4rem; }
.cfg-soc-head { display:flex; align-items:center; gap:.5rem; font-size:.82rem; font-weight:700; color:var(--copper, #A66B33); text-transform:uppercase; letter-spacing:.04em; margin:0 0 .35rem; padding-bottom:.3rem; border-bottom:2px solid var(--copper, #A66B33); }
.cfg-soc-count { font-size:.72rem; font-weight:700; color:var(--muted); background:var(--surface-3); border-radius:999px; padding:.05rem .5rem; }
.cfg-emp-table { width:100%; border-collapse:collapse; }
.cfg-emp-table th { background:var(--gray); font-size:.75rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; padding:.55rem .85rem; text-align:left; }
.cfg-emp-table td { padding:.6rem .85rem; font-size:.84rem; border-top:1px solid var(--border); vertical-align:middle; }
.cfg-emp-table tr:hover td { background:#fafcff; }
.cfg-badge { display:inline-block; font-size:.7rem; font-weight:700; padding:.15rem .45rem; border-radius:10px; }
.cfg-badge-73 { background:#E3F0FD; color:var(--bam73); }
.cfg-badge-74 { background:#E8F5E9; color:var(--bam74); }
.cfg-badge-active { background:#E8F5E9; color:#2E7D32; }
.cfg-badge-inactive { background:#f5f5f5; color:#999; }
/* Contracts list */
.cfg-cont-row { display:flex; align-items:center; gap:.6rem; padding:.45rem .5rem; border-top:1px solid #f0f0f0; font-size:.83rem; border-radius:6px; }
.cfg-cont-row:first-child { border-top:none; }
.cfg-cont-row.selected { background:var(--surface-3); box-shadow:inset 0 0 0 1px var(--bam73); }
.cfg-cont-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
/* Sélecteur couleur employé */
.cfg-color-pick { display:flex; align-items:center; gap:.6rem; margin-top:.3rem; }
.cfg-color-pick input[type=color] { width:22px; height:22px; padding:1px; border:1px solid var(--border); border-radius:4px; cursor:pointer; background:none; }

/* Inline contrat form */
.cfg-inline-form { background:#f8f9fa; border:1px solid var(--border); border-radius:6px; padding:.85rem; margin-top:.65rem; }
.cfg-inline-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.5rem; margin-bottom:.5rem; }
@media(max-width:600px) { .cfg-form-grid,.cfg-inline-grid { grid-template-columns:1fr; } }

/* ── Fiche RH / cabinet social (#94 v2 — intégrée en onglets à la fiche salarié) ── */
.frh-tabs { display:flex; gap:.2rem; flex-wrap:wrap; border-bottom:1px solid var(--border); margin-bottom:.6rem; }
.frh-tab { padding:.45rem .75rem; font-size:.83rem; font-weight:600; color:var(--muted); background:none; border:none; border-bottom:2px solid transparent; border-radius:0; cursor:pointer; }
.frh-tab.on { color:var(--bam73); border-bottom-color:var(--bam73); }
.frh-badge { display:inline-block; font-size:.68rem; font-weight:700; background:var(--danger-light); color:var(--danger); border-radius:9px; padding:.05rem .4rem; margin-left:.25rem; }
/* #99 : Suivi (usage quotidien) détaché du groupe « réglage » (one-shot) */
.frh-tab-primary { color:var(--bam73); background:var(--bam73-light); font-weight:700; border-radius:var(--radius-sm) var(--radius-sm) 0 0; }
.frh-tab-sep { width:1px; align-self:center; height:20px; background:var(--border-2); margin:0 .45rem; }
/* Barre export/contexte du contrat sélectionné, au-dessus des panneaux à onglets */
.cef-frh-toolbar { display:flex; align-items:center; justify-content:space-between; gap:.75rem; flex-wrap:wrap; font-size:.82rem; color:var(--muted); margin-bottom:.6rem; }
/* Hauteur mini FIXE : évite le redimensionnement de la modale/vue au changement d'onglet */
.cef-tab-body { min-height:420px; }
.cef-panel .cfg-section { margin-bottom:0; }

/* ── Notes journées ── */
.day-note-dot {
  display:inline-block; font-size:.75rem; cursor:pointer; margin-left:.3rem;
  vertical-align:middle; transition:transform var(--t);
}
.day-note-dot:hover { transform:scale(1.25); }
.day-note-add {
  display:inline-block; font-size:.7rem; font-weight:700; cursor:pointer;
  color:var(--muted-light); margin-left:.3rem; opacity:0; transition:opacity var(--t);
  vertical-align:middle;
}
.th-day:hover .day-note-add { opacity:.6; }
.day-note-add:hover { opacity:1 !important; color:var(--bam73); }

/* ── #95 Prévisionnel + #65 Suivi (#99 : onglets scindés — variables partagées) ──── */
#frh-tab-previsionnel, #frh-tab-suivi {
  --pv-basse: var(--muted-light);       /* vert clair = semaine basse */
  --pv-basse-bg: var(--surface-3);
  --pv-haute: var(--bam73);             /* vert BAM = semaine haute */
  --pv-haute-bg: var(--bam73-light);
  --pv-manuel: #7c3aed;                 /* violet appli = saisie manuelle / repère vacances */
  --pv-manuel-bg: #f3edfe;
}
.prev-hint { color:var(--muted); font-size:.82rem; }
.prev-periodbar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:12px; }
.prev-periodbar label { font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.prev-periodbar select { font:inherit; padding:6px 9px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); color:var(--text); }
.prev-hero { display:flex; gap:16px; flex-wrap:wrap; align-items:center; justify-content:space-between;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:14px 16px; margin-bottom:12px; }
.prev-refs { display:flex; gap:12px; flex-wrap:wrap; }
.prev-step { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:9px 12px; }
.prev-k { font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); display:flex; align-items:center; gap:6px; }
.prev-dot { width:10px; height:10px; border-radius:50%; }
.prev-dot.basse { background:var(--pv-basse); } .prev-dot.haute { background:var(--pv-haute); }
.prev-ctl { display:flex; align-items:center; gap:6px; margin-top:5px; }
.prev-ctl button { width:30px; height:30px; padding:0; font-size:1.1rem; line-height:1; border:1px solid var(--border);
  background:var(--surface); color:var(--text); border-radius:var(--radius-sm); cursor:pointer; }
.prev-ctl button:hover { background:var(--surface-3); }
.prev-val { font-size:1.4rem; font-weight:700; color:var(--text); display:inline-flex; align-items:baseline; }
.prev-val input { font:inherit; font-size:1.3rem; font-weight:700; width:78px; padding:0; text-align:center; border:none; background:transparent; color:inherit;
  -moz-appearance:textfield; appearance:textfield; }
.prev-val input::-webkit-outer-spin-button, .prev-val input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.prev-moybox { text-align:right; }
.prev-m { font-size:2.1rem; font-weight:800; color:var(--bam73-dark); line-height:1; }
.prev-u { color:var(--muted); font-size:.78rem; }
.prev-frisewrap { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:10px 14px; margin-bottom:12px; }
.prev-frise-lbl { font-size:.72rem; color:var(--muted); margin-bottom:6px; }
.prev-frise { display:flex; align-items:flex-end; gap:2px; height:68px; overflow-x:auto; padding-bottom:4px; }
.prev-bar { flex:1 0 6px; min-width:6px; border-radius:3px 3px 0 0; position:relative; cursor:pointer; transition:filter .1s; }
.prev-bar:hover { filter:brightness(1.06); }
.prev-bar.basse { background:var(--pv-basse); } .prev-bar.haute { background:var(--pv-haute); } .prev-bar.manuel { background:var(--pv-manuel); }
.prev-bar.vac::after { content:""; position:absolute; left:0; right:0; bottom:-4px; height:2px; background:var(--pv-manuel); border-radius:2px; }
.prev-gico { display:inline-flex; vertical-align:-2px; margin-right:3px; }
.prev-grp { border:1px solid var(--border); border-radius:var(--radius-lg); margin-bottom:9px; overflow:hidden; background:var(--surface); }
.prev-head { display:flex; align-items:center; gap:10px; padding:11px 13px; cursor:pointer; user-select:none; }
.prev-head:hover { background:var(--surface-2); }
.prev-chev { transition:transform .18s; color:var(--muted); }
.prev-grp.open .prev-chev { transform:rotate(90deg); }
.prev-title { font-weight:600; flex:1; color:var(--text); }
.prev-meta { color:var(--muted); font-size:.8rem; }
.prev-seg { display:inline-flex; border:1px solid var(--border); border-radius:999px; overflow:hidden; background:var(--surface-2); }
.prev-seg button { background:transparent; border:none; color:var(--muted); font-weight:600; padding:5px 11px; font-size:.8rem; cursor:pointer; }
.prev-seg button.on.basse { background:var(--pv-basse-bg); color:var(--text-2); }
.prev-seg button.on.haute { background:var(--pv-haute-bg); color:var(--bam73-dark); }
.prev-seg button.on.manuel { background:var(--pv-manuel-bg); color:var(--pv-manuel); }
.prev-body { display:none; border-top:1px solid var(--border); }
.prev-grp.open .prev-body { display:block; }
.prev-wk { display:flex; align-items:center; gap:10px; padding:8px 13px; border-bottom:1px solid var(--surface-2); }
.prev-wk:last-child { border-bottom:none; }
.prev-lbl { flex:1; font-size:.88rem; color:var(--text); } .prev-lbl .d { color:var(--muted); font-size:.8rem; }
.prev-badge { background:var(--pv-manuel-bg); color:var(--pv-manuel); border-radius:999px; padding:1px 8px; font-size:.7rem; font-weight:600; margin-left:6px; }
.prev-man { width:64px; font:inherit; padding:5px 7px; border:1px solid var(--border); border-radius:var(--radius-sm); text-align:right; }
.prev-save { display:flex; gap:12px; align-items:center; justify-content:flex-end; margin-top:8px; }
.prev-save button { background:var(--pv-haute); color:#fff; border:none; border-radius:9px; padding:9px 17px; font-weight:600; cursor:pointer; }
.prev-save button:hover { filter:brightness(1.05); }
@media (max-width:560px){ .prev-moybox { text-align:left; } }

/* ── #65 Suivi d'annualisation (sous l'éditeur prévisionnel #95) ────────────── */
.annu-suivi { margin-top:18px; border-top:1px solid var(--border); padding-top:14px; }
.annu-suivi-title { display:flex; align-items:center; gap:6px; font-weight:700; font-size:.8rem; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; margin-bottom:10px; }
.annu-apprenti { color:var(--muted); font-size:.85rem; font-style:italic; }
.annu-table-wrap { overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius-lg); }
.annu-table { width:100%; border-collapse:collapse; font-size:.82rem; }
.annu-table th { background:var(--surface-2); font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.03em; font-size:.66rem; padding:.5rem .6rem; text-align:right; white-space:nowrap; }
.annu-table th:first-child, .annu-table td:first-child { text-align:left; }
.annu-table td { padding:.4rem .6rem; text-align:right; border-top:1px solid var(--border); white-space:nowrap; }
.annu-table tr.annu-vac td:first-child { border-left:3px solid var(--pv-manuel); }
.annu-realise input { width:60px; font:inherit; padding:3px 5px; border:1px solid var(--border); border-radius:var(--radius-sm); text-align:right; background:var(--surface); color:var(--text); }
.annu-override td.annu-realise { background:var(--pv-manuel-bg); }
.annu-override-tag { font-size:.62rem; color:var(--pv-manuel); font-weight:700; margin-left:4px; }
.annu-clear { background:none; border:none; color:var(--muted); cursor:pointer; padding:0 2px; line-height:0; vertical-align:-3px; }
.annu-clear:hover { color:var(--danger); }
.annu-projete { color:var(--muted); font-style:italic; font-size:.82rem; }
.annu-ecart-neg { color:var(--danger); font-weight:600; }
.annu-ecart-pos { color:var(--success); font-weight:600; }
.annu-statut { font-weight:700; border-radius:999px; padding:.25rem .7rem; font-size:.78rem; }
.annu-statut.a_jour { background:var(--success-light); color:var(--success); }
.annu-statut.retard { background:var(--warning-light); color:var(--warning); }
.annu-statut.avance { background:var(--pv-manuel-bg); color:var(--pv-manuel); }

/* #65 — refonte suivi en tableau de bord : hero solde + trajectoire SVG + détail repliable */
.annu-hero { display:flex; gap:16px; flex-wrap:wrap; align-items:center; justify-content:space-between;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:14px 16px; margin-bottom:12px; }
.annu-k { font-size:.72rem; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; font-weight:700; }
.annu-big { font-size:2.4rem; font-weight:800; line-height:1.05; letter-spacing:-.02em; margin:2px 0 6px; color:var(--text); }
.annu-big.pos { color:var(--success); } .annu-big.neg { color:var(--danger); }
.annu-solde .annu-statut { display:inline-block; }
.annu-kpis { display:flex; gap:18px; flex-wrap:wrap; }
.annu-kpis > div { font-size:1.3rem; font-weight:800; color:var(--text); text-align:right; }
.annu-kpis small { display:block; font-size:.6rem; color:var(--muted); font-weight:600; text-transform:uppercase; letter-spacing:.03em; margin-top:1px; }
.annu-traj { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:12px 14px 6px; margin-bottom:12px; }
.annu-traj-lbl { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; font-size:.72rem; color:var(--muted); margin-bottom:6px; }
.annu-traj-lbl b { color:var(--text); }
.annu-leg { display:inline-flex; gap:10px; align-items:center; }
.annu-leg i { display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:3px; vertical-align:-1px; }
.annu-leg i.pos { background:var(--success); } .annu-leg i.neg { background:var(--danger); }
.annu-leg i.cum { background:var(--pv-manuel); border-radius:999px; } .annu-leg i.vac { background:var(--pv-manuel); opacity:.4; }
.annu-svg { width:100%; height:auto; display:block; }
.annu-tbar:hover { filter:brightness(1.08); }
.annu-det { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; }
.annu-det-head { width:100%; text-align:left; background:none; border:none; cursor:pointer; padding:11px 14px;
  font:inherit; font-weight:700; font-size:.84rem; color:var(--text); display:flex; align-items:center; gap:8px; }
.annu-det-head:hover { background:var(--surface-2); }
.annu-chev { transition:transform .15s; color:var(--muted); font-size:.7rem; }
.annu-det-head.open .annu-chev { transform:rotate(90deg); }
.annu-det-sub { font-size:.72rem; font-weight:500; color:var(--muted); margin-left:auto; }
.annu-det-body { padding:0 14px 14px; }

/* ── #96 Vue globale annualisation — tableau tous salariés × semaines (remplace le Google Sheet) ── */
.modal.modal-wide { width:min(96vw, 1400px); max-height:92vh; padding:1.1rem 1.3rem; }
.annu-global-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.annu-global-head h3 { margin:0; }
.annu-global-toolbar { display:flex; gap:1.25rem; flex-wrap:wrap; margin:.7rem 0 .5rem; }
.annu-global-toolbar label { display:flex; flex-direction:column; gap:.2rem; font-size:.74rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.03em; }
.annu-global-toolbar select { font:inherit; padding:.35rem .5rem; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); color:var(--text); }
.btn-annu-export { margin-left:auto; align-self:flex-end; display:inline-flex; align-items:center; gap:.35rem; font:inherit; font-weight:700; font-size:.8rem; padding:.4rem .7rem; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); color:var(--text); cursor:pointer; }
.btn-annu-export:hover { background:var(--bg); border-color:var(--muted); }
.btn-annu-export:disabled { opacity:.6; cursor:wait; }
.btn-annu-export .ic { width:15px; height:15px; }
.annu-global-multi { font-size:.7rem; font-weight:600; color:var(--copper, #A66B33); }
.annu-global-wrap { overflow:auto; max-height:72vh; border:1px solid var(--border); border-radius:var(--radius); }
.annu-global-table { border-collapse:collapse; font-size:.68rem; white-space:nowrap; }
.annu-global-table th, .annu-global-table td { padding:.18rem .32rem; border:1px solid var(--border); text-align:center; }
.annu-global-table thead th { position:sticky; top:0; z-index:3; background:var(--surface-3); font-weight:700; color:var(--text-2); }
.annu-global-table td.annu-global-name, .annu-global-table th.annu-global-name { position:sticky; left:0; z-index:2; background:var(--surface); text-align:left; font-weight:700; min-width:120px; }
.annu-global-table thead th.annu-global-name { z-index:4; }
.annu-global-table td.annu-global-label, .annu-global-table th.annu-global-label { position:sticky; left:120px; z-index:2; background:var(--surface-2); text-align:left; color:var(--muted); font-weight:600; min-width:56px; }
.annu-global-hh { color:var(--muted); font-weight:400; }
.annu-global-vac { background:var(--pv-manuel-bg); }
.annu-global-table thead th.annu-global-vac { background:var(--pv-manuel-bg); }
.annu-global-table td.annu-ecart-pos { color:var(--success); font-weight:700; }
.annu-global-table td.annu-ecart-neg { color:var(--danger); font-weight:700; }
@media (max-width:700px) { .modal.modal-wide { width:98vw; padding:.8rem; } }