/* Layout : barre de menu en haut comme Lodisare, sous-menu Fiches, fiches à onglets + sous-menu à gauche, encadrés titrés */
:root{
  --bg:#eef1f5; --surface:#ffffff; --surface-2:#eef1f5; --line:#d6dce5; --ink:#172131; --muted:#556275;
  --nav-bg:#1e2a3c; --nav-ink:#e9eef6; --nav-muted:#a8b4c6; --nav-hover:#2b3a52; --nav-active:#36496a;
  --accent:#2f4b8f; --accent-soft:#e1e7f4; --on-accent:#ffffff;
  --good:#1b6e45; --good-soft:#ddf0e5; --warn:#975c05; --warn-soft:#fcedd2; --crit:#b42318; --crit-soft:#fbe1de;
  --shared:#5e4196; --shared-soft:#ece5f7;
  --f-display:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;
  --f-body:"Public Sans","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --r:10px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#10151c; --surface:#18202a; --surface-2:#202935; --line:#2d3746; --ink:#e4e9f0; --muted:#9aa6b6;
    --nav-bg:#0b1017; --nav-ink:#e4e9f0; --nav-muted:#8d99aa; --nav-hover:#18212d; --nav-active:#24324a;
    --accent:#8ea7e6; --accent-soft:#222e46; --on-accent:#0d1320;
    --good:#61c493; --good-soft:#153126; --warn:#e3b553; --warn-soft:#352a12; --crit:#f08a7f; --crit-soft:#3a1c1a;
    --shared:#bba3e9; --shared-soft:#29223d; color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#10151c; --surface:#18202a; --surface-2:#202935; --line:#2d3746; --ink:#e4e9f0; --muted:#9aa6b6;
  --nav-bg:#0b1017; --nav-ink:#e4e9f0; --nav-muted:#8d99aa; --nav-hover:#18212d; --nav-active:#24324a;
  --accent:#8ea7e6; --accent-soft:#222e46; --on-accent:#0d1320;
  --good:#61c493; --good-soft:#153126; --warn:#e3b553; --warn-soft:#352a12; --crit:#f08a7f; --crit-soft:#3a1c1a;
  --shared:#bba3e9; --shared-soft:#29223d; color-scheme:dark;
}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:14px;line-height:1.5}
h1,h2,h3{font-family:var(--f-display);text-wrap:balance;margin:0;line-height:1.2}
h1{font-size:1.45rem;font-weight:700}
h2{font-size:1.05rem;font-weight:700}
h3{font-size:.95rem;font-weight:700}
p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mono{font-family:var(--f-mono);font-size:.92em;font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
.small{font-size:.84rem}
.demo-banner{background:var(--warn-soft);color:var(--warn);text-align:center;font-size:.8rem;font-weight:600;padding-block:5px;padding-inline:16px}

/* Barre de menu */
.topbar{background:var(--nav-bg);color:var(--nav-ink);display:flex;align-items:center;gap:2px;padding-inline:16px;min-height:54px;flex-wrap:wrap}
.brand{font-family:var(--f-display);font-weight:700;font-size:1.1rem;display:flex;align-items:center;gap:9px;margin-right:14px;white-space:nowrap}
.brand-mark{width:22px;height:22px;border-radius:50%;background:conic-gradient(from 200deg,#8ea7e6,#2f4b8f 60%,#8ea7e6);flex:none}
.navlink{all:unset;cursor:pointer;padding-block:8px;padding-inline:12px;border-radius:6px;color:var(--nav-ink);font-weight:500;display:inline-flex;gap:6px;align-items:center;white-space:nowrap}
.navlink:hover{background:var(--nav-hover)}
.navlink[aria-current="page"]{background:var(--nav-active);font-weight:700}
.navlink:focus-visible{outline:2px solid var(--nav-ink)}
.navlink .later{font-size:.7rem;color:var(--nav-muted)}
.topsearch{display:flex;margin-inline:8px}
.topsearch input{border:1px solid var(--nav-hover);background:var(--nav-hover);color:var(--nav-ink);border-radius:6px;padding-block:6px;padding-inline:10px;width:220px;max-width:40vw}
.topsearch input::placeholder{color:var(--nav-muted)}
.spacer{flex:1}
.create{all:unset;cursor:pointer;background:#177a4f;color:#fff;font-weight:700;padding-block:8px;padding-inline:14px;border-radius:6px;white-space:nowrap}
.create:hover{filter:brightness(1.08)}
.create:focus-visible{outline:2px solid var(--nav-ink)}
.badge-n{background:var(--crit);color:#fff;border-radius:999px;font-size:.72rem;font-weight:700;padding-inline:7px}

.subbar{background:var(--surface);border-bottom:1px solid var(--line);display:flex;gap:2px;padding-inline:16px;overflow-x:auto}
.subbar .sep{width:1px;background:var(--line);margin-block:8px;margin-inline:10px}
.sublink{all:unset;cursor:pointer;padding-block:10px;padding-inline:12px;font-weight:600;color:var(--accent);border-bottom:2px solid transparent;white-space:nowrap}
.sublink[aria-current="page"]{color:var(--ink);border-bottom-color:var(--ink)}
.sublink:focus-visible{outline:2px solid var(--accent)}

main{padding-block:20px;padding-inline:20px;display:flex;flex-direction:column;gap:16px;max-width:1440px;margin-inline:auto;width:100%}

/* Éléments communs */
.btn{cursor:pointer;border:1px solid var(--line);background:var(--surface);border-radius:7px;padding-block:6px;padding-inline:11px;font-weight:600;font-size:.86rem;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.btn:hover{background:var(--surface-2)}
.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.btn-primary:hover{background:var(--accent);filter:brightness(1.08)}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.link{all:unset;cursor:pointer;color:var(--accent);font-weight:600}
.link:hover{text-decoration:underline}
.link:focus-visible{outline:2px solid var(--accent)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding-inline:9px;padding-block:1px;font-size:.76rem;font-weight:700;white-space:nowrap}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.st-attente{background:var(--surface-2);color:var(--muted);border:1px solid var(--line)}
.st-cours{background:var(--good-soft);color:var(--good)}
.st-susp{background:var(--warn-soft);color:var(--warn)}
.st-acl{background:var(--crit-soft);color:var(--crit)}
.st-clos{background:var(--surface-2);color:var(--muted)}
.miss{cursor:pointer;border:0;border-radius:6px;padding-inline:7px;padding-block:1px;font-size:.78rem;font-weight:700;background:var(--crit);color:#fff;white-space:nowrap}
.miss.ok{background:var(--good-soft);color:var(--good);cursor:default}
.chip{display:inline-flex;align-items:center;gap:4px;font-size:.74rem;font-weight:600;border-radius:5px;padding-inline:6px;padding-block:1px;background:var(--surface-2);color:var(--muted);border:1px solid var(--line);white-space:nowrap}
.chip-auto{background:var(--accent-soft);color:var(--accent);border-color:transparent}
.chip-shared{background:var(--shared-soft);color:var(--shared);border-color:transparent}
.person{display:inline-flex;align-items:center;gap:6px;border-radius:6px;padding-inline:8px;padding-block:2px;font-weight:600;font-size:.86rem;white-space:nowrap;border:0}
.person.aut{background:var(--accent);color:var(--on-accent)}
.person.vic{background:var(--surface-2);color:var(--ink);border:1px solid var(--line)}
.person .age{font-style:italic;font-weight:400;opacity:.85}
button.person{cursor:pointer}
button.person:hover{filter:brightness(1.1)}
button.person:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.person.org{background:var(--good-soft);color:var(--good)}
.degree{font-size:.8rem;background:var(--surface-2);border:1px solid var(--line);border-radius:5px;padding-inline:6px;white-space:nowrap}
.late{color:var(--crit);font-weight:700}
.tcount{font-weight:700}
.tcount.late{color:var(--crit)}
.hint{font-size:.8rem;color:var(--muted)}
.empty{color:var(--crit);font-weight:600}

.tablewrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding-block:8px;padding-inline:10px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:.78rem;color:var(--muted);font-weight:700;white-space:nowrap}
tbody tr.clickable{cursor:pointer}
tbody tr.clickable:hover{background:var(--surface-2)}
tr.sit-row td{background:var(--accent-soft);font-weight:600}
.num{text-align:right}
.filters{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.filters button{cursor:pointer;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding-block:3px;padding-inline:11px;font-size:.82rem;font-weight:600}
.filters button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}

/* Accueil */
.band{background:var(--accent);color:var(--on-accent);border-radius:var(--r);padding-block:14px;padding-inline:18px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.home{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:18px;align-items:start}
.section{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:12px;min-width:0;scroll-margin-top:12px}
.sec-title{font-family:var(--f-display);font-size:1.05rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
.grp{border:1px solid var(--line);border-radius:8px;overflow:hidden}
.grp-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-block:8px;padding-inline:14px;font-weight:700;flex-wrap:wrap}
.grp-cours{background:var(--good-soft);color:var(--good)}
.grp-susp{background:var(--warn-soft);color:var(--warn)}
.grp-acl{background:var(--crit-soft);color:var(--crit)}
.grp-att{background:var(--surface-2);color:var(--ink)}
.grp-tasks{background:var(--accent-soft);color:var(--accent)}
.grp .none{padding:12px 14px;color:var(--muted)}
.collapsed{all:unset;cursor:pointer;display:flex;gap:8px;align-items:center;font-weight:600;color:var(--ink);padding-block:4px}
.collapsed:focus-visible{outline:2px solid var(--accent)}
.side{position:sticky;top:12px;display:flex;flex-direction:column;gap:14px}
.side-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--surface)}
.side-list button{all:unset;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding-block:10px;padding-inline:14px;border-bottom:1px solid var(--line)}
.side-list button:last-child{border-bottom:0}
.side-list button:hover{background:var(--surface-2)}
.side-list button:focus-visible{outline:2px solid var(--accent)}
.side-list .n{background:var(--ink);color:var(--surface);border-radius:999px;font-size:.75rem;font-weight:700;padding-inline:8px}
.side-list .red{background:var(--crit);color:#fff}
.check{display:flex;gap:8px;align-items:flex-start;font-weight:600;font-size:.88rem}

/* Fiches */
.fiche-head{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding-block:14px 0;padding-inline:18px;display:flex;flex-direction:column;gap:8px}
.fiche-title{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.type-label{font-family:var(--f-display);font-weight:700;font-size:1.45rem;color:var(--accent)}
.fiche-meta{font-size:.82rem;color:var(--muted);display:flex;gap:4px 14px;flex-wrap:wrap}
.fiche-actions{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.tabs{display:flex;gap:2px;overflow-x:auto;margin-top:6px}
.tabs button{all:unset;cursor:pointer;padding-block:9px;padding-inline:13px;font-weight:600;color:var(--accent);border-bottom:3px solid transparent;white-space:nowrap}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--ink)}
.tabs button.shared{color:var(--shared);background:var(--shared-soft);border-radius:6px 6px 0 0}
.tabs button.shared[aria-selected="true"]{border-bottom-color:var(--shared)}
.tabs button:focus-visible{outline:2px solid var(--accent)}
.tabs .tsep{width:1px;background:var(--line);margin-inline:6px;margin-block:6px}
.fiche-body{display:grid;grid-template-columns:230px minmax(0,1fr);gap:16px;align-items:start}
.fiche-body.full{grid-template-columns:minmax(0,1fr)}
.submenu{display:flex;flex-direction:column;gap:6px}
.submenu button{all:unset;cursor:pointer;padding-block:10px;padding-inline:12px;border-radius:8px;background:var(--surface);border:1px solid var(--line);font-weight:600;font-size:.88rem;display:flex;justify-content:space-between;gap:8px}
.submenu button[aria-current="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.submenu.shared button[aria-current="true"]{background:var(--shared);border-color:var(--shared);color:var(--surface)}
.submenu button:focus-visible{outline:2px solid var(--accent)}
.content{display:flex;flex-direction:column;gap:16px;min-width:0}
.box{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;min-width:0}
.box-head{background:var(--surface-2);padding-block:10px;padding-inline:16px;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.box.shared{border-color:var(--shared)}
.box.shared .box-head{background:var(--shared-soft);color:var(--shared)}
.box-body{padding:16px;display:flex;flex-direction:column;gap:12px}
.kv{display:grid;grid-template-columns:minmax(170px,max-content) minmax(0,1fr);gap:9px 22px}
.kv dt{color:var(--muted);font-size:.88rem;text-align:right}
.kv dd{margin:0;font-weight:500}
.progress{height:10px;border-radius:5px;background:var(--surface-2);overflow:hidden;border:1px solid var(--line)}
.progress span{display:block;height:100%;background:var(--accent)}
.steps{display:flex;flex-direction:column;gap:6px}
.stepline{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:10px;align-items:center;padding-block:7px;padding-inline:10px;border-radius:8px;border:1px solid var(--line)}
.stepline .ix{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:.8rem;background:var(--surface-2);color:var(--muted)}
.stepline.done .ix{background:var(--accent);color:var(--on-accent)}
.stepline.next{border-color:var(--accent);border-style:dashed}
.banner{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;border-radius:var(--r);padding-block:11px;padding-inline:16px;background:var(--accent-soft);border:1px solid var(--accent)}
.banner.warn{background:var(--warn-soft);border-color:var(--warn)}
.banner.crit{background:var(--crit-soft);border-color:var(--crit)}
.timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.timeline li{display:grid;grid-template-columns:90px 14px minmax(0,1fr);gap:10px;padding-block:7px}
.tl-date{font-size:.82rem;color:var(--muted);text-align:right}
.tl-dot{width:10px;height:10px;border-radius:50%;margin-top:6px;background:var(--line);justify-self:center}
.tl-dot.note{background:var(--accent)} .tl-dot.rdv{background:var(--good)} .tl-dot.rapport{background:var(--warn)} .tl-dot.doc{background:var(--muted)} .tl-dot.statut{background:var(--shared)}
.tl-body{display:flex;flex-direction:column;gap:2px}
.matrix th,.matrix td{border:1px solid var(--line);text-align:center}
.matrix th.rowh{text-align:left;font-size:.9rem;color:var(--ink)}
.matrix thead th{font-size:.9rem;color:var(--ink)}
.cell-btn{all:unset;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px;border-radius:8px;min-width:120px}
.cell-btn:hover{background:var(--surface-2)}
.cell-btn:focus-visible{outline:2px solid var(--accent)}
.cell-add{color:var(--muted);font-size:1.3rem}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
.field{display:flex;flex-direction:column;gap:5px;min-width:0}
.field.full{grid-column:1 / -1}
.field label,.legend{font-size:.85rem;font-weight:600}
.field input,.field select,.field textarea{border:1px solid var(--line);background:var(--surface);border-radius:7px;padding-block:7px;padding-inline:10px;min-width:0;width:100%}
.opts{display:flex;flex-wrap:wrap;gap:6px 16px}
.opts label{display:flex;gap:6px;align-items:center;font-size:.9rem;cursor:pointer}
.opts label.off{color:var(--muted);text-decoration:line-through;cursor:not-allowed}
.task-done{all:unset;cursor:pointer;width:20px;height:20px;border:2px solid var(--line);border-radius:5px;display:inline-grid;place-items:center}
.task-done:hover{border-color:var(--good)}
.task-done:focus-visible{outline:2px solid var(--accent)}
.pres{all:unset;cursor:pointer;width:30px;height:30px;border-radius:7px;display:inline-grid;place-items:center;font-weight:700;background:var(--surface-2);color:var(--muted)}
.pres.yes{background:var(--good-soft);color:var(--good)}
.pres.no{background:var(--crit-soft);color:var(--crit)}
.pres[disabled]{cursor:default;opacity:.55}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--surface);padding-block:10px;padding-inline:16px;border-radius:10px;font-weight:600;max-width:min(92vw,560px);box-shadow:0 8px 30px rgba(0,0,0,.25);z-index:50}
.modal-back{position:fixed;inset:0;background:rgba(10,15,25,.45);display:grid;place-items:center;padding:16px;z-index:40}
.modal{background:var(--surface);border-radius:12px;max-width:640px;width:100%;max-height:85vh;overflow:auto;padding:22px;display:flex;flex-direction:column;gap:14px;border:1px solid var(--line)}
.login{min-height:80vh;display:grid;place-items:center;padding-inline:16px}
.login .box{width:100%;max-width:380px}

@media (max-width:1000px){.home{grid-template-columns:1fr}.side{position:static}}
@media (max-width:760px){
  .fiche-body{grid-template-columns:1fr}
  .submenu{flex-direction:row;overflow-x:auto}
  .submenu button{white-space:nowrap}
  .form{grid-template-columns:1fr}
  .kv{grid-template-columns:1fr;gap:1px}
  .kv dt{text-align:left}
  .kv dd{margin-bottom:8px}
  .topsearch{order:5;width:100%;margin:0 0 8px}
  .topsearch input{width:100%;max-width:none}
  main{padding-inline:16px}
}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

/* --- Ajouts pour l'application (liens au lieu de boutons, messages) --- */
a.person, a.navlink, a.sublink, a.btn, a.link, a.create, a.side-link { text-decoration: none; }
a.person:hover { filter: brightness(1.1); }
a.btn { color: inherit; }
a.btn-primary { color: var(--on-accent); }
tr[data-href] { cursor: pointer; }
tr[data-href]:hover { background: var(--surface-2); }
.side-list a { display: flex; justify-content: space-between; align-items: center; padding-block: 10px; padding-inline: 14px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.side-list a:last-child { border-bottom: 0; }
.side-list a:hover { background: var(--surface-2); }
.submenu a { padding-block: 10px; padding-inline: 12px; border-radius: 8px; background: var(--surface); border: 1px solid var(--line); font-weight: 600; font-size: .88rem; display: flex; justify-content: space-between; gap: 8px; color: var(--ink); text-decoration: none; }
.submenu a[aria-current="true"] { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.submenu.shared a[aria-current="true"] { background: var(--shared); border-color: var(--shared); color: var(--surface); }
.tabs a { padding-block: 9px; padding-inline: 13px; font-weight: 600; color: var(--accent); border-bottom: 3px solid transparent; white-space: nowrap; text-decoration: none; }
.tabs a[aria-selected="true"] { color: var(--ink); border-bottom-color: var(--ink); }
.tabs a.shared { color: var(--shared); background: var(--shared-soft); border-radius: 6px 6px 0 0; }
.tabs a.shared[aria-selected="true"] { border-bottom-color: var(--shared); }
.filters a { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding-block: 3px; padding-inline: 11px; font-size: .82rem; font-weight: 600; color: var(--ink); text-decoration: none; }
.filters a[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.messages { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.messages li { border-radius: var(--r); padding-block: 10px; padding-inline: 16px; background: var(--good-soft); color: var(--good); font-weight: 600; border: 1px solid var(--good); }
.messages li.error, .messages li.warning { background: var(--crit-soft); color: var(--crit); border-color: var(--crit); }
.inline-form { display: inline; }
details.closed-group > summary { cursor: pointer; font-weight: 600; padding-block: 4px; }
.errorlist { color: var(--crit); margin: 0; padding-left: 18px; font-size: .85rem; }
.degree { white-space: normal; display: inline-block; max-width: 34ch; line-height: 1.35; }

/* Saisie */
[hidden] { display: none !important; }
.opts > div { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.opts > div > div { display: contents; }
.field input[type="checkbox"], .field input[type="radio"] { width: auto; }
.field.has-error input, .field.has-error select, .field.has-error textarea { border-color: var(--crit); }
label.check { display: flex; gap: 8px; align-items: center; font-weight: 600; font-size: .9rem; cursor: pointer; }
fieldset.groupe { border: 0; margin: 0 0 18px; padding: 0; min-width: 0; }
fieldset.groupe legend { font-family: var(--f-display); font-weight: 700; font-size: 1rem; padding: 0 0 10px; color: var(--ink); }
.saisie .actions, .stack > .actions { margin-top: 6px; }
.btn-danger { color: var(--crit); border-color: var(--crit); }
.btn-danger:hover { background: var(--crit-soft); }
.stack { display: flex; flex-direction: column; gap: 16px; }
.pagehead { display: flex; flex-direction: column; gap: 4px; }
.pagehead h1 { margin: 0; font-family: var(--f-display); font-size: 1.4rem; }
.picker { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; }
.picker-res { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; max-width: 560px; }
.picker-item { all: unset; cursor: pointer; display: block; padding-block: 7px; padding-inline: 10px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); font-weight: 600; }
.picker-item:hover, .picker-item:focus-visible { background: var(--accent-soft); border-color: var(--accent); }
.picker-choisi { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.box-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.box-head .btn { padding-block: 4px; font-size: .8rem; }
td .btn-edit { padding-block: 2px; padding-inline: 8px; font-size: .78rem; }
.box-head.shared { background: var(--shared-soft); color: var(--shared); }
.create[aria-current="page"] { outline: 2px solid var(--nav-ink); }
.matrix form .cell-btn { box-sizing: border-box; width: 100%; }
ol.sequence { margin: 0 0 8px; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; }
ol.sequence li { padding-left: 4px; }
ol.sequence li.ici { font-weight: 700; }

/* Comptes et droits */
.compte-grille { display: flex; flex-direction: column; gap: 16px; }
.matrice-droits { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.carte-droit { border: 1px solid var(--line); border-radius: var(--r); margin: 0; padding: 0; overflow: hidden; min-width: 0; }
.carte-droit legend { float: left; width: 100%; background: var(--accent); color: var(--on-accent); font-weight: 700; padding-block: 7px; padding-inline: 12px; font-size: .9rem; }
.carte-droit .cases { clear: both; display: flex; gap: 4px; padding: 10px 12px; }
.carte-droit label { display: flex; flex-direction: column; align-items: center; gap: 2px; flex: 1; font-weight: 700; font-size: .8rem; cursor: pointer; }
.carte-droit[disabled] label { cursor: default; }
.carte-droit input { width: 18px; height: 18px; accent-color: var(--good); }
.lien-mdp { margin-top: 8px; width: 100%; border: 1px solid var(--accent); border-radius: 7px; padding: 7px 10px; font-family: var(--f-mono, monospace); font-size: .82rem; background: var(--surface); }
table.presences select { border: 1px solid var(--line); border-radius: 6px; padding: 3px 6px; background: var(--surface); }
table.presences select.oui { background: var(--good-soft); color: var(--good); font-weight: 700; }
table.presences select.non { background: var(--crit-soft); color: var(--crit); font-weight: 700; }
.champ-recherche, .box .row > select { border: 1px solid var(--line); border-radius: 7px; padding-block: 6px; padding-inline: 10px; background: var(--surface); min-width: 0; }
.champ-recherche { flex: 1 1 220px; max-width: 360px; }

/* Courriers : aperçu à l'échelle d'une page A4 (repris de « Courriers Radian ») */
.cache { display: none !important; }
.courrier-grille { display: grid; grid-template-columns: minmax(300px, 460px) minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 1000px) { .courrier-grille { grid-template-columns: 1fr; } }
.courrier-form { display: flex; flex-direction: column; gap: 12px; }
.courrier-form .form { gap: 10px 14px; }
.donnees-dossier summary { cursor: pointer; font-weight: 600; font-size: .9rem; color: var(--accent); }
.donnees-dossier[open] summary { margin-bottom: 10px; }
#msg.ok { color: var(--good); font-weight: 600; }
.hint.ok { color: var(--good); }
.banner ul { margin: 6px 0; padding-left: 18px; }
button.link { background: none; border: 0; padding: 0; font: inherit; }
.apercu-courrier { --zoom: 1; overflow: hidden; }
.apercu-courrier.reelle { position: fixed; inset: 20px; z-index: 50; overflow: auto; background: #e9e7e2; padding: 20px; border-radius: var(--r); box-shadow: 0 10px 40px rgba(0,0,0,.25); }
.apercu-courrier .page { zoom: var(--zoom); width: 595.3pt; min-height: 841.9pt; margin: 0 auto 14px; padding: 0 70.9pt 70.9pt; position: relative;
  background: #fff; border: 1px solid var(--line); color: #000; text-align: left; font-family: Calibri, Carlito, "Segoe UI", sans-serif; font-size: 12pt; line-height: 1.3184; }
.apercu-courrier .page p { margin: 0; text-align: left; }
.apercu-courrier .zone-entete, .apercu-courrier .zone-pied { position: absolute; left: 0; right: 0; display: flex; align-items: center; justify-content: center;
  font: 10pt "Segoe UI", sans-serif; color: #8a9599; background: repeating-linear-gradient(135deg, #f5f4f0 0 8px, #fbfaf8 8px 16px); }
.apercu-courrier .zone-entete { top: 0; height: 90.9pt; position: relative; margin: 0 -70.9pt; }
.apercu-courrier .zone-pied { bottom: 0; height: 56pt; }
.apercu-courrier .sig-place { display: inline-flex; align-items: center; justify-content: center; border: 1px dashed #8a9599; color: #8a9599; font: 8pt "Segoe UI", sans-serif; vertical-align: top; }
.apercu-courrier .titre-page { font-size: 12.5px; color: var(--muted); margin: 0 0 6px; }

/* Notifications */
.navlink .badge-n { margin-left: 2px; }
.notif { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; padding-block: 9px; padding-inline: 10px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; border-radius: 6px; }
.notif:hover { background: var(--surface-2); }
.notif-titre { flex: 1 1 320px; }
.notif.nouvelle .notif-titre { font-weight: 700; }
.apercu-courrier .sig-place { transform: translateY(-10%); }   /* même chevauchement que dans le document Word */
.apercu-courrier table.sig-direction { width: 100%; border-collapse: collapse; margin-top: 30pt; }
.apercu-courrier table.sig-direction td { width: 50%; text-align: center; vertical-align: top; border: 0; padding: 0; }
.apercu-courrier p.c { text-align: center; }

/* Aperçu d'un document */
.apercu-pdf { width: 100%; height: 80vh; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.apercu-image { max-width: 100%; height: auto; border: 1px solid var(--line); }
#apercu-word { overflow-x: auto; background: #e9e7e2; border-radius: 6px; }
#apercu-word .docx-wrapper { background: #e9e7e2; padding: 16px; }
#apercu-word .docx-wrapper > section.docx { box-shadow: 0 2px 10px rgba(0,0,0,.15); margin-bottom: 16px; }
#apercu-word .filigrane-apercu { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 0; opacity: .35; pointer-events: none; }
details.renvoi[open] { flex-basis: 100%; }
.renvoi-form { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; max-width: 640px; }
.renvoi-form label { font-weight: 600; font-size: .85rem; }
.renvoi-form textarea { border: 1px solid var(--line); border-radius: 7px; padding: 8px 10px; font: inherit; width: 100%; resize: vertical; }
.renvoi-form .btn { align-self: flex-start; }
.remarque-direction { max-width: 360px; white-space: normal; margin-top: 4px; }

/* Boutons des missions (listes Auteurs et Victimes) selon leur statut */
.btn.mis-cours{background:var(--good-soft);border-color:var(--good);color:var(--good)}
.btn.mis-susp{background:var(--warn-soft);border-color:var(--warn);color:var(--warn)}
.btn.mis-acl{background:var(--crit-soft);border-color:var(--crit);color:var(--crit)}
.btn.mis-clos{background:var(--surface-2);border-color:var(--line);color:var(--muted)}
.btn.mis-cours:hover,.btn.mis-susp:hover,.btn.mis-acl:hover,.btn.mis-clos:hover{filter:brightness(.97)}
.legende-missions{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.legende-missions .btn{cursor:default;font-size:.74rem;padding-block:2px;padding-inline:8px}

/* Statut cliquable dans l'en-tête d'une fiche : d'où il vient, ce qui le fera changer */
details.statut-info{position:relative;display:inline-block}
details.statut-info>summary{list-style:none;cursor:pointer}
details.statut-info>summary::-webkit-details-marker{display:none}
details.statut-info>summary .pill::after{content:" ▾";font-size:.7em}
.statut-pop{position:absolute;z-index:20;top:calc(100% + 6px);left:0;width:min(340px,80vw);background:var(--surface);border:1px solid var(--line);border-radius:9px;box-shadow:0 6px 24px rgba(0,0,0,.12);padding:10px 12px;font-size:.84rem;font-weight:400;line-height:1.4}
.statut-pop p{margin-block:0 6px}
.statut-pop p:last-child{margin-bottom:0}

/* Brouillons du suivi journalier */
.box-brouillons{border-style:dashed}
.brouillon{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;padding-block:8px;border-bottom:1px solid var(--line)}
.brouillon:last-child{border-bottom:0}

/* Carte des organismes (Leaflet) */
.carte{height:440px;border:1px solid var(--line);border-radius:9px;margin-block:10px;position:relative;z-index:0}
.carte-petite{height:260px}
.carte-barre{gap:12px;align-items:center;flex-wrap:wrap}
.carte-legende{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.carte-legende span{display:inline-flex;align-items:center;gap:5px}
.pastille{display:inline-block;width:12px;height:12px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
.pastille.st-libre{background:#16a34a}.pastille.st-negociation{background:#f59e0b}.pastille.st-occupe{background:#dc2626}
.pastille.st-stand_by{background:#6b7280}.pastille.st-stop{background:#1f2937}
.leaflet-container{font:inherit}
/* Fond de carte en noir et blanc : seuls les repères (organismes, communes) sont en couleur, on les voit mieux */
.leaflet-tile-pane{filter:grayscale(1) contrast(1.05) brightness(1.04)}

/* Agenda (semaine) */
.ag-tete{gap:12px;align-items:center;flex-wrap:wrap}
.ag-nav{gap:6px;align-items:center;flex-wrap:wrap}
.ag-collegues{margin-block:8px}
.ag-collegues>summary{cursor:pointer;font-weight:600;color:var(--accent)}
.ag-cases{display:flex;flex-wrap:wrap;gap:4px 16px;margin-block:8px}
.ag-legende{display:flex;flex-wrap:wrap;gap:12px}
.ag-legende span{display:inline-flex;align-items:center;gap:5px}
.ag-pastille{display:inline-block;width:12px;height:12px;border-radius:3px}
.ag-grille{--h:56px;display:grid;grid-template-columns:48px repeat(var(--jours),minmax(0,1fr));border:1px solid var(--line);border-radius:9px;background:var(--surface);overflow:hidden;margin-top:8px}
.ag-coin{border-bottom:1px solid var(--line)}
.ag-entete{border-bottom:1px solid var(--line);border-left:1px solid var(--line);padding:6px;display:flex;flex-direction:column;gap:3px;min-width:0}
.ag-jnom{font-weight:700;font-size:.86rem}
.ag-jnom span{font-weight:500;color:var(--muted)}
.ag-entete.auj .ag-jnom{color:var(--accent)}
.ag-heures{display:flex;flex-direction:column}
.ag-heures span{height:var(--h);font-size:.72rem;color:var(--muted);text-align:right;padding-inline-end:6px;transform:translateY(-.5em)}
.ag-heures span:first-child{transform:none}
.ag-jour{position:relative;height:calc(11 * var(--h));border-left:1px solid var(--line);cursor:copy;
  background-image:linear-gradient(var(--line) 1px,transparent 1px);background-size:100% var(--h)}
.ag-jour.auj{background-color:color-mix(in srgb,var(--accent) 5%,transparent)}
.ag-el{position:absolute;box-sizing:border-box;padding:3px 5px;border-radius:6px;border:1px solid var(--surface);overflow:hidden;font-size:.76rem;line-height:1.25;cursor:pointer;display:flex;flex-direction:column;gap:1px;text-decoration:none}
.ag-el strong{font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ag-h,.ag-d,.ag-qui{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ag-h{font-variant-numeric:tabular-nums;opacity:.85}
.ag-d,.ag-qui{opacity:.85}
.ag-el:hover,.ag-el:focus-visible{z-index:5;box-shadow:0 2px 10px rgba(0,0,0,.18)}
.ag-seance{border-style:dashed}
.ag-journee{display:block;font-size:.74rem;padding:2px 5px;border-radius:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none}
/* couleurs : moi, puis jusqu'à 5 collègues */
.ag-c0{background:var(--accent);color:var(--on-accent)}
.ag-c1{background:#0f766e;color:#fff}
.ag-c2{background:#9333ea;color:#fff}
.ag-c3{background:#c2410c;color:#fff}
.ag-c4{background:#be185d;color:#fff}
.ag-c5{background:#4d7c0f;color:#fff}
.ag-choix{position:absolute;left:4px;right:4px;z-index:10;display:flex;flex-direction:column;gap:4px;padding:6px;background:var(--surface);border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 20px rgba(0,0,0,.18);cursor:default}
.ag-choix .btn{justify-content:center}
.ag-aide{margin-top:6px}
.ag-liste{display:none}
.ag-liste-jour h3{font-size:.95rem;margin-block:14px 6px}
.ag-liste-jour.auj h3{color:var(--accent)}
.ag-ligne{display:flex;gap:10px;align-items:baseline;padding:6px 8px;border-radius:7px;margin-bottom:4px;text-decoration:none}
.ag-liste .ag-ligne{color:inherit;background:var(--surface);border-left:5px solid var(--accent)}
.ag-liste .ag-ligne.ag-c1{border-left-color:#0f766e}.ag-liste .ag-ligne.ag-c2{border-left-color:#9333ea}
.ag-liste .ag-ligne.ag-c3{border-left-color:#c2410c}.ag-liste .ag-ligne.ag-c4{border-left-color:#be185d}.ag-liste .ag-ligne.ag-c5{border-left-color:#4d7c0f}
.agenda-jour{display:flex;flex-direction:column;gap:2px;margin-bottom:14px}
.agenda-jour .ag-ligne{padding:4px 6px;color:inherit;font-size:.84rem}
.agenda-jour .ag-ligne:hover{background:var(--surface-2)}
@media (max-width:760px){.ag-grille,.ag-aide{display:none}.ag-liste{display:block}}

/* Double authentification */
.qr-2fa{display:inline-block;background:#fff;padding:8px;border-radius:8px;margin-block:8px}
.qr-2fa svg{display:block}
.etapes-2fa li{margin-bottom:12px}
.codes-secours{columns:2;max-width:360px;font-size:1.05rem;line-height:1.9}
@media print{.topbar,.subbar,nav,.actions,.banner{display:none}}

/* Paramètres */
.param-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
a.param-carte{display:block;text-decoration:none;color:inherit;margin:0;transition:border-color .15s}
a.param-carte:hover,a.param-carte:focus-visible{border-color:var(--accent)}
.param-carte h3{margin:0 0 4px;color:var(--accent)}
.param-carte p{margin:0}
tr.archivee td{color:var(--muted)}
.brand-logo{height:26px;width:auto;display:block}

/* Import en une fois */
.import-bilan{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:12px}
.import-bilan .box{margin:0}
.import-bilan .box-body{display:flex;align-items:baseline;gap:8px}
.import-n{font-size:1.8rem;font-weight:700}

/* Explorateur statistique */
.stats-grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:16px;align-items:start}
.stats-totaux{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:.95rem}
.stats-totaux strong{font-family:var(--f-display);font-size:1.15rem}
.barre{height:8px;min-width:60px;border-radius:4px;background:var(--surface-2);overflow:hidden}
.barre span{display:block;height:100%;background:var(--accent)}
tr.non-renseigne td{color:var(--muted);font-style:italic}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Graphiques SVG (statistiques/graphiques.py) : couleurs en variables, pour le mode clair et sombre */
:root{--serie-1:#2f5fb3; --serie-2:#d2642c}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--serie-1:#7fa2ea; --serie-2:#e9875a}}
:root[data-theme="dark"]{--serie-1:#7fa2ea; --serie-2:#e9875a}
.graphique{display:block;max-width:100%;height:auto;overflow:visible}
.graphique .g-s1{fill:var(--serie-1)}
.graphique .g-s2{fill:var(--serie-2)}
.graphique .g-hachure{stroke:var(--surface)}
.graphique .g-fond{fill:var(--surface-2)}
.graphique .g-txt{fill:var(--muted);font-size:12px}
.graphique .g-txt-fort{fill:var(--ink);font-size:12px}
.graphique .g-grille{stroke:var(--line);stroke-width:1}
.graphique .g-axe{stroke:var(--muted);stroke-width:1}
.graphique .g-reference{stroke:var(--muted);stroke-width:1.5;fill:none}
.graphique .g-ligne{stroke:var(--serie-1)}
.graphique .g-point{fill:var(--serie-1);stroke:var(--surface)}
.graphique a:hover rect,.graphique a:focus rect,.graphique a:hover circle{opacity:.8}
.graphique a:focus{outline:none}
.graphique a:focus rect,.graphique a:focus circle{stroke:var(--ink);stroke-width:2}
.legende-graphique{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:.85rem;color:var(--muted);margin-bottom:6px}
.legende-graphique i{display:inline-block;width:11px;height:11px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.legende-graphique i.s1{background:var(--serie-1)}
.legende-graphique i.s2{background:repeating-linear-gradient(45deg,var(--serie-2) 0 3px,var(--surface) 3px 5px)}
.legende-graphique i.ref{height:0;border-top:2px dashed var(--muted);border-radius:0}
.stats-large{grid-column:1/-1}
.carte-stats{height:420px;border-radius:8px;border:1px solid var(--line)}
/* Causes de réalisation partielle : plusieurs possibles */
.causes-cloture{border:1px solid var(--line);border-radius:8px;padding:8px 12px;margin-top:8px;display:flex;flex-wrap:wrap;gap:4px 16px;width:100%}
.causes-cloture legend{font-weight:600;padding:0 4px}
.causes-cloture label,.choix-causes label{display:flex;gap:6px;align-items:center;font-weight:400}
.choix-causes summary{cursor:pointer;color:var(--accent)}
.choix-causes[open] > div{display:flex;flex-direction:column;gap:2px;padding:6px 0}

/* Page d'erreur (500) : autonome, sans barre de navigation */
.page-erreur { max-width: 640px; margin: 48px auto; padding: 0 16px; }

/* Recherche : filtres */
.filtres-recherche{gap:8px;flex-wrap:wrap;margin:8px 0 16px}
.filtres-recherche input[name=q]{min-width:240px;flex:1}

/* Bulles d'information « i » et encadrés « Comment ça marche ? » */
.lib{display:flex;align-items:center;gap:6px}
.aide{position:relative;display:inline-flex}
.aide-i{width:18px;height:18px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--muted);
  font:600 11px/1 Georgia, serif;font-style:italic;cursor:help;padding:0;display:inline-flex;align-items:center;justify-content:center}
.aide-i:hover,.aide-i:focus-visible,.aide.ouverte .aide-i{color:var(--on-accent);background:var(--accent);border-color:var(--accent)}
.aide-bulle{display:none;position:absolute;left:-6px;top:calc(100% + 6px);z-index:30;width:max-content;max-width:min(300px, 80vw);
  padding:8px 10px;border-radius:8px;background:#1f2937;color:#fff;font-size:.8rem;font-weight:400;line-height:1.4;box-shadow:0 6px 18px rgba(0,0,0,.18);
  white-space:normal;text-transform:none;letter-spacing:normal}
.aide:hover .aide-bulle,.aide-i:focus-visible+.aide-bulle,.aide.ouverte .aide-bulle{display:block}
.aide.a-gauche .aide-bulle{left:auto;right:-6px}
.mode-emploi{border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:10px;background:var(--surface);
  padding:10px 14px;margin:0 0 16px}
.mode-emploi summary{cursor:pointer;font-weight:600}
.mode-emploi summary .small{font-weight:400;color:var(--muted);margin-left:6px}
.mode-emploi-texte{margin-top:8px;max-width:80ch}
.mode-emploi-texte p{margin:0 0 8px}

/* Pied de page : signaler un problème */
.pied{max-width:1280px;margin:8px auto 24px;padding:0 16px;text-align:right}

/* Charge de travail */
.grille-charge{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:16px}
@media (max-width:520px){.grille-charge{grid-template-columns:1fr}}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
tr.en-tete-charge td{font-weight:600}
.poids-ressenti{display:flex;align-items:center;gap:8px}
.poids-ressenti select{width:auto}
.ma-charge p{margin:0 0 6px}

/* Téléphone et petite tablette : menu repliable, tableaux de tâches et de dossiers en cartes */
.menu-mobile{display:none}
@media (max-width:760px){
  .menu-mobile{display:inline-flex;margin-left:auto}
  .topbar{padding-block:6px;gap:4px}
  .topbar > .navlink:not(.menu-mobile):not(.toujours), .topbar > .inline-form, .topbar > .spacer{display:none}
  .topbar.ouvert > .navlink:not(.menu-mobile):not(.toujours), .topbar.ouvert > .inline-form{display:flex;width:100%}
  .topbar.ouvert > .inline-form .navlink{width:100%}
  .topbar .create{order:4}
  table.en-cartes thead{display:none}
  table.en-cartes, table.en-cartes tbody, table.en-cartes tr, table.en-cartes td{display:block;width:100%}
  table.en-cartes tr{border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin:0 0 10px;background:var(--surface)}
  table.en-cartes td{border:0;padding:3px 0;text-align:left}
  table.en-cartes td::before{content:attr(data-titre);display:block;font-size:.72rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--muted)}
  table.en-cartes td:not([data-titre])::before, table.en-cartes td[data-titre=""]::before{content:none}
  table.en-cartes td:empty{display:none}
  .tablewrap:has(table.en-cartes){overflow-x:visible}
}

/* Agenda : jours fériés et fermetures du service */
.ag-entete.ferme{background:repeating-linear-gradient(135deg,var(--surface),var(--surface) 6px,var(--line) 6px,var(--line) 7px)}
.ag-ferie{background:var(--warn-soft);color:var(--ink);font-weight:600}
.ag-ferie-texte{color:var(--muted);font-weight:500}

/* Accessibilité : lien « Aller au contenu » (visible au clavier seulement), crédit de la carte lisible */
.evitement{position:absolute;left:8px;top:-60px;z-index:100;background:var(--surface);color:var(--ink);padding:8px 12px;border-radius:6px;
  border:2px solid var(--accent);font-weight:600;text-decoration:none}
.evitement:focus{top:8px}
.leaflet-container .leaflet-control-attribution a{color:#0a4f6e}
main:focus{outline:none}

/* Pastilles rouges (champs manquants, retards) : texte blanc sur rouge foncé en clair, texte sombre sur rouge clair en sombre */
:root{--on-crit:#fff}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--on-crit:#1d0b09}}
:root[data-theme="dark"]{--on-crit:#1d0b09}
.badge-n,.miss,.side-list .red{color:var(--on-crit)}