/* =========================================================================
   Admin (léger) — s'appuie sur design-system.css.
   Inclut des « shims » pour les classes Bootstrap encore présentes dans
   le HTML généré par les contrôleurs Admin (reskin sans réécriture).
   ========================================================================= */

.admin { padding-block: var(--sp-6); }
.admin > * + * { margin-top: var(--sp-4); }

.admin__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3);
  margin-bottom: var(--sp-5);
}

/* --- Auth / login --------------------------------------------------------- */
.login-card {
  max-width: 420px;
  margin: var(--sp-7) auto;
  background: var(--surface-raised);
  border: 2px solid var(--line-strong);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-sm);
  padding: var(--sp-6);
}
.login-card h1 { margin-bottom: var(--sp-4); }
.login-card .field:last-of-type { margin-bottom: var(--sp-5); }

/* -------------------------------------------------------------------------
   Shims Bootstrap → design system (HTML admin non réécrit)
   ------------------------------------------------------------------------- */
/* Boutons Bootstrap (btn-success / btn-info / btn-warning / btn-primary /
   btn-danger). Sélecteur ~= (token exact) → ne touche pas .btn--* du design
   system. */
.admin [class~="btn-success"],
.admin [class~="btn-info"],
.admin [class~="btn-warning"],
.admin [class~="btn-primary"],
.admin [class~="btn-danger"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 var(--sp-4);
  border: 2px solid var(--line-strong);
  border-radius: var(--r-md);
  background: var(--surface);
  color: var(--ink);
  font-family: var(--font-label);
  font-weight: 700;
  font-size: var(--text-sm);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
}
.admin [class~="btn-success"],
.admin [class~="btn-primary"] {
  background: var(--primary);
  color: var(--primary-ink);
  border-color: color-mix(in srgb, var(--primary) 78%, #000);
}
.admin [class~="btn-info"] { background: var(--primary-wash); border-color: var(--primary); color: var(--primary); }
.admin [class~="btn-warning"] { background: var(--warn-wash); border-color: var(--warn); color: var(--ink); }
.admin [class~="btn-danger"] { background: var(--danger-wash); border-color: var(--danger); color: var(--danger); }

.admin .form-control,
.admin select,
.admin input[type="text"],
.admin input[type="password"] {
  width: 100%;
  min-height: 42px;
  padding: var(--sp-2) var(--sp-3);
  background: var(--surface);
  color: var(--ink);
  border: 2px solid var(--line-strong);
  border-radius: var(--r-md);
  font: inherit;
}
.admin .form-control:focus,
.admin select:focus,
.admin input:focus { outline: none; border-color: var(--primary); box-shadow: var(--focus-ring); }

.admin .form-row { display: flex; flex-wrap: wrap; gap: var(--sp-3); align-items: center; }
.admin .form-group { margin-bottom: var(--sp-3); }
.admin .form-check,
.admin .form-check-inline {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  margin-right: var(--sp-4);
}
.admin .form-check-input { width: 18px; height: 18px; accent-color: var(--primary); }
.admin label { font-size: var(--text-sm); }

.admin table,
.admin .table {
  width: 100%;
  border-collapse: collapse;
  background: var(--surface);
  border: 2px solid var(--line-strong);
  border-radius: var(--r-md);
  overflow: hidden;
  font-size: var(--text-sm);
}
.admin th,
.admin td {
  padding: var(--sp-2) var(--sp-3);
  text-align: left;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.admin thead th,
.admin .thead-primary th {
  background: var(--surface-2);
  font-family: var(--font-label);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: var(--text-xs);
  color: var(--ink-soft);
}
.admin .bg-info { background: var(--primary-wash) !important; }

.admin .alert,
.admin [class^="alert-"],
.admin [class*=" alert-"] {
  display: block;
  padding: var(--sp-2) var(--sp-3);
  border-radius: var(--r-sm);
  border: 1.5px solid var(--line-strong);
  border-left-width: 5px;
  margin: var(--sp-2) 0;
  font-size: var(--text-sm);
}
.admin .alert-success { background: var(--success-wash); border-color: var(--success); }
.admin .alert-danger,
.admin .alert-error { background: var(--danger-wash); border-color: var(--danger); }
.admin .alert-info { background: var(--info-wash); border-color: var(--info); }
.admin .alert-warning { background: var(--warn-wash); border-color: var(--warn); }

/* pastille couleur (mots-clés) */
.admin td > div[style*="border-radius"] { border-color: var(--line-strong) !important; }