/* ===== C-PREVU — ADMIN THEME (drop-in) ===== */

/* Design tokens */
:root{
  --bg:#f7f7f8; --fg:#0f172a; --muted:#64748b;
  --card:#ffffff; --border:#e5e7eb;
  --primary:#0d6efd; --primary-ink:#ffffff;
  --success:#16a34a; --danger:#dc2626; --warn:#f59e0b;
  --ring: 0 0 0 .25rem rgba(13,110,253,.25);
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#0c1116; --fg:#e5e7eb; --muted:#94a3b8;
    --card:#0f1620; --border:#1f2a37;
    --primary:#3b82f6; --primary-ink:#0b1020;
    --success:#22c55e; --danger:#ef4444; --warn:#fbbf24;
    --ring: 0 0 0 .25rem rgba(59,130,246,.25);
  }
}

/* Base */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--bg); color:var(--fg);
  font: 15px/1.45 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  text-rendering:optimizeLegibility;
}
a{color:inherit; text-decoration:none}
img{max-width:100%; height:auto}

/* Layout helpers */
.container{max-width:1100px; margin:0 auto; padding:1rem}
.grid{display:grid; gap:.75rem}
@media (min-width:700px){ .grid{grid-template-columns: repeat(12, 1fr)} }
.grid > *{grid-column: 1 / -1}
@media (min-width:700px){
  .grid > .span-6{grid-column: span 6}
  .grid > .span-4{grid-column: span 4}
  .grid > .span-3{grid-column: span 3}
}

/* Header */
header.app{
  position:sticky; top:0; z-index:40;
  background:var(--primary); color:var(--primary-ink);
  box-shadow:0 1px 0 rgba(0,0,0,.08);
}
header.app .container{display:flex; align-items:center; justify-content:space-between; gap:.75rem}
header.app strong{font-weight:700}
header.app nav{display:flex; gap:.5rem; flex-wrap:wrap}

/* Cards */
.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:12px;
  padding:1rem;
  box-shadow:0 1px 0 rgba(0,0,0,.04);
}
.card + .card{margin-top:1rem}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.5rem .8rem; border-radius:.6rem;
  border:1px solid var(--border); background:#f8fafc; color:inherit;
  text-decoration:none; cursor:pointer; user-select:none;
  transition:transform .04s ease, filter .15s ease;
}
.btn:active{transform:translateY(1px)}
.btn:hover{filter:brightness(0.98)}
.btn.secondary{background:transparent}
.btn.primary{background:var(--primary); color:var(--primary-ink); border-color:transparent}
.btn.danger{background:var(--danger); color:#fff; border-color:transparent}
.btn[disabled]{opacity:.5; pointer-events:none}
.btn:focus-visible{outline:none; box-shadow:var(--ring)}

/* === Header buttons override (lisibilité sur barre bleue) === */
header.app nav .btn{
  background:#ffffff;                  /* pastille blanche */
  color:#0f172a;                       /* texte foncé lisible */
  border-color:rgba(255,255,255,.55);  /* contour doux, visible sur bleu */
}
header.app nav .btn.secondary{
  background:transparent;              /* bouton contour */
  color:#ffffff;                       /* texte blanc */
  border-color:#ffffff;
}
header.app nav .btn:hover{filter:brightness(.96)}
header.app nav .btn.secondary:hover{
  background:rgba(255,255,255,.12);    /* léger voile au survol */
}

/* Forms */
label{display:block; font-weight:600; margin-bottom:.25rem}
input, select, textarea{
  width:100%; padding:.55rem .65rem; border-radius:.6rem;
  border:1px solid var(--border); background:var(--card); color:inherit;
  outline:none;
}
input:focus, select:focus, textarea:focus{box-shadow:var(--ring); border-color:transparent}
.help{color:var(--muted); font-size:.9rem}

/* Filters bar */
.filters{display:flex; gap:.5rem; flex-wrap:wrap; align-items:center}
.filters .help{margin-left:auto}

/* Table */
.table{width:100%; border-collapse:collapse; background:var(--card); border-radius:12px; overflow:hidden}
.table th, .table td{padding:.6rem .7rem; border-bottom:1px solid var(--border); text-align:left; vertical-align:top}
.table thead th{background:rgba(0,0,0,.03); font-weight:700}
.table tbody tr:nth-child(odd){background:rgba(0,0,0,.015)}
.badge{
  display:inline-block; padding:.15rem .45rem; border-radius:.5rem; font-size:.8rem;
  background:#eef2ff; color:#3730a3;
}

/* Pager */
.pager{display:flex; gap:.35rem; align-items:center; margin-top:.75rem}
.pager a, .pager .current{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:2rem; padding:.35rem .6rem; border-radius:.5rem; border:1px solid var(--border);
  background:#f8fafc;
}
.pager .current{background:var(--primary); color:var(--primary-ink); border-color:transparent}