/* ===== Notices ECS — charte graphique alignée sur parc-info ===== */
:root{
  --vert:#00a65d; --vert-d:#008f50; --vert-dd:#007a44;
  --vert-bg:#ecfdf5; --vert-bg2:#d1fae5; --vert-txt:#065f46;
  --bg:#f4f6fa; --card:#ffffff; --bord:#e5e7eb; --bord2:#d1d5db;
  --txt:#1f2937; --txt2:#111827; --muted:#6b7280;
  --rouge:#dc2626; --rouge-d:#b91c1c; --rouge-bg:#fef2f2;
  --warn:#f59e0b; --warn-bg:#fffbeb;
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  background:var(--bg);color:var(--txt);font-size:14px;line-height:1.5}
a{color:var(--vert-dd);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1000px;margin:0 auto;padding:0 24px}
main.wrap{padding-top:24px;padding-bottom:60px}

/* ===== En-tête (style parc-info : blanc + liseré vert) ===== */
.topbar{background:#fff;box-shadow:0 1px 0 var(--bord),0 3px 6px rgba(0,0,0,.04);
  border-bottom:3px solid var(--vert)}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;
  gap:14px;padding-top:10px;padding-bottom:10px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand:hover{opacity:.9;text-decoration:none}
.logo-img{height:52px;width:auto;max-width:300px;object-fit:contain;display:block}
.brand-sep{width:1px;height:38px;background:var(--bord)}
.apptitle{font-size:15px;font-weight:600;color:var(--txt2);letter-spacing:.2px}
.topbar nav{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.topbar nav a{color:#374151;font-size:13.5px;font-weight:600;padding:7px 11px;border-radius:7px}
.topbar nav a:hover{background:var(--vert-bg);color:var(--vert-dd);text-decoration:none}
@media(max-width:680px){
  .apptitle,.brand-sep{display:none}
  .logo-img{height:42px}
}

h1{font-size:21px;margin:.1em 0 .6em;color:var(--txt2);font-weight:600}
h2{font-size:16px;margin:.1em 0 .8em;color:var(--txt2);font-weight:600}
.muted{color:var(--muted)}
.small{font-size:12px}
.hint{font-size:12px;color:var(--muted);margin:.3em 0}
.req{color:var(--rouge)}
.back{font-size:13.5px;color:var(--muted)}
.back:hover{color:var(--vert-dd)}

.pagehead{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.badge{display:inline-block;min-width:22px;text-align:center;background:var(--vert-bg2);
  color:var(--vert-txt);border-radius:11px;padding:1px 9px;font-size:12.5px;font-weight:700}

/* Cartes */
.card{background:var(--card);border:1px solid var(--bord);border-radius:10px;
  padding:18px 20px;margin:16px 0}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:760px){.grid{grid-template-columns:1fr}}

/* Formulaires */
label{display:block;font-size:13px;font-weight:600;margin:12px 0 4px;color:#374151}
input[type=text],input[type=password],input[type=date],select{
  width:100%;padding:9px 11px;border:1px solid var(--bord2);border-radius:8px;
  font-size:14px;background:#fff;font-family:inherit;color:var(--txt)}
input:focus,select:focus{outline:none;border-color:var(--vert);box-shadow:0 0 0 3px var(--vert-bg)}
input[type=file]{width:100%;font-size:14px;margin:4px 0}
button,.btn{display:inline-block;cursor:pointer;border:1px solid var(--bord2);border-radius:8px;
  padding:9px 15px;font-size:13.5px;font-weight:600;background:#fff;color:#374151;
  margin-top:10px;font-family:inherit}
button:hover,.btn:hover{background:#f3f4f6;text-decoration:none}
button.primary,.btn.primary{background:var(--vert);color:#fff;border-color:var(--vert)}
button.primary:hover,.btn.primary:hover{background:var(--vert-d);border-color:var(--vert-d)}
button.danger,.btn.danger{background:#fff;color:var(--rouge);border-color:#f0c2c2}
button.danger:hover,.btn.danger:hover{background:var(--rouge-bg)}
.btn.ghost{background:#fff;border-color:var(--bord);color:#374151}
.btn.ghost:hover{background:#f3f4f6}
.row{display:flex;gap:14px}
.row .grow{flex:1}
@media(max-width:600px){.row{flex-direction:column;gap:0}}
.inline-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.inline-form input[type=text]{width:auto;flex:1;min-width:180px}
.inline-form button{margin-top:0}
.addnotice{border:1px dashed #bfe6d2;border-radius:10px;padding:14px;background:var(--vert-bg);margin-bottom:16px}

/* Tableaux */
table.list{width:100%;border-collapse:collapse;margin-top:8px}
table.list th{text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted);background:#f9fafb;border-bottom:1px solid var(--bord);padding:9px 11px}
table.list td{padding:11px 11px;border-bottom:1px solid #f0f1f3;vertical-align:middle}
table.list.compact td{padding:8px 11px}
tbody tr:hover{background:#f9fafb}
tr.inactive{opacity:.55}
.actions{white-space:nowrap;text-align:right}
.actions .btn{margin-top:0;padding:6px 11px}

.tag{display:inline-block;font-size:12px;font-weight:600;padding:2px 10px;border-radius:20px;
  background:#f3f4f6;color:#374151}
.tag.ok{background:var(--vert-bg2);color:var(--vert-txt)}
.tag.off{background:#fee2e2;color:var(--rouge-d)}

.search{display:flex;gap:8px;margin:10px 0 18px}
.search input{flex:1}
.search button{margin-top:0}
.empty{padding:30px 0}

.ok-banner{background:var(--vert-bg);color:var(--vert-txt);border:1px solid #bfe6d2;border-radius:8px;padding:10px 14px}
.err{background:var(--rouge-bg);color:#991b1b;border:1px solid #f0c2c2;border-radius:8px;padding:10px 14px}
.urlbox{background:#f9fafb;border:1px solid var(--bord);border-radius:8px;padding:9px 12px;
  font-family:"Consolas","Courier New",monospace;font-size:12.5px;word-break:break-all}

/* Authentification / setup */
.auth{max-width:400px;margin:7vh auto;background:#fff;border:1px solid var(--bord);
  border-radius:14px;padding:30px;box-shadow:0 6px 24px rgba(17,24,39,.07);text-align:center}
.auth .logo-img{height:54px;margin:0 auto 6px}
.auth h1{font-size:18px;margin:.4em 0 .2em}
.auth label{text-align:left}
.auth button{width:100%;margin-top:18px}
.auth .err{text-align:left}

/* ===== Page publique client ===== */
.public{min-height:100vh;background:linear-gradient(180deg,#00a65d,#008f50 38%,var(--bg) 38%);
  padding:26px 14px 50px}
.pub-card{max-width:580px;margin:0 auto;background:#fff;border-radius:16px;
  padding:24px 24px 18px;box-shadow:0 12px 40px rgba(0,80,45,.22)}
.pub-head{text-align:center;border-bottom:1px solid var(--bord);padding-bottom:16px;margin-bottom:6px}
.pub-head .logo-img{height:60px;max-width:90%;margin:0 auto 10px}
.pub-head h1{font-size:20px;margin:.3em 0 .1em}
.pub-sub{color:var(--muted);margin:0;font-size:15px}
.pub-group{margin-top:18px}
.pub-group h2{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--vert-dd);
  border-left:3px solid var(--vert);padding-left:9px;margin-bottom:8px}
.pub-list{list-style:none;margin:0;padding:0}
.pub-list li{margin:8px 0}
.pub-list a{display:flex;align-items:center;gap:10px;padding:13px 14px;border:1px solid var(--bord);
  border-radius:10px;background:#fafdfb;color:var(--txt)}
.pub-list a:hover{background:var(--vert-bg);border-color:#bfe6d2;text-decoration:none}
.pub-list .doc{font-size:20px}
.pub-list .doc-name{flex:1;font-weight:600}
.pub-list .doc-go{color:var(--vert-dd);font-size:13px;font-weight:700;white-space:nowrap}
.pub-foot{margin-top:22px;border-top:1px solid var(--bord);padding-top:12px;
  text-align:center;color:var(--muted);font-size:13px}

/* ===== Étiquette QR imprimable ===== */
.qrpage{background:#eef1f6}
.toolbar{max-width:560px;margin:18px auto;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.label{width:340px;margin:10px auto 40px;background:#fff;border:2px solid var(--vert);
  border-radius:14px;padding:20px 18px;text-align:center}
.label .logo-img{height:40px;max-width:90%;margin:0 auto 8px}
.label-title{font-weight:600;margin:2px 0 14px;color:#374151}
.label-qr{display:flex;justify-content:center;margin:6px 0}
.label-qr img,.label-qr canvas{display:block}
.label-res{font-weight:700;margin-top:14px;font-size:15px;color:var(--txt2)}
.label-instr{color:var(--muted);font-size:13px;margin-top:4px}
.label-url{margin-top:10px;font-family:"Consolas",monospace;font-size:11px;
  word-break:break-all;color:#374151;border-top:1px dashed #bfe6d2;padding-top:8px}

@media print{
  .noprint{display:none!important}
  .qrpage{background:#fff}
  .label{border-color:#000;margin:0;page-break-inside:avoid}
}