/* =====================================================================
   POSTE DE TRAVAIL — habillage rétro, jaune et violet
   ---------------------------------------------------------------------
   Surcouche de styles.css (chargée après lui). Ne touche ni à app.js
   ni aux données : retirer la ligne <link> = retour à l'ancien look.

   Parti pris : une interface de bureau de la fin des années 80 —
   palette courte, biseaux nets de 1-2 px, barres de titre rayées,
   fond tramé en damier. Pas de lueurs ni d'effets animés.
   Le rideau de fin de journée garde son dessin d'origine.
   ===================================================================== */

:root{
  /* palette */
  --v-ink:#120a24;     /* presque noir, violacé */
  --v-deep:#1d1238;    /* fond des écrans */
  --v-dark:#2b1b52;
  --v:#45307f;         /* violet franc */
  --v-mid:#6b55b0;
  --v-lav:#a597d4;     /* lavande, libellés */
  --v-pale:#ddd6f0;    /* plastique clair */
  --v-white:#f4f1fb;
  --v-desk:#241749;    /* 2e teinte du damier */
  --y:#ffd23a;         /* jaune */
  --y-pale:#fff0a6;
  --y-dark:#b58a10;
  --m:#d94f9e;         /* magenta : alertes, 1er état des Prog */
  --m-pale:#f3a9d2;
  --m-dark:#8a2463;
  /* rôles : chaque usage pointe vers une teinte de la gamme ci-dessus */
  --etat1:var(--v-lav);        /* 1er état des grilles de droite */
  --etat1-hi:var(--v-white);
  --etat1-lo:var(--v-mid);

  /* on rebranche les variables de styles.css */
  --cream:var(--v-deep); --cream2:var(--v-ink); --paper:var(--v-deep);
  --wood:var(--v); --wood-dark:var(--v-dark); --wood-deep:var(--v-ink);
  --rose:var(--v-mid); --rose-dark:var(--v); --rose-deep:var(--y);
  --gold:var(--y); --gold-light:var(--y-pale); --gold-deep:var(--y-dark);
  --sage:var(--v-lav); --sage-dark:var(--v-mid);
  --ink:var(--v-pale); --ink-soft:var(--v-lav);
  --black:var(--v-ink); --edge:var(--v-mid); --rim:var(--y);
  --txt-lite:var(--v-white); --txt-mut:var(--v-lav); --txt-screen:var(--v-pale);
  --amber-a:var(--etat1); --amber-b:var(--etat1-lo);
  --green-a:var(--y); --green-b:var(--y-dark);
  --bev-hi:var(--v-mid); --bev-hi2:var(--v); --bev-lo:var(--v-ink); --bev-lo2:var(--v-dark);

  --title-font:"DotGothic16","MS Sans Serif",Tahoma,sans-serif;
}

/* ===== bureau : damier tramé ======================================== */
body{
  color:var(--v-pale);
  background:conic-gradient(var(--v-dark) 25%,var(--v-desk) 0 50%,var(--v-dark) 0 75%,var(--v-desk) 0) 0 0/4px 4px !important;
}
body::before,body::after,html::after{display:none !important;}
#fit{filter:none !important;}

/* ===== barre du haut : barre de menus claire ========================= */
.topbar{
  background:var(--v-pale) !important;border:2px solid var(--v-ink) !important;
  box-shadow:inset 2px 2px 0 var(--v-white),inset -2px -2px 0 var(--v-lav),4px 4px 0 var(--v-ink) !important;
}
.brand{font-family:var(--title-font) !important;font-weight:400 !important;font-size:17px !important;
  color:var(--v) !important;text-shadow:none !important;letter-spacing:.02em;}
.brand b{color:var(--v-mid) !important;}
.emblem polygon{stroke:var(--v) !important;}
.emblem polygon[fill="#f0d989"]{fill:var(--y) !important;opacity:1 !important;}
.emblem circle{fill:var(--v) !important;}
.sync{color:var(--v) !important;background:var(--v-white) !important;border:1px solid var(--v-lav) !important;}

/* ===== boutons : biseau net, pas de dégradé ========================== */
.abtn,.mini,.ntbtn,.delbtn{
  border-radius:0 !important;border:1px solid var(--v-ink) !important;
  background:var(--v-pale) !important;color:var(--v) !important;text-shadow:none !important;
  box-shadow:inset 1px 1px 0 var(--v-white),inset -1px -1px 0 var(--v-lav) !important;
  transition:none !important;
}
.abtn:hover,.mini:hover,.ntbtn:hover,.delbtn:hover{background:var(--v-white) !important;}
.abtn:active,.mini:active,.ntbtn:active,.delbtn:active{
  background:var(--v-lav) !important;box-shadow:inset 1px 1px 0 var(--v-mid) !important;transform:translate(1px,1px) !important;}
#eodBtn{background:var(--y) !important;color:var(--v-ink) !important;
  box-shadow:inset 1px 1px 0 var(--y-pale),inset -1px -1px 0 var(--y-dark) !important;}
#eodBtn:hover{background:var(--y-pale) !important;}
.delbtn{background:var(--v-dark) !important;color:var(--v-lav) !important;border-color:var(--v-ink) !important;
  box-shadow:inset 1px 1px 0 var(--v-mid) !important;}
.delbtn:hover{background:var(--m) !important;color:var(--v-ink) !important;box-shadow:none !important;}

/* ===== fenêtres =====================================================
   barre de titre rayée façon bureau 1987 ; le titre est posé sur un
   pavé uni au milieu des rayures. */
.panel,.rpanel,.cpanel{
  background:var(--v-deep) !important;border:2px solid var(--v-ink) !important;
  box-shadow:4px 4px 0 var(--v-ink) !important;
}
.panel::before,.rpanel::before,.cpanel::before,
.panel::after,.rpanel::after,.cpanel::after{display:none !important;}

.pbar,.cbar{
  background:
    repeating-linear-gradient(180deg,var(--y) 0 1px,var(--v) 1px 3px) 0 5px/100% 13px no-repeat,
    var(--v) !important;
  border-bottom:2px solid var(--v-ink) !important;padding:4px 8px !important;gap:8px !important;
  text-shadow:none !important;
}
.pbar .t,.cbar .t{flex:0 0 auto !important;margin:0 auto;padding:0 8px;background:var(--v);
  font-family:var(--title-font) !important;font-weight:400 !important;font-size:14px !important;
  color:var(--y) !important;text-shadow:none !important;}
.pbar .ico,.cbar .ico{background:var(--v);padding:0 4px;color:var(--y) !important;}
.led{background:var(--y) !important;box-shadow:none !important;border-radius:0 !important;}

/* ===== contenu des écrans =========================================== */
.wk,.subh{font-family:var(--title-font) !important;font-weight:400 !important;font-size:17px !important;color:var(--y) !important;}
.wk:has(button){font-size:inherit !important;}
.board{background:var(--v-ink) !important;border:1px solid var(--v) !important;box-shadow:none !important;}
.board::before{display:none !important;}
thead th{color:var(--v-lav) !important;font-weight:700;}
td.rh{color:var(--v-pale) !important;}
.verifdate{color:var(--v-lav) !important;}
.verifdate b{color:var(--y) !important;}

/* cases */
.cell{background:var(--v-dark) !important;border:1px solid var(--v-ink) !important;
  box-shadow:inset 1px 1px 0 var(--v),inset -1px -1px 0 var(--v-ink) !important;}
body.admin .cell:hover{outline:1px solid var(--y) !important;outline-offset:-1px;}
.cell:active{box-shadow:inset 1px 1px 0 var(--v-ink) !important;}
.cell.s1{background:var(--etat1) !important;color:var(--v-ink) !important;border-color:var(--v-ink) !important;
  box-shadow:inset 1px 1px 0 var(--etat1-hi),inset -1px -1px 0 var(--etat1-lo) !important;}
.cell.s2{background:var(--y) !important;color:var(--v-ink) !important;border-color:var(--v-ink) !important;
  box-shadow:inset 1px 1px 0 var(--y-pale),inset -1px -1px 0 var(--y-dark) !important;}
#colLeft .cell.s1{background:var(--m) !important;color:var(--v-ink) !important;
  box-shadow:inset 1px 1px 0 var(--m-pale),inset -1px -1px 0 var(--m-dark) !important;}
.cell.glitch::after{background:repeating-linear-gradient(0deg,rgba(255,210,58,.6) 0 1px,transparent 1px 3px) !important;mix-blend-mode:normal !important;}

/* champs */
td.taskcell input{background:var(--v-deep) !important;color:var(--v-white) !important;
  border:1px solid var(--v-ink) !important;box-shadow:inset 1px 1px 0 var(--v-ink),inset -1px -1px 0 var(--v) !important;}
td.taskcell input:focus{outline:1px solid var(--y) !important;outline-offset:-1px;background:var(--v-dark) !important;}

/* cases à cocher */
.verifbox{background:var(--v-dark) !important;border:1px solid var(--v-ink) !important;
  box-shadow:inset 1px 1px 0 var(--v),inset -1px -1px 0 var(--v-ink) !important;}
.veriflabel{color:var(--v-pale) !important;}
.verifbox input[type=checkbox]{background:var(--v-deep) !important;border:1px solid var(--v-ink) !important;
  box-shadow:inset 1px 1px 0 var(--v-ink) !important;}
.verifbox input[type=checkbox]:hover{background:var(--v) !important;}
.verifbox input[type=checkbox]:checked{background:var(--y) !important;border-color:var(--v-ink) !important;box-shadow:none !important;}
.verifbox input[type=checkbox]:checked::after{color:var(--v-ink) !important;}

/* ===== onglets ====================================================== */
.tabbar{background:var(--v) !important;border-bottom:2px solid var(--v-ink);padding:5px 5px 0 !important;}
.tab{background:var(--v-pale) !important;color:var(--v) !important;border:2px solid var(--v-ink) !important;border-bottom:0 !important;
  box-shadow:inset 1px 1px 0 var(--v-white) !important;font-family:var(--title-font) !important;font-weight:400 !important;font-size:14px !important;}
.tab:hover{background:var(--v-white) !important;}
.tab.active{background:var(--v-deep) !important;color:var(--y) !important;box-shadow:none !important;}
/* l'onglet Vendredi garde son petit diable mais perd le bois */
.tab.ven{background-image:none !important;background:var(--v-pale) !important;color:var(--v) !important;}
.tab.ven::before{display:none !important;}
.tab.ven.active{background:var(--v-ink) !important;color:var(--m-pale) !important;}

/* ===== Vendredi : même machine, écran prune et orange =============== */
.rpanel.hell{animation:none !important;border-color:var(--v-ink) !important;}
.hell-ov{display:none !important;}
.hell-pent{opacity:.07 !important;}
.hell-pent .pentagram circle,.hell-pent .pentagram polygon{stroke:var(--m) !important;}
.tab-vendredi{
  --gold:var(--m-pale); --gold-light:var(--m-pale); --rose-deep:var(--m-pale);
  --etat1:var(--m); --etat1-hi:var(--m-pale); --etat1-lo:var(--m-dark);
  background:var(--v-ink) !important;border-color:var(--v-ink) !important;color:var(--v-pale) !important;}
.tab-vendredi::after,.tab-vendredi::before{display:none !important;}
.tab-vendredi .dayhead,.tab-vendredi .note{color:var(--m-pale) !important;}
.tab-vendredi .verifbox{background:var(--v-dark) !important;border:1px solid var(--v-ink) !important;}
.tab-vendredi .verifbox input[type=checkbox]{background:var(--v-deep) !important;border-color:var(--v-ink) !important;}
.tab-vendredi .verifbox input[type=checkbox]:checked{background:var(--m) !important;}
.tab-vendredi .verifbox input[type=checkbox]:checked::after{color:var(--v-ink) !important;}
.ven-head .vt{font-family:var(--title-font) !important;font-weight:400 !important;font-size:20px !important;color:var(--m-pale) !important;text-shadow:none !important;}
.ven-head .vtag{color:var(--m-pale) !important;}
.ven-head .vled{background:var(--m) !important;border-radius:0 !important;box-shadow:none !important;}

/* ===== traitement de texte ==========================================
   une fenêtre du même système, avec une feuille claire : le texte se
   lit en sombre sur papier. */
.w97{--wface:var(--v-pale);--whi:var(--v-white);--wlt:var(--v-white);--wsh:var(--v-lav);--wdk:var(--v);--wtxt:var(--v-ink);
  background:var(--v-pale) !important;border:2px solid var(--v-ink) !important;box-shadow:4px 4px 0 var(--v-ink) !important;}
.w97-title{background:
    repeating-linear-gradient(180deg,var(--y) 0 1px,var(--v) 1px 3px) 0 4px/100% 12px no-repeat,var(--v) !important;
  color:var(--y) !important;height:21px !important;}
.w97-tt{flex:0 0 auto !important;margin:0 auto;padding:0 8px;background:var(--v);
  font-family:var(--title-font) !important;font-weight:400 !important;font-size:14px !important;}
.w97-wicon{background:var(--y) !important;color:var(--v) !important;}
.w97-tbtn{background:var(--v-pale) !important;color:var(--v) !important;border-color:var(--v-white) var(--v-ink) var(--v-ink) var(--v-white) !important;}
.w97-mlab,.w97-mi{color:var(--v-ink) !important;}
.w97-menu.open .w97-mlab,.w97-mlab:hover,.w97-mi:hover{background:var(--v) !important;color:var(--y) !important;}
.w97 .ntbtn{background:transparent !important;border-color:transparent !important;box-shadow:none !important;color:var(--v-ink) !important;}
.w97 .ntbtn:hover{border-color:var(--v-white) var(--v) var(--v) var(--v-white) !important;}
.w97 .ntbtn.on{background:var(--v-lav) !important;}
.w97 .ntsel{background:var(--v-white) !important;color:var(--v-ink) !important;}
.w97 .notepad{background:var(--v-mid) !important;}
.w97-sheet{background:var(--v-white) !important;border:1px solid var(--v-ink) !important;box-shadow:3px 3px 0 var(--v-ink) !important;}
.w97 .noteed{color:var(--v-ink) !important;}
.w97 .noteed:empty:before{color:var(--v-lav) !important;}
.w97 .noteed a{color:var(--v) !important;}
.w97 .noteed b,.w97 .noteed strong{color:var(--v-ink) !important;}
.w97 .noteed blockquote{border-left:3px solid var(--y) !important;color:var(--v) !important;}
.w97-brk::after{background:var(--v-white) !important;color:var(--v-lav) !important;}
.w97 .ntab{background:var(--v-pale) !important;color:var(--v) !important;}
.w97 .ntab.active{background:var(--v-white) !important;color:var(--v-ink) !important;}
.w97-status{color:var(--v-ink) !important;}

/* ===== modale de note =============================================== */
.modal{background:var(--v-pale) !important;border:2px solid var(--v-ink) !important;box-shadow:6px 6px 0 var(--v-ink) !important;}
.modal textarea,.modal input,.modal-ta{background:var(--v-white) !important;color:var(--v-ink) !important;border:1px solid var(--v-ink) !important;}

/* ===== jeu du croco ================================================= */
.crocscreen{background:var(--v-ink) !important;border:2px solid var(--v-ink) !important;
  box-shadow:inset 2px 2px 0 var(--v-dark) !important;}
.crocface svg polygon{fill:var(--v-mid) !important;stroke:var(--v-ink) !important;}
.crocface svg rect[fill="#fff6e4"]{fill:var(--v-white) !important;}
.crocface svg rect[fill="#4a3323"],.crocface svg rect[fill="#3e2712"]{fill:var(--v-ink) !important;}
.crocface svg rect[fill="#5c3a1e"]{fill:var(--v-dark) !important;}
.tooth{background:var(--y) !important;border-color:var(--v-ink) !important;box-shadow:inset -1px -1px 0 var(--y-dark) !important;}
.tooth:hover{background:var(--y-pale) !important;}
.tooth.pressed{background:var(--v-dark) !important;box-shadow:none !important;}
.tooth.boom{background:var(--m) !important;}
.crocmsg{font-family:var(--title-font) !important;font-weight:400 !important;font-size:17px !important;color:var(--v-pale) !important;}
.crocmsg.win{color:var(--y) !important;}
.crocmsg.lose{color:var(--m-pale) !important;}
.crocscore{background:var(--v-ink) !important;border:2px solid var(--v-ink) !important;box-shadow:inset 2px 2px 0 var(--v-dark) !important;}
.cs-lbl{color:var(--v-lav) !important;}
.cs-num{font-family:var(--title-font) !important;font-weight:400 !important;text-shadow:none !important;}
.cs-num.win{color:var(--y) !important;}
.cs-num.lose{color:var(--m-pale) !important;}
.cs-vs{color:var(--v-mid) !important;}

/* ===== fenêtre de la Veille (veille-panel.js) ======================= */
#veilleOverlay{background:rgba(18,10,36,.7) !important;backdrop-filter:none !important;}
#veilleOverlay .v-cadre{border:2px solid var(--v-ink) !important;box-shadow:6px 6px 0 var(--v-ink) !important;}
#veilleOverlay .v-bar{background:var(--v) !important;color:var(--y) !important;}
#veilleOverlay .v-bar button{color:var(--v) !important;background:var(--v-pale) !important;border:1px solid var(--v-ink) !important;}
#veilleOverlay .v-bar button:hover{background:var(--y) !important;color:var(--v-ink) !important;}

/* le petit diable de l'onglet et les sous-titres du Vendredi rentrent dans la gamme */
.tab.ven svg{filter:grayscale(1) brightness(.55) sepia(1) hue-rotate(250deg) saturate(2.4);}
.tab.ven.active svg{filter:grayscale(1) brightness(1.4) sepia(1) hue-rotate(280deg) saturate(2.2);}
.tab-vendredi .dayhead::before{background:var(--m) !important;box-shadow:none !important;}
.tab-vendredi td.taskcell input:focus,.tab-vendredi .cell:hover{outline-color:var(--m-pale) !important;}

/* ===== 04/11/2026 : voyant de synchro + cases perimees ===== */
.sync{padding:3px 9px;font-size:12px;font-weight:700;white-space:nowrap;border-radius:2px}
.sync.ok{color:#1f6b3a !important;background:#e8fbe9 !important;border-color:#2e9a55 !important}
.sync.att{color:#7a5a00 !important;background:#fff6d6 !important;border-color:#d6a700 !important}
.sync.err{color:#fff !important;background:#b3203a !important;border-color:#ffd6dc !important;
  animation:syncPulse 1.6s ease-in-out infinite}
@keyframes syncPulse{50%{box-shadow:0 0 0 3px rgba(255,80,110,.35)}}
/* case cochee lors d'une periode passee : elle s'affiche decochee, la date en sourdine */
.verifbox.perime .verifdate b{color:var(--v-lav) !important;font-weight:400}