:root{
  --primary:#0c6b58;--primary-dark:#08503f;--primary-light:#e6f4f0;
  --bg:#f4f6f8;--card:#fff;--text:#1a2330;--muted:#6b7785;
  --border:#e2e8ec;--danger:#c92a2a;--ok:#2b8a3e;--warn:#e67700;
  --radius:12px;--radius-sm:6px;--shadow-sm:0 2px 8px rgba(0,0,0,.04);
  --sidebar-w:240px;
}
*{box-sizing:border-box}
body{margin:0;font-family:'Inter',system-ui,sans-serif;background:var(--bg);color:var(--text);display:flex;min-height:100vh;-webkit-font-smoothing:antialiased}
a{text-decoration:none}

.sidebar{width:var(--sidebar-w);flex-shrink:0;background:linear-gradient(180deg,#0c6b58,#08503f);color:#fff;padding:20px 0;display:flex;flex-direction:column}
.sidebar h1{font-size:1.2em;padding:0 20px 16px;margin:0;border-bottom:1px solid rgba(255,255,255,.15)}
.sidebar nav a{display:block;padding:10px 20px;color:#fff;text-decoration:none;font-size:.95em;opacity:.85;border-left:3px solid transparent;transition:background .15s,opacity .15s}
.sidebar nav a:hover{background:rgba(255,255,255,.08);opacity:1}
.sidebar nav a.active{background:rgba(255,255,255,.12);border-left-color:#f59f00;opacity:1;font-weight:600}
.sidebar .user{margin-top:auto;padding:16px 20px;border-top:1px solid rgba(255,255,255,.15);font-size:.85em}
.sidebar .user a{color:#f59f00}

.menu-toggle{display:none}
.sidebar-overlay{display:none}

.main{flex:1;padding:24px 32px;overflow:auto;min-width:0}
.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:12px}
.topbar h2{margin:0;color:var(--primary-dark);font-size:1.4em}

.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:20px;margin-bottom:16px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:20px}
.stat{background:#fff;border-radius:var(--radius);padding:18px;box-shadow:var(--shadow-sm);border-left:4px solid var(--primary)}
.stat .v{font-size:1.8em;font-weight:700;color:var(--primary-dark)}
.stat .l{color:var(--muted);font-size:.9em}

table{width:100%;border-collapse:collapse;background:#fff}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--border);font-size:.92em}
th{background:#f8fafb;color:var(--muted);font-weight:600;text-transform:uppercase;font-size:.75em;letter-spacing:.5px}
tr:hover{background:#f8fafb}

.btn{display:inline-flex;align-items:center;gap:6px;background:var(--primary);color:#fff;border:none;padding:8px 14px;border-radius:var(--radius-sm);font:inherit;font-size:.9em;cursor:pointer;text-decoration:none;transition:background .15s}
.btn:hover{background:var(--primary-dark)}
.btn:focus-visible{outline:2px solid var(--primary-dark);outline-offset:2px}
.btn.sm{padding:4px 10px;font-size:.85em}
.btn.secondary{background:#fff;color:var(--primary);border:1px solid var(--primary)}
.btn.secondary:hover{background:var(--primary-light)}
.btn.danger{background:var(--danger)}
.btn.warn{background:var(--warn)}

label{display:block;margin:8px 0 4px;font-size:.88em;color:var(--muted);font-weight:500}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]):not([type=button]):not([type=file]),
select,textarea{
  display:block;width:100%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;
  color:var(--text);background-color:#fff;background-clip:padding-box;
  border:1px solid #ced4da;border-radius:.375rem;
  transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
select{
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat:no-repeat;background-position:right .75rem center;background-size:16px 12px;
  appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-right:2.25rem;
}
textarea{min-height:calc(1.5em + .75rem + 2px)}
input:not([type=checkbox]):not([type=radio]):focus-visible,select:focus-visible,textarea:focus-visible,
input:not([type=checkbox]):not([type=radio]):focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 .2rem rgba(12,107,88,.18)}
input:disabled,select:disabled,textarea:disabled{background:#f1f3f5;color:var(--muted);cursor:not-allowed}

.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}

.badge{display:inline-block;padding:2px 8px;border-radius:12px;font-size:.78em;font-weight:600}
.badge.ok{background:#d3f9d8;color:var(--ok)}
.badge.warn{background:#fff3bf;color:var(--warn)}
.badge.err{background:#ffe3e3;color:var(--danger)}

.alert{padding:10px 14px;border-radius:var(--radius-sm);margin-bottom:14px}
.alert.ok{background:#d3f9d8;color:var(--ok)}
.alert.err{background:#ffe3e3;color:var(--danger)}

.actions{display:flex;gap:6px;flex-wrap:wrap}
.login-page{margin:auto;max-width:400px;padding:40px}
.login-page .card{padding:32px}

/* ---- Responsive : sidebar en menu mobile sous 880px ---- */
@media(max-width:880px){
  body{display:block}
  .menu-toggle{
    display:flex;align-items:center;gap:8px;position:fixed;top:12px;left:12px;z-index:40;
    background:var(--primary-dark);color:#fff;border:none;border-radius:var(--radius-sm);
    padding:10px 14px;font:inherit;font-weight:600;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.2);
  }
  .sidebar{
    position:fixed;top:0;left:0;height:100vh;z-index:50;transform:translateX(-100%);
    transition:transform .2s ease;box-shadow:2px 0 16px rgba(0,0,0,.2);
  }
  .sidebar.open{transform:translateX(0)}
  .sidebar-overlay{
    display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:45;
  }
  .sidebar-overlay.open{display:block}
  .main{padding:70px 16px 24px}
  .topbar{flex-wrap:wrap}
  .row,.row3{grid-template-columns:1fr}
  table{font-size:.88em}
  th,td{padding:8px 6px}
}

/* ---- Cases à cocher & boutons radio : grandes cibles tactiles (smartphone / iPhone) ----
   appearance:none + dessin maison : sinon iOS/Android affichent les contrôles natifs minuscules.
   !important sur width/height : certains champs portent un style="width:auto" en ligne. */
input[type=checkbox],input[type=radio]{
  -webkit-appearance:none;-moz-appearance:none;appearance:none;
  display:inline-block;flex:0 0 auto;
  width:1.5rem!important;height:1.5rem!important;min-width:1.5rem;
  margin:0 .65rem 0 0;padding:0!important;
  border:2px solid #8a99a6;background-color:#fff;background-repeat:no-repeat;background-position:center;
  vertical-align:middle;cursor:pointer;
  transition:background-color .15s,border-color .15s,box-shadow .15s;
  -webkit-tap-highlight-color:transparent;
}
input[type=checkbox]{border-radius:.4rem}
input[type=radio]{border-radius:50%}
input[type=checkbox]:checked{
  background-color:var(--primary);border-color:var(--primary);background-size:80%;
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m5 10.5 3.5 3.5L15 6.5'/%3e%3c/svg%3e");
}
input[type=radio]:checked{
  border-color:var(--primary);
  background-image:radial-gradient(circle,var(--primary) 45%,transparent 50%);
}
input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:none;box-shadow:0 0 0 .25rem rgba(12,107,88,.25)}
input[type=checkbox]:disabled,input[type=radio]:disabled{opacity:.5;cursor:not-allowed}
@media (pointer:coarse),(max-width:640px){
  input[type=checkbox],input[type=radio]{width:1.85rem!important;height:1.85rem!important;min-width:1.85rem}
}

/* Ligne cliquable en entier (case + texte) */
.choice-row{display:flex;align-items:center;gap:0;margin:0;padding:.6rem .75rem;min-height:48px;
  font-size:1em;font-weight:400;color:var(--text);cursor:pointer;
  border:1px solid var(--border);border-radius:var(--radius-sm,8px);background:#fff}
.choice-row:has(input:checked){border-color:var(--primary);background:var(--primary-light)}
.choice-row.align-top{align-items:flex-start}
.choice-group{display:flex;flex-wrap:wrap;gap:12px}
.choice-group .choice-row{flex:1 1 140px}
/* Radio d'une cellule de tableau : zone de toucher d'au moins 44 px */
.radio-hit{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;margin:0;cursor:pointer}
.radio-hit input{margin:0}