:root{
  --red:#e2231a; --red-dark:#a3160f; --gold:#c9a24a; --bg:#0a0a0c; --bg-panel:#141417; --bg-panel-2:#1b1b1f;
  --line:#2a2a30; --text:#f2f2f2; --text-dim:#9a9ba3; --green:#2fa84f; --blue:#2e7dd1;
  --amber:#c98a1f; --purple:#8a5fd6; --radius:10px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:
    radial-gradient(circle at 15% 0%, rgba(226,35,26,.08), transparent 40%),
    repeating-linear-gradient(120deg, rgba(255,255,255,.015) 0 2px, transparent 2px 26px),
    var(--bg);
  color:var(--text); font-family:'Inter',system-ui,sans-serif; min-height:100vh;
}
h1,h2,h3,h4,.brand-font{font-family:'Archivo','Inter',sans-serif; letter-spacing:.02em;}
.cine{font-family:'Bebas Neue','Archivo',sans-serif; letter-spacing:.06em;}
a{color:inherit; text-decoration:none; cursor:pointer;}
.banner-demo{
  background:linear-gradient(90deg, rgba(226,35,26,.25), rgba(226,35,26,.02));
  border:1px solid rgba(226,35,26,.4); color:#ffdad6; font-size:12px; font-weight:700;
  padding:9px 16px; text-align:center;
}
.shell{display:flex; min-height:100vh;}

/* ---------------- sidebar ---------------- */
.sidebar{
  width:298px; flex:0 0 298px; background:linear-gradient(180deg,#0e0e11,#08080a);
  border-right:1px solid var(--line); padding:22px 18px; position:sticky; top:0; height:100vh;
  display:flex; flex-direction:column; gap:20px;
}
.sidebar .logo-wrap{display:flex; align-items:center; padding:0 2px;}
.sidebar .logo-wrap img{width:100%; max-width:250px; display:block; filter:drop-shadow(0 0 14px rgba(226,35,26,.25));}
.tagline{font-size:10.5px; color:var(--text-dim); letter-spacing:.045em; text-transform:uppercase; padding:0 2px; text-align:center; white-space:nowrap;}
.tagline b{color:var(--red);} .tagline .g{color:var(--green);} .tagline .bl{color:var(--blue);}
nav.mainnav{display:flex; flex-direction:column; gap:1px; margin-top:6px; overflow-y:auto; flex:1;}
.nav-section{display:flex; flex-direction:column; margin-bottom:2px;}
.nav-section-label{font-size:10.5px; font-weight:800; text-transform:uppercase; letter-spacing:.09em; color:var(--text-dim);
  padding:11px 12px; opacity:.85; display:flex; align-items:center; gap:9px; user-select:none;
  border:1px solid transparent; border-radius:8px;}
.nav-section-label.clickable{cursor:pointer;}
.nav-section-label.clickable:hover{background:var(--bg-panel); opacity:1;}
.nav-section-label.open{
  background:linear-gradient(90deg, rgba(226,35,26,.16), rgba(226,35,26,.03));
  border-color:rgba(226,35,26,.3); color:#fff; opacity:1;
  box-shadow:inset 3px 0 0 var(--red);
}
.nav-chevron{display:inline-flex; align-items:center; justify-content:center; width:14px; height:14px;
  font-size:10px; transition:transform .18s ease, color .18s ease; opacity:.6; color:var(--text-dim);}
.nav-section-label.open .nav-chevron{transform:rotate(90deg); color:var(--red); opacity:1;}
.nav-sub{display:flex; flex-direction:column; gap:2px; padding:4px 0 6px 14px; margin-left:11px;
  border-left:2px solid rgba(226,35,26,.25);}
.nav-section-label:first-child{padding-top:12px;}
nav.mainnav a{display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:8px;
  color:var(--text-dim); font-weight:600; font-size:14px; border:1px solid transparent;}
nav.mainnav a:hover{background:var(--bg-panel); color:var(--text);}
nav.mainnav a.active{background:linear-gradient(90deg, rgba(226,35,26,.18), rgba(226,35,26,.02));
  color:#fff; border-color:rgba(226,35,26,.35); box-shadow:inset 3px 0 0 var(--red);}
nav.mainnav .ico{width:8px; height:8px; border-radius:50%; background:currentColor; opacity:.5; flex:0 0 8px;}
.nav-section-icon{width:16px; height:16px; flex:0 0 16px; opacity:.8;}
.nav-section-label.open .nav-section-icon{opacity:1; color:var(--red);}
.new-badge{display:inline-flex; align-items:center; justify-content:center; min-width:19px; height:19px; padding:0 5px;
  border-radius:999px; background:var(--red); color:#fff; font-size:10.5px; font-weight:800; margin-left:auto;
  box-shadow:0 0 0 2px rgba(226,35,26,.2);}
.task-row.is-unseen, .log-card.is-unseen{border-color:#e8c93d; box-shadow:0 0 0 1px rgba(232,201,61,.3) inset;}
.task-row.is-unseen .projet, .log-card.is-unseen .log-date{
  text-decoration:underline; text-decoration-color:#e8c93d; text-decoration-thickness:2px; text-underline-offset:3px;}
.unseen-tag{display:inline-flex; align-items:center; gap:4px; font-size:9.5px; font-weight:800; text-transform:uppercase;
  letter-spacing:.05em; color:#0c0c0e; background:#e8c93d; padding:2px 7px; border-radius:999px; margin-left:8px;}
.project-tile.is-unseen{border-color:#e8c93d; box-shadow:0 0 0 1px rgba(232,201,61,.25) inset;}
.project-tile .new-badge{position:absolute; top:14px; right:14px; margin-left:0;}

/* ---------------- clients & employees ---------------- */
.person-directory-card{display:flex; flex-direction:column; gap:6px;}
.person-directory-card .pname{font-size:15px; font-weight:800;}
.person-directory-card .prole{font-size:12px; color:var(--text-dim);}
.person-directory-card .pmeta{font-size:12px; color:#c9c9cf; margin-top:2px;}
.person-directory-card .pactions{margin-top:10px; display:flex; gap:8px;}

/* ---------------- inventory / QR labels ---------------- */
.qr-label-grid{display:flex; flex-wrap:wrap; gap:14px; margin-top:16px;}
.qr-label{width:200px; background:#fff; color:#0a0a0a; border-radius:10px; padding:16px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:6px; border:1px solid #ddd;}
.qr-label .qr-slot{width:150px; height:150px; display:flex; align-items:center; justify-content:center;}
.qr-label .qr-slot svg{width:100%; height:100%;}
.qr-label .lbl-cat{font-weight:900; font-size:13px; text-transform:uppercase; letter-spacing:.03em; color:#111;}
.qr-label .lbl-emp{font-weight:800; font-size:20px; color:#e2231a;}
.qr-label .lbl-brand{font-size:9px; color:#888; text-transform:uppercase; letter-spacing:.1em; margin-top:2px;}
.qr-label .lbl-remove{margin-top:6px;}
.inv-row{display:flex; align-items:center; gap:14px; background:var(--bg-panel); border:1px solid var(--line);
  border-radius:var(--radius); padding:12px 16px; margin-bottom:8px;}
.inv-row .inv-emp{font-family:'Archivo'; font-weight:900; font-size:16px; color:var(--red); width:64px; flex:0 0 64px;}
.inv-row .inv-body{flex:1; min-width:0;}
.inv-row .inv-name{font-weight:800; font-size:13.5px;}
.inv-row .inv-meta{font-size:11.5px; color:var(--text-dim); margin-top:2px;}
.inv-row .inv-qty{display:flex; align-items:center; gap:8px;}
.inv-row .inv-qty .qty-n{font-family:'Archivo'; font-weight:900; font-size:18px; min-width:28px; text-align:center;}
.cat-pill{display:inline-flex; padding:2px 9px; border-radius:999px; font-size:10.5px; font-weight:700; background:var(--bg-panel-2); border:1px solid var(--line); color:var(--text-dim);}

/* ---------------- rendez-vous ---------------- */
.rdv-toolbar{display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-bottom:20px; padding:14px 16px;
  background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius);}
.rdv-view-toggle{display:flex; gap:4px;}
.rdv-nav{display:flex; align-items:center; gap:6px;}
.rdv-ref-date{font-weight:800; font-size:13px; margin-left:6px; text-transform:capitalize; min-width:160px;}
.rdv-filter{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.rdv-toolbar > .btn{margin-left:auto;}
.rdv-groupe-picker{display:flex; flex-wrap:wrap; gap:6px; max-width:480px;}
.rdv-groupe-chip{display:flex; align-items:center; gap:5px; font-size:11.5px; background:var(--bg-panel-2);
  border:1px solid var(--line); border-radius:999px; padding:4px 10px 4px 8px; cursor:pointer; white-space:nowrap;}
.rdv-groupe-chip input{width:auto; margin:0;}

.tech-picker-list{display:flex; flex-direction:column; gap:3px; max-height:230px; overflow-y:auto;
  border:1px solid var(--line); border-radius:8px; padding:5px; background:var(--bg-panel-2); max-width:420px;}
.tech-picker-row{display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:8px 10px; border-radius:6px; cursor:pointer; font-size:12.5px; user-select:none;}
.tech-picker-row:hover{background:rgba(255,255,255,.06);}
.tech-picker-row:has(input:checked){background:rgba(226,35,26,.18); font-weight:700;}
.tech-picker-row input{position:absolute; opacity:0; width:1px; height:1px;}
.tech-picker-check{width:16px; height:16px; border-radius:50%; border:1px solid var(--line); flex:0 0 16px;
  display:flex; align-items:center; justify-content:center; font-size:10px; color:transparent;}
.tech-picker-row:has(input:checked) .tech-picker-check{background:var(--red); border-color:var(--red); color:#fff;}
.tech-chips{display:flex; flex-wrap:wrap; gap:6px; min-height:8px;}
.tech-chips:empty{min-height:0;}
.tech-chip{display:inline-flex; align-items:center; gap:6px; padding:5px 6px 5px 11px; border-radius:999px;
  background:rgba(226,35,26,.16); border:1px solid rgba(226,35,26,.45); color:var(--text); font-size:13px; font-weight:600;}
.tech-chip-x{border:none; background:rgba(255,255,255,.10); color:var(--text); width:18px; height:18px; line-height:1;
  border-radius:50%; cursor:pointer; font-size:14px; display:flex; align-items:center; justify-content:center; padding:0;}
.tech-chip-x:hover{background:var(--red); color:#fff;}

.rdv-day-list{display:flex; flex-direction:column; gap:8px;}
.rdv-card{display:flex; align-items:center; gap:14px; background:var(--bg-panel); border:1px solid var(--line);
  border-radius:var(--radius); padding:12px 16px;}
.rdv-card-time{font-family:'Archivo'; font-weight:800; font-size:13.5px; color:var(--red); flex:0 0 100px;}
.rdv-card-body{flex:1; min-width:0;}
.rdv-card-title{font-weight:800; font-size:13.5px;}
.rdv-card-meta{display:flex; flex-wrap:wrap; gap:10px; font-size:11.5px; color:var(--text-dim); margin-top:4px; align-items:center;}
.rdv-card-lien{font-size:11px; color:var(--text-dim); margin-top:4px;}

.rdv-week-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:8px;}
.rdv-week-day{background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius); min-height:160px; overflow:hidden;}
.rdv-week-day.is-today{border-color:rgba(226,35,26,.5);}
.rdv-week-day-head{padding:8px 10px; font-size:11px; font-weight:800; text-transform:capitalize; text-align:center;
  background:var(--bg-panel-2); cursor:pointer; border-bottom:1px solid var(--line);}
.rdv-week-day.is-today .rdv-week-day-head{color:var(--red);}
.rdv-week-day-items{display:flex; flex-direction:column; gap:5px; padding:6px;}
.rdv-chip{background:var(--bg-panel-2); border-left:3px solid #888; border-radius:4px; padding:5px 7px; font-size:10.5px;}
.rdv-chip-time{font-weight:800; color:var(--red);}
.rdv-chip-title{font-weight:700; line-height:1.25; margin-top:1px;}
.rdv-chip-tech{color:var(--text-dim); margin-top:1px;}

.rdv-month-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:6px;}
.rdv-month-dow{font-size:10px; font-weight:800; text-transform:uppercase; color:var(--text-dim); text-align:center; padding-bottom:4px;}
.rdv-month-cell{background:var(--bg-panel); border:1px solid var(--line); border-radius:8px; min-height:90px;
  padding:6px; cursor:pointer; overflow:hidden;}
.rdv-month-cell:hover{border-color:rgba(226,35,26,.4);}
.rdv-month-cell.is-outside{opacity:.35;}
.rdv-month-cell.is-today{border-color:var(--red);}
.rdv-month-daynum{font-size:11px; font-weight:800; margin-bottom:4px;}
.rdv-month-dot{font-size:9.5px; background:var(--bg-panel-2); border-radius:3px; padding:2px 5px; margin-bottom:3px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#fff;}
.rdv-month-more{font-size:9px; color:var(--text-dim);}

.inv-detail-layout{display:flex; gap:16px; flex-wrap:wrap; align-items:flex-start;}
.inv-photo{width:110px; height:110px; object-fit:cover; border-radius:8px; border:1px solid var(--line); flex:0 0 110px;}
.inv-photo-empty{width:110px; height:110px; display:flex; align-items:center; justify-content:center; flex:0 0 110px;
  border-radius:8px; border:1px dashed var(--line); color:var(--text-dim); font-size:11.5px; background:var(--bg-panel-2);}
.inv-qr-wrap{width:110px; height:110px; background:#fff; border-radius:8px; padding:6px; display:flex; align-items:center; justify-content:center; flex:0 0 110px;}
.inv-qr-wrap svg{width:100%; height:100%;}
.inv-detail-grid{flex:1; min-width:220px; text-align:left; font-size:12.5px; color:#c9c9cf; display:flex; flex-direction:column; gap:6px;}
.lbl-mini{display:block; font-size:9.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--text-dim);}
.client-detail-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px 16px; font-size:12.5px;}
.client-detail-grid .full{grid-column:1/-1;}

.inv-list{display:flex; flex-direction:column; gap:1px; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; margin-bottom:8px;}
.inv-list-row{display:grid; grid-template-columns:40px 1fr auto auto; gap:14px; align-items:center;
  background:var(--bg-panel); padding:9px 14px; cursor:pointer; border-bottom:1px solid var(--line);}
.inv-list-row:last-child{border-bottom:none;}
.inv-list-row:hover{background:var(--bg-panel-2);}
.inv-thumb{width:32px; height:32px; border-radius:6px; object-fit:cover; border:1px solid var(--line);}
.inv-thumb-empty{width:32px; height:32px; border-radius:6px; border:1px dashed var(--line); display:flex; align-items:center; justify-content:center; color:var(--text-dim); font-size:11px; background:var(--bg-panel-2);}
.inv-list-name{font-size:13px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.inv-list-code{display:inline-block; margin-left:8px; font-size:10.5px; font-weight:600; color:var(--text-dim);}
.inv-list-emp{font-family:'Archivo'; font-weight:800; font-size:13px; color:var(--red); white-space:nowrap;}
.inv-list-qty{font-family:'Archivo'; font-weight:800; font-size:13px; white-space:nowrap; text-align:right; min-width:80px;}
@media print{
  body > *:not(#printArea){display:none !important;}
  #printArea{display:block !important; position:absolute; top:0; left:0; width:100%; background:#fff;}
  .qr-label{break-inside:avoid; page-break-inside:avoid;}
  .lbl-remove{display:none !important;}
}

.userbox{margin-top:auto;}
.userbox label{font-size:11px; color:var(--text-dim); text-transform:uppercase; letter-spacing:.08em; display:block; margin-bottom:6px;}
.userbox select{width:100%; background:var(--bg-panel); color:var(--text); border:1px solid var(--line);
  border-radius:8px; padding:8px; font-size:13px; font-family:inherit;}
.sidebar-foot{margin-top:10px; font-size:11px; color:var(--text-dim); padding:0 4px;}
.sidebar-crest{margin-top:4px; text-align:center; opacity:.5;}
.sidebar-crest img{width:52px;}

.main{flex:1; min-width:0; padding:0 0 60px;}
.main-inner{padding:26px 34px 0;}
.topbar{display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; flex-wrap:wrap; gap:12px;}
.topbar h1{margin:0; font-size:24px; font-weight:800;}
.topbar .sub{color:var(--text-dim); font-size:13px; margin-top:4px;}
.crumb{font-size:11px; color:var(--text-dim); margin-bottom:4px; text-transform:uppercase; letter-spacing:.08em;}
.crumb a{color:var(--red); font-weight:700;}

/* ---------------- cinematic hero ---------------- */
.hero-cine{width:100%; margin-bottom:28px; background:#000;}
.hero-image{
  position:relative; width:100%; aspect-ratio:2243/478; overflow:hidden;
  background:#000;
}
.hero-image .bg{
  position:absolute; inset:0; background-size:contain; background-repeat:no-repeat; background-position:center;
}
.hero-caption{position:relative; padding:26px 46px 30px; width:100%;
  background:linear-gradient(180deg, #121215, #0a0a0c); border-bottom:1px solid var(--line);}
.hero-caption .eyebrow{font-size:11px; letter-spacing:.35em; text-transform:uppercase; color:var(--red);
  font-weight:800; display:flex; align-items:center; gap:10px; margin-bottom:10px;}
.hero-caption .eyebrow::before{content:''; width:26px; height:2px; background:var(--red);}
.hero-caption h1.cine{
  font-size:44px; line-height:1; color:#fff; margin:0 0 12px;
  text-shadow:0 0 30px rgba(226,35,26,.25);
}
.hero-caption h1.cine b{color:var(--red);}
.hero-caption .sub{color:#d7d7dc; font-size:14px; max-width:700px; line-height:1.55;}
.hero-caption .hero-stats{display:flex; gap:26px; margin-top:20px; flex-wrap:wrap;}
.hero-caption .hero-stats .hs{display:flex; flex-direction:column; align-items:center; text-align:center;}
.hero-caption .hero-stats .hs .n{font-family:'Archivo'; font-weight:900; font-size:24px; color:#fff;}
.hero-caption .hero-stats .hs .l{font-size:10px; text-transform:uppercase; letter-spacing:.1em; color:var(--text-dim); white-space:nowrap;}
@media(max-width:900px){.hero-caption h1.cine{font-size:32px;} .hero-caption{padding:22px 24px 26px;}}

.strip-banner{position:relative; border-radius:var(--radius); overflow:hidden; margin-bottom:26px; border:1px solid var(--line); min-height:110px;}
.strip-banner .bg{position:absolute; inset:0; background-size:cover; background-position:center; opacity:.5;}
.strip-banner .overlay{position:absolute; inset:0; background:linear-gradient(90deg, rgba(0,0,0,.9), rgba(0,0,0,.35));}
.strip-banner .content{position:relative; z-index:2; padding:22px 26px;}
.strip-banner h3{margin:0; font-size:18px; font-weight:900; color:#fff;}
.strip-banner .sub{color:var(--text-dim); font-size:12.5px; margin-top:4px; max-width:480px;}

/* ---------------- grid / cards ---------------- */
.grid{display:grid; gap:16px;}
.grid.cols-6{grid-template-columns:repeat(6,1fr);}
.grid.cols-4{grid-template-columns:repeat(4,1fr);}
.grid.cols-3{grid-template-columns:repeat(3,1fr);}
.grid.cols-2{grid-template-columns:repeat(2,1fr);}
@media(max-width:1100px){.grid.cols-6{grid-template-columns:repeat(3,1fr);} .grid.cols-4{grid-template-columns:repeat(2,1fr);}}
.card{background:linear-gradient(180deg,var(--bg-panel-2),var(--bg-panel)); border:1px solid var(--line);
  border-radius:var(--radius); padding:16px 18px;}
.stat .n{font-family:'Archivo'; font-size:30px; font-weight:900; line-height:1;}
.stat .l{font-size:11px; color:var(--text-dim); text-transform:uppercase; letter-spacing:.08em; margin-top:8px;}
.stat .s{font-size:11px; color:var(--text-dim); margin-top:2px;}
.stat.accent-red .n{color:var(--red);} .stat.accent-green .n{color:var(--green);}
.stat.accent-blue .n{color:var(--blue);} .stat.accent-amber .n{color:var(--amber);}
.section-title{display:flex; align-items:center; gap:10px; margin:28px 0 12px; font-size:13px; font-weight:800;
  text-transform:uppercase; letter-spacing:.1em; color:var(--text-dim);}
.section-title::before{content:''; width:4px; height:16px; background:var(--red); border-radius:2px;}
.progress-track{background:#232327; border-radius:6px; height:8px; overflow:hidden; flex:1;}
.progress-fill{height:100%; background:linear-gradient(90deg,var(--red-dark),var(--red)); border-radius:6px; transition:width .3s;}
.progress-row{display:flex; align-items:center; gap:10px; font-size:12px;}
.leaflet-container{color:#333!important;font-family:sans-serif!important;font-size:12px!important;}
.leaflet-popup-content{color:#333!important;}
.leaflet-popup-content-wrapper{background:#fff!important;}
.leaflet-control-zoom a{color:#333!important;background:#fff!important;}
.leaflet-control-attribution{background:rgba(255,255,255,.8)!important;color:#555!important;}
.leaflet-control-attribution a{color:#0078a8!important;}
.edit-fullscreen{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1500;background:var(--bg-panel);overflow-y:auto;padding:24px 32px;animation:fadeInUp .2s ease;}
.edit-fullscreen .btn[type="submit"],.edit-fullscreen .btn[onclick*="save"],.edit-fullscreen .btn.primary{font-size:15px;padding:10px 28px;}
.edit-fullscreen::before{content:'';position:fixed;top:12px;right:16px;z-index:1501;}
.edit-fs-close{position:fixed;top:12px;right:16px;z-index:1502;background:var(--red);color:#fff;border:none;border-radius:50%;width:36px;height:36px;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.3);}
.edit-fs-close:hover{background:var(--red-dark);}
.progress-row .pct{width:42px; text-align:right; color:var(--text-dim); font-variant-numeric:tabular-nums;}
.person-card{display:flex; flex-direction:column; gap:10px;}
.person-card .head{display:flex; justify-content:space-between; align-items:baseline;}
.person-card .head b{font-size:15px;}
.metrics{display:flex; gap:14px; font-size:11px; color:var(--text-dim);}
.metrics span b{color:var(--text); font-size:13px;}
.badge{display:inline-flex; align-items:center; gap:5px; padding:2px 8px; border-radius:999px; font-size:11px; font-weight:700;}
.badge.retard{background:rgba(226,35,26,.14); color:#ff8b84;}
.badge.soon{background:rgba(201,138,31,.14); color:#e8b95a;}
.badge.active-yes{background:rgba(47,168,79,.16); color:#4fd875; border:1px solid rgba(47,168,79,.4);}
.badge.active-no{background:rgba(226,35,26,.16); color:#ff8b84; border:1px solid rgba(226,35,26,.4);}
.badge.status-pending{background:rgba(201,138,31,.16); color:#e8b95a; border:1px solid rgba(201,138,31,.4);}

/* ---------------- project cards (home) ---------------- */
.project-tile{
  display:flex; flex-direction:column; gap:12px; padding:18px 20px;
  background:linear-gradient(160deg, var(--bg-panel-2) 0%, var(--bg-panel) 100%);
  border:1px solid var(--line); border-radius:12px; position:relative; overflow:hidden;
}
.project-tile::before{content:''; position:absolute; top:0; left:0; width:4px; height:100%; background:var(--red); opacity:.7;}
.project-tile:hover{border-color:rgba(226,35,26,.5); transform:translateY(-1px); transition:.15s;}
.project-tile .code{font-size:10.5px; color:var(--red); font-weight:800; letter-spacing:.08em; text-transform:uppercase;}
.project-tile .name{font-size:15.5px; font-weight:800; line-height:1.3;}
.project-tile .cat-counts{display:flex; gap:8px; flex-wrap:wrap;}
.cat-chip{font-size:10.5px; font-weight:700; padding:3px 9px; border-radius:999px; background:var(--bg-panel-2); border:1px solid var(--line); color:var(--text-dim);}
.cat-chip.has{color:#fff; border-color:rgba(255,255,255,.18);}
.project-tile .people{font-size:11px; color:var(--text-dim);}
.project-tile .flags{display:flex; gap:6px; flex-wrap:wrap;}

/* ---------------- toolbar / lists ---------------- */
.toolbar{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:14px;}
.toolbar select, .toolbar input[type=text]{background:var(--bg-panel); border:1px solid var(--line); color:var(--text);
  padding:8px 10px; border-radius:8px; font-size:13px; font-family:inherit;}
.toolbar input[type=text]{min-width:220px;}
.btn{display:inline-flex; align-items:center; gap:6px; cursor:pointer; background:var(--red); color:#fff;
  border:none; border-radius:8px; padding:9px 16px; font-weight:700; font-size:13px; font-family:inherit;}
.btn:hover{background:var(--red-dark);}
.btn.secondary{background:var(--bg-panel-2); border:1px solid var(--line); color:var(--text);}
.btn.secondary:hover{background:var(--bg-panel);}
.btn.small{padding:5px 10px; font-size:12px;}
.btn.danger{background:transparent; border:1px solid rgba(226,35,26,.4); color:#ff8b84;}
.btn.danger:hover{background:rgba(226,35,26,.12);}
.btn.toggle-green{background:transparent; border:1px solid rgba(47,168,79,.45); color:#7be49a;}
.btn.toggle-green:hover{background:rgba(47,168,79,.12);}
.btn.toggle-green.active{background:var(--green); border-color:var(--green); color:#08150b; font-weight:800;}
.btn.toggle-blue{background:var(--blue); border:1px solid var(--blue); color:#fff; font-weight:800;}
.btn.toggle-blue:hover{background:#2569b0;}
.task-list{display:flex; flex-direction:column; gap:10px;}
.task-row{background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:14px 16px; display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:start;}
.task-row.overdue{border-color:rgba(226,35,26,.5); box-shadow:0 0 0 1px rgba(226,35,26,.15) inset;}
.task-row .num{width:26px; height:26px; border-radius:6px; background:var(--bg-panel-2); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:800; color:var(--text-dim);}
.task-row .body .projet{font-weight:800; font-size:13.5px; color:#fff;}
.task-row .body .tache{font-size:13px; color:var(--text-dim); margin-top:3px; line-height:1.45;}
.task-row .body .notes{font-size:12px; color:#c9c9cf; margin-top:6px; background:rgba(255,255,255,.03);
  border-left:2px solid var(--line); padding:6px 10px; border-radius:0 6px 6px 0;}
.task-row .meta{display:flex; flex-direction:column; gap:8px; align-items:flex-end; min-width:180px;}
.task-row .meta .assignee{font-size:12px; font-weight:700;}
.task-row .meta .date{font-size:11px; color:var(--text-dim);}
.task-row .meta .date.late{color:#ff8b84; font-weight:700;}
.task-row .foot{grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; margin-top:6px;
  border-top:1px dashed var(--line); padding-top:10px; gap:10px; flex-wrap:wrap;}
.task-row .foot .updated{font-size:11px; color:var(--text-dim);}
.status-pill{padding:4px 10px; border-radius:999px; font-size:11px; font-weight:800; text-transform:uppercase;
  letter-spacing:.03em; border:1px solid transparent;}
.quickform{display:flex; gap:8px; align-items:center;}
.quickform select, .quickform input[type=number]{background:var(--bg-panel-2); border:1px solid var(--line);
  color:var(--text); border-radius:6px; padding:5px 8px; font-size:12px; font-family:inherit;}
.quickform input[type=number]{width:60px;}
.panel-form{background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius); padding:18px; margin-bottom:20px;}
.panel-form h3{margin:0 0 14px; font-size:14px; text-transform:uppercase; letter-spacing:.08em; color:var(--text-dim);}
.form-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:12px;}
.form-grid .full{grid-column:1/-1;}
.form-grid label{display:block; font-size:11px; color:var(--text-dim); margin-bottom:5px; text-transform:uppercase; letter-spacing:.06em;}
.form-grid input, .form-grid select, .form-grid textarea{width:100%; background:var(--bg-panel-2); border:1px solid var(--line);
  color:var(--text); padding:9px 10px; border-radius:8px; font-family:inherit; font-size:13px;}
.form-grid textarea{min-height:64px; resize:vertical;}
.form-actions{margin-top:14px; display:flex; gap:10px;}
details.new-task-toggle{margin-bottom:16px;}
details.new-task-toggle > summary{cursor:pointer; list-style:none; display:inline-flex; align-items:center; gap:8px;
  background:var(--red); color:#fff; padding:9px 16px; border-radius:8px; font-weight:700; font-size:13px;}
details.new-task-toggle > summary::-webkit-details-marker{display:none;}
details.new-task-toggle[open] > summary{background:var(--red-dark);}
.cat-block{margin-bottom:26px;}
.cat-block .cat-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px;}
.cat-block .cat-head h4{margin:0; font-size:13px; text-transform:uppercase; letter-spacing:.08em; color:var(--text-dim);}
.cat-dot{width:8px; height:8px; border-radius:50%; display:inline-block; margin-right:8px;}
.cat-dot.todo{background:var(--blue);} .cat-dot.visite{background:var(--amber);} .cat-dot.jobs{background:var(--purple);}

.phase{margin-bottom:20px;}
.phase .phase-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:8px;}
.phase .phase-head h4{margin:0; font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--text-dim);}
.checklist-item{display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:8px; background:var(--bg-panel);
  border:1px solid var(--line); margin-bottom:6px; cursor:pointer;}
.checklist-item.done{opacity:.55;} .checklist-item.done .txt{text-decoration:line-through;}
.checklist-item .box{width:18px; height:18px; border-radius:5px; border:2px solid var(--line); flex:0 0 18px;
  display:flex; align-items:center; justify-content:center; font-size:12px;}
.checklist-item.done .box{background:var(--green); border-color:var(--green); color:#fff;}
.checklist-item .txt{font-size:13px;}
.empty{color:var(--text-dim); font-size:13px; padding:30px; text-align:center; border:1px dashed var(--line); border-radius:var(--radius);}

/* ---------------- charts ---------------- */
.donut{width:128px; height:128px; border-radius:50%; position:relative; flex:0 0 128px;}
.donut::after{content:''; position:absolute; inset:20px; border-radius:50%; background:var(--bg-panel);}
.donut-legend{display:flex; flex-direction:column; gap:7px; font-size:12px; min-width:160px;}
.legend-row{display:flex; align-items:center; gap:8px; color:var(--text-dim);}
.legend-row .dot{width:9px; height:9px; border-radius:50%; flex:0 0 9px;}
.legend-row b{color:#fff; margin-left:auto; font-variant-numeric:tabular-nums;}
.bar-chart{display:flex; flex-direction:column; gap:11px;}
.bar-row{display:flex; align-items:center; gap:10px; font-size:12px;}
.bar-label{width:120px; flex:0 0 120px; color:var(--text-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.bar-track{flex:1; background:#232327; border-radius:6px; height:14px; overflow:hidden;}
.bar-fill{height:100%; background:linear-gradient(90deg, var(--red-dark), var(--red)); border-radius:6px; transition:width .3s;}
.bar-value{width:26px; text-align:right; color:var(--text-dim); font-variant-numeric:tabular-nums;}

/* ---------------- daily logs ---------------- */
.log-card{background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; margin-bottom:12px;}
.log-card .log-head{display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:10px; margin-bottom:10px;}
.log-card .log-date{font-family:'Archivo'; font-weight:900; font-size:16px; color:#fff;}
.log-card .log-meta{font-size:11.5px; color:var(--text-dim); margin-top:2px;}
.log-card .log-project-link{font-size:11.5px; color:var(--red); font-weight:700; cursor:pointer;}
.log-field{margin-bottom:9px;}
.log-field .lbl{font-size:10px; text-transform:uppercase; letter-spacing:.07em; color:var(--text-dim); margin-bottom:3px;}
.log-field .val{font-size:13px; color:#e8e8ec; line-height:1.5; white-space:pre-wrap;}
.log-field.problemes .val{color:#ffb3ac;}
.weather-badge{display:inline-flex; align-items:center; gap:5px; padding:3px 10px; border-radius:999px; font-size:11px; font-weight:700; background:var(--bg-panel-2); border:1px solid var(--line); color:var(--text-dim);}
.photo-grid{display:flex; gap:8px; flex-wrap:wrap; margin-top:8px;}
.photo-grid img{width:74px; height:74px; object-fit:cover; border-radius:8px; border:1px solid var(--line); cursor:pointer;}
.photo-input-preview{display:flex; gap:8px; flex-wrap:wrap; margin-top:8px;}
.photo-input-preview img{width:60px; height:60px; object-fit:cover; border-radius:6px; border:1px solid var(--line);}
.flash{padding:10px 14px; border-radius:8px; margin-bottom:16px; font-size:13px; font-weight:600; border:1px solid var(--line);
  background:rgba(47,168,79,.12); border-color:rgba(47,168,79,.4); color:#7be49a;}
.hidden{display:none !important;}

/* ---------------- login overlay ---------------- */
.login-overlay{position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; background:#050506;}
.login-overlay .bg{position:absolute; inset:0; background-size:cover; background-position:center 30%; opacity:.24; filter:saturate(1.15) contrast(1.05);}
.login-overlay .vgn{position:absolute; inset:0; background:radial-gradient(ellipse at center, transparent 25%, rgba(0,0,0,.92) 100%);}
.login-overlay .grain{position:absolute; inset:0; background:repeating-linear-gradient(0deg, rgba(255,255,255,.02) 0 1px, transparent 1px 3px); mix-blend-mode:overlay; pointer-events:none;}

/* ---------------- task full-screen modal ---------------- */
.task-modal-overlay{position:fixed; inset:0; z-index:1500; background:rgba(0,0,0,.72); display:flex; align-items:flex-start; justify-content:center; padding:3vh 24px 24px;}
.task-modal-overlay.hidden{display:none;}
.task-modal{background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius); width:min(880px,100%); max-height:92vh; overflow-y:auto; padding:34px 38px; position:relative; box-shadow:0 20px 60px rgba(0,0,0,.55);}
.task-modal-close{position:absolute; top:16px; right:16px; width:36px; height:36px; border-radius:8px; border:1px solid var(--line); background:var(--bg-panel-2); color:var(--text); font-size:18px; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .15s ease, color .15s ease;}
.task-modal-close:hover{background:var(--red); color:#fff; border-color:var(--red);}
.task-modal .tm-projet{font-family:'Archivo','Inter',sans-serif; font-weight:900; font-size:22px; margin:0 44px 6px 0;}
.task-modal .tm-tache{font-size:15px; color:var(--text); margin-bottom:14px; white-space:pre-wrap;}
.task-modal .tm-notes{font-size:13.5px; color:var(--text-dim); white-space:pre-wrap; background:var(--bg-panel-2); border:1px solid var(--line); border-radius:8px; padding:12px 14px; margin-bottom:16px;}
.task-modal .tm-meta{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px;}
.task-modal .tm-updated{font-size:11.5px; color:var(--text-dim); margin-bottom:18px;}
.task-modal .tm-actions{display:flex; flex-wrap:wrap; gap:10px;}
.login-card{position:relative; z-index:2; width:400px; max-width:92vw; max-height:92vh; overflow-y:auto;
  background:linear-gradient(180deg, rgba(22,22,25,.97), rgba(9,9,11,.98)); border:1px solid var(--line); border-radius:14px;
  padding:32px 30px 26px; box-shadow:0 30px 90px rgba(0,0,0,.65), 0 0 0 1px rgba(226,35,26,.1);}
.login-card img.logo{width:200px; display:block; margin:0 auto 22px; filter:drop-shadow(0 0 16px rgba(226,35,26,.3));}
.login-tabs{display:flex; gap:6px; margin-bottom:20px; background:var(--bg-panel-2); border-radius:9px; padding:4px; border:1px solid var(--line);}
.login-tabs button{flex:1; background:transparent; border:none; color:var(--text-dim); font-weight:700; font-size:12.5px;
  padding:9px; border-radius:6px; cursor:pointer; font-family:inherit; letter-spacing:.02em;}
.login-tabs button.active{background:var(--red); color:#fff;}
.login-field{margin-bottom:13px;}
.login-field label{display:block; font-size:10.5px; color:var(--text-dim); text-transform:uppercase; letter-spacing:.07em; margin-bottom:5px;}
.login-field input, .login-field select{width:100%; background:var(--bg-panel-2); border:1px solid var(--line); color:var(--text);
  padding:10px 12px; border-radius:8px; font-family:inherit; font-size:13.5px;}
.login-row-2{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.login-error{background:rgba(226,35,26,.14); border:1px solid rgba(226,35,26,.4); color:#ff8b84; font-size:12px;
  padding:9px 11px; border-radius:8px; margin-bottom:14px;}
.login-submit{width:100%; margin-top:6px; justify-content:center; padding:11px 16px;}
.login-hint{font-size:11px; color:var(--text-dim); text-align:center; margin-top:16px; line-height:1.5;}
.login-eyebrow{font-size:10px; letter-spacing:.28em; text-transform:uppercase; color:var(--red); font-weight:800;
  text-align:center; margin-bottom:6px;}
.login-title{text-align:center; font-size:13px; color:var(--text-dim); margin-bottom:22px;}

/* ---------------- account panel (sidebar) ---------------- */
.account-panel{display:flex; flex-direction:column; gap:2px; padding:12px 12px; background:var(--bg-panel); border:1px solid var(--line); border-radius:10px;}

.top-account-widget{position:fixed; top:14px; right:20px; z-index:500;}

/* (ZIDX-001 / 5 septembre 2026) L'indicateur d'enregistrement etait a z-index:600,
   donc DERRIERE le fond des pop-up (#popupBackdrop 1590), les formulaires en pop-up
   (1600/1700) et l'editeur plein ecran (1500). Or c'est DANS ces pop-up qu'on saisit.
   Consequence : ni la coche verte ni -- bien plus grave -- le BANDEAU ROUGE
   "vos modifications ne sont PAS enregistrees" n'etaient visibles au moment ou ils
   comptent. On passe au-dessus de toutes les couches (le bouton plein ecran est a
   2000). pointer-events:none est deja pose : l'indicateur ne bloque aucun clic. */
.autosave-indicator{position:fixed; bottom:18px; right:20px; z-index:2100; background:var(--bg-panel);
  border:1px solid var(--line); color:var(--green); font-size:11.5px; font-weight:700; padding:7px 14px;
  border-radius:999px; opacity:0; transform:translateY(6px); transition:opacity .2s, transform .2s;
  box-shadow:0 8px 20px rgba(0,0,0,.35); pointer-events:none;}
.autosave-indicator.show{opacity:1; transform:translateY(0);}
/* (ZIDX-001) Un echec d'enregistrement ne doit pas se distinguer seulement par la
   couleur du texte sur une pastille de 11.5px : bordure rouge, fond teinte, et un peu
   plus grand. Meme forme, meme place -- rien a reapprendre pour l'equipe. */
.autosave-indicator.is-error{color:var(--red); border-color:var(--red); background:rgba(226,35,26,.16);
  font-size:12.5px; padding:9px 16px; max-width:min(560px, 92vw); text-align:right;
  border-radius:14px; white-space:normal; line-height:1.35;
  box-shadow:0 10px 26px rgba(226,35,26,.35);}
.top-account-btn{display:flex; align-items:center; gap:8px; background:var(--bg-panel); border:1px solid var(--line);
  color:var(--text); padding:7px 12px 7px 10px; border-radius:999px; font-size:12.5px; font-weight:700;
  cursor:pointer; font-family:inherit; box-shadow:0 4px 14px rgba(0,0,0,.35);}
.top-account-btn:hover{background:var(--bg-panel-2); border-color:rgba(226,35,26,.4);}
.top-account-dot{width:7px; height:7px; border-radius:50%; background:var(--green); flex:0 0 7px;
  box-shadow:0 0 0 3px rgba(47,168,79,.18);}
.top-account-caret{font-size:9px; opacity:.6; margin-left:2px;}
.top-account-menu{position:absolute; top:calc(100% + 8px); right:0; width:280px;
  background:linear-gradient(180deg, var(--bg-panel-2), var(--bg-panel)); border:1px solid var(--line);
  border-radius:12px; padding:14px; box-shadow:0 20px 50px rgba(0,0,0,.5);}
.account-panel .who{font-size:13px; font-weight:800;}
.account-panel .role{font-size:11px; color:var(--text-dim);}
.account-panel .gest-badge{display:inline-block; margin-top:6px; font-size:9.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase;
  color:var(--red); background:rgba(226,35,26,.14); border:1px solid rgba(226,35,26,.35); border-radius:999px; padding:2px 8px;}
.account-panel .logout-btn{margin-top:10px; width:100%; text-align:center; justify-content:center;}

/* ===== Fenêtres en pop-up (toutes ancrées vers le haut de la page) ===== */
#popupBackdrop{position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:1590; display:none;
  backdrop-filter:blur(1px);}
#popupBackdrop.show{display:block;}
details.new-task-toggle[open] > .panel-form,
.panel-form.pw,
[id^="user-edit-"]:not(.hidden),
[id^="emp-edit-"]:not(.hidden),
[id^="emp-camion-"]:not(.hidden),
[id^="client-detail-"]:not(.hidden),
[id^="client-edit-"]:not(.hidden),
[id^="soum-edit-"]:not(.hidden),
[id^="bt-detail-"]:not(.hidden),
[id^="bt-edit-"]:not(.hidden),
[id^="service-edit-"]:not(.hidden),
[id^="achat-detail-"]:not(.hidden),
[id^="facture-edit-"]:not(.hidden){
  position:fixed !important;
  top:3vh; left:50%; transform:translateX(-50%);
  width:min(920px,95vw); max-height:90vh; overflow-y:auto;
  z-index:1600; margin:0 !important;
  box-shadow:0 24px 70px rgba(0,0,0,.62);
  animation:pwPopIn .16s ease-out;
}
/* les conteneurs "détail/modifier" (transparents) reçoivent un fond pour bien former une fenêtre */
[id^="user-edit-"]:not(.hidden),
[id^="emp-edit-"]:not(.hidden),
[id^="emp-camion-"]:not(.hidden),
[id^="client-detail-"]:not(.hidden),
[id^="client-edit-"]:not(.hidden),
[id^="soum-edit-"]:not(.hidden),
[id^="bt-detail-"]:not(.hidden),
[id^="bt-edit-"]:not(.hidden),
[id^="service-edit-"]:not(.hidden),
[id^="achat-detail-"]:not(.hidden),
[id^="facture-edit-"]:not(.hidden){
  background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px;
}
/* le contenu interne d'un conteneur-fenêtre ne double pas le cadre */
[id^="client-detail-"]:not(.hidden) > .card,
[id^="achat-detail-"]:not(.hidden) > .card,
[id^="bt-detail-"]:not(.hidden) > .card,
[id^="user-edit-"]:not(.hidden) > .panel-form,
[id^="emp-edit-"]:not(.hidden) > .panel-form,
[id^="client-edit-"]:not(.hidden) > .panel-form,
[id^="soum-edit-"]:not(.hidden) > .panel-form,
[id^="bt-edit-"]:not(.hidden) > .panel-form,
[id^="service-edit-"]:not(.hidden) > .panel-form,
[id^="facture-edit-"]:not(.hidden) > .panel-form{
  border:none; background:transparent; padding:0; margin:0;
}
@keyframes pwPopIn{ from{opacity:0; transform:translate(-50%,-12px);} to{opacity:1; transform:translateX(-50%);} }
@media (max-width:600px){
  details.new-task-toggle[open] > .panel-form, .panel-form.pw,
  [id^="user-edit-"]:not(.hidden),[id^="emp-edit-"]:not(.hidden),[id^="emp-camion-"]:not(.hidden),
  [id^="client-detail-"]:not(.hidden),[id^="client-edit-"]:not(.hidden),[id^="soum-edit-"]:not(.hidden),
  [id^="bt-detail-"]:not(.hidden),[id^="bt-edit-"]:not(.hidden),[id^="service-edit-"]:not(.hidden),
  [id^="achat-detail-"]:not(.hidden),[id^="facture-edit-"]:not(.hidden){ top:1.5vh; width:97vw; }
}

/* ===== Tableau des clients (style grille, comme le système actuel) ===== */
.client-table-wrap{border:1px solid var(--line); border-radius:var(--radius); overflow:auto; max-height:calc(100vh - 260px); background:var(--bg-panel);}
.client-table{width:100%; border-collapse:collapse; font-size:13px; white-space:nowrap;}
.client-table thead th{position:sticky; top:0; z-index:2; text-align:left; font-weight:800; font-size:11.5px;
  text-transform:uppercase; letter-spacing:.04em; color:var(--text); background:var(--bg-panel-2);
  padding:9px 12px; border-bottom:1px solid var(--line); border-right:1px solid var(--line);}
.client-table thead th:last-child{border-right:none;}
.client-table tbody td{padding:7px 12px; border-bottom:1px solid rgba(255,255,255,.05); border-right:1px solid rgba(255,255,255,.04);
  overflow:hidden; text-overflow:ellipsis; max-width:340px;}
.client-table tbody td:last-child{border-right:none;}
.client-table tbody tr{cursor:pointer;}
.client-table tbody tr:nth-child(even){background:rgba(255,255,255,.018);}
.client-table tbody tr:hover{background:rgba(46,125,209,.20);}
.client-table td.cnum{font-weight:700; color:var(--text); font-variant-numeric:tabular-nums;}
.client-table td.cnom{font-weight:600;}
.client-table td.cdim{color:var(--text-dim);}
.client-table .ct-dot{display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--red); margin-right:6px; vertical-align:middle;}

/* Bouton X de fermeture, présent sur toutes les fenêtres pop-up */
.pw-x{position:absolute; top:10px; right:10px; width:32px; height:32px; border-radius:8px;
  border:1px solid var(--line); background:var(--bg-panel-2); color:var(--text); font-size:19px; line-height:1;
  font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:5;
  transition:background .15s ease, color .15s ease, border-color .15s ease;}
.pw-x:hover{background:var(--red); color:#fff; border-color:var(--red);}
/* un peu d'air en haut à droite pour ne pas cacher le titre sous le X */
details.new-task-toggle[open] > .panel-form, .panel-form.pw{padding-right:52px;}
[id^="user-edit-"]:not(.hidden),[id^="emp-edit-"]:not(.hidden),[id^="emp-camion-"]:not(.hidden),
[id^="client-detail-"]:not(.hidden),[id^="client-edit-"]:not(.hidden),[id^="soum-edit-"]:not(.hidden),
[id^="bt-detail-"]:not(.hidden),[id^="bt-edit-"]:not(.hidden),[id^="service-edit-"]:not(.hidden),
[id^="achat-detail-"]:not(.hidden),[id^="facture-edit-"]:not(.hidden){padding-right:52px;}

/* ============================================================
   FENÊTRES PLEIN ÉCRAN (logiciel PC) — chaque fenêtre remplit
   l'écran, avec un X toujours visible en haut à droite.
   ============================================================ */
details.new-task-toggle[open] > .panel-form,
.panel-form.pw,
[id^="user-edit-"]:not(.hidden),[id^="emp-edit-"]:not(.hidden),[id^="emp-camion-"]:not(.hidden),
[id^="client-detail-"]:not(.hidden),[id^="client-edit-"]:not(.hidden),[id^="soum-edit-"]:not(.hidden),
[id^="bt-detail-"]:not(.hidden),[id^="bt-edit-"]:not(.hidden),[id^="service-edit-"]:not(.hidden),
[id^="achat-detail-"]:not(.hidden),[id^="facture-edit-"]:not(.hidden),
.task-modal{
  position:fixed !important; inset:0 !important; top:0 !important; left:0 !important; right:0 !important; bottom:0 !important;
  transform:none !important; width:100vw !important; height:100vh !important;
  max-width:none !important; max-height:100vh !important; min-height:100vh !important;
  border:none !important; border-radius:0 !important; margin:0 !important;
  overflow-y:auto !important; z-index:1600 !important;
  padding:72px max(24px,7vw) 48px !important;
  box-shadow:none !important; background:var(--bg-panel) !important;
  animation:pwFsIn .18s ease-out;
}
@keyframes pwFsIn{ from{opacity:0;} to{opacity:1;} }
/* l'overlay de la fiche : le contenu remplit déjà l'écran, on retire fond + centrage */
.task-modal-overlay{padding:0 !important; align-items:stretch !important; justify-content:stretch !important; background:transparent !important; z-index:1600 !important;}
/* X de fermeture toujours visible en haut à droite de l'écran */
.pw-x, .task-modal-close{
  position:fixed !important; top:16px !important; right:18px !important;
  width:44px !important; height:44px !important; border-radius:10px !important; font-size:24px !important; z-index:1700 !important;
}
/* Bouton Enregistrer toujours visible en haut à GAUCHE des fenêtres-formulaires */
.pw-save{
  background:#2fa84f; color:#fff; border:1px solid #2fa84f; border-radius:10px;
  padding:0 18px; height:44px; min-height:44px; font-weight:800; font-size:15px; cursor:pointer;
  display:inline-flex; align-items:center; gap:6px; font-family:inherit; line-height:1;
}
.pw-save svg{ flex:0 0 auto; display:block; }
.pw-save span{ display:block; }
.pw-save:hover{ background:#268a41; border-color:#268a41; }
/* Titre de la fenêtre en BLANC GRAS bien visible — on sait toujours où on se situe */
details.new-task-toggle[open] > .panel-form h3,
.panel-form.pw h3,
[id^="user-edit-"]:not(.hidden) h3, [id^="user-edit-"]:not(.hidden) h4,
[id^="emp-edit-"]:not(.hidden) h3, [id^="emp-edit-"]:not(.hidden) h4,
[id^="emp-camion-"]:not(.hidden) h3, [id^="emp-camion-"]:not(.hidden) h4,
[id^="client-detail-"]:not(.hidden) h3, [id^="client-detail-"]:not(.hidden) h4,
[id^="client-edit-"]:not(.hidden) h3, [id^="client-edit-"]:not(.hidden) h4,
[id^="soum-edit-"]:not(.hidden) h3, [id^="soum-edit-"]:not(.hidden) h4,
[id^="bt-detail-"]:not(.hidden) h3, [id^="bt-detail-"]:not(.hidden) h4,
[id^="bt-edit-"]:not(.hidden) h3, [id^="bt-edit-"]:not(.hidden) h4,
[id^="service-edit-"]:not(.hidden) h3, [id^="service-edit-"]:not(.hidden) h4,
[id^="achat-detail-"]:not(.hidden) h3, [id^="achat-detail-"]:not(.hidden) h4,
[id^="facture-edit-"]:not(.hidden) h3, [id^="facture-edit-"]:not(.hidden) h4,
.task-modal .tm-projet{
  color:#ffffff !important; font-weight:900 !important; font-size:22px !important;
  letter-spacing:.01em !important; text-transform:none !important; margin:0 0 20px !important;
}

/* ===== Polices agrandies dans les fenêtres plein écran ===== */
/* base du contenu */
details.new-task-toggle[open] > .panel-form,
.panel-form.pw,
[id*="-edit-"]:not(.hidden),
[id*="-detail-"]:not(.hidden),
[id^="emp-camion-"]:not(.hidden),
.task-modal{ font-size:15px !important; }
/* étiquettes des champs */
details.new-task-toggle[open] > .panel-form label,
.panel-form.pw label,
[id*="-edit-"]:not(.hidden) label,
[id*="-detail-"]:not(.hidden) label,
[id^="emp-camion-"]:not(.hidden) label,
.task-modal label{ font-size:14px !important; margin-bottom:6px !important; }
/* champs de saisie */
details.new-task-toggle[open] > .panel-form input,
details.new-task-toggle[open] > .panel-form select,
details.new-task-toggle[open] > .panel-form textarea,
.panel-form.pw input, .panel-form.pw select, .panel-form.pw textarea,
[id*="-edit-"]:not(.hidden) input, [id*="-edit-"]:not(.hidden) select, [id*="-edit-"]:not(.hidden) textarea,
[id*="-detail-"]:not(.hidden) input, [id*="-detail-"]:not(.hidden) select, [id*="-detail-"]:not(.hidden) textarea,
[id^="emp-camion-"]:not(.hidden) input, [id^="emp-camion-"]:not(.hidden) select, [id^="emp-camion-"]:not(.hidden) textarea,
.task-modal input, .task-modal select, .task-modal textarea{ font-size:16px !important; padding:11px 13px !important; }
/* contenu des fiches (grille de détail) */
details.new-task-toggle[open] > .panel-form .client-detail-grid,
.panel-form.pw .client-detail-grid,
[id*="-detail-"]:not(.hidden) .client-detail-grid,
.task-modal .client-detail-grid{ font-size:16px !important; gap:14px 22px !important; }
/* mini-étiquettes des fiches */
details.new-task-toggle[open] > .panel-form .lbl-mini,
[id*="-detail-"]:not(.hidden) .lbl-mini,
.task-modal .lbl-mini{ font-size:12px !important; margin-bottom:3px !important; }
/* boutons et notes dans les fenêtres */
details.new-task-toggle[open] > .panel-form .btn,
.panel-form.pw .btn,
[id*="-edit-"]:not(.hidden) .btn,
[id*="-detail-"]:not(.hidden) .btn,
.task-modal .btn{ font-size:15px !important; padding:11px 20px !important; }
.task-modal .tm-tache{ font-size:17px !important; }
.task-modal .tm-notes{ font-size:15px !important; }
/* Onglets et sous-onglets en MAJUSCULES + police uniforme (référence = onglets principaux) */
.nav-section-label{ text-transform:uppercase; }
nav.mainnav a.sub-link{ font-size:10.5px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
/* Module intégré (iframe isolée) */
.embed-frame{ width:100%; height:calc(100vh - 150px); min-height:560px; border:1px solid var(--line); border-radius:10px; background:#0d0e10; display:block; }
/* Mode plein écran des sous-onglets */
.fullscreen-close{ display:none; position:fixed; top:14px; right:20px; z-index:2000; width:44px; height:44px;
  border-radius:10px; background:var(--red); color:#fff; border:none; font-size:20px; cursor:pointer; pointer-events:auto;
  align-items:center; justify-content:center; box-shadow:0 4px 16px rgba(0,0,0,.45); }
.fullscreen-close:hover{ filter:brightness(1.12); }
body.fullscreen .sidebar{ display:none; }
body.fullscreen .top-account-widget{ right:78px; }
body.fullscreen .main-inner{ padding:22px 30px 0; }
body.fullscreen .embed-frame{ height:calc(100vh - 118px); }

/* ============================================================
   AUDIT AFFICHAGE (2026) - robustesse des longs textes : noms,
   courriels et adresses avec accents ne debordent jamais de leur
   boite. Purement additif : n'agit que si un mot depasse sa boite,
   sans modifier aucune mise en page existante.
   ============================================================ */
.project-tile .name,
.rdv-card-title,
.rdv-card-lien,
.person-directory-card .pname,
.person-directory-card .pmeta,
.inv-row .inv-name,
.task-modal .tm-projet{
  overflow-wrap:break-word;
  word-break:break-word;
}

/* === Script 47 (10 aout 2026) : accessibilite clavier + adaptation mobile === */

/* Contour visible sur l'element actif au clavier (Tab), absent jusqu'ici. */
:focus-visible{
  outline:2px solid var(--red);
  outline-offset:2px;
}

/* Sur petit ecran, la sidebar de 298px fixes ecrasait le contenu principal
   (ne laissait presque plus de place). On empile la sidebar au-dessus du
   contenu au lieu de les mettre cote a cote. */
@media (max-width:768px){
  .shell{ flex-direction:column; }
  .sidebar{
    width:100%; flex:0 0 auto; position:static; height:auto;
    padding:14px 16px;
  }
  nav.mainnav{ overflow-y:visible; flex:0 0 auto; }
}