/* Planning Heures : tout est limité à .plh pour ne pas toucher au thème. */
.plh{
  --bg:#F2F5F6; --surface:#FFFFFF; --fg:#14303A; --muted:#5E7178;
  --line:#D3DCE0; --line-soft:#E8EDEF; --we:#EBF0F2;
  --accent:#1F6F7A; --accent-fg:#FFFFFF; --accent-soft:#DCECEE;
  --danger:#B3372F; --blk-s:62%; --blk-l:89%; --blk-edge:42%;
  --hh:44px; --hours-w:44px;
  container-type:inline-size;
  background:var(--bg);color:var(--fg);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:15px;line-height:1.4;font-variant-numeric:tabular-nums;
  padding:16px;border-radius:12px;text-align:left;
  display:flex;flex-direction:column;gap:14px;
}
.plh,.plh *{box-sizing:border-box}
.plh [hidden]{display:none!important}
.plh p{margin:0}
.plh button{font:inherit;color:inherit;cursor:pointer;text-transform:none;letter-spacing:normal;box-shadow:none;
  min-height:0;line-height:1.3;margin:0;width:auto;text-decoration:none;text-shadow:none}
.plh :focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.plh .bar{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;padding-bottom:12px;border-bottom:1px solid var(--line)}
.plh .ttl{font-size:23px;line-height:1.1;margin:0;font-weight:800;letter-spacing:-.01em;color:var(--fg)}
.plh .tabs{display:flex;background:var(--line-soft);border-radius:9px;padding:3px;gap:2px}
.plh .tabs button{border:0;background:transparent;padding:6px 12px;border-radius:7px;font-weight:600;color:var(--muted)}
.plh .tabs button[aria-selected="true"]{background:var(--surface);color:var(--fg);box-shadow:0 1px 2px rgb(0 0 0 / .12)}
.plh .nav{display:flex;align-items:center;gap:6px;margin-left:auto;flex-wrap:wrap}
.plh .period{font-weight:700;min-width:11.5em;text-align:center}
.plh .btn{border:1px solid var(--line);background:var(--surface);color:var(--fg);border-radius:8px;padding:7px 12px;font-weight:600;font-size:15px}
.plh .btn.icon{padding:7px 11px}
.plh .btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.plh .btn.danger{color:var(--danger)}
.plh .btn:disabled{opacity:.55;cursor:default}

.plh .status{font-size:13px;color:var(--muted)}
.plh .status.err{color:var(--danger);font-weight:600}
.plh .view{display:flex;flex-direction:column;gap:14px}

.plh .sum{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:baseline}
.plh .sum .big{font-size:22px;font-weight:800}
.plh .sum .lbl{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600;margin-right:6px}
.plh .chips{display:flex;flex-wrap:wrap;gap:6px}
.plh .chip{background:hsl(var(--h) var(--blk-s) var(--blk-l));border:1px solid hsl(var(--h) 45% var(--blk-edge) / .5);
  border-radius:999px;padding:2px 10px;font-size:13px;font-weight:600}
.plh .sum .acts{margin-left:auto;display:flex;flex-wrap:wrap;gap:8px}

.plh .cal{background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.plh .cal-head,.plh .cal-body{display:grid;grid-template-columns:var(--hours-w) repeat(7,minmax(0,1fr))}
.plh .cal-head{border-bottom:1px solid var(--line)}
.plh .dayhead{border:0;border-left:1px solid var(--line-soft);border-radius:0;background:transparent;color:var(--fg);padding:8px 6px;text-align:left;min-width:0;cursor:default}
.plh .dayhead .n{font-size:12px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--muted)}
.plh .dayhead .d{font-size:18px;font-weight:800;margin-left:4px}
.plh .dayhead .t{display:block;font-size:12.5px;color:var(--muted);font-weight:600}
.plh .dayhead.today .n,.plh .dayhead.today .d{color:var(--accent)}
.plh .hours{position:relative;height:calc(var(--hh)*17)}
.plh .hours span{position:absolute;right:6px;font-size:11.5px;color:var(--muted);font-weight:600;transform:translateY(3px)}
.plh .col{position:relative;height:calc(var(--hh)*17);border-left:1px solid var(--line-soft);cursor:pointer;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(var(--line-soft) 1px,transparent 1px);
  background-size:100% var(--hh),100% calc(var(--hh)/2)}
.plh .col.we{background-color:var(--we)}
.plh .blk{position:absolute;border:1px solid hsl(var(--h) 45% var(--blk-edge) / .65);background:hsl(var(--h) var(--blk-s) var(--blk-l));
  color:var(--fg);border-radius:6px;padding:2px 6px;text-align:left;overflow:hidden;font-size:12.5px;line-height:1.25;display:block}
.plh .blk b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:700}
.plh .blk span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.85}
.plh .hint{font-size:13px;color:var(--muted)}

@container (max-width:760px){
  .plh .nav{margin-left:0;width:100%}
  .plh .period{flex:1;min-width:0}
  .plh .cal-head{grid-template-columns:repeat(7,minmax(0,1fr))}
  .plh .cal-head .corner{display:none}
  .plh .dayhead{text-align:center;padding:6px 2px;cursor:pointer;border-left:0}
  .plh .dayhead .n,.plh .dayhead .d{display:block;margin:0}
  .plh .dayhead .n{font-size:10.5px}
  .plh .dayhead .t{font-size:11px}
  .plh .dayhead.sel{background:var(--accent-soft)}
  .plh .cal-body{grid-template-columns:var(--hours-w) minmax(0,1fr)}
  .plh .col{display:none}
  .plh .col.sel{display:block}
  .plh .blk{font-size:13.5px;padding:3px 8px}
}

.plh .tablebox{background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow-x:auto}
.plh table{border-collapse:collapse;width:100%;margin:0;border:0;background:transparent;font-size:15px}
.plh th,.plh td{padding:9px 12px;text-align:left;border:0;border-bottom:1px solid var(--line-soft);white-space:nowrap;background:transparent;color:var(--fg)}
.plh th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
.plh td.num,.plh th.num{text-align:right}
.plh tfoot td{font-weight:700;border-bottom:0;border-top:1px solid var(--line)}
.plh .dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:hsl(var(--h) 50% var(--blk-edge));margin-right:8px}
.plh details{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:8px 12px}
.plh details+details{margin-top:8px}
.plh summary{font-weight:700;cursor:pointer}
.plh details ul{margin:8px 0 2px;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px;font-size:14px}
.plh details li{margin:0;padding:0}
.plh details li span{color:var(--muted)}
.plh .h2{font-size:17px;font-weight:800;margin:6px 0 0;color:var(--fg)}
.plh .copyout{width:100%;min-height:9em;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--fg);padding:8px;font:13px/1.4 ui-monospace,Menlo,monospace}
.plh .empty{padding:22px 14px;color:var(--muted);text-align:center}

.plh .lock{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:18px;max-width:380px}
.plh .f{display:flex;flex-direction:column;gap:4px;margin-bottom:11px;min-width:0}
.plh .f label{font-size:12px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--muted);margin:0}
.plh .f input,.plh .f select{border:1px solid var(--line);border-radius:8px;padding:9px 10px;background:var(--bg);color:var(--fg);
  width:100%;min-width:0;height:auto;margin:0;font:inherit;font-size:16px;line-height:1.3;box-shadow:none}
.plh .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.plh .dur{font-size:13px;color:var(--muted);margin:-4px 0 10px}
.plh .actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;margin-top:6px}
.plh .actions .left{margin-right:auto}
.plh .ferr{color:var(--danger);font-size:13px;font-weight:600;min-height:1.2em}

.plh dialog{border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--fg);padding:18px;
  width:min(420px,calc(100vw - 32px));max-width:none;font-size:15px}
.plh dialog::backdrop{background:rgb(0 0 0 / .45)}
.plh dialog .h2{margin:0 0 12px;font-size:19px}
