:root {
  --bg: #f4f6f9; --card: #ffffff; --ink: #1c2733; --muted: #6b7885; --line: #dde3ea;
  --brand: #1f3a5f; --brand-2: #2f6fb3; --ok: #2e8b57; --warn: #c98a12; --bad: #c0392b;
  --radius: 10px;
}
* { box-sizing: border-box; }
body { margin: 0; font: 14px/1.45 "Segoe UI", system-ui, -apple-system, Roboto, sans-serif; color: var(--ink); background: var(--bg); }
a { color: var(--brand-2); text-decoration: none; }
a:hover { text-decoration: underline; }

header.top { background: var(--brand); color: #fff; display: flex; align-items: center; gap: 24px; padding: 0 20px; height: 52px; position: sticky; top: 0; z-index: 20; }
header.top .logo { font-weight: 700; letter-spacing: .2px; }
header.top nav { display: flex; gap: 4px; }
header.top nav a { color: #d7e3f2; padding: 8px 12px; border-radius: 8px; }
header.top nav a:hover { background: rgba(255,255,255,.12); text-decoration: none; }
header.top nav a.active { background: rgba(255,255,255,.2); color: #fff; }

header.top .right { margin-left: auto; display: flex; align-items: center; gap: 18px; }
.sync { font-size: 12px; color: #b9cde4; display: flex; align-items: center; gap: 6px; text-decoration: none; }
.sync[hidden] { display: none; }
.sync::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #5ec98a; }
.sync.off::before, .sync.warn::before { background: #e0a43a; }
.sync.off, .sync.warn { color: #f3d9a4; }
.sync.bad::before { background: #ef6b5e; }
.sync.bad { color: #ffd2cd; font-weight: 600; }
a.sync:hover { text-decoration: underline; }

main { padding: 20px; max-width: 1700px; margin: 0 auto; }
h1 { font-size: 22px; margin: 0 0 4px; }
h2 { font-size: 16px; margin: 0 0 10px; }
.sub { color: var(--muted); margin: 0 0 16px; }

.flash { padding: 10px 14px; border-radius: 8px; margin-bottom: 12px; border: 1px solid; }
.flash.ok { background: #e8f5ee; border-color: #b9e0c9; color: #1d6b42; }
.flash.error { background: #fdecea; border-color: #f3c0ba; color: #9c2b20; }

.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin-bottom: 18px; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; }
.card .big { font-size: 30px; font-weight: 700; line-height: 1.1; }
.card .lbl { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .5px; }
.card.alert { border-color: #f0c7c2; background: #fff7f6; }
.card.alert .big { color: var(--bad); }
.grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 14px; margin-bottom: 18px; }

.bar { background: #e6ebf1; border-radius: 6px; height: 8px; overflow: hidden; min-width: 70px; }
.bar > span { display: block; height: 100%; background: var(--brand-2); }
.bar.good > span { background: var(--ok); }

.toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 12px; margin-bottom: 12px; }
.toolbar .spacer { flex: 1; }
input, select, textarea { font: inherit; color: inherit; border: 1px solid var(--line); border-radius: 6px; padding: 5px 8px; background: #fff; }
input:focus, select:focus, textarea:focus { outline: 2px solid #9cc3ea; border-color: var(--brand-2); }
button, .btn { font: inherit; border: 1px solid var(--brand); background: var(--brand); color: #fff; padding: 6px 14px; border-radius: 7px; cursor: pointer; display: inline-block; }
button:hover, .btn:hover { background: #17304f; text-decoration: none; }
.btn.light, button.light { background: #fff; color: var(--brand); }
.btn.light:hover, button.light:hover { background: #eef3f9; }
button.danger { background: #fff; color: var(--bad); border-color: #e6b5af; }
button.danger:hover { background: #fdecea; }
button.link { background: none; border: none; color: var(--brand-2); padding: 0 4px; }

.tablewrap { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: auto; max-height: calc(100vh - 210px); }
table { border-collapse: collapse; width: 100%; }
thead th { position: sticky; top: 0; background: #eef2f7; text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: #44525f; padding: 8px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; z-index: 2; }
tbody td { padding: 4px 8px; border-bottom: 1px solid #edf0f4; vertical-align: top; }
tbody tr:hover { background: #f7fafd; }
td.r, th.r { text-align: right; }
td.nw { white-space: nowrap; }
td input, td select { width: 100%; min-width: 100px; padding: 3px 6px; border-color: transparent; background: transparent; }
td input:hover, td select:hover { border-color: var(--line); background: #fff; }
td input[type=date] { min-width: 128px; }
td select { min-width: 112px; }
td select.st { min-width: 118px; }
td input[type=number] { min-width: 70px; text-align: right; }
td.work { max-width: 420px; min-width: 240px; }
.saved { outline: 2px solid #7fcf9f !important; background: #effaf3 !important; }
.failed { outline: 2px solid #e79b92 !important; background: #fdecea !important; }

.chip { display: inline-block; padding: 1px 9px; border-radius: 999px; font-size: 12px; font-weight: 600; }
select.st { font-weight: 600; border-radius: 999px; padding: 2px 8px; border-color: transparent; }
.st-Teplannen { background: #e9edf2; color: #44525f; }
.st-Ingepland { background: #dcebfa; color: #1f5a96; }
.st-Bezig { background: #fdf0d2; color: #8a5d05; }
.st-Geblokkeerd { background: #fbdcd8; color: #a3281c; }
.st-Afgerond { background: #d9f0e2; color: #1d6b42; }
.st-Geannuleerd { background: #eceff1; color: #8a949d; text-decoration: line-through; }
tr.overdue td:first-child { box-shadow: inset 3px 0 0 var(--bad); }
tr.closed { opacity: .6; }
.dup { background: #fdecea; color: #a3281c; border-radius: 6px; padding: 0 6px; font-size: 12px; font-weight: 600; }
.warnbox { background: #fff7e6; border: 1px solid #f0d9a4; color: #7a5a0a; border-radius: var(--radius); padding: 10px 14px; margin-bottom: 14px; }
.muted { color: var(--muted); }
.empty { padding: 30px; text-align: center; color: var(--muted); }

form.edit { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; max-width: 980px; }
form.edit .row { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px 16px; margin-bottom: 12px; }
form.edit label { display: block; font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .4px; margin-bottom: 3px; }
form.edit input, form.edit select, form.edit textarea { width: 100%; }
form.edit textarea { min-height: 80px; resize: vertical; }
form.edit .full { grid-column: 1 / -1; }
form.edit .actions { display: flex; gap: 10px; align-items: center; margin-top: 8px; }

/* synchronisation Excel (page Import / Export) */
.chip.s-ok { background: #d9f0e2; color: #1d6b42; }
.chip.s-pending, .chip.s-busy { background: #fdf0d2; color: #8a5d05; }
.chip.s-external, .chip.s-conflict, .chip.s-error, .chip.s-new, .chip.s-login { background: #fbdcd8; color: #a3281c; }
.chip.s-never { background: #e9edf2; color: #44525f; }
.srcrow { display: grid; grid-template-columns: 170px 1fr; gap: 6px 14px; padding: 12px 0; border-top: 1px solid var(--line); }
.srcrow.first { border-top: none; }
.srcrow .path { width: 100%; font-family: Consolas, monospace; font-size: 13px; }
.srcrow .msg { grid-column: 2; color: var(--muted); font-size: 13px; }
.srcrow .acts { grid-column: 2; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.srcrow .acts form { margin: 0; }
button.small, .btn.small { padding: 3px 11px; font-size: 13px; }

/* planning */
.day { margin-bottom: 16px; }
.day h3 { margin: 0 0 6px; font-size: 14px; background: var(--brand); color: #fff; padding: 6px 12px; border-radius: 8px 8px 0 0; }
.day table { background: #fff; border: 1px solid var(--line); }
.day thead th { position: static; }
.printhead { display: none; }

@media print {
  @page { size: A4 landscape; margin: 12mm; }
  body { background: #fff; font-size: 11px; }
  header.top, .toolbar, .noprint, .flash { display: none !important; }
  main { padding: 0; max-width: none; }
  .printhead { display: block; margin-bottom: 10px; }
  .day { break-inside: avoid; }
  .day h3 { background: #1f3a5f !important; color: #fff !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .tablewrap { max-height: none; overflow: visible; border: none; }
}


/* ===== lisibilité : en-têtes de page, tableaux aérés, groupes par POP ===== */
body { font-size: 14.5px; }
main { max-width: 1760px; padding: 22px 28px 40px; }
.pagehead { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: 14px; }
.pagehead h1 { font-size: 24px; }
.pagehead .sub { margin: 4px 0 0; }
.kpis { display: flex; gap: 10px; }
.kpi { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 8px 16px; min-width: 96px; text-align: center; }
.kpi b { display: block; font-size: 22px; line-height: 1.15; color: var(--brand); }
.kpi span { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--muted); }
.toolbar { box-shadow: 0 1px 2px rgba(20,40,70,.04); }

table.roomy tbody td { padding: 9px 10px; vertical-align: middle; border-bottom: 1px solid #e9edf2; }
table.roomy thead th { padding: 10px 10px; }
table.roomy tbody tr:not(.grp):nth-child(even) { background: #fbfcfe; }
table.roomy tbody tr:not(.grp):hover { background: #f1f6fd; }
tr.grp td { background: #e8eef6 !important; padding: 7px 12px !important; font-size: 13px; color: var(--brand); border-bottom: 1px solid var(--line); position: sticky; top: 36px; z-index: 1; }
tr.grp .muted { font-weight: 400; }
th.gp, td.gp { background-color: rgba(47,111,179,.045); }
thead th.gp { color: #1f5a96; }
.big { font-size: 15px; font-weight: 700; }
.sm { font-size: 12px; margin-top: 1px; }
td.work { max-width: 520px; min-width: 280px; line-height: 1.4; }
td.remark input { min-width: 180px; }
td.gipod { white-space: nowrap; }
td.gipod input { width: 92px; min-width: 92px; }
a.ext { display: inline-block; margin-left: 2px; font-weight: 700; padding: 0 5px; border-radius: 6px; background: #e6f0fb; }
a.ext:hover { background: #cfe3f8; text-decoration: none; }
.sub2 input { margin-top: 3px; font-size: 12.5px; }
td input, td select { font-size: 14px; }
td input:hover, td select:hover { border-color: #c5d0dc; }
td input:focus, td select:focus { background: #fff; }
.card { box-shadow: 0 1px 2px rgba(20,40,70,.04); }
.tablewrap { box-shadow: 0 1px 3px rgba(20,40,70,.06); }


/* ===== page POP : onglets, cartes de synergie ===== */
.tabs { display: flex; gap: 4px; margin-bottom: 12px; border-bottom: 2px solid var(--line); }
.tab { padding: 8px 18px; border-radius: 8px 8px 0 0; color: var(--muted); font-weight: 600; margin-bottom: -2px; border-bottom: 2px solid transparent; }
.tab:hover { text-decoration: none; background: #eaf0f7; }
.tab.on { color: var(--brand); border-bottom-color: var(--brand-2); background: #fff; }
.avl { display: grid; grid-template-columns: 74px 1fr; gap: 8px; align-items: center; margin-bottom: 4px; }
.avl > span { font-size: 12px; color: var(--muted); }
.syncell { min-width: 210px; }
.pill { display: inline-block; padding: 1px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #eceff3; color: #44525f; }
.pill.st { background: #e1ecf9; color: #1f5a96; }
.pill.date.now { background: #fdf0d2; color: #8a5d05; }
.pill.date.future { background: #dcebfa; color: #1f5a96; }
.pill.date.past { background: #eceff1; color: #8a949d; }
.pill.date.text { background: #f3e9fb; color: #6b3a96; }
section.syn { background: var(--card); border: 1px solid var(--line); border-left: 5px solid #b9c4d0; border-radius: var(--radius); margin-bottom: 14px; padding: 12px 16px 8px; box-shadow: 0 1px 3px rgba(20,40,70,.05); }
section.syn.now { border-left-color: #e0a43a; }
section.syn.future { border-left-color: var(--brand-2); }
section.syn.past { opacity: .72; }
section.syn header { display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; align-items: center; }
section.syn .gtitle { display: flex; gap: 14px; align-items: baseline; flex-wrap: wrap; }
section.syn .big { font-size: 17px; }
section.syn .addr { color: var(--ink); font-weight: 600; }
section.syn .gmeta { display: flex; gap: 8px; flex-wrap: wrap; }
section.syn .gsub { margin: 4px 0 8px; font-size: 13px; }
table.mini { margin-bottom: 6px; }
table.mini thead th { position: static; background: #f4f7fb; font-size: 11px; }
table.mini tbody td { padding: 6px 10px; }

/* ===== tableau de bord ===== */
:root { --c-cable: #2a78d6; --c-interv: #eb6834; --good: #0ca30c; --warn: #fab219; --serious: #ec835a; --crit: #d03b3b;
        --track: #e8ecf1; --ink2: #52514e; }
.c-cable { background: var(--c-cable); } .c-interv { background: var(--c-interv); } .gray { background: #b4bcc6; }
.dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; vertical-align: baseline; }
i.dot.c-cable, i.dot.c-interv { background-clip: padding-box; }
.legendbar { display: flex; gap: 18px; font-size: 13px; color: var(--ink2); }
.ink { color: var(--ink); }

.kpirow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-bottom: 16px; }
.tile { display: flex; flex-direction: column; gap: 2px; padding: 14px 18px 13px; background: var(--card); border: 1px solid var(--line);
        border-radius: 12px; box-shadow: 0 1px 3px rgba(20,40,70,.05); border-top: 4px solid #b9c4d0; color: var(--ink); }
a.tile:hover { text-decoration: none; box-shadow: 0 3px 10px rgba(20,40,70,.1); }
.tile .tl { font-size: 12px; text-transform: uppercase; letter-spacing: .6px; color: var(--muted); font-weight: 600; }
.tile .tv { font-size: 38px; font-weight: 700; line-height: 1.1; color: var(--brand); }
.tile .ts { font-size: 12.5px; color: var(--ink2); }
.tile.good { border-top-color: var(--good); } .tile.good .ts { color: #006300; }
.tile.warn { border-top-color: var(--warn); } .tile.warn .tv { color: #8a5d05; } .tile.warn .ts { color: #8a5d05; }
.tile.bad { border-top-color: var(--crit); } .tile.bad .tv { color: var(--crit); } .tile.bad .ts { color: #a3281c; }

.g12 { display: grid; grid-template-columns: repeat(12, 1fr); gap: 14px; margin-bottom: 14px; }
.s7 { grid-column: span 7; } .s5 { grid-column: span 5; }
.panel { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 16px 20px 18px; box-shadow: 0 1px 3px rgba(20,40,70,.05); }
.panel h2 { font-size: 15px; margin: 0 0 12px; display: flex; justify-content: space-between; align-items: baseline; }
.panel h2 .hint { font-size: 12px; font-weight: 400; color: var(--muted); }
section#traiter { margin-top: 0; }

.weekchart { display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; height: 214px; align-items: end;
             border-bottom: 1px solid #c3c2b7; padding-top: 6px; }
.weekchart .col { display: flex; flex-direction: column; align-items: center; height: 100%; justify-content: flex-end; border-radius: 8px; position: relative; }
.weekchart .col.today { background: rgba(47,111,179,.06); }
.weekchart .stack { width: 100%; max-width: 40px; flex: 1 1 auto; display: flex; flex-direction: column; justify-content: flex-end; gap: 2px; }
.weekchart .seg { display: block; width: 100%; border-radius: 4px 4px 0 0; min-height: 4px; }
.weekchart .seg:last-child { border-radius: 0; }
.weekchart .seg:first-child:not(:last-child) { border-radius: 4px 4px 0 0; }
.weekchart .seg:only-child { border-radius: 4px 4px 0 0; }
.weekchart .cv { font-size: 13px; font-weight: 700; color: var(--ink); height: 20px; }
.weekchart .cl { position: absolute; bottom: -42px; font-size: 12px; color: var(--muted); text-align: center; line-height: 1.2; }
.weekchart .cl b { display: block; font-size: 14px; color: var(--ink); font-weight: 600; }
.weekchart .col.today .cl b { color: var(--c-cable); }
.weekchart { margin-bottom: 46px; }

.hbar { display: grid; grid-template-columns: 96px 1fr auto; gap: 12px; align-items: center; margin-bottom: 11px; }
.hbar .hn { font-weight: 600; }
.htrack { display: flex; gap: 2px; height: 20px; }
.htrack .seg { display: block; height: 100%; }
.htrack .seg:first-child { border-radius: 0 0 0 0; }
.htrack .seg:last-child { border-radius: 0 4px 4px 0; }
.htrack .seg:only-child { border-radius: 0 4px 4px 0; }
.hbar .hv { font-weight: 700; min-width: 70px; text-align: right; }
.hbar .hv small { font-weight: 400; color: var(--muted); font-size: 12px; }

.progress { display: flex; gap: 20px; align-items: center; margin-bottom: 16px; }
.ringv { font-size: 24px; font-weight: 700; fill: var(--ink); }
.ringl { font-size: 11px; fill: var(--muted); text-transform: uppercase; letter-spacing: .5px; }
.pnums { line-height: 1.55; }
.pnums b { font-size: 20px; }
.stbar { margin-top: 12px; }
.stt { display: flex; justify-content: space-between; font-size: 13px; font-weight: 600; margin-bottom: 5px; }
.sttrack { display: flex; gap: 2px; height: 14px; }
.sttrack .seg { display: block; border-radius: 3px; min-width: 6px; }
.stleg { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; font-size: 12.5px; color: var(--ink2); }
.stleg b { color: var(--ink); }
.sttrack .st-Teplannen, .sd-Teplannen { background: #b4bcc6; }
.sttrack .st-Ingepland, .sd-Ingepland { background: #6250d6; }
.sttrack .st-Bezig, .sd-Bezig { background: #fab219; }
.sttrack .st-Geblokkeerd, .sd-Geblokkeerd { background: #d03b3b; }
.sttrack .st-Afgerond, .sd-Afgerond { background: #0ca30c; }
.sttrack .st-Geannuleerd, .sd-Geannuleerd { background: #d5d9de; }

.synrow { display: grid; grid-template-columns: 1.5fr 1.2fr 1fr; gap: 12px; align-items: center; padding: 9px 0; border-bottom: 1px solid #edf0f4; }
.synrow:last-child { border-bottom: none; }
.synrow .sm1 { display: flex; flex-direction: column; gap: 1px; }
.synrow .sm2 { display: flex; gap: 6px; flex-wrap: wrap; }
.synrow .sm3 { text-align: right; font-size: 13px; }

table.todo td { padding: 8px 10px; }
.flag { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.flag.crit { background: #fbdcd8; color: #a3281c; }
.flag.late { background: #fdeadf; color: #a14a1d; }
.flag.warn { background: #fdf0d2; color: #8a5d05; }
.allgood { color: #006300; font-weight: 600; margin: 4px 0; }
.st-Ingepland { background: #e6e1fa; color: #4a3aa7; }

@media (max-width: 1250px) { .kpirow { grid-template-columns: repeat(3, 1fr); } .s7, .s5 { grid-column: span 12; } }

/* ===== planning (écran + impression pour les ouvriers) ===== */
.seg-toggle { display: inline-flex; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; background: #fff; }
.seg-toggle a { padding: 6px 14px; color: var(--ink2); font-weight: 600; font-size: 13.5px; }
.seg-toggle a:hover { text-decoration: none; background: #f1f4f8; }
.seg-toggle a.on { background: var(--brand); color: #fff; }
.vsep { width: 1px; align-self: stretch; background: var(--line); margin: 0 4px; }
.toolbar .chk { display: inline-flex; gap: 6px; align-items: center; color: var(--ink2); }
.hintline { margin: 0 0 14px; font-size: 13px; }

.psec { background: var(--card); border: 1px solid var(--line); border-radius: 12px; margin-bottom: 16px; overflow: hidden;
        box-shadow: 0 1px 3px rgba(20,40,70,.05); }
.psec.today { border-color: var(--c-cable); box-shadow: 0 0 0 1px var(--c-cable); }
.phead { display: flex; justify-content: space-between; align-items: center; padding: 10px 18px; background: var(--brand); color: #fff; }
.phead h2 { margin: 0; font-size: 17px; letter-spacing: .2px; }
.phead .cnt { font-size: 13px; opacity: .85; }
.todaytag { font-size: 11px; font-weight: 700; background: #fff; color: var(--brand); padding: 1px 8px; border-radius: 999px; margin-left: 8px; vertical-align: middle; text-transform: uppercase; }
.pblock { padding: 0 18px 6px; }
.pblock + .pblock { border-top: 1px solid var(--line); }
.pteam { font-weight: 700; font-size: 14px; color: var(--brand); padding: 12px 0 4px; display: flex; align-items: center; gap: 8px; }
.pteam::before { content: ""; width: 4px; height: 16px; border-radius: 2px; background: var(--c-cable); }
table.ptable { width: 100%; border-collapse: collapse; table-layout: fixed; background: transparent; border: none; }
.ptable td { padding: 9px 10px; border-top: 1px solid #edf0f4; vertical-align: top; }
.ptable tr:first-child td { border-top: none; }
.ptable col.w-when { width: 118px; } .ptable col.w-pop { width: 190px; } .ptable col.w-where { width: 16%; } .ptable col.w-what { width: 26%; } .ptable col.w-st { width: 118px; }
.ptable .wh { font-weight: 700; font-size: 15px; color: var(--ink); }
.ptable .tk, .ptable .muted { font-size: 12.5px; }
.ptable .tk { color: var(--muted); margin-left: 6px; }
.ptable .wt { margin-top: 2px; font-weight: 600; }
.ptable .rm { color: var(--ink2); }
.ptable .rm .rt { white-space: pre-line; }
.popc { font-weight: 600; color: var(--ink2); }
.dp { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700; background: #eceff3; color: #3a4350; }
.dp.heledag { background: #dfe9f7; color: #1f4f8f; }
.dp.voormiddag { background: #fdf0d2; color: #8a5d05; }
.dp.namiddag { background: #e6e1fa; color: #4a3aa7; }
.kd { display: inline-block; font-size: 12px; font-weight: 700; padding: 1px 8px; border-radius: 6px; margin-right: 6px; }
.k-cable { background: #dfe9f7; color: #1f4f8f; } .k-int { background: #fde4da; color: #a23d12; }

@media print {
  @page { size: A4 landscape; margin: 10mm; }
  body { font-size: 12px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .psec { box-shadow: none; border: 1px solid #999; border-radius: 0; margin-bottom: 10px; break-inside: auto; }
  .psec.today { border-color: #999; box-shadow: none; }
  .pblock { break-inside: avoid; }
  .phead { background: #1f3a5f !important; color: #fff !important; padding: 6px 12px; }
  .todaytag { display: none; }
  .ptable .wh { font-size: 13.5px; }
  .printhead h1 { font-size: 20px; }
  .app-version, body > .muted { display: none; }
}
.printhead h1 { margin: 0; }

/* ===== cohérence entre onglets ===== */
:root { --bg: #f5f6f8; --radius: 12px; }
.kpi { text-align: left; padding: 9px 18px 8px; min-width: 110px; border-top: 4px solid #b9c4d0; box-shadow: 0 1px 3px rgba(20,40,70,.05); }
.kpi b { font-size: 26px; }
.kpi:nth-child(3) { border-top-color: var(--c-cable); }
.toolbar { border-radius: 12px; }
.toolbar select, .toolbar input[type=search], .toolbar input[type=date] { border-radius: 8px; }
.tablewrap { border-radius: 12px; }
thead th { background: #eef1f5; color: #3b4652; }
tr.grp td { background: #e6ecf5 !important; }
.chip { padding: 2px 10px; }
.st-Teplannen { background: #eceff3; color: #3f4954; }
.st-Bezig { background: #fdf0d2; color: #8a5d05; }
.chip.st-Bezig::before, .chip.st-Geblokkeerd::before, .chip.st-Afgerond::before { margin-right: 5px; font-size: 10px; }
.chip.st-Geblokkeerd::before { content: "⛔"; } .chip.st-Afgerond::before { content: "✓"; } .chip.st-Bezig::before { content: "●"; }
select.st { border-radius: 999px; font-weight: 600; }
select.st-Ingepland { background: #e6e1fa; color: #4a3aa7; }

.headbtns { display: flex; gap: 8px; }
.addlink { margin-left: auto; font-size: 12px; font-weight: 600; opacity: 0; transition: opacity .15s; }
.pblock:hover .addlink, .addlink:focus { opacity: 1; }
.k-man { background: #e3f3e8; color: #1d6b42; }

/* en-tête de POP (Câbles synergie) */
tr.spacer td { padding: 0 !important; height: 14px; background: var(--bg) !important; border: none !important; }
tr.spacer:first-child { display: none; }
tr.pophead td { background: var(--brand) !important; color: #fff !important; padding: 10px 14px !important; position: sticky; top: 36px; z-index: 1; border-bottom: none; }
.pophead .ph { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.pophead .popname { font-size: 18px; font-weight: 800; letter-spacing: .3px; }
.pophead .popcity { font-size: 14px; opacity: .85; }
.pophead .phstats { display: flex; gap: 14px; align-items: center; margin-left: auto; font-size: 13px; }
.pophead .phstats b { font-size: 15px; }
.phc { padding: 1px 10px; border-radius: 999px; font-weight: 700; font-size: 12px; }
.phc.tp { background: #e8ecf1; color: #3f4954; } .phc.pl { background: #e6e1fa; color: #4a3aa7; } .phc.dn { background: #d6f0d6; color: #006300; }
.phbar { width: 110px; height: 8px; border-radius: 4px; background: rgba(255,255,255,.22); overflow: hidden; }
.phbar span { display: block; height: 100%; background: #5fd35f; border-radius: 4px; }

.pfile { display: flex; align-items: center; gap: 6px; margin-top: 4px; font-weight: 600; }
.pfile form { display: inline; }
.pfile .x { background: none; border: none; color: var(--muted); padding: 0 4px; cursor: pointer; font-size: 12px; }
.pfile .x:hover { color: var(--crit); }
.pupload { margin-top: 4px; }
.pbtn { font-size: 12px; font-weight: 600; color: var(--brand-2); cursor: pointer; opacity: .55; }
.pbtn:hover, tr:hover .pbtn { opacity: 1; }
.ptable col.w-rm { width: 28%; }
/* zone (ville) bien lisible dans l'en-tête de POP */
.pophead .popcity { font-size: 17px; font-weight: 700; opacity: 1; background: #fff; color: var(--brand); padding: 2px 14px; border-radius: 999px; }
.pophead .popname { font-size: 20px; }
.pophead .zl { font-size: 11px; text-transform: uppercase; letter-spacing: .6px; opacity: .8; margin-right: -8px; }

/* ===== POP Statuts : couleurs ===== */
:root { --lo: #ec835a; --mid: #fab219; --hi: #2a78d6; --done: #0ca30c; }
select.s3 { border-radius: 999px; font-weight: 700; padding: 3px 26px 3px 12px; border: 1px solid transparent; }
select.s3-OK { background: #d6f0d6; color: #006300; }
select.s3-Ongoing { background: #fdf0d2; color: #8a5d05; }
select.s3-Todo { background: #fbdcd8; color: #a3281c; }
select.s3-none { background: #eef1f5; color: #7a8591; }
.bar.lv-lo > span { background: var(--lo); } .bar.lv-mid > span { background: var(--mid); }
.bar.lv-hi > span { background: var(--hi); } .bar.lv-done > span { background: var(--done); }
.pctv { font-weight: 700; font-size: 13px; }
.pctv.lv-lo { color: #a14a1d; } .pctv.lv-mid { color: #8a5d05; } .pctv.lv-hi { color: #1f4f8f; } .pctv.lv-done { color: #006300; }
.bar { height: 10px; border-radius: 5px; }
tr.prow td:first-child { border-left: 5px solid #d5dbe3; }
tr.prow.p-done td:first-child { border-left-color: var(--done); }
tr.prow.p-run td:first-child { border-left-color: var(--hi); }
tr.prow.p-done { background: #f4fbf4 !important; }
th.ck, td.ck { background: rgba(250,178,25,.07); } thead th.ck { color: #8a5d05; }
.dl { font-size: 12px; font-weight: 700; margin-top: 2px; }
.dl.late { color: #a3281c; } .dl.soon { color: #8a5d05; }
.legendline { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; font-size: 12.5px; color: var(--ink2); margin: 0 0 10px; }
.legendline .lg { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.legendline .sepv { width: 1px; height: 14px; background: var(--line); }
.lg.s3-OK { background: #0ca30c; } .lg.s3-Ongoing { background: #fab219; } .lg.s3-Todo { background: #d03b3b; }
.lg.lv-lo { background: var(--lo); } .lg.lv-mid { background: var(--mid); } .lg.lv-hi { background: var(--hi); } .lg.lv-done { background: var(--done); }
.lg.late { background: #d03b3b; border-radius: 50% !important; } .lg.soon { background: #fab219; border-radius: 50% !important; }
.kpi.k-blue { border-top-color: var(--hi); } .kpi.k-green { border-top-color: var(--done); } .kpi.k-red { border-top-color: var(--crit); } .kpi.k-red b { color: var(--crit); }
select.s3 { min-width: 122px; }

.zonepill { display: inline-block; margin-top: 4px; padding: 2px 12px; border-radius: 999px; background: #e3ecf8; color: var(--brand); font-weight: 700; font-size: 14px; }
tr.prow a.big { font-size: 17px; }

.pophead .phedit { color: #fff; font-weight: 600; border: 1px solid rgba(255,255,255,.5); padding: 2px 12px; border-radius: 8px; }
.pophead .phedit:hover { background: rgba(255,255,255,.15); text-decoration: none; }
tr.pophead + tr.prow td { padding-top: 12px; padding-bottom: 12px; }

/* ===== POP Statuts : présentation douce (sans bandeaux foncés) ===== */
tr.sp2 td { height: 10px; }
tr.pophead2 td { background: #f3f6fa !important; color: var(--ink) !important; padding: 10px 16px !important; border-top: 1px solid var(--line) !important; border-bottom: 1px solid #e6ebf1 !important; position: static; }
.pophead2 .ph { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pophead2 .zdot { width: 10px; height: 10px; border-radius: 50%; background: var(--hi); flex: none; }
.pophead2 .zname { font-size: 18px; font-weight: 700; color: var(--brand); }
.pophead2 .pchip { font-size: 13px; font-weight: 700; color: #3f4954; background: #fff; border: 1px solid #d5dbe3; border-radius: 8px; padding: 1px 10px; }
.pophead2 .pchip:hover { text-decoration: none; border-color: var(--brand-2); color: var(--brand-2); }
.pophead2 .phstats2 { margin-left: auto; display: flex; gap: 14px; align-items: center; font-size: 13px; }
tr.pophead2 + tr.prow td { padding-top: 12px; padding-bottom: 12px; }
tr.prow td:first-child { border-left-width: 4px; }

.toolbar input.livesearch { min-width: 400px; }

/* ===== homogénéité : mêmes en-têtes doux partout ===== */
.phc.bl { background: #fbdcd8; color: #a3281c; }
.phbar2 { width: 90px; height: 7px; border-radius: 4px; background: #dde3ea; overflow: hidden; display: inline-block; }
.phbar2 span { display: block; height: 100%; background: var(--done); border-radius: 4px; }
.pophead2 .pchip { cursor: default; }
/* planning : en-têtes de jour doux au lieu de bandeaux foncés */
.phead { background: #f3f6fa; color: var(--brand); border-bottom: 1px solid var(--line); }
.phead .cnt { opacity: 1; color: var(--muted); }
.psec.today .phead { background: #e3ecf8; }
.todaytag { background: var(--c-cable); color: #fff; }
.phead h2 { font-size: 18px; }
@media print {
  .phead { background: #eef2f7 !important; color: #1f3a5f !important; border-bottom: 1px solid #999; }
  .todaytag { display: none; }
}

.kpirow { grid-template-columns: repeat(6, 1fr); }
.tile.t-blow { border-top-color: var(--c-cable); }
.tile .tv small { font-size: 18px; font-weight: 600; color: var(--ink2); }
.tile.t-blow .ts b { color: var(--brand); font-size: 14px; }
.pophead2 .rest { background: #e3ecf8; color: var(--brand); padding: 1px 10px; border-radius: 999px; font-size: 12.5px; }
.pophead2 .rest b { font-size: 13.5px; }
@media (max-width: 1250px) { .kpirow { grid-template-columns: repeat(3, 1fr); } }

/* ===== dashboard : statut des onglets + avancement annuel ===== */
.tabrow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-bottom: 14px; }
.tabcard { display: flex; flex-direction: column; gap: 3px; padding: 12px 16px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; color: var(--ink); box-shadow: 0 1px 3px rgba(20,40,70,.05); }
a.tabcard:hover { text-decoration: none; box-shadow: 0 3px 10px rgba(20,40,70,.1); }
.tcn { font-size: 13px; font-weight: 700; color: var(--ink2); display: flex; align-items: center; gap: 8px; }
.tcn .lvl { width: 10px; height: 10px; border-radius: 50%; background: #b9c4d0; flex: none; }
.tabcard.good .lvl, .tabcard.ok .lvl { background: var(--good); } .tabcard.warn .lvl { background: var(--warn); } .tabcard.bad .lvl { background: var(--crit); }
.tcv { font-size: 26px; font-weight: 700; color: var(--brand); line-height: 1.15; }
.tcv small { font-size: 12.5px; font-weight: 500; color: var(--muted); }
.tcv.sm { font-size: 15px; font-weight: 700; line-height: 1.35; }
.tcs { font-size: 12.5px; color: var(--ink2); }
.tcs b.bad { color: #a3281c; } .tcs b.warn { color: #8a5d05; }
.mbar { margin-top: 4px; height: 6px; border-radius: 3px; background: #e3e8ee; overflow: hidden; width: 100%; }
.mbar span { display: block; height: 100%; background: var(--done); border-radius: 3px; }
.yr { display: grid; grid-template-columns: 340px 1fr; gap: 28px; align-items: start; }
.yrbar { margin-bottom: 12px; }
.yrt { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 4px; } .yrt b { font-size: 15px; color: var(--brand); }
.yrtrack { height: 10px; border-radius: 5px; background: #e6ebf1; overflow: hidden; }
.yrtrack span { display: block; height: 100%; background: var(--c-cable); border-radius: 5px; } .yrtrack span.done { background: var(--done); }
.yrnums { margin-top: 14px; display: grid; gap: 4px; font-size: 13px; color: var(--ink2); } .yrnums b { font-size: 16px; color: var(--ink); }
.yearchart { display: grid; grid-template-columns: repeat(12, 1fr); gap: 8px; height: 190px; align-items: end; border-bottom: 1px solid #c3c2b7; margin-bottom: 30px; position: relative; }
.ycol { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; position: relative; border-radius: 8px; }
.ycol.now { background: rgba(47,111,179,.07); }
.ystack { width: 100%; max-width: 34px; flex: 1 1 auto; display: flex; flex-direction: column; justify-content: flex-end; gap: 2px; }
.yseg { display: block; width: 100%; min-height: 3px; border-radius: 4px 4px 0 0; } .yseg.done { background: var(--c-cable); } .yseg.plan { background: #a9c8f0; }
.yseg.done:not(:only-child) { border-radius: 0; }
.yv { font-size: 11.5px; font-weight: 700; color: var(--ink2); height: 18px; }
.yl { position: absolute; bottom: -24px; font-size: 12px; color: var(--muted); } .ycol.now .yl { color: var(--c-cable); font-weight: 700; }
@media (max-width: 1250px) { .tabrow { grid-template-columns: repeat(3, 1fr); } .yr { grid-template-columns: 1fr; } }

/* avancement global (KABELWERKEN) */
.kwtop { display: flex; gap: 28px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.kwbig b { font-size: 40px; color: var(--brand); line-height: 1; } .kwbig span { margin-left: 6px; color: var(--muted); }
.kwn { display: flex; flex-direction: column; } .kwn b { font-size: 22px; color: var(--c-cable); line-height: 1.15; } .kwn span { font-size: 12.5px; color: var(--ink2); }
.kwn.rest b { color: #3f6fb0; } .kwn.sper b { color: #7a8591; font-size: 18px; }
.kwlegend { display: flex; gap: 16px; font-size: 12.5px; color: var(--ink2); margin-bottom: 8px; }
.kwrow { display: grid; grid-template-columns: 78px minmax(160px, 1fr) minmax(300px, 520px); gap: 14px; align-items: center; padding: 6px 0; border-top: 1px solid #edf0f4; }
.kwy { font-weight: 700; color: var(--brand); }
.kwtrack { display: flex; gap: 2px; height: 16px; }
.kwtrack span { display: block; height: 100%; min-width: 3px; }
.kwtrack .kd { background: var(--c-cable); border-radius: 4px 0 0 4px; } .kwtrack .kr { background: #a9c8f0; border-radius: 0 4px 4px 0; }
.kwtrack span:only-child { border-radius: 4px; }
.kwv { font-size: 13px; color: var(--ink2); } .kwv b { color: var(--ink); }
@media (max-width: 1250px) { .kwrow { grid-template-columns: 70px 1fr; } .kwv { grid-column: 1 / -1; } }

/* avancement global : anneaux par année */
.kwglobal { display: flex; align-items: center; gap: 20px; }
.kwglobal .yrnums { margin: 0; line-height: 1.45; } .kwglobal .yrnums .gap { margin-top: 8px; }
.restc { color: #3f6fb0; }
.ringrow { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.yring { text-align: center; padding: 6px 4px; border-radius: 12px; }
.yname { font-weight: 700; color: var(--brand); font-size: 15px; margin-bottom: 2px; }
.ringv2 { font-size: 21px; font-weight: 700; fill: var(--ink); }
.ydone { font-size: 12.5px; color: var(--ink2); }
.yrest { font-size: 13px; color: var(--ink); margin-top: 2px; } .yrest b { color: #3f6fb0; } .yrest span { display: block; font-size: 12px; color: var(--muted); }
.yrest .okc { color: #006300; font-weight: 700; }

/* ===== tableau de bord visuel ===== */
.alerts { display: flex; gap: 8px; flex-wrap: wrap; }
.alert { padding: 4px 14px; border-radius: 999px; font-weight: 700; font-size: 13px; }
a.alert:hover { text-decoration: none; filter: brightness(.96); }
.alert.bad { background: #fbdcd8; color: #a3281c; } .alert.warn { background: #fdf0d2; color: #8a5d05; } .alert.good { background: #d6f0d6; color: #006300; }
.panel.hero { margin-bottom: 14px; }
.yr { display: grid; grid-template-columns: 380px 1fr; gap: 28px; align-items: center; }
.mring { flex: none; } .mringv { font-size: 15px; font-weight: 700; fill: var(--ink); }
.tabrow { grid-template-columns: repeat(5, 1fr); }
.tabcard { flex-direction: row; align-items: center; gap: 12px; padding: 12px 14px; }
.tabcard .tctext { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tabcard.good, .tabcard.warn, .tabcard.bad { border-top: none; }
.wchart { width: 100%; height: auto; display: block; }
.wax { font-size: 11px; fill: var(--muted); } .wlab { font-size: 12px; fill: var(--muted); } .wnum { font-size: 14px; font-weight: 600; fill: var(--ink); }
.wlab.today, .wnum.today { fill: var(--c-cable); font-weight: 700; }
.donutv { font-size: 22px; font-weight: 700; fill: var(--ink); }
.teamwrap { display: flex; align-items: center; gap: 22px; }
.tlegend { list-style: none; margin: 0; padding: 0; flex: 1; display: grid; gap: 6px; }
.tlegend li { display: grid; grid-template-columns: 14px 1fr auto 44px; align-items: center; gap: 8px; }
.tlegend .tn { font-weight: 600; } .tlegend small { color: var(--muted); text-align: right; }
.stwrap { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.stcol { text-align: center; } .stt2 { font-weight: 700; margin: 4px 0 6px; }
.stleg2 { list-style: none; margin: 0; padding: 0; display: inline-block; text-align: left; font-size: 12.5px; color: var(--ink2); }
.stleg2 li { margin: 2px 0; } .stleg2 b { color: var(--ink); }
@media (max-width: 1250px) { .tabrow { grid-template-columns: repeat(2, 1fr); } .yr { grid-template-columns: 1fr; } }

.teamwrap { min-height: 230px; }

.tabrow { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1250px) { .tabrow { grid-template-columns: repeat(2, 1fr); } }

.s3 { grid-column: span 3; } .s4 { grid-column: span 4; } .s8 { grid-column: span 8; }
.teamwrap { min-height: 0 !important; gap: 12px; }
.tlegend { gap: 5px; font-size: 13px; } .tlegend li { grid-template-columns: 12px 1fr auto 38px; gap: 6px; }
.upr { display: grid; grid-template-columns: 62px 4px 1fr auto; gap: 10px; align-items: center; padding: 7px 0; border-top: 1px solid #edf0f4; color: var(--ink); }
.upr:first-of-type { border-top: none; } a.upr:hover { text-decoration: none; background: #f6f8fb; }
.ud { display: flex; flex-direction: column; line-height: 1.2; } .ud b { font-size: 13.5px; } .ud small { font-size: 11px; color: var(--muted); }
.uk { width: 4px; align-self: stretch; border-radius: 2px; } .uk.k-cable { background: var(--c-cable); } .uk.k-int { background: var(--c-interv); } .uk.k-man { background: #1d9a5a; }
.ut { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; } .ut b { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ut small { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.uw { font-size: 12px; font-weight: 700; color: var(--brand); background: #e3ecf8; padding: 1px 9px; border-radius: 999px; } .uw.none { background: #fdf0d2; color: #8a5d05; }
@media (max-width: 1250px) { .s3, .s4, .s8 { grid-column: span 12; } }

.upr { grid-template-columns: 84px 4px 1fr auto; } .ud b { white-space: nowrap; }

.s12{grid-column:span 12}

/* détail du reste à souffler */
.kwd { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line, #e6e9ee); }
.kwd-t { font-weight: 650; font-size: 14px; margin-bottom: 12px; } .kwd-t .muted { font-weight: 400; font-size: 12.5px; }
.kwd-g { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 28px; }
.kwd-c h3 { font-size: 11.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--ink2); margin: 0 0 8px; font-weight: 650; }
.kwd-c h3 .muted { text-transform: none; letter-spacing: 0; font-weight: 400; }
.kwd-st { display: flex; gap: 16px; align-items: center; }
.kwd-l { list-style: none; margin: 0; padding: 0; flex: 1; }
.kwd-l li { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; column-gap: 8px; padding: 5px 0; border-bottom: 1px solid var(--line, #eef0f3); font-size: 13px; }
.kwd-l li:last-child { border-bottom: 0; }
.kwd-l li .kn { grid-column: 1 / 3; } .kwd-l li:has(.dot) .kn { grid-column: 2; }
.kwd-l li b { grid-column: 3; text-align: right; font-variant-numeric: tabular-nums; }
.kwd-l li small { grid-column: 1 / -1; color: var(--ink2); font-size: 11.5px; text-align: right; }
.kwd-l li:has(.dot) small { grid-column: 2 / -1; }
.kwd-l em { font-style: normal; color: var(--ink2); font-size: 11.5px; margin-left: 4px; }
@media (max-width: 1250px) { .kwd-g { grid-template-columns: 1fr; } }

.kwnote { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; margin-top: 3px; }
.kwnote .nt { font-size: 10.5px; padding: 1px 8px; border-radius: 999px; font-variant-numeric: tabular-nums; }
.kwnote .syn { background: rgba(27,175,122,.13); color: #0d7a55; } .kwnote .sper { background: #eceff3; color: #5b6573; }

.synp .synrow { grid-template-columns: 1fr auto; row-gap: 4px; padding: 8px 0; }
.synp .synrow .sm3 { grid-column: 1 / -1; text-align: left; display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.synp .synrow .sm3 .mbar { flex: 1; max-width: 120px; margin: 0; }
.synp .synrow .sm2 { justify-content: flex-end; }
.g12 > .panel { align-self: stretch; }

.kwd-g { grid-template-columns: 1fr 1.15fr; }
.kwd-l .prio { margin-left: 6px; font-size: 10.5px; padding: 1px 8px; border-radius: 999px; background: #eef2f8; color: #3d5a80; }
.kwd-l .prio.late { background: #fbe4e4; color: #a32a2a; }

.qh { display: flex; align-items: baseline; gap: 8px; margin: 12px 0 2px; padding: 5px 10px; border-radius: 8px; background: #eef2f8; color: #2f4a70; font-size: 12.5px; }
.qh:first-of-type { margin-top: 2px; }
.qh span { margin-left: auto; font-size: 11.5px; color: var(--ink2); }
.qh em { font-style: normal; font-size: 10.5px; padding: 0 7px; border-radius: 999px; background: #fbe4e4; color: #a32a2a; }
.qh.late { background: #fbefef; color: #8d2b2b; }

.kwd-g { grid-template-columns: 1fr 1fr; align-items: stretch; gap: 36px; }
.kwd-c:first-child { display: flex; flex-direction: column; }
.kwd-c:first-child .kwd-st { flex-direction: column; align-items: stretch; gap: 14px; flex: 1; justify-content: center; }
.kwd-c:first-child .kwd-st svg { width: 140px; height: 140px; align-self: center; }
.kwd-c:first-child .kwd-l li { padding: 8px 0; }

.kwq-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; } .kwq-h h3 { margin: 0; }
.kwq { font: inherit; font-size: 12.5px; padding: 5px 10px; border: 1px solid #d6dbe3; border-radius: 8px; background: #fff; color: var(--ink); }
.kwq-list { max-height: 420px; overflow-y: auto; padding-right: 6px; }
.qempty { padding: 14px 4px; }

/* connexion (mode serveur) */
body.loginpage { min-height: 100vh; display: grid; place-items: center; padding: 16px; background: var(--bg); }
.loginbox { width: min(360px, 100%); background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 26px 24px; box-shadow: 0 8px 30px rgba(20,40,70,.08); display: grid; gap: 12px; }
.loginlogo { font-size: 20px; font-weight: 700; color: var(--brand); }
.loginbox label, .stackform label { display: grid; gap: 4px; font-size: 13px; color: var(--ink2); }
.loginbox input, .stackform input { font: inherit; font-size: 15px; padding: 9px 11px; border: 1px solid #cfd6df; border-radius: 8px; }
.loginbox button { margin-top: 4px; padding: 10px 14px; }
.stackform { display: grid; gap: 12px; }
header.top .who { font-size: 13px; color: #dce6f5; display: inline-flex; align-items: center; gap: 6px; margin-right: 8px; }
header.top .who a { color: #fff; font-weight: 600; } header.top .who button.link { color: #b9cdea; font-size: 12.5px; }

/* tuiles « à faire » par statut */
.atiles { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.atile { padding: 12px 14px; border: 1px solid #e6e9ee; border-left: 4px solid #ccc; border-radius: 12px; background: #fbfcfe; display: flex; flex-direction: column; gap: 2px; }
.atile .an { font-size: 26px; font-weight: 700; color: var(--ink); line-height: 1.15; } .atile .an small { font-size: 12.5px; font-weight: 500; color: var(--ink2); }
.atile .aw { font-size: 13px; font-weight: 600; color: var(--ink); }
.atile .am { font-size: 13px; color: var(--ink); margin-top: 4px; font-variant-numeric: tabular-nums; }
.atile .ah { font-size: 12px; color: #6b7686; margin-bottom: 6px; }
.atile .alate, .atile .aok { align-self: flex-start; margin-top: auto; font-size: 11.5px; padding: 2px 9px; border-radius: 999px; }
.atile .alate { background: #fbe4e4; color: #a32a2a; } .atile .aok { background: #e4f5ec; color: #1d7a4a; }
@media (max-width: 700px) { .atiles { grid-template-columns: 1fr; } }

/* « Par POP » : même hauteur que « Par statut » (la liste défile à l'intérieur) */
.kwd-g > .kwd-c:nth-child(2) { display: flex; flex-direction: column; height: 0; min-height: 100%; }
.kwd-g > .kwd-c:nth-child(2) .kwq-list { flex: 1; min-height: 0; max-height: none; overflow-y: auto; }
@media (max-width: 1250px) { .kwd-g > .kwd-c:nth-child(2) { height: auto; min-height: 0; } .kwd-g > .kwd-c:nth-child(2) .kwq-list { max-height: 360px; } }

/* envoi WhatsApp */
.envoi { margin-bottom: 16px; padding: 16px 18px; }
.envh { display: flex; align-items: baseline; gap: 12px; margin-bottom: 10px; } .envh h2 { margin: 0; font-size: 18px; }
.envg { display: grid; grid-template-columns: 1.1fr 1fr; gap: 28px; } .envg h3 { margin: 0 0 8px; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink2); }
.envtxt { width: 100%; box-sizing: border-box; font: 13.5px/1.5 "Segoe UI", system-ui, sans-serif; padding: 10px 12px; border: 1px solid #d6dbe3; border-radius: 10px; background: #f7fbf7; resize: vertical; }
.envbtns { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
.wa-open { background: #1faa5a; border-color: #1faa5a; } .wa-open:hover { background: #178a48; }
.envfiles { list-style: none; margin: 0; padding: 0; max-height: 220px; overflow: auto; }
.envfiles li { display: flex; flex-direction: column; padding: 6px 0; border-bottom: 1px solid #eef0f3; font-size: 13px; } .envfiles li .muted { font-size: 11.5px; }
@media (max-width: 1000px) { .envg { grid-template-columns: 1fr; } }
.addlink + .addlink { margin-left: 14px; }
.envimgs { display: grid; gap: 14px; }
.envimg img { width: 100%; height: auto; border: 1px solid #d6dbe3; border-radius: 10px; background: #fff; display: block; }
.envtxtbox { margin-top: 12px; } .envtxtbox summary { cursor: pointer; color: var(--brand-2); font-size: 13px; margin-bottom: 8px; }

.popplans { margin-top: 8px; display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }
.popplans .pfile { font-size: 12.5px; } .popplans .pfile a { color: var(--brand-2); }
.popplans .pfile .x { background: none; border: none; color: #b0493f; padding: 0 4px; cursor: pointer; }
.pfile.popf a { color: #1d7a4a; }

.ptable col.w-pop { width: 24%; } .ptable col.w-where { width: 18%; } .ptable col.w-what { width: 30%; }

/* ---- plans SharePoint ---- */
.spform { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:10px 0 }
.spform .path { flex:1 1 420px; min-width:min(260px, 100%) }
.spstate { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:6px 0 }
.spstate form { margin:0 }
.spcheck { width:100% }
.spcheck td, .spcheck th { padding:6px 10px; text-align:left; vertical-align:top }
.sp-ok { color:#1a7f4b; font-weight:600 }
.sp-bad { color:#b45309 }
.popf .spb { font-size:11px; padding:1px 6px; border-radius:8px; background:#e8f1fb; color:#1d4f91; margin-left:4px }

/* ---- planning hebdo des synergies ---- */
.synpaste { min-height: 70px; border: 2px dashed #b8c4d2; border-radius: 10px; padding: 14px; background: #fafcfe; color: #44525f; cursor: text; outline: none }
.synpaste:empty:before { content: attr(data-ph); color: #8a949d }
.synpaste:focus { border-color: #2a78d6; background: #fff }
.synw { display:inline-block; margin-top:4px; padding:1px 8px; border-radius:6px; background:#fdf0d2; color:#7a4f00; font-size:12px; font-weight:600 }
.synwk { padding:3px 6px; margin-bottom:4px; border-left:3px solid #1baf7a; background:#f1faf6; border-radius:0 6px 6px 0 }
tr.synold td { opacity:.6 }

/* ---- alerte synergies terminées ---- */
.synalert { border-left: 5px solid #d9822b; background: #fff8ee; margin-bottom: 18px }
.sdrow { padding: 10px 0; border-top: 1px solid #f0e2cc }
.sdrow:first-of-type { border-top: none }
.sd1 { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:6px }
.sd2 { display:flex; gap:8px; flex-wrap:wrap }
.sdc { padding:3px 10px; border-radius:8px; background:#fff; border:1px solid #e9cfa6; color:#5a3b05; font-size:13px; text-decoration:none }
.sdc:hover { background:#fdf0d2 }

/* ---- modification multiple */
th.selc, td.selc { width: 28px; padding-left: 10px; padding-right: 2px; text-align: center; }
.selc input, .grpsel { width: 16px; height: 16px; cursor: pointer; accent-color: var(--blue, #1f4e8c); }
.grpsel { margin-right: 8px; vertical-align: middle; }
tr.picked > td { background: #eef4ff; }
.bulkbar { position: sticky; bottom: 12px; z-index: 20; display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end; margin-top: 12px;
  background: #1b2f4b; color: #fff; border-radius: 12px; padding: 10px 14px; box-shadow: 0 6px 24px rgba(10, 25, 50, .35); }
.bulkbar[hidden] { display: none; }
.bulkbar label { display: flex; flex-direction: column; gap: 3px; font-size: 11px; color: #c8d6ea; }
.bulkbar label.chk { flex-direction: row; align-items: center; gap: 5px; padding-bottom: 7px; }
.bulkbar select, .bulkbar input[type=date] { min-width: 120px; }
.bulkbar .muted { color: #c8d6ea; }
@media print { .bulkbar, .selc, .grpsel { display: none !important; } }
.bulkbar select, .bulkbar input[type=date] { color: #1a2433; background: #fff; }

/* ---- préparation « prêt à souffler » */
.rdy { display: inline-block; font-size: 12px; font-weight: 600; padding: 2px 9px; border-radius: 999px; cursor: help; white-space: nowrap; }
.rdy-ready { background: #dff5e6; color: #14672f; }
.rdy-check { background: #fff1d6; color: #8a5a00; }
.rdy-blocked { background: #fde2e2; color: #a12222; }
.rdywhy { font-size: 11px; color: var(--muted, #667); margin-top: 3px; max-width: 190px; white-space: normal; line-height: 1.25; }

/* ---- tableau de bord orienté action */
details.hero > summary { list-style: none; cursor: pointer; }
details.hero > summary::-webkit-details-marker { display: none; }
details.hero > summary { display: flex; align-items: center; gap: 10px; }
details.hero > summary h2 { margin: 0; flex: 1; }
details.hero > summary::before { content: "▾"; color: var(--muted, #667); transition: transform .15s; }
details.hero:not([open]) > summary::before { transform: rotate(-90deg); }
details.hero[open] > summary { margin-bottom: 12px; }
.readyp .rdgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 10px; }
.rdpop { border: 1px solid var(--line); border-left: 4px solid #2e9e57; border-radius: 8px; padding: 8px 10px; background: #fbfefc; }
.rdh { margin-bottom: 6px; }
.rdc { display: flex; flex-wrap: wrap; gap: 6px; }
.rdh .pchip { font-size: 12px; font-weight: 700; color: #3f4954; background: #fff; border: 1px solid #d5dbe3; border-radius: 8px; padding: 1px 8px; }

/* ---- suivi des plannings communiqués */
.commbox { margin: 10px 0 14px; padding: 10px 12px; border-radius: 10px; background: #f4f6f9; border: 1px solid var(--line); font-size: 14px; }
.commbox.ok { background: #edf8f1; border-color: #bfe3cc; color: #14672f; }
.commbox.chg { background: #fff6e3; border-color: #f0d49a; }
.commlist { margin: 8px 0; padding-left: 18px; }
.commlist li { margin: 3px 0; }
.commlist li span { display: block; color: #4a5568; font-size: 13px; }
.commform { margin-top: 8px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.cmbox textarea { width: 100%; font-family: inherit; font-size: 13px; }
.cmbox summary { cursor: pointer; font-weight: 600; margin: 6px 0; }
.addlink.chgl { color: #a35a00; font-weight: 600; }
/* ---- fiche POP */
.pcgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; margin-bottom: 12px; }
.pcgrid .panel { margin: 0; }
.pcdl { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; margin: 0; }
.pcdl dt { color: var(--muted, #667); font-size: 13px; }
.pcdl dd { margin: 0; }
.pcsyn { margin-bottom: 8px; }
.s3chip { display: inline-block; padding: 1px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #eceff3; color: #4a5568; }
.s3chip.s3-OK { background: #dff5e6; color: #14672f; }
.s3chip.s3-Ongoing { background: #fff1d6; color: #8a5a00; }
.s3chip.s3-Todo { background: #fde2e2; color: #a12222; }

/* ---- recherche globale */
.gs { position: fixed; inset: 0; background: rgba(15, 25, 45, .45); z-index: 100; display: flex; justify-content: center; align-items: flex-start; padding-top: 12vh; }
.gs[hidden] { display: none; }
.gsbox { width: min(640px, 92vw); background: #fff; border-radius: 12px; padding: 12px; box-shadow: 0 12px 40px rgba(10, 25, 50, .4); }
.gsbox input { width: 100%; font-size: 17px; padding: 10px 12px; box-sizing: border-box; }
#gsr { list-style: none; margin: 8px 0; padding: 0; max-height: 50vh; overflow: auto; }
#gsr li a { display: flex; gap: 10px; align-items: baseline; padding: 7px 10px; border-radius: 8px; text-decoration: none; color: inherit; }
#gsr li.on a, #gsr li a:hover { background: #eef4ff; }
#gsr li em { font-style: normal; font-size: 11px; font-weight: 700; text-transform: uppercase; color: #3a5a8c; min-width: 84px; }
#gsr li span { color: var(--muted, #667); font-size: 13px; margin-left: auto; }
#gsr li.none { padding: 8px 10px; color: var(--muted, #667); }
button.link#gsopen { color: #c8d6ea; }
@media print { .gs, #gsopen { display: none !important; } }

/* ---- planning des équipes (tableau de bord) */
.gwrap { overflow-x: auto; }
.gtab { width: 100%; border-collapse: separate; border-spacing: 6px; table-layout: fixed; min-width: 640px; }
.gtab thead th { font-size: 12px; font-weight: 600; color: var(--muted, #667); text-align: center; padding: 2px; }
.gtab thead th.gtoday { color: #1f4e8c; }
.gteam { width: 92px; text-align: left; font-size: 14px; font-weight: 700; vertical-align: middle; padding-right: 6px; }
.gcell { background: #f3f4f6; border: 1px solid #dfe3e8; border-radius: 8px; padding: 5px; vertical-align: top; height: 62px; min-width: 96px; }
.gcell.gtoday { background: #f0f5fd; border-color: #bcd0ee; }
.gcell.dropok { outline: 2px dashed #2a78d6; background: #e3eefc; }
.gblk { display: block; border-radius: 7px; padding: 4px 6px; margin-bottom: 4px; text-decoration: none; text-align: center; cursor: grab; border: 1px solid transparent; }
.gblk b { display: block; font-size: 13px; color: #1d2433; }
.gblk span { display: block; font-size: 11px; color: #4a5568; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gblk.k-cable { background: #e1e9fb; border-color: #c4d3f3; }
.gblk.k-int { background: #f9e6da; border-color: #f0cdb6; }
.gblk.k-int b { color: #c4561d; }
.gblk.k-man { background: #def4ea; border-color: #bfe6d3; }
.gblk.dragging { opacity: .45; }
.gadd { display: block; text-align: center; color: #9aa3b0; text-decoration: none; font-size: 15px; line-height: 1.2; }
.gcell:has(.gblk) .gadd { font-size: 12px; opacity: 0; }
.gcell:hover .gadd { opacity: 1; }
.sdc[draggable="true"] { cursor: grab; }

/* ---- bandeau avancement (haut du tableau de bord) */
.h2grid { display: grid; grid-template-columns: auto 1.2fr 1fr; gap: 26px; align-items: center; }
@media (max-width: 1000px) { .h2grid { grid-template-columns: 1fr; } }
.ringbox { display: flex; align-items: center; gap: 16px; }
.rbn b { display: block; font-size: 21px; }
.rhythm h3, .years h3 { margin: 0 0 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted, #667); }
.qbar { height: 12px; background: var(--track, #e8ebf0); border-radius: 6px; position: relative; }
.qbar i { display: block; height: 100%; background: var(--c-cable, #2a78d6); border-radius: 6px; }
.qbar u { position: absolute; top: -3px; bottom: -3px; width: 2px; background: #1d2433; }
.pace { display: flex; gap: 18px; margin-top: 10px; flex-wrap: wrap; }
.pace > div { font-size: 12px; color: var(--muted, #667); }
.pace b { display: block; font-size: 19px; color: var(--ink, #1d2433); }
.pace b.ok { color: #14672f; } .pace b.late { color: #a12222; }
.chipst { background: #eceff3; color: #4a5568; display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.chipst.bad { background: #fde2e2; color: #a12222; } .chipst.good { background: #dff5e6; color: #14672f; }
.pyrs { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-start; }
.pyr { display: block; width: 78px; text-align: center; font-size: 11px; color: var(--muted, #667); }
.pyr svg { display: block; margin: 0 auto 2px; }
.pyr b { display: block; color: var(--ink, #1d2433); font-size: 13px; }
.kp { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.kp span { font-size: 12px; padding: 3px 10px; border-radius: 8px; background: #f3f4f6; border: 1px solid var(--line); }
.kp span.w { background: #fff1d6; border-color: #f0d49a; color: #8a5a00; }
.kp span.b { background: #fde2e2; border-color: #f3bcbc; color: #a12222; }
details.kwdet > summary { cursor: pointer; color: #1f5fbf; font-size: 13px; margin-top: 12px; }

/* ---- bandeau v3 : cadence, trois chiffres, graphique */
.banner { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline; background: #eceff3; border: 1px solid var(--line); color: #4a5568; border-radius: 10px; padding: 8px 12px; font-size: 14px; font-weight: 600; margin: 14px 0 10px; }
.banner.good { background: #e9f6ee; border-color: #bfe3cc; color: #14672f; }
.banner.bad { background: #fde9e9; border-color: #f3bcbc; color: #a12222; }
.banner small { font-weight: 400; opacity: .85; }
.three { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin: 10px 0 4px; }
.three .box { display: block; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; text-decoration: none; color: inherit; }
.three .box b { display: block; font-size: 20px; }
.three .box span { font-size: 12px; color: var(--muted, #667); }
.three .b1 { border-left: 4px solid #2a78d6; } .three .b2 { border-left: 4px solid #8fb4e8; } .three .b3 { border-left: 4px solid #e0a21b; background: #fffaf0; }
.tog { font-size: 12px; color: var(--muted, #667); margin-top: 6px; }
.charth { margin: 16px 0 6px; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted, #667); }
.wchart .wt { font-size: 11px; fill: #667; } .wchart .wv { font-size: 11px; font-weight: 600; fill: #1d2433; }
.qwarn { font-size: 12px; background: #fff1d6; border: 1px solid #f0d49a; color: #8a5a00; border-radius: 8px; padding: 6px 10px; margin-top: 8px; }
.kp a { font-size: 12px; padding: 3px 10px; border-radius: 8px; background: #f3f4f6; border: 1px solid var(--line); text-decoration: none; color: inherit; }
.kp a.w { background: #fff1d6; border-color: #f0d49a; color: #8a5a00; } .kp a.b { background: #fde2e2; border-color: #f3bcbc; color: #a12222; }

.sdc .rk { display: inline-block; font-style: normal; font-weight: 700; font-size: 11px; background: #1b2f4b; color: #fff; border-radius: 999px; min-width: 18px; text-align: center; padding: 0 5px; margin-right: 4px; }
.sdc .pr { font-style: normal; font-size: 11px; color: #667; margin-left: 4px; } .sdc .pr.late { color: #a12222; font-weight: 700; }

.gteam small { display: block; font-weight: 400; font-size: 11px; color: var(--muted, #667); margin-top: 2px; }
.gtot { font-size: 10px; text-align: right; color: #4a5568; margin-top: 2px; }
.gsum td { text-align: center; font-size: 12px; color: #4a5568; padding: 2px; } .gsum td span { font-size: 11px; color: #8a93a3; }
.gsum .gteam { font-size: 12px; color: var(--muted, #667); }

/* ---- vue du jour */
.jgrid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 14px; align-items: start; }
@media (max-width: 1000px) { .jgrid { grid-template-columns: 1fr; } }
.jgrid .panel { margin-bottom: 14px; }
.jteam { border-top: 1px solid var(--line); padding: 10px 0; } .jteam:first-of-type { border-top: 0; }
.jth { display: flex; gap: 10px; align-items: baseline; margin-bottom: 6px; } .jth b { font-size: 16px; }
.jrow { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: baseline; padding: 4px 0; }
.jrow .jk { font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 999px; }
.jk.k-cable { background: #e1e9fb; color: #1f4e8c; } .jk.k-int { background: #f9e6da; color: #c4561d; } .jk.k-man { background: #def4ea; color: #14672f; }
.jplan { font-size: 12px; } .jno { font-size: 11px; color: #a12222; font-weight: 700; } .jclose { font-size: 12px; margin-left: auto; }
.jalert { font-size: 13px; background: #fff6e3; border: 1px solid #f0d49a; border-radius: 8px; padding: 6px 10px; margin-bottom: 6px; }
.jrow2 { padding: 5px 0; border-top: 1px solid #eef0f4; } .jrow2:first-of-type { border-top: 0; } .late { color: #a12222; }

@media print { .no-print, nav, header, .gsbtn { display: none !important; } .panel { break-inside: avoid; } }

.blkwhy { font-size: 11.5px; color: #8a5a00; margin-top: 3px; max-width: 220px; white-space: normal; }
.age { font-size: 11px; color: #667; } .age-o { color: #c4561d; font-weight: 600; } .age-r { color: #a12222; font-weight: 700; }

.shiftbox { background: #f4f6fb; border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; margin: 0 0 10px; font-size: 13px; }
.lastsent { display: block; font-weight: 400; color: #667; font-size: 11px; }
@media print { body * { visibility: hidden; } #grille, #grille * { visibility: visible; } #grille { position: absolute; left: 0; top: 0; width: 100%; } }

.trendrow { font-size: 12.5px; color: #667; margin: 6px 0 10px; } .tr { margin-left: 10px; font-weight: 600; } .tr-ok { color: #14672f; } .tr-ko { color: #a12222; }
.panel > h2 .pcollapse { margin-left: 8px; border: 0; background: none; cursor: pointer; color: #667; font-size: 14px; }
.panel.collapsed > :not(h2) { display: none; }

.rtab .r, .mini .r { text-align: right; } .rgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; } @media (max-width: 1000px) { .rgrid { grid-template-columns: 1fr; } }
.rbox { border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; } .rbox h3 { margin: 0 0 6px; font-size: 13px; } .rbig { font-size: 15px; margin-bottom: 6px; } .rbig b { font-size: 20px; }
.rok td { color: #14672f; } .rtot td { border-top: 2px solid #cfd5df; font-weight: 700; }
.rw { display: inline-block; font-size: 11.5px; padding: 1px 8px; border-radius: 999px; background: #fff1d6; color: #8a5a00; margin: 1px 2px 1px 0; } .rw-ok { background: #def4ea; color: #14672f; }
.rw-z { background: #e1e9fb; color: #1f4e8c; white-space: nowrap; }

/* champ date vide : Safari y affiche la date du jour, ce qui fait croire qu'une date est enregistrée */
input[type=date].nodate::-webkit-datetime-edit { color: transparent; }
input[type=date].nodate { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='20'><text x='4' y='14' font-family='sans-serif' font-size='12' fill='%23a3adb8'>— pas de date</text></svg>"); background-repeat: no-repeat; background-position: 4px center; }
.warnline { background: #fff4e0; border: 1px solid #f0c987; color: #7a4b00; border-radius: 8px; padding: 8px 12px; margin: 8px 0; }
.warnline a { color: #7a4b00; font-weight: 600; }

/* ============ Câbles synergie / Interventions : présentation sobre ============ */
.pg2 h1 { font-size: 20px; font-weight: 650; margin: 0 0 2px; }
.pg2 .kp2 { color: #6b7280; margin-bottom: 12px; }
.pg2 .kp2 b { color: #111827; font-weight: 600; }
.tabs2 { display: flex; flex-wrap: wrap; gap: 2px; border-bottom: 1px solid #e5e7eb; margin-bottom: 12px; }
.tabs2 a { padding: 8px 13px; color: #6b7280; border-bottom: 2px solid transparent; margin-bottom: -1px; text-decoration: none; }
.tabs2 a:hover { color: #111827; }
.tabs2 a i { font-style: normal; background: #f3f4f6; color: #4b5563; border-radius: 10px; padding: 0 7px; margin-left: 6px; font-size: 11.5px; }
.tabs2 a.on { color: #111827; border-color: #2563eb; font-weight: 600; }
.tabs2 a.on i { background: #dbeafe; color: #1d4ed8; }
.tools2 { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.tools2 .spacer { flex: 1; }
.tools2 input.livesearch { min-width: 260px; width: 280px; border: 1px solid #d1d5db; border-radius: 7px; padding: 6px 10px; }
.seg2 { display: flex; border: 1px solid #d1d5db; border-radius: 7px; overflow: hidden; background: #fff; }
.seg2 a { padding: 6px 12px; border-right: 1px solid #d1d5db; color: #374151; text-decoration: none; }
.seg2 a:last-child { border-right: 0; }
.seg2 a.on { background: #111827; color: #fff; }
.tw2 { border-radius: 10px; box-shadow: none; border: 1px solid #e5e7eb; }
table.t2 thead th { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: #6b7280; background: #fafafa; padding: 8px 10px; border-bottom: 1px solid #e5e7eb; }
table.t2 tbody td { padding: 5px 10px; border-bottom: 1px solid #f0f1f3; }
table.t2 tbody tr:not(.grp):nth-child(even) { background: transparent; }
table.t2 tbody tr:not(.grp):hover { background: #f5f8ff; }
table.t2 tbody tr.picked { background: #eff6ff !important; }
tr.g2 td { background: #fafafa !important; padding: 6px 10px !important; border-top: 1px solid #e5e7eb !important; border-bottom: 1px solid #e5e7eb !important; }
.g2 .ph { display: flex; align-items: center; gap: 10px; }
.g2 .zname { font-weight: 650; color: #374151; font-size: 13.5px; }
.g2 .phstats2 { margin: 0 0 0 4px; color: #6b7280; font-size: 12.5px; display: inline; }
.g2 .bad { color: #b91c1c; font-weight: 600; }
.t2 .rt, .t2 .tk { font-weight: 650; color: #111827; text-decoration: none; }
.t2 .tk { color: #2563eb; }
.t2 a.mod { color: #6b7280; font-size: 12.5px; }
.t2 .sm, .t2 .age { font-size: 11.5px; }
/* équipe : sélecteur discret */
.t2 select.tsel { border: 1px solid transparent; background: transparent; font-weight: 600; padding: 3px 4px; border-radius: 6px; color: #1f4cb0; min-width: 96px; cursor: pointer; }
.t2 select.tsel:hover, .t2 select.tsel:focus { border-color: #cbd5e1; background: #fff; }
.t2 select.tsel.tnone { color: #9ca3af; font-weight: 400; border: 1px dashed #cbd5e1; }
/* date + raccourcis */
.dtc { display: inline-flex; align-items: center; gap: 8px; }
.dtc input[type=date] { border: 1px solid transparent; background: transparent; font-weight: 600; padding: 3px 4px; border-radius: 6px; min-width: 118px; }
.dtc input[type=date]:hover, .dtc input[type=date]:focus { border-color: #cbd5e1; background: #fff; }
.dtc .rel { color: #6b7280; font-size: 12px; min-width: 0; }
.dtc .rel.late { color: #b91c1c; font-weight: 600; }
.dtc .qd { display: none; gap: 4px; }
.dtc input.nodate ~ .qd, tr:hover .dtc .qd { display: inline-flex; }
.dtc .qd button { border: 1px solid #bfdbfe; background: #fff; color: #1d4ed8; border-radius: 5px; padding: 1px 7px; font-size: 11.5px; cursor: pointer; font-weight: 500; }
.dtc .qd button:hover { background: #eff6ff; }
tr.closed .dtc .qd { display: none !important; }
/* « Exécuté » : seulement pour les routes en cours / terminées */
.t2 tr:not(.exec) td.ex > * { display: none; }
.t2 tr.exec td.ex input[type=date], .t2 tr.exec td.ex input[type=number] { width: 124px; min-width: 0; display: inline-block; }
.t2 tr.exec td.ex .sub2 { display: inline-block; margin-left: 4px; }
.t2 td input[type=checkbox] { width: 15px; height: 15px; min-width: 0; padding: 0; }
.t2 td select.tsel, .t2 td select.prisel { width: auto; min-width: 0; }
.t2 td select.st { width: auto; min-width: 112px; }
.dtc input[type=date] { width: auto; }
.t2 td.remark input { width: 100%; }
.t2 select.prisel { font-size: 12px; padding: 2px 4px; border: 1px solid transparent; background: transparent; }
.t2 select.prisel:hover { border-color: #cbd5e1; background: #fff; }
.t2 td.work { max-width: 420px; color: #4b5563; }
.t2 td.remark input { min-width: 150px; border: 1px solid transparent; background: transparent; }
.t2 td.remark input:hover, .t2 td.remark input:focus { border-color: #cbd5e1; background: #fff; }
/* barre de sélection flottante */
.pg2 .bulkbar { background: #111827; border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.25); align-items: center; padding: 9px 14px; max-width: 900px; margin-left: auto; margin-right: auto; }
.pg2 .bulkbar label { flex-direction: row; align-items: center; gap: 6px; color: #d1d5db; }
.pg2 .bulkbar #bk_apply { background: #2563eb; border-color: #2563eb; }

.tools2 .warnbtn { font-size: 12px; padding: 4px 9px; color: #6b7280; }

/* barre du haut : recherche + accès discret à Import / Export */
.srchbtn { background: rgba(255,255,255,.12); color: #e6eef7; border: 0; border-radius: 6px; padding: 5px 11px; font-size: 13px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px }
.srchbtn:hover { background: rgba(255,255,255,.22) }
.srchbtn kbd { background: rgba(0,0,0,.25); border-radius: 4px; padding: 1px 6px; font-size: 11px; color: #b9cbe0; font-family: inherit }
.impx { color: #a9bdd2; font-size: 13px; text-decoration: none; padding: 5px 8px; border-radius: 6px }
.impx:hover, .impx.active { color: #fff; background: rgba(255,255,255,.12) }
@media (max-width: 1100px) { .srchbtn kbd { display: none } }

/* page Envoyer / Imprimer : choix du mode d'envoi */
.viaopts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 4px 0 16px }
.viaopts button { text-align: left; background: #fff; border: 2px solid #d6dde6; border-radius: 10px; padding: 12px 14px; cursor: pointer; font: inherit; color: inherit }
.viaopts button:hover { border-color: #9db8d9 }
.viaopts button.on { border-color: #2a78d6; background: #eef5ff }
.viaopts i { font-style: normal; font-size: 22px; display: block }
.viaopts b { display: block; font-size: 15px; margin: 2px 0 }
.viaopts span { font-size: 12px; color: #667 }
.viablock[hidden], section.envoi[hidden] { display: none !important }
@media (max-width: 800px) { .viaopts { grid-template-columns: 1fr 1fr } }
header.top nav a, header.top .logo, .srchbtn, .srchbtn kbd, .impx, header.top .sync { white-space: nowrap }
header.top nav a { padding-left: 9px; padding-right: 9px }
@media (max-width: 1450px) { .srchbtn kbd { display: none } }
@media (max-width: 1450px) { header.top nav a { padding-left: 6px; padding-right: 6px; font-size: 13px } header.top #sync { display: none } header.top .logo { font-size: 14px } }

header.top nav .srchbtn { margin-left: 14px }

/* fiche POP : câbles SPER / synergie */
.pcgrid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px }
.pcgrid2 .panel { margin-bottom: 0 }
.cchips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px }
.cchip { display: inline-flex; align-items: baseline; gap: 6px; background: #f1f4f8; border: 1px solid #dbe2ea; border-radius: 6px; padding: 3px 8px; font-size: 13px }
.cchip i { font-style: normal; color: #667; font-size: 11.5px }
.gblock { margin-bottom: 10px }
@media (max-width: 900px) { .pcgrid2 { grid-template-columns: 1fr } }

/* ---- adaptation automatique à la taille de la fenêtre ---- */
header.top { height: auto; min-height: 52px; flex-wrap: wrap; row-gap: 0; column-gap: 18px; }
header.top nav { flex-wrap: wrap; }
.searchrow { display: flex; justify-content: center; padding: 12px 16px 0 }
.gsfield { width: min(580px, 100%); display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid #cdd6e0; border-radius: 22px; padding: 9px 18px; color: #6f7c89; font: inherit; font-size: 14px; cursor: text; box-shadow: 0 1px 3px rgba(0,0,0,.06); text-align: left }
.gsfield:hover { border-color: #9db8d9 }
.gsfield .gsph { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.gsfield kbd { background: #eef1f5; border-radius: 4px; padding: 1px 7px; font-size: 11px; font-family: inherit; color: #6f7c89 }
@media (max-width: 1100px) { header.top { padding: 6px 12px } header.top nav { order: 3; width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 6px } header.top nav a { flex: none } }
@media (max-width: 640px) { .gsfield kbd { display: none } header.top .right { gap: 10px } main { padding-left: 10px !important; padding-right: 10px !important } }
main { max-width: 100%; }
.tablewrap, .tw2 { overflow-x: auto; }
img, svg, canvas { max-width: 100%; height: auto }
section.panel, .card { overflow-x: auto; }
.kpis { flex-wrap: wrap; }
input.path, .spform input[type=text], .spform input[type=search] { min-width: 0; max-width: 100%; }
@media (max-width: 1250px) { .kwd-g > * { min-width: 0; } }
input.livesearch { min-width: 0; max-width: 100%; box-sizing: border-box; }
.tools2 { flex-wrap: wrap; }
@media (max-width: 640px) { .toolbar input.livesearch, .tools2 input.livesearch { min-width: 0; width: 100%; } }

/* planning des équipes (tableau de bord) : version compacte */
.gtab { border-spacing: 3px; }
.gtab thead th { font-size: 11.5px; padding: 1px; }
.gteam { width: 104px; font-size: 13px; line-height: 1.2; padding-right: 4px; }
.gteam small { font-size: 10.5px; margin-top: 1px; line-height: 1.25; }
.gcell { height: 34px; padding: 3px 4px; border-radius: 6px; }
.gblk { display: flex; align-items: baseline; gap: 6px; text-align: left; padding: 2px 6px; margin-bottom: 2px; border-radius: 5px; }
.gblk b { display: inline; font-size: 12.5px; white-space: nowrap; flex: none; }
.gblk span { display: inline; font-size: 11.5px; flex: 1; min-width: 0; }
.gadd { font-size: 13px; line-height: 1; }
.gcell:not(:has(.gblk)) .gadd { line-height: 26px; }
.gtot { font-size: 10px; margin-top: 0; }
.gsum td { font-size: 11.5px; padding: 1px; line-height: 1.25; }
.wgrid > h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.wgrid > h2 .hint { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }

.ghandle { cursor: grab; color: #a8b1bf; margin-right: 5px; font-size: 12px; letter-spacing: -2px; user-select: none }
.ghandle:hover { color: #2a78d6 }
tr.rowdrag { opacity: .5 }

/* POP complet : bouton de sélection par type de câble dans l'en-tête d'un POP */
.pkgbtn { border: 1px solid #1f5fbf; background: #eaf1fd; color: #1f4f9f; border-radius: 99px; padding: 2px 11px; font-size: 12.5px; cursor: pointer; margin-left: 6px; }
.pkgbtn:hover { background: #d8e6fb; }

/* Production de la semaine : ligne compacte + détail replié */
.prod { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; margin: 14px 0 6px; }
.prodk b { font-size: 24px; display: block; line-height: 1.1; } .prodk span { font-size: 12px; color: #667085; }
.prod .ok { color: #1a7f4b; } .prod .ko { color: #b54708; }
.prodbar { flex: 1; min-width: 240px; }
.ptrack { height: 10px; background: #e8edf5; border-radius: 6px; overflow: hidden; }
.pfill { height: 100%; border-radius: 6px; background: #1a7f4b; } .pfill.ko { background: #e0852b; }
.pcap { font-size: 12px; color: #667085; margin-top: 5px; }
.psb { display: flex; align-items: flex-end; gap: 3px; height: 40px; position: relative; }
.psb i { width: 9px; background: #9db8e8; border-radius: 2px 2px 0 0; display: block; min-height: 2px; }
.psb i.hit { background: #3f78d0; } .psb i.cur.ok { background: #1a7f4b; } .psb i.cur.ko { background: #e0852b; }
.psb u { position: absolute; left: 0; right: 0; border-top: 1.5px dashed #c2622d; pointer-events: none; }
.prodmore { margin: 6px 0 10px; } .prodmore summary { cursor: pointer; color: #1f5fbf; font-size: 13px; }

/* Choix de la langue (en haut à droite) */
.langsw { display: inline-flex; gap: 2px; margin-right: 10px; }
.langsw a { padding: 2px 7px; border-radius: 6px; font-size: 12px; font-weight: 600; color: #c9d6ea; text-decoration: none; }
.langsw a:hover { background: rgba(255,255,255,.12); }
.langsw a.on { background: rgba(255,255,255,.22); color: #fff; }