/* =========================================================
   Colixo Portail Client — Styles partagés
   Palette : #111111 / #ffffff / #f97316
   Mobile-first — constitution §I, §VI
   ========================================================= */

/* --- Tokens ------------------------------------------- */
:root {
  --color-black:        #111111;
  --color-white:        #ffffff;
  --color-orange:       #f97316;
  --color-orange-light: #fff7ed;
  --color-orange-dark:  #ea6b07;
  --color-gray-50:      #f9fafb;
  --color-gray-100:     #f3f4f6;
  --color-gray-200:     #e5e7eb;
  --color-gray-400:     #9ca3af;
  --color-gray-600:     #4b5563;
  --color-gray-800:     #1f2937;
  --color-success:      #16a34a;
  --color-success-bg:   #f0fdf4;
  --color-error:        #dc2626;
  --color-error-bg:     #fef2f2;
  --color-warning:      #d97706;
  --color-warning-bg:   #fffbeb;

  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;

  --shadow-card: 0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.04);
  --shadow-btn:  0 1px 3px rgba(0,0,0,.15);

  --font-sans: system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --font-mono: "SF Mono","Fira Code","Consolas",monospace;

  --transition-fast: .15s ease;
  --transition-med:  .25s ease;

  --sidebar-w: 240px;
}

/* --- Reset -------------------------------------------- */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { font-size:16px; -webkit-text-size-adjust:100%; }
body {
  font-family:var(--font-sans);
  background:var(--color-gray-50);
  color:var(--color-black);
  line-height:1.6;
  min-height:100dvh;
}
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }

/* --- Layout portal ------------------------------------ */
.portal-layout {
  display:flex;
  min-height:100dvh;
}

/* --- Sidebar nav -------------------------------------- */
.sidebar {
  width:var(--sidebar-w);
  background:var(--color-black);
  color:var(--color-white);
  display:flex;
  flex-direction:column;
  position:fixed;
  inset-block:0;
  left:0;
  z-index:200;
  transform:translateX(-100%);
  transition:transform var(--transition-med);
  border-right:3px solid var(--color-orange);
}

.sidebar.is-open { transform:none; }

@media (min-width:768px) {
  .sidebar { transform:none; position:sticky; top:0; height:100dvh; flex-shrink:0; }
}

.sidebar__logo {
  padding:1.5rem 1.25rem 1.25rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.logo__name {
  font-size:1.375rem;
  font-weight:800;
  letter-spacing:.08em;
  color:var(--color-white);
  display:block;
}

.logo__name::first-letter { color:var(--color-orange); }

.logo__tagline {
  font-size:.6875rem;
  color:var(--color-gray-400);
  letter-spacing:.05em;
  text-transform:uppercase;
}

.sidebar__user {
  padding:.875rem 1.25rem;
  border-bottom:1px solid rgba(255,255,255,.08);
  font-size:.8125rem;
}

.sidebar__user-label {
  color:var(--color-gray-400);
  display:block;
  margin-bottom:.125rem;
  font-size:.6875rem;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.sidebar__user-name {
  color:var(--color-white);
  font-weight:600;
  display:block;
  word-break:break-word;
}

.sidebar__nav {
  flex:1;
  padding:.75rem .5rem;
  display:flex;
  flex-direction:column;
  gap:.125rem;
  overflow-y:auto;
}

.nav-item {
  display:flex;
  align-items:center;
  gap:.625rem;
  padding:.625rem .875rem;
  border-radius:var(--radius-sm);
  font-size:.9rem;
  font-weight:500;
  color:var(--color-gray-400);
  transition:color var(--transition-fast),background var(--transition-fast);
  cursor:pointer;
  border:none;
  background:none;
  width:100%;
  text-align:left;
  font-family:var(--font-sans);
}

.nav-item:hover { color:var(--color-white); background:rgba(255,255,255,.06); }
.nav-item--active { color:var(--color-white); background:rgba(249,115,22,.15); }
.nav-item--active::before {
  content:'';
  width:3px;
  height:1.25rem;
  background:var(--color-orange);
  border-radius:2px;
  flex-shrink:0;
}

.nav-item--logout {
  margin-top:auto;
  color:var(--color-gray-400);
}

.nav-item--logout:hover { color:var(--color-error); background:rgba(220,38,38,.08); }

.sidebar__footer {
  padding:.75rem 1.25rem;
  border-top:1px solid rgba(255,255,255,.08);
}

/* --- Mobile top bar ----------------------------------- */
.topbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:var(--color-black);
  color:var(--color-white);
  padding:.875rem 1rem;
  border-bottom:3px solid var(--color-orange);
  position:sticky;
  top:0;
  z-index:150;
}

@media (min-width:768px) { .topbar { display:none; } }

.topbar__logo {
  font-size:1.125rem;
  font-weight:800;
  letter-spacing:.08em;
}

.topbar__logo::first-letter { color:var(--color-orange); }

/* ── Brand inline : logo + texte côte à côte ────────────────────────────── */
.brand-inline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.brand-inline__logo {
  display: block;
  height: 28px;
  width: auto;
  flex-shrink: 0;
  object-fit: contain;
}

/* Tailles selon le contexte */
.topbar__logo .brand-inline__logo            { height: 22px; }
.logo__name .brand-inline__logo              { height: 20px; }
.login-brand-panel__mark .brand-inline__logo { height: 36px; }
.login-box__logo-name .brand-inline__logo    { height: 32px; }

/* Mobile : légère réduction */
@media (max-width: 640px) {
  .topbar__logo .brand-inline__logo { height: 18px; }
  .logo__name .brand-inline__logo   { height: 18px; }
}

.topbar__menu-btn {
  background:none;
  border:none;
  color:var(--color-white);
  cursor:pointer;
  padding:.25rem;
  font-size:1.375rem;
  line-height:1;
}

/* Overlay mobile */
.sidebar-overlay {
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.5);
  z-index:190;
}

.sidebar-overlay.is-visible { display:block; }
@media (min-width:768px) { .sidebar-overlay { display:none !important; } }

/* --- Main content ------------------------------------- */
.portal-main {
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
}

@media (min-width:768px) {
  .portal-main { margin-left:0; }
}

.page-header {
  padding:1.75rem 1.5rem 0;
}

.page-title {
  font-size:clamp(1.25rem,3vw,1.75rem);
  font-weight:800;
  color:var(--color-black);
  line-height:1.2;
}

.page-title::after { content:'.'; color:var(--color-orange); }

.page-subtitle {
  color:var(--color-gray-600);
  font-size:.9375rem;
  margin-top:.25rem;
}

.page-content {
  padding:1.5rem;
  flex:1;
}

/* --- Cards -------------------------------------------- */
.card {
  background:var(--color-white);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  border:1px solid var(--color-gray-200);
  padding:1.5rem;
}

.card--orange-border { border-left:4px solid var(--color-orange); }

.card__title {
  font-size:1.0625rem;
  font-weight:700;
  margin-bottom:1.25rem;
  padding-bottom:.75rem;
  border-bottom:2px solid var(--color-gray-100);
  color:var(--color-black);
}

/* --- Stats grid --------------------------------------- */
.stats-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:1rem;
  margin-bottom:1.5rem;
}

.stat-card {
  background:var(--color-white);
  border-radius:var(--radius-md);
  padding:1.25rem 1.5rem;
  box-shadow:var(--shadow-card);
  border:1px solid var(--color-gray-200);
}

.stat-card__label {
  font-size:.8125rem;
  color:var(--color-gray-600);
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.stat-card__value {
  font-size:2rem;
  font-weight:800;
  color:var(--color-black);
  line-height:1.1;
  margin-top:.25rem;
}

.stat-card--orange .stat-card__value { color:var(--color-orange); }

/* --- Quick links -------------------------------------- */
.quick-links {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:1rem;
  margin-bottom:1.5rem;
}

.quick-link {
  display:flex;
  flex-direction:column;
  gap:.5rem;
  padding:1.25rem;
  background:var(--color-white);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-card);
  border:1px solid var(--color-gray-200);
  transition:border-color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast);
  cursor:pointer;
}

.quick-link:hover {
  border-color:var(--color-orange);
  box-shadow:0 4px 16px rgba(249,115,22,.15);
  transform:translateY(-2px);
}

.quick-link__icon {
  font-size:1.5rem;
  line-height:1;
}

.quick-link__title {
  font-size:.9375rem;
  font-weight:700;
  color:var(--color-black);
}

.quick-link__desc {
  font-size:.8125rem;
  color:var(--color-gray-600);
}

/* --- Admin dashboard --------------------------------- */
.admin-dashboard {
  background:
    linear-gradient(135deg, rgba(249,115,22,.08), transparent 28rem),
    linear-gradient(180deg, #fff7ed 0, #f7f5f2 17rem, #f1f3f5 100%);
}

.admin-dashboard .page-content {
  padding:0 var(--space-4) var(--space-10);
}

.admin-dashboard__hero {
  margin:var(--space-4);
  padding:var(--space-6);
  border-radius:var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(194,65,12,.9), rgba(17,17,17,.97)),
    var(--color-black);
  color:var(--color-white);
  box-shadow:0 24px 70px rgba(0,0,0,.2),0 1px 2px rgba(0,0,0,.08);
  position:relative;
  overflow:hidden;
}

.admin-dashboard__hero::after {
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.08) 48%, transparent 49%),
    linear-gradient(0deg, transparent, rgba(255,255,255,.05) 48%, transparent 49%);
  background-size:6rem 6rem;
  opacity:.22;
  pointer-events:none;
}

.admin-dashboard__hero-copy,
.admin-dashboard__actions {
  position:relative;
  z-index:1;
}

.admin-dashboard__eyebrow {
  color:rgba(255,255,255,.68);
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.admin-dashboard__title {
  color:var(--color-white);
  font-size:var(--text-3xl);
  margin-top:var(--space-2);
}

.admin-dashboard__subtitle {
  color:rgba(255,255,255,.74);
  max-width:48rem;
}

.admin-dashboard__actions {
  margin-top:var(--space-5);
  gap:var(--space-3);
}

.admin-dashboard__actions .btn-ghost {
  color:var(--color-white);
  border-color:rgba(255,255,255,.28);
}

.admin-dashboard__actions .btn-ghost:hover {
  background:rgba(255,255,255,.1);
  color:var(--color-white);
}

.admin-dashboard__content {
  display:grid;
  gap:var(--space-8);
  max-width:1120px;
  width:100%;
  margin:0 auto;
}

.admin-dashboard-section {
  display:grid;
  gap:var(--space-4);
}

.admin-dashboard-section__eyebrow {
  color:var(--color-gray-500);
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.admin-dashboard__stats {
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:var(--space-5);
  margin-bottom:0;
}

.admin-stat-card {
  display:flex;
  align-items:center;
  gap:var(--space-4);
  min-height:8rem;
  border-radius:var(--radius-md);
  padding:var(--space-6);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  border-color:rgba(17,17,17,.08);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
  position:relative;
  overflow:hidden;
}

.admin-stat-card::before {
  content:'';
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:var(--color-orange);
}

.admin-stat-card__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:3rem;
  height:3rem;
  border-radius:var(--radius-md);
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
  font-size:var(--text-sm);
  font-weight:var(--font-bold);
  flex-shrink:0;
  box-shadow:inset 0 0 0 1px rgba(194,65,12,.12);
}

.admin-stat-card__icon--muted {
  background:var(--color-warning-bg);
  color:var(--color-warning);
}

.admin-stat-card__icon--total {
  background:var(--color-info-bg);
  color:var(--color-info);
}

.admin-stat-card .stat-card__value {
  font-size:var(--text-3xl);
  color:var(--color-black);
}

.admin-stat-card--active .stat-card__value {
  color:var(--color-btn-primary);
}

.admin-dashboard-card {
  border-radius:var(--radius-md);
  padding:var(--space-6);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  border-color:rgba(17,17,17,.08);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
}

.admin-dashboard-card__header {
  margin-bottom:var(--space-5);
  padding-bottom:var(--space-4);
  border-bottom:1px solid var(--color-gray-100);
}

.admin-dashboard-card__title {
  margin-bottom:var(--space-1);
  padding-bottom:0;
  border-bottom:none;
}

.admin-dashboard__quick-links {
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:var(--space-4);
  margin-bottom:0;
}

.admin-dashboard__quick-links .quick-link {
  justify-content:space-between;
  min-height:10.75rem;
  padding:var(--space-5);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  border-color:rgba(17,17,17,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
}

.admin-dashboard__quick-links .quick-link:hover {
  border-color:rgba(194,65,12,.34);
  box-shadow:0 12px 28px rgba(194,65,12,.12),inset 0 1px 0 rgba(255,255,255,.65);
}

.admin-dashboard__quick-links .quick-link__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.5rem;
  height:2.5rem;
  border-radius:var(--radius-md);
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
  font-size:var(--text-sm);
  font-weight:var(--font-bold);
  box-shadow:inset 0 0 0 1px rgba(194,65,12,.12);
}

.admin-dashboard__quick-links .quick-link__icon--orders,
.admin-dashboard__quick-links .quick-link__icon--drivers {
  background:var(--color-info-bg);
  color:var(--color-info);
}

.admin-dashboard__quick-links .quick-link__icon--create {
  background:var(--color-btn-primary);
  color:var(--color-white);
}

.admin-dashboard__quick-links .quick-link__title {
  font-size:var(--text-base);
}

.admin-dashboard__quick-links .quick-link__desc {
  line-height:1.45;
}

.admin-dashboard #spinner-area {
  min-height:16rem;
  display:grid;
  place-items:center;
}

/* --- Client dashboard -------------------------------- */
.client-dashboard {
  background:
    linear-gradient(135deg, rgba(249,115,22,.09), transparent 28rem),
    linear-gradient(180deg, #fff7ed 0, #f7f5f2 17rem, #f1f3f5 100%);
}

.client-dashboard .page-content {
  padding:0 var(--space-4) var(--space-10);
}

.client-dashboard__hero {
  margin:var(--space-4);
  padding:var(--space-6);
  border-radius:var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(194,65,12,.92), rgba(17,17,17,.97)),
    var(--color-black);
  color:var(--color-white);
  box-shadow:0 24px 70px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.08);
  position:relative;
  overflow:hidden;
}

.client-dashboard__hero::after {
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.08) 48%, transparent 49%),
    linear-gradient(0deg, transparent, rgba(255,255,255,.05) 48%, transparent 49%);
  background-size:6rem 6rem;
  opacity:.22;
  pointer-events:none;
}

.client-dashboard__hero-copy,
.client-dashboard__actions {
  position:relative;
  z-index:1;
}

.client-dashboard__eyebrow {
  color:rgba(255,255,255,.68);
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.client-dashboard__title {
  color:var(--color-white);
  font-size:var(--text-3xl);
  margin-top:var(--space-2);
}

.client-dashboard__subtitle {
  color:rgba(255,255,255,.74);
  max-width:44rem;
}

.client-dashboard__actions {
  margin-top:var(--space-5);
  gap:var(--space-3);
}

.client-dashboard__actions .btn-ghost {
  color:var(--color-white);
  border-color:rgba(255,255,255,.28);
}

.client-dashboard__actions .btn-ghost:hover {
  background:rgba(255,255,255,.1);
  color:var(--color-white);
}

.client-dashboard__content {
  display:grid;
  gap:var(--space-8);
  max-width:1120px;
  margin:0 auto;
  width:100%;
}

.client-dashboard__stats {
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:var(--space-5);
  margin-bottom:0;
}

.client-stat-card {
  display:flex;
  align-items:center;
  gap:var(--space-4);
  min-height:8rem;
  border-radius:var(--radius-md);
  padding:var(--space-6);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
  border-color:rgba(17,17,17,.08);
  position:relative;
  overflow:hidden;
}

.client-stat-card::before {
  content:'';
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:var(--color-orange);
}

.client-stat-card__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:3rem;
  height:3rem;
  border-radius:var(--radius-md);
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
  font-weight:var(--font-bold);
  flex-shrink:0;
  box-shadow:inset 0 0 0 1px rgba(194,65,12,.12);
}

.client-stat-card__icon--muted {
  background:var(--color-gray-100);
  color:var(--color-gray-700);
  font-size:var(--text-sm);
}

.client-dashboard-card {
  border-radius:var(--radius-md);
  padding:var(--space-6);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
  border-color:rgba(17,17,17,.08);
}

.client-dashboard-card__header {
  margin-bottom:var(--space-5);
  padding-bottom:var(--space-4);
  border-bottom:1px solid var(--color-gray-100);
}

.client-dashboard-card__title {
  margin-bottom:var(--space-1);
  padding-bottom:0;
  border-bottom:none;
}

.client-dashboard__quick-links {
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:var(--space-4);
  margin-bottom:0;
}

.client-dashboard__quick-links .quick-link {
  justify-content:space-between;
  min-height:10.75rem;
  padding:var(--space-5);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
  border-color:rgba(17,17,17,.08);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
}

.client-dashboard__quick-links .quick-link:hover {
  border-color:rgba(194,65,12,.34);
  box-shadow:0 12px 28px rgba(194,65,12,.12), inset 0 1px 0 rgba(255,255,255,.65);
}

.client-dashboard__quick-links .quick-link__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.5rem;
  height:2.5rem;
  border-radius:var(--radius-md);
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
  font-size:var(--text-sm);
  font-weight:var(--font-bold);
  box-shadow:inset 0 0 0 1px rgba(194,65,12,.12);
}

.client-dashboard__quick-links .quick-link__icon--create {
  background:var(--color-btn-primary);
  color:var(--color-white);
}

.client-dashboard__quick-links .quick-link__icon--orders {
  background:var(--color-info-bg);
  color:var(--color-info);
}

.client-dashboard__quick-links .quick-link__icon--simulator {
  background:var(--color-gray-100);
  color:var(--color-gray-800);
}

.client-dashboard__quick-links .quick-link__title {
  font-size:var(--text-base);
}

.client-dashboard__quick-links .quick-link__desc {
  line-height:1.45;
}

/* --- Client new order ------------------------------- */
.client-order-new {
  background:
    linear-gradient(135deg, rgba(249,115,22,.09), transparent 28rem),
    linear-gradient(180deg, #fff7ed 0, #f7f5f2 17rem, #f1f3f5 100%);
}

.client-order-new .page-content {
  padding:0 var(--space-4) var(--space-10);
}

.client-order-new__hero {
  margin:var(--space-4);
  padding:var(--space-6);
  border-radius:var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(194,65,12,.92), rgba(17,17,17,.97)),
    var(--color-black);
  color:var(--color-white);
  box-shadow:0 24px 70px rgba(0,0,0,.2),0 1px 2px rgba(0,0,0,.08);
  position:relative;
  overflow:hidden;
}

.client-order-new__hero::after {
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.08) 48%, transparent 49%),
    linear-gradient(0deg, transparent, rgba(255,255,255,.05) 48%, transparent 49%);
  background-size:6rem 6rem;
  opacity:.22;
  pointer-events:none;
}

.client-order-new__hero-copy {
  position:relative;
  z-index:1;
}

.client-order-new__eyebrow {
  color:rgba(255,255,255,.68);
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.client-order-new__title {
  color:var(--color-white);
  font-size:var(--text-3xl);
  margin-top:var(--space-2);
}

.client-order-new__title::after {
  content:none;
}

.client-order-new__subtitle {
  color:rgba(255,255,255,.74);
  max-width:44rem;
}

.client-order-new__layout {
  max-width:1120px;
  margin:0 auto;
  gap:var(--space-6);
}

.client-order-new__form,
.client-order-new__summary {
  border:1px solid rgba(17,17,17,.08);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
}

.client-order-new__form {
  padding:var(--space-5);
}

.client-order-new__section {
  margin:0 0 var(--space-5);
  border-color:rgba(17,17,17,.08);
  background:rgba(249,250,251,.54);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}

.client-order-new__section .form-section__title {
  color:var(--color-gray-700);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  letter-spacing:.06em;
}

.client-order-new__section .form-section__body {
  padding:var(--space-5);
}

.client-order-new .field__input,
.client-order-new .field__select,
.client-order-new .field__textarea {
  border-color:rgba(17,17,17,.12);
  background:var(--color-white);
}

.client-order-new .field__input--number {
  max-width:none;
}

.client-order-new .option-check {
  border-color:rgba(17,17,17,.08);
  background:var(--color-white);
  box-shadow:0 1px 2px rgba(17,17,17,.04);
}

.client-order-new .option-check:hover {
  border-color:rgba(194,65,12,.22);
}

.save-delivery-section {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--color-gray-100);
}

.save-delivery-label-wrap {
  margin-top: 0.75rem;
}

#saved-address-picker {
  margin-bottom: 1.25rem;
}

.client-order-new__baggage-list {
  display:grid;
  gap:var(--space-3);
  margin-top:var(--space-2);
}

.client-order-new .baggage-item {
  padding:var(--space-4);
  border-color:rgba(17,17,17,.08);
  background:var(--color-white);
  box-shadow:0 6px 18px rgba(17,17,17,.05);
}

.client-order-new__supplement {
  padding:var(--space-4);
  border:1px solid var(--color-info-border);
  border-radius:var(--radius-md);
  background:var(--color-info-bg);
}

.client-order-new__summary {
  padding:var(--space-5);
}

.client-order-new__summary .card__title {
  margin-bottom:var(--space-4);
}

.client-order-new__summary .summary-total {
  color:var(--color-black);
}

.client-order-new #spinner-area {
  min-height:16rem;
  display:grid;
  place-items:center;
}

.client-order-new #alert-area:not(:empty) {
  max-width:1120px;
  width:100%;
  margin:0 auto var(--space-4);
}

/* --- Client pricing ---------------------------------- */
.client-pricing {
  background:
    linear-gradient(135deg, rgba(249,115,22,.09), transparent 28rem),
    linear-gradient(180deg, #fff7ed 0, #f7f5f2 17rem, #f1f3f5 100%);
}

.client-pricing .page-content {
  padding:0 var(--space-4) var(--space-10);
}

.client-pricing__hero {
  margin:var(--space-4);
  padding:var(--space-6);
  border-radius:var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(194,65,12,.92), rgba(17,17,17,.97)),
    var(--color-black);
  color:var(--color-white);
  box-shadow:0 24px 70px rgba(0,0,0,.2),0 1px 2px rgba(0,0,0,.08);
  position:relative;
  overflow:hidden;
}

.client-pricing__hero::after {
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.08) 48%, transparent 49%),
    linear-gradient(0deg, transparent, rgba(255,255,255,.05) 48%, transparent 49%);
  background-size:6rem 6rem;
  opacity:.22;
  pointer-events:none;
}

.client-pricing__hero-copy,
.client-pricing__actions {
  position:relative;
  z-index:1;
}

.client-pricing__eyebrow {
  color:rgba(255,255,255,.68);
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.client-pricing__title {
  color:var(--color-white);
  font-size:var(--text-3xl);
  margin-top:var(--space-2);
}

.client-pricing__title::after {
  content:none;
}

.client-pricing__subtitle {
  color:rgba(255,255,255,.74);
  max-width:44rem;
}

.client-pricing__actions {
  margin-top:var(--space-5);
}

.client-pricing__content {
  display:grid;
  gap:var(--space-6);
  max-width:1120px;
  width:100%;
  margin:0 auto;
}

.client-pricing-card,
.client-pricing #plan-content > .card,
.client-pricing #plan-content > .card + .card {
  border:1px solid rgba(17,17,17,.08);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
}

.client-pricing #plan-content {
  display:grid;
  gap:var(--space-6);
}

.client-pricing #plan-content > .card,
.client-pricing-card {
  padding:var(--space-6);
}

.client-pricing .service-display-block {
  padding:var(--space-5) 0;
  border-bottom:1px solid rgba(17,17,17,.08);
}

.client-pricing .service-display-header {
  align-items:center;
  justify-content:space-between;
  gap:var(--space-4);
}

.client-pricing .tariff-table__service {
  font-size:var(--text-lg);
}

.client-pricing .tariff-table__delai {
  color:var(--color-gray-500);
  font-weight:var(--font-semibold);
}

.client-pricing .tariff-table__price {
  display:inline-flex;
  align-items:center;
  min-height:2rem;
  padding:var(--space-1) var(--space-3);
  border-radius:100px;
  background:var(--color-gray-100);
  font-weight:var(--font-bold);
}

.client-pricing .table-wrapper {
  border:1px solid rgba(17,17,17,.08);
  border-radius:var(--radius-md);
  overflow:auto;
  box-shadow:none;
}

.client-pricing .tariff-table thead th {
  background:var(--color-gray-100);
}

.client-pricing .options-display {
  gap:var(--space-2);
}

.client-pricing .option-display-row {
  padding:var(--space-3) 0;
}

.client-pricing .badge--plan {
  background:var(--color-info-bg);
  color:var(--color-info);
  border:1px solid var(--color-info-border);
}

.client-pricing-help {
  display:grid;
  gap:var(--space-4);
  align-items:center;
}

.client-pricing #spinner-area {
  min-height:16rem;
  display:grid;
  place-items:center;
}

/* --- Client orders ----------------------------------- */
.client-orders {
  background:
    linear-gradient(135deg, rgba(249,115,22,.09), transparent 28rem),
    linear-gradient(180deg, #fff7ed 0, #f7f5f2 17rem, #f1f3f5 100%);
}

.client-orders .page-content {
  padding:0 var(--space-4) var(--space-10);
}

.client-orders__hero {
  margin:var(--space-4);
  padding:var(--space-6);
  border-radius:var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(194,65,12,.92), rgba(17,17,17,.97)),
    var(--color-black);
  color:var(--color-white);
  box-shadow:0 24px 70px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.08);
  position:relative;
  overflow:hidden;
}

.client-orders__hero::after {
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.08) 48%, transparent 49%),
    linear-gradient(0deg, transparent, rgba(255,255,255,.05) 48%, transparent 49%);
  background-size:6rem 6rem;
  opacity:.22;
  pointer-events:none;
}

.client-orders__hero-copy,
.client-orders__actions {
  position:relative;
  z-index:1;
}

.client-orders__eyebrow {
  color:rgba(255,255,255,.68);
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.client-orders__title {
  color:var(--color-white);
  font-size:var(--text-3xl);
  margin-top:var(--space-2);
}

.client-orders__subtitle {
  color:rgba(255,255,255,.74);
  max-width:42rem;
}

.client-orders__actions {
  margin-top:var(--space-5);
}

.client-orders__content {
  display:grid;
  gap:var(--space-6);
  max-width:1120px;
  margin:0 auto;
  width:100%;
}

.client-orders-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-4);
  border-radius:var(--radius-md);
  padding:var(--space-5) var(--space-6);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
  border-color:rgba(17,17,17,.08);
}

.client-orders-toolbar .btn {
  box-shadow:0 10px 20px rgba(194,65,12,.16);
}

.client-orders-toolbar__label {
  color:var(--color-gray-500);
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.client-orders-toolbar__count {
  color:var(--color-black);
  font-size:var(--text-xl);
  font-weight:var(--font-bold);
  line-height:1.25;
}

.client-orders__list {
  display:grid;
  gap:var(--space-5);
}

.client-orders .order-card {
  margin-bottom:0;
  border-radius:var(--radius-md);
  border-color:rgba(17,17,17,.08);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
  transition:border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}

.client-orders .order-card:hover {
  border-color:rgba(194,65,12,.18);
  box-shadow:0 18px 42px rgba(17,17,17,.08),0 1px 2px rgba(17,17,17,.05);
  transform:translateY(-1px);
}

.client-orders .order-details__summary {
  padding:var(--space-5) var(--space-6);
}

.client-orders .order-details__summary-title {
  font-size:var(--text-lg);
}

.client-orders .order-details__summary-meta {
  color:var(--color-gray-500);
}

.client-orders .order-details__summary-aside {
  gap:var(--space-3);
}

.client-orders .order-card__body {
  padding:var(--space-6);
  gap:var(--space-6);
  border-top:1px solid var(--color-gray-100);
}

.client-orders .order-card__body > section {
  padding:var(--space-5);
  border:1px solid rgba(17,17,17,.07);
  border-radius:var(--radius-md);
  background:rgba(249,250,251,.54);
}

.client-orders .order-section-title {
  color:var(--color-gray-700);
  letter-spacing:.06em;
}

.client-orders .order-meta {
  gap:var(--space-4);
}

.client-orders .order-meta > div {
  min-width:0;
  padding-bottom:var(--space-3);
  border-bottom:1px solid var(--color-gray-100);
}

.client-orders .order-meta > div span:last-child {
  word-break:break-word;
}

.client-orders .badge {
  border:1px solid transparent;
}

.client-orders .badge--en_attente {
  border-color:var(--color-warning-border);
}

.client-orders .badge--confirme {
  background:var(--color-info-bg);
  color:var(--color-info);
  border-color:var(--color-info-border);
}

.client-orders .badge--livre {
  border-color:var(--color-success-border);
}

.client-orders .tariff-table__price {
  display:inline-flex;
  align-items:center;
  min-height:2rem;
  padding:var(--space-1) var(--space-3);
  border-radius:100px;
  background:var(--color-gray-100);
  font-weight:var(--font-bold);
}

.client-orders .empty-state {
  min-height:22rem;
  border:1px solid rgba(17,17,17,.08);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
  gap:var(--space-4);
  text-align:center;
}

.client-orders .empty-state::before {
  content:'';
  width:3rem;
  height:3rem;
  border-radius:var(--radius-md);
  background:var(--color-orange-light);
  box-shadow:inset 0 0 0 1px rgba(194,65,12,.12);
}

.client-orders #spinner-area {
  min-height:16rem;
  display:grid;
  place-items:center;
}

.client-orders #alert-area:not(:empty) {
  max-width:1120px;
  width:100%;
  margin:0 auto var(--space-4);
}

.client-info-card {
  border-left:4px solid var(--color-orange);
}

.client-help-card {
  display:grid;
  gap:var(--space-5);
  background:rgba(255,255,255,.76);
}

.client-help-card__copy {
  display:flex;
  gap:var(--space-4);
  align-items:flex-start;
}

.client-help-card__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.5rem;
  height:2.5rem;
  border-radius:var(--radius-md);
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
  font-weight:var(--font-bold);
  flex-shrink:0;
  box-shadow:inset 0 0 0 1px rgba(194,65,12,.12);
}

.client-help-card__contacts {
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-3);
}

.client-help-card__link {
  display:inline-flex;
  align-items:center;
  min-height:2.75rem;
  padding:var(--space-2) var(--space-4);
  border:1px solid rgba(17,17,17,.08);
  border-radius:var(--radius-md);
  background:var(--color-white);
  color:var(--color-gray-800);
  font-size:var(--text-sm);
  font-weight:var(--font-semibold);
  transition:border-color var(--transition-fast),color var(--transition-fast),box-shadow var(--transition-fast);
}

.client-help-card__link:hover {
  border-color:rgba(194,65,12,.34);
  color:var(--color-btn-primary);
  box-shadow:0 8px 20px rgba(194,65,12,.1);
}

.client-info-list {
  display:grid;
  grid-template-columns:1fr;
  gap:var(--space-2) var(--space-4);
}

.client-info-list dt {
  padding-top:var(--space-2);
  font-size:var(--text-xs);
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--color-gray-700);
}

.client-info-list dd {
  margin:0 0 var(--space-3);
  padding-bottom:var(--space-2);
  border-bottom:1px solid var(--color-gray-100);
  min-width:0;
  word-break:break-word;
}

.client-dashboard__content > .alert {
  margin:0;
  padding:var(--space-6);
  border-radius:var(--radius-md);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
}

.client-dashboard #spinner-area {
  min-height:16rem;
  display:grid;
  place-items:center;
}

@media (min-width:768px) {
  .admin-dashboard__hero {
    margin:var(--space-6);
    padding:var(--space-8);
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:var(--space-6);
  }

  .admin-dashboard .page-content {
    padding:0 var(--space-6) var(--space-12);
  }

  .admin-dashboard__actions {
    margin-top:0;
    justify-content:flex-end;
  }

  .client-pricing__hero {
    margin:var(--space-6);
    padding:var(--space-8);
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:var(--space-6);
  }

  .client-pricing .page-content {
    padding:0 var(--space-6) var(--space-12);
  }

  .client-pricing__actions {
    margin-top:0;
    justify-content:flex-end;
  }

  .client-pricing-help {
    grid-template-columns:minmax(0,1fr) auto;
  }

  .client-order-new__hero {
    margin:var(--space-6);
    padding:var(--space-8);
  }

  .client-order-new .page-content {
    padding:0 var(--space-6) var(--space-12);
  }

  .client-order-new__form,
  .client-order-new__summary {
    padding:var(--space-6);
  }

  .client-orders__hero {
    margin:var(--space-6);
    padding:var(--space-8);
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:var(--space-6);
  }

  .client-orders .page-content {
    padding:0 var(--space-6) var(--space-12);
  }

  .client-orders__actions {
    margin-top:0;
    justify-content:flex-end;
  }

  .client-dashboard__hero {
    margin:var(--space-6);
    padding:var(--space-8);
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:var(--space-6);
  }

  .client-dashboard .page-content {
    padding:0 var(--space-6) var(--space-12);
  }

  .client-dashboard__actions {
    margin-top:0;
    justify-content:flex-end;
  }

  .client-info-list {
    grid-template-columns:max-content minmax(0,1fr);
  }

  .client-info-list dd {
    margin-bottom:0;
  }

  .client-help-card {
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
  }

  .client-help-card__contacts {
    justify-content:flex-end;
  }
}

@media (max-width:767px) {
  .admin-dashboard__hero {
    margin:var(--space-3);
    padding:var(--space-5);
  }

  .admin-dashboard__title {
    font-size:var(--text-2xl);
  }

  .admin-dashboard__actions {
    align-items:stretch;
  }

  .admin-dashboard__actions .btn {
    width:100%;
    white-space:normal;
  }

  .admin-stat-card,
  .admin-dashboard-card {
    padding:var(--space-5);
  }

  .admin-dashboard__quick-links {
    grid-template-columns:1fr;
  }

  .admin-dashboard__quick-links .quick-link {
    min-height:0;
  }

  .client-pricing__hero {
    margin:var(--space-3);
    padding:var(--space-5);
  }

  .client-pricing__title {
    font-size:var(--text-2xl);
  }

  .client-pricing__actions {
    align-items:stretch;
  }

  .client-pricing__actions .btn,
  .client-pricing-help .btn {
    width:100%;
    white-space:normal;
  }

  .client-pricing #plan-content > .card,
  .client-pricing-card {
    padding:var(--space-5);
  }

  .client-pricing .service-display-header {
    align-items:flex-start;
    flex-direction:column;
  }

  .client-order-new__hero {
    margin:var(--space-3);
    padding:var(--space-5);
  }

  .client-order-new__title {
    font-size:var(--text-2xl);
  }

  .client-order-new__form,
  .client-order-new__summary {
    padding:var(--space-4);
  }

  .client-order-new__section .form-section__body {
    padding:var(--space-4);
  }

  .client-order-new__form-actions {
    align-items:stretch;
  }

  .client-order-new__form-actions .btn {
    width:100%;
    white-space:normal;
  }

  .client-orders__hero {
    margin:var(--space-3);
    padding:var(--space-5);
  }

  .client-orders__title {
    font-size:var(--text-2xl);
  }

  .client-orders__actions,
  .client-orders-toolbar {
    align-items:stretch;
  }

  .client-orders__actions .btn,
  .client-orders-toolbar .btn {
    width:100%;
    white-space:normal;
  }

  .client-orders-toolbar {
    flex-direction:column;
    padding:var(--space-5);
  }

  .client-orders .order-details__summary {
    align-items:flex-start;
    padding:var(--space-5);
  }

  .client-orders .order-details__summary-aside {
    width:100%;
    justify-content:space-between;
  }

  .client-orders .order-card__body {
    padding:var(--space-5);
  }

  .client-orders .order-card__body > section {
    padding:var(--space-4);
  }

  .client-dashboard__hero {
    margin:var(--space-3);
    padding:var(--space-5);
  }

  .client-dashboard__title {
    font-size:var(--text-2xl);
  }

  .client-dashboard__actions {
    align-items:stretch;
  }

  .client-dashboard__actions .btn {
    width:100%;
    white-space:normal;
  }

  .client-stat-card,
  .client-dashboard-card {
    padding:var(--space-5);
  }

  .client-dashboard__quick-links {
    grid-template-columns:1fr;
  }

  .client-dashboard__quick-links .quick-link {
    min-height:0;
  }

  .client-help-card__copy {
    align-items:flex-start;
  }

  .client-help-card__contacts,
  .client-help-card__link {
    width:100%;
  }

  .client-help-card__link {
    justify-content:center;
  }
}

/* --- Tables ------------------------------------------- */
.table-wrapper {
  overflow-x:auto;
  border-radius:var(--radius-md);
  border:1px solid var(--color-gray-200);
}

.data-table {
  width:100%;
  border-collapse:collapse;
  font-size:.9rem;
  background:var(--color-white);
}

.data-table thead {
  background:var(--color-gray-50);
  border-bottom:2px solid var(--color-gray-200);
}

.data-table th {
  padding:.75rem 1rem;
  text-align:left;
  font-size:.8125rem;
  font-weight:600;
  color:var(--color-gray-600);
  text-transform:uppercase;
  letter-spacing:.04em;
  white-space:nowrap;
}

.data-table td {
  padding:.875rem 1rem;
  border-bottom:1px solid var(--color-gray-100);
  color:var(--color-black);
  vertical-align:middle;
}

.data-table tbody tr:last-child td { border-bottom:none; }

.data-table tbody tr:hover td { background:var(--color-gray-50); }

.data-table__empty {
  text-align:center;
  color:var(--color-gray-400);
  padding:2.5rem 1rem;
  font-style:italic;
}

/* --- Badges ------------------------------------------- */
.badge {
  display:inline-flex;
  align-items:center;
  gap:.25rem;
  padding:.1875rem .625rem;
  border-radius:100px;
  font-size:.75rem;
  font-weight:600;
  white-space:nowrap;
}

.badge--actif    { background:var(--color-success-bg); color:var(--color-success); }
.badge--inactif  { background:var(--color-gray-100);   color:var(--color-gray-600); }
.badge--custom   { background:var(--color-orange-light); color:var(--color-orange-dark); }
.badge--standard { background:var(--color-gray-100);   color:var(--color-gray-600); }
.badge--admin    { background:#ede9fe; color:#6d28d9; }
.badge--client   { background:#e0f2fe; color:#0369a1; }

/* --- Tariff table ------------------------------------- */
.tariff-table { border-collapse:collapse; width:100%; }

.tariff-table th,
.tariff-table td {
  padding:.875rem 1.25rem;
  text-align:left;
  border-bottom:1px solid var(--color-gray-100);
}

.tariff-table thead th {
  background:var(--color-gray-50);
  font-size:.8125rem;
  font-weight:600;
  color:var(--color-gray-600);
  text-transform:uppercase;
  letter-spacing:.04em;
}

.tariff-table tbody tr:last-child td { border-bottom:none; }

.tariff-table__service {
  font-weight:700;
  font-size:.9375rem;
}

.tariff-table__delai {
  font-size:.8125rem;
  color:var(--color-gray-600);
  margin-top:.125rem;
}

.tariff-table__price {
  font-family:var(--font-mono);
  font-size:.9375rem;
  font-weight:600;
  color:var(--color-black);
}

/* --- Forms -------------------------------------------- */
.form-grid {
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
}

@media (min-width:600px) {
  .form-grid--2col { grid-template-columns:1fr 1fr; }
}

.field {
  display:flex;
  flex-direction:column;
  gap:.375rem;
}

.field--full { grid-column:1/-1; }

.field__label {
  font-size:.875rem;
  font-weight:600;
  color:var(--color-gray-800);
}

.field__required { color:var(--color-error); }

.field__input,
.field__select,
.field__textarea {
  width:100%;
  padding:.625rem .875rem;
  border:1.5px solid var(--color-gray-200);
  border-radius:var(--radius-sm);
  font-family:var(--font-sans);
  font-size:.9375rem;
  color:var(--color-black);
  background:var(--color-white);
  transition:border-color var(--transition-fast),box-shadow var(--transition-fast);
  appearance:none;
}

.field__textarea { resize:vertical; min-height:80px; }

.field__input:focus,
.field__select:focus,
.field__textarea:focus {
  outline:none;
  border-color:var(--color-orange);
  box-shadow:0 0 0 3px rgba(249,115,22,.15);
}

.field__input[aria-invalid="true"],
.field__select[aria-invalid="true"] {
  border-color:var(--color-error);
  background:var(--color-error-bg);
}

.field__error {
  font-size:.8125rem;
  color:var(--color-error);
  font-weight:500;
}

.field__hint {
  font-size:.8125rem;
  color:var(--color-gray-400);
}

.field__hint--warning {
  color:var(--color-warning);
}

.field__input--readonly,
.field__input[readonly] {
  background:var(--color-gray-50, #f9fafb);
  border-color:var(--color-gray-200);
  cursor:default;
  color:var(--color-gray-600);
}

.field__input--readonly:focus,
.field__input[readonly]:focus {
  border-color:var(--color-gray-200);
  box-shadow:none;
  outline:none;
}

/* Number inputs tariff */
.field__input--number {
  font-family:var(--font-mono);
  max-width:140px;
}

/* --- Buttons ------------------------------------------ */
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.375rem;
  padding:.6875rem 1.375rem;
  border-radius:var(--radius-sm);
  font-family:var(--font-sans);
  font-size:.9375rem;
  font-weight:600;
  cursor:pointer;
  border:2px solid transparent;
  transition:background var(--transition-fast),color var(--transition-fast),
             border-color var(--transition-fast),box-shadow var(--transition-fast),
             transform var(--transition-fast);
  text-decoration:none;
  white-space:nowrap;
}

.btn:active { transform:translateY(1px); }
.btn:disabled { opacity:.5; cursor:not-allowed; transform:none; }

.btn--primary {
  background:var(--color-btn-primary);
  color:var(--color-white);
  border-color:var(--color-btn-primary);
  box-shadow:var(--shadow-btn);
}

.btn--primary:hover:not(:disabled) {
  background:var(--color-btn-primary-dark);
  border-color:var(--color-btn-primary-dark);
  box-shadow:0 3px 8px rgba(194,65,12,.35);
}

.btn--ghost {
  background:transparent;
  color:var(--color-gray-600);
  border-color:var(--color-gray-200);
}

.btn--ghost:hover:not(:disabled) {
  background:var(--color-gray-100);
  border-color:var(--color-gray-400);
  color:var(--color-black);
}

.btn--danger {
  background:transparent;
  color:var(--color-error);
  border-color:var(--color-error);
}

.btn--danger:hover:not(:disabled) {
  background:var(--color-error);
  color:var(--color-white);
}

.btn--sm {
  font-size:.8125rem;
  padding:.4375rem .875rem;
}

.btn-group {
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
  align-items:center;
}

.filters-row {
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
  align-items:center;
}

.order-layout {
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  align-items:start;
}

@media (min-width:1024px) {
  .order-layout { grid-template-columns:minmax(0,1fr) 360px; }
  .order-summary { position:sticky; top:1rem; }
}

.options-list {
  display:grid;
  gap:.75rem;
}

.option-check {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.75rem .875rem;
  border:1px solid var(--color-gray-200);
  border-radius:var(--radius-sm);
  background:var(--color-gray-50);
}

.option-check__label {
  display:flex;
  align-items:center;
  gap:.5rem;
  font-weight:600;
}

.summary-plan-badge {
  margin-bottom:.75rem;
}

.summary-context {
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
  margin-bottom:1rem;
  padding-bottom:.75rem;
  border-bottom:1px solid var(--color-gray-100);
  font-size:.8125rem;
  color:var(--color-gray-500);
  font-weight:500;
}

.summary-lines {
  display:flex;
  flex-direction:column;
  gap:.5rem;
}

.summary-line {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  padding-bottom:.5rem;
  border-bottom:1px solid var(--color-gray-100);
}

.summary-line:last-child { border-bottom:none; }

.summary-line__detail {
  display: block;
  font-size: 0.75rem;
  color: var(--color-gray-400);
  margin-top: .15rem;
}

.summary-total {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  margin-top:1rem;
  padding-top:1rem;
  border-top:2px solid var(--color-gray-200);
  font-size:1.0625rem;
  font-weight:800;
}

.order-card {
  background:var(--color-white);
  border:1px solid var(--color-gray-200);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-card);
  margin-bottom:1rem;
  overflow:hidden;
}

@keyframes order-card-highlight-fade {
  0%   { opacity:1; }
  100% { opacity:0; }
}
.order-card--highlight {
  position:relative;
}
.order-card--highlight::before {
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  box-shadow:inset 0 0 0 3px var(--color-orange);
  pointer-events:none;
  animation:order-card-highlight-fade 3s ease-out forwards;
  z-index:1;
}

.order-card__header {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  padding:1rem 1.25rem;
  background:var(--color-gray-50);
  border-bottom:1px solid var(--color-gray-200);
  flex-wrap:wrap;
}

.order-card__body {
  padding:1rem 1.25rem;
  display:grid;
  gap:1rem;
}

.order-meta {
  display:grid;
  grid-template-columns:1fr;
  gap:.75rem;
}

@media (min-width:720px) {
  .order-meta { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

.order-meta__label {
  display:block;
  color:var(--color-gray-600);
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  margin-bottom:.125rem;
}

.order-actions {
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
}

.order-details {
  border-top:1px solid var(--color-gray-200);
  margin-top:.25rem;
}

.order-details__summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem 1.25rem;
  cursor:pointer;
  list-style:none;
}

.order-details__summary::-webkit-details-marker {
  display:none;
}

.order-details__summary::-moz-list-bullet {
  list-style-type:none;
}

.order-details__summary-main {
  display:grid;
  gap:.125rem;
  min-width:0;
}

.order-details__summary-title {
  font-size:1rem;
  font-weight:800;
  line-height:1.3;
}

.order-details__summary-meta {
  color:var(--color-gray-600);
  font-size:.875rem;
}

.order-details__summary-aside {
  display:flex;
  align-items:center;
  gap:.75rem;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.order-timeline {
  display:grid;
  gap:.75rem;
  margin-bottom:1rem;
}

.order-timeline__item {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:.75rem;
  align-items:flex-start;
}

.order-timeline__marker {
  width:.9rem;
  height:.9rem;
  border-radius:50%;
  margin-top:.25rem;
  background:var(--color-gray-200);
  box-shadow:0 0 0 4px var(--color-gray-100);
}

.order-timeline__item--done .order-timeline__marker {
  background:var(--color-orange);
  box-shadow:0 0 0 4px rgba(249,115,22,.12);
}

.order-timeline__item--current .order-timeline__marker {
  background:var(--color-orange-dark);
  box-shadow:0 0 0 4px rgba(249,115,22,.2);
}

.order-timeline__content {
  display:grid;
  gap:.125rem;
}

.order-timeline__label {
  font-weight:700;
}

.order-timeline__date {
  color:var(--color-gray-600);
  font-size:.8125rem;
}

.order-timeline__note {
  font-size:.8125rem;
  color:var(--color-gray-600);
  margin-top:.125rem;
}

.order-timeline__note--pending {
  font-size:.875rem;
  color:var(--color-orange-dark);
  font-weight:500;
}

.secure-parcel-info {
  background:#ede9fe;
  border-radius:.5rem;
  padding:.75rem 1rem;
  margin-bottom:.5rem;
}

.secure-parcel-info__badge {
  display:flex;
  align-items:center;
  gap:.5rem;
  margin-bottom:.625rem;
}

.secure-parcel-info__label {
  font-size:.875rem;
  font-weight:600;
  color:#4c1d95;
}

.order-section-title {
  font-size:.875rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--color-gray-600);
  margin-bottom:.75rem;
}

.proof-grid {
  display:grid;
  gap:1rem;
}

.proof-actions {
  margin-top:.75rem;
  padding-top:.75rem;
  border-top:1px solid var(--border, #e5e7eb);
}

.order-filters {
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin:.5rem 0 1rem;
}

.filter-chip.is-active {
  background:var(--color-orange, #f97316);
  border-color:var(--color-orange, #f97316);
  color:#fff;
}

.load-more-area {
  display:flex;
  justify-content:center;
  margin-top:1rem;
}

.code-reveal__box {
  border:1px solid var(--color-orange, #f97316);
  border-radius:.5rem;
  padding:.75rem 1rem;
  background:rgba(249,115,22,.06);
}

.code-reveal__value {
  margin-top:.25rem;
}

.code-reveal__value code {
  font-size:1.5rem;
  font-weight:700;
  letter-spacing:.15em;
  color:var(--color-orange, #f97316);
}

.proof-media {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:1rem;
}

.proof-media__item {
  display:grid;
  gap:.5rem;
}

.proof-media__item img {
  width:100%;
  max-height:240px;
  object-fit:contain;
  border:1px solid var(--color-gray-200);
  border-radius:var(--radius-sm);
  background:var(--color-gray-50);
}

.signature-pad {
  width:100%;
  min-height:180px;
  border:1.5px solid var(--color-gray-200);
  border-radius:var(--radius-sm);
  background:var(--color-white);
  touch-action:none;
}

.badge--en_attente { background:var(--color-warning-bg); color:var(--color-warning); }
.badge--confirme   { background:#e0f2fe; color:#0369a1; }
.badge--livre      { background:var(--color-success-bg); color:var(--color-success); }

/* --- Alerts / feedback -------------------------------- */
.alert {
  padding:.875rem 1.125rem;
  border-radius:var(--radius-md);
  font-size:.9rem;
  font-weight:500;
  display:flex;
  align-items:flex-start;
  gap:.625rem;
  margin-bottom:1rem;
}

.alert--error   { background:var(--color-error-bg);   color:var(--color-error);   border-left:3px solid var(--color-error); }
.alert--success { background:var(--color-success-bg); color:var(--color-success); border-left:3px solid var(--color-success); }
.alert--warning { background:var(--color-warning-bg); color:var(--color-warning); border-left:3px solid var(--color-warning); }
.alert--info    { background:var(--color-orange-light); color:var(--color-orange-dark); border-left:3px solid var(--color-orange); }

/* --- Modal -------------------------------------------- */
.modal-backdrop {
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.5);
  z-index:300;
  align-items:center;
  justify-content:center;
  padding:1rem;
}

.modal-backdrop.is-open { display:flex; }

.modal {
  background:var(--color-white);
  border-radius:var(--radius-lg);
  box-shadow:0 20px 60px rgba(0,0,0,.25);
  width:100%;
  max-width:560px;
  max-height:90dvh;
  display:flex;
  flex-direction:column;
}

.modal__header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:1.25rem 1.5rem;
  border-bottom:1px solid var(--color-gray-200);
}

.modal__title {
  font-size:1.0625rem;
  font-weight:700;
}

.modal__close {
  background:none;
  border:none;
  font-size:1.25rem;
  cursor:pointer;
  color:var(--color-gray-400);
  padding:.25rem;
  border-radius:var(--radius-sm);
  transition:color var(--transition-fast);
}

.modal__close:hover { color:var(--color-black); }

.modal__body {
  padding:1.5rem;
  overflow-y:auto;
  flex:1;
}

.modal__footer {
  padding:1rem 1.5rem;
  border-top:1px solid var(--color-gray-200);
  display:flex;
  justify-content:flex-end;
  gap:.75rem;
  flex-wrap:wrap;
}

.modal-form-section { padding-top:.25rem; }
.modal-form-section__hr { border:none; border-top:1px solid var(--color-gray-200); margin:0; }
.order-section-title--compact { margin-bottom:.25rem; }

/* --- Login page --------------------------------------- */
.login-page {
  min-height:100dvh;
  display:grid;
  place-items:center;
  background:
    linear-gradient(135deg, rgba(249,115,22,.14), transparent 32rem),
    radial-gradient(circle at top right, rgba(255,247,237,.18), transparent 28rem),
    var(--color-black);
  padding:var(--space-4);
}

.login-shell {
  width:min(100%, 980px);
  display:grid;
  grid-template-columns:1fr;
  background:var(--color-white);
  border:1px solid rgba(255,255,255,.16);
  border-radius:var(--radius-lg);
  box-shadow:0 24px 70px rgba(0,0,0,.34), 0 1px 2px rgba(0,0,0,.08);
  overflow:hidden;
}

.login-brand-panel {
  display:none;
  background:
    linear-gradient(160deg, rgba(194,65,12,.92), rgba(17,17,17,.96)),
    var(--color-black);
  color:var(--color-white);
  padding:var(--space-10);
  min-height:100%;
}

.login-brand-panel__mark {
  font-size:var(--text-3xl);
  font-weight:800;
  letter-spacing:.08em;
  line-height:1;
}

.login-brand-panel__mark::first-letter { color:var(--color-orange); }

.login-brand-panel__eyebrow {
  margin-top:var(--space-3);
  color:rgba(255,255,255,.68);
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.login-brand-panel__title {
  margin-top:var(--space-10);
  max-width:12ch;
  font-size:var(--text-3xl);
  font-weight:800;
  line-height:1.12;
}

.login-brand-panel__text {
  margin-top:var(--space-4);
  max-width:32ch;
  color:rgba(255,255,255,.72);
  font-size:var(--text-base);
  line-height:1.7;
}

.login-box {
  background:var(--color-white);
  border-radius:0;
  box-shadow:none;
  border:none;
  padding:var(--space-8) var(--space-6);
  width:100%;
  max-width:none;
}

.login-box__logo {
  text-align:center;
  margin-bottom:var(--space-6);
}

.login-box__logo-name {
  font-size:var(--text-3xl);
  font-weight:800;
  letter-spacing:.08em;
  color:var(--color-black);
}

.login-box__logo-name::first-letter { color:var(--color-orange); }

.login-box__logo-tag {
  font-size:var(--text-xs);
  color:var(--color-gray-500);
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-top:var(--space-1);
}

.login-box__title {
  font-size:var(--text-2xl);
  font-weight:800;
  text-align:center;
  margin-bottom:var(--space-6);
  color:var(--color-black);
  line-height:1.2;
}

.login-alert-area:not(:empty) {
  margin-bottom:var(--space-4);
}

.login-box__form {
  display:flex;
  flex-direction:column;
  gap:var(--space-4);
}

.login-box__forgot {
  font-size:var(--text-sm);
  color:var(--color-btn-primary);
  text-decoration:underline;
  text-underline-offset:2px;
  cursor:pointer;
  background:none;
  border:none;
  font-family:var(--font-sans);
  align-self:flex-end;
  padding:0;
}

.login-box__forgot:hover { color:var(--color-orange-dark); }

.login-box__submit {
  min-height:3rem;
  margin-top:var(--space-2);
}

.login-box__signup {
  text-align:center;
  font-size:var(--text-sm);
  color:var(--color-gray-600);
  margin-top:var(--space-5);
}
.login-box__signup a {
  color:var(--color-orange);
  font-weight:600;
  text-decoration:none;
}
.login-box__signup a:hover { text-decoration:underline; }

.login-box__footer {
  text-align:center;
  font-size:var(--text-sm);
  color:var(--color-gray-500);
  margin-top:var(--space-4);
}

@media (min-width:768px) {
  .login-page { padding:var(--space-8); }

  .login-shell {
    grid-template-columns:minmax(0, .9fr) minmax(360px, 1fr);
  }

  .login-brand-panel {
    display:flex;
    flex-direction:column;
    justify-content:space-between;
  }

  .login-box {
    padding:var(--space-10);
  }
}

/* --- Page toolbar ------------------------------------- */
.page-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
  margin-bottom:1.25rem;
}

/* --- Loading spinner ---------------------------------- */
.spinner {
  width:2rem;
  height:2rem;
  border:3px solid var(--color-gray-200);
  border-top-color:var(--color-orange);
  border-radius:50%;
  animation:spin .7s linear infinite;
  margin:2rem auto;
  display:block;
}

@keyframes spin { to { transform:rotate(360deg); } }

/* --- Focus visible ------------------------------------ */
:focus-visible {
  outline:2px solid var(--color-orange);
  outline-offset:2px;
}

/* --- Utility ------------------------------------------ */
[hidden]       { display:none !important; }
.text-muted    { color:var(--color-gray-400); font-size:.875rem; }
.text-mono     { font-family:var(--font-mono); }
.mt-1          { margin-top:.5rem; }
.mt-2          { margin-top:1rem; }
.mb-2          { margin-bottom:1rem; }
.gap-top       { margin-top:1.5rem; }

/* --- Responsive helpers ------------------------------- */
@media (max-width:767px) {
  .hide-mobile { display:none !important; }
  .page-content { padding:1rem; }
  .page-header { padding:1rem 1rem 0; }
}

/* =========================================================
   Tarif v2 — Plan tarifaire avancé
   ========================================================= */

/* Sélecteur de type de plan */
.plan-type-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
  gap:.75rem;
}

.plan-type-card {
  display:flex;
  flex-direction:column;
  gap:.25rem;
  padding:.875rem 1rem;
  border:2px solid var(--color-gray-200);
  border-radius:var(--radius-md);
  cursor:pointer;
  transition:border-color var(--transition-fast),background var(--transition-fast);
}

.plan-type-radio { display:none; }

.plan-type-card:has(.plan-type-radio:checked) {
  border-color:var(--color-orange);
  background:var(--color-orange-light);
}

.plan-type-name {
  font-weight:700;
  font-size:.9375rem;
  color:var(--color-black);
}

.plan-type-desc {
  font-size:.75rem;
  color:var(--color-gray-600);
  line-height:1.3;
}

/* Bloc service (admin) */
.service-block {
  border:1px solid var(--color-gray-200);
  border-radius:var(--radius-md);
  overflow:hidden;
  margin-bottom:1rem;
}

.service-block:last-child { margin-bottom:0; }

.service-block__header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.875rem 1.25rem;
  background:var(--color-gray-50);
  border-bottom:1px solid var(--color-gray-200);
}

.service-block__body { padding:1.25rem; }

/* Lignes de tranches (admin) */
.tier-list { overflow-x:auto; }

.tier-row {
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr 1fr 2.5rem;
  gap:.5rem;
  padding:.75rem 1.25rem;
  border-bottom:1px solid var(--color-gray-100);
  align-items:end;
  min-width:540px;
}

/* Variante 5 colonnes pour tranches kilométriques (km_min km_max base_fee per_km) */
.tier-row--5col {
  grid-template-columns:1fr 1fr 1fr 1fr 2.5rem;
  min-width:440px;
}

.tier-row:last-child { border-bottom:none; }

.tier-cell { display:flex; flex-direction:column; }

.tier-cell--action {
  justify-content:flex-end;
  align-items:center;
}

.tier-col-label {
  font-size:.6875rem;
  font-weight:600;
  color:var(--color-gray-600);
  text-transform:uppercase;
  letter-spacing:.04em;
  margin-bottom:.25rem;
  white-space:nowrap;
}

.tier-empty {
  padding:1.5rem 1.25rem;
  color:var(--color-gray-400);
  font-style:italic;
  font-size:.875rem;
  text-align:center;
}

/* Options (admin) */
.option-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.75rem 0;
  border-bottom:1px solid var(--color-gray-100);
}

.option-row:last-child { border-bottom:none; }

.option-row__label {
  display:flex;
  align-items:center;
  gap:.625rem;
  cursor:pointer;
  flex:1;
  font-size:.9375rem;
}

.option-row__price {
  display:flex;
  align-items:center;
  gap:.5rem;
  flex-shrink:0;
}

.option-row__price .field__input--number { max-width:90px; }

/* Affichage plan (client) */
.service-display-block {
  padding:1rem 0;
  border-bottom:1px solid var(--color-gray-100);
}

.service-display-block:last-of-type { border-bottom:none; }

.service-display-header {
  display:flex;
  align-items:baseline;
  gap:.625rem;
  margin-bottom:.5rem;
}

.service-display-price {
  display:flex;
  align-items:center;
  gap:.75rem;
  flex-wrap:wrap;
}

/* Options (client) */
.options-display { display:flex; flex-direction:column; }

.option-display-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.625rem 0;
  border-bottom:1px solid var(--color-gray-100);
  font-size:.9375rem;
}

.option-display-row:last-child { border-bottom:none; }

/* Badge type plan */
.badge--plan { background:#e0f2fe; color:#0369a1; }

/* =========================================================
   Dispatch admin — 008-dispatch-admin
   ========================================================= */

.dispatch-section {
  background:var(--color-white);
  border-radius:var(--radius-lg);
  padding:1.5rem;
  box-shadow:var(--shadow-card);
  margin-bottom:1.5rem;
}

.dispatch-section__title {
  font-size:1rem;
  font-weight:600;
  color:var(--color-gray-800);
  margin-bottom:1rem;
  display:flex;
  align-items:center;
  gap:.5rem;
}

.dispatch-cards {
  display:flex;
  flex-direction:column;
  gap:.75rem;
}

.dispatch-card {
  padding:1rem;
  border:1px solid var(--color-gray-200);
  border-radius:var(--radius-md);
  background:var(--color-gray-50);
}

.dispatch-card__header {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:.5rem;
  margin-bottom:.5rem;
}

.dispatch-card__ref {
  display:flex;
  align-items:center;
  gap:.375rem;
  flex-wrap:wrap;
}

.dispatch-card__total {
  font-weight:600;
  white-space:nowrap;
  font-size:.9rem;
}

.dispatch-card__meta {
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
  font-size:.875rem;
  color:var(--color-gray-600);
  margin-bottom:.625rem;
}

.dispatch-card__addresses {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.5rem;
  font-size:.875rem;
  margin-bottom:.75rem;
}

.dispatch-card__address-label {
  display:block;
  font-size:.75rem;
  color:var(--color-gray-400);
  margin-bottom:.125rem;
}

.dispatch-card__actions {
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
  align-items:center;
}

.dispatch-assign-form {
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
  align-items:center;
}

.dispatch-assign-form .field__select {
  min-width:180px;
  flex:1;
}

.dispatch-driver-group {
  border:1px solid var(--color-gray-200);
  border-radius:var(--radius-md);
  overflow:hidden;
  margin-bottom:.75rem;
}

.dispatch-driver-group:last-child { margin-bottom:0; }

.dispatch-driver-group__header {
  display:flex;
  align-items:center;
  gap:.625rem;
  padding:.625rem 1rem;
  background:var(--color-gray-100);
  font-weight:600;
  font-size:.9rem;
}

.dispatch-driver-missions {
  padding:.75rem;
  display:flex;
  flex-direction:column;
  gap:.5rem;
}

.dispatch-card--inprogress {
  background:var(--color-white);
}

.dispatch-card--done {
  background:var(--color-white);
  opacity:.85;
}

.dispatch-card--blocked {
  border-color:var(--color-orange);
}

.dispatch-card__readiness-msg {
  font-size:.8125rem;
  color:var(--color-orange-dark);
  background:var(--color-orange-light);
  border-radius:var(--radius-sm);
  padding:.375rem .5rem;
  margin-bottom:.625rem;
}

.font-mono { font-family:var(--font-mono); font-size:.875rem; }

/* ── Dispatch — badges étendus ─────────────────────────── */
.badge--secure-parcel { background:#ede9fe; color:#6d28d9; }
.badge--code-ok       { background:var(--color-success-bg); color:var(--color-success); }
.badge--code-blocked  { background:var(--color-orange-light); color:var(--color-orange-dark); }

/* ── Dispatch — infos Sécurité Plus ────────────────────── */
.dispatch-card__secure-info {
  font-size:.8125rem;
  color:#4c1d95;
  background:#ede9fe;
  border-radius:var(--radius-sm);
  padding:.25rem .5rem;
  margin-bottom:.5rem;
}

/* ── Dispatch — adresse compacte repliable ─────────────── */
.dispatch-address-details > summary {
  cursor:pointer;
  list-style:none;
  font-size:.875rem;
}
.dispatch-address-details > summary::marker,
.dispatch-address-details > summary::-webkit-details-marker { display:none; }
.dispatch-address-details > summary::after {
  content:' ▾';
  font-size:.7rem;
  color:var(--color-gray-400);
  vertical-align:middle;
}
.dispatch-address-details[open] > summary::after { content:' ▴'; }
.dispatch-address-details--noexpand > summary {
  cursor:default;
  pointer-events:none;
}
.dispatch-address-details--noexpand > summary::after { display:none; }
.dispatch-address-full {
  margin-top:.375rem;
  font-size:.8125rem;
  color:var(--color-gray-600);
  padding-left:.625rem;
  border-left:2px solid var(--color-gray-200);
  line-height:1.6;
}

/* ── Dispatch — compteurs toolbar ──────────────────────── */
.dispatch-toolbar-counters {
  display:flex;
  gap:1rem;
  flex-wrap:wrap;
  padding:.375rem 0 .125rem;
  font-size:.8125rem;
  color:var(--color-gray-600);
}
.dispatch-counter { display:flex; align-items:center; gap:.25rem; }
.dispatch-counter strong { font-weight:600; color:var(--color-gray-800); }
.dispatch-counter--blocked { color:var(--color-orange-dark); }
.dispatch-counter--blocked strong { color:var(--color-orange-dark); }

/* =========================================================
   012-refonte-ui-portail — Phase 1 : Design system extensions
   Additive only — aucune classe existante supprimée
   ========================================================= */

/* --- Tokens ajout ------------------------------------- */
:root {
  /* Gris manquants */
  --color-gray-300: #d1d5db;
  --color-gray-500: #6b7280;
  --color-gray-700: #374151;

  /* Bouton primaire WCAG AA : #c2410c/blanc = 4.63:1 */
  --color-btn-primary:      #c2410c;
  --color-btn-primary-dark: #9a3412;

  /* Bordures statut */
  --color-success-border: #bbf7d0;
  --color-error-border:   #fecaca;
  --color-warning-border: #fde68a;
  --color-info:           #2563eb;
  --color-info-bg:        #eff6ff;
  --color-info-border:    #bfdbfe;

  /* Espacement (échelle 4 px) */
  --space-1:  .25rem;
  --space-2:  .5rem;
  --space-3:  .75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;

  /* Typographie */
  --text-xs:   .75rem;
  --text-sm:   .875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;

  --font-normal:   400;
  --font-medium:   500;
  --font-semibold: 600;
  --font-bold:     700;
}

/* --- Bouton primaire : fix contraste WCAG AA ---------- */
/* Override : #c2410c/blanc = 4.63:1 (était #f97316 = 2.82:1) */
.btn--primary {
  background:var(--color-btn-primary);
}
.btn--primary:hover:not(:disabled) {
  background:var(--color-btn-primary-dark);
  box-shadow:0 3px 8px rgba(194,65,12,.35);
}

/* --- Nouveaux variants bouton ------------------------- */
.btn--secondary {
  background:var(--color-white);
  color:var(--color-black);
  border-color:var(--color-gray-300);
}
.btn--secondary:hover:not(:disabled) {
  background:var(--color-gray-50);
  border-color:var(--color-gray-500);
}

.btn--lg {
  min-height:3rem;
  padding:.875rem 1.75rem;
  font-size:1rem;
}

.btn--full { width:100%; }

.btn--loading {
  position:relative;
  color:transparent !important;
  pointer-events:none;
}
.btn--loading::after {
  content:'';
  position:absolute;
  width:1rem;
  height:1rem;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  border:2px solid rgba(255,255,255,.35);
  border-top-color:var(--color-white);
  border-radius:50%;
  animation:spin .7s linear infinite;
}

/* --- Badges statuts commandes (futurs + existants) ---- */
/* Statuts futurs (spec 008 — extension DB) */
.badge--assignee          { background:#e0f2fe; color:#0369a1; }
.badge--en_cours_de_collecte { background:#dbeafe; color:#1d4ed8; }
.badge--en_transit        { background:#e0e7ff; color:#4338ca; }
.badge--livree            { background:var(--color-success-bg); color:var(--color-success); }
.badge--annulee           { background:var(--color-gray-100); color:var(--color-gray-600); }
/* Types commande */
.badge--hotel             { background:var(--color-orange-light); color:var(--color-orange-dark); }
.badge--colis             { background:var(--color-gray-100); color:var(--color-gray-800); }

/* --- Card extensions ---------------------------------- */
.card__header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:1.25rem;
  padding-bottom:.75rem;
  border-bottom:1px solid var(--color-gray-100);
}
.card__header-title {
  font-size:1rem;
  font-weight:700;
  color:var(--color-black);
}
.card__footer {
  margin-top:1.25rem;
  padding-top:.875rem;
  border-top:1px solid var(--color-gray-100);
  display:flex;
  gap:.5rem;
  justify-content:flex-end;
  flex-wrap:wrap;
}

/* --- Table alias (.table = même rendu que .data-table) - */
.table {
  width:100%;
  border-collapse:collapse;
  font-size:.9rem;
  background:var(--color-white);
}
.table thead {
  background:var(--color-gray-50);
  border-bottom:2px solid var(--color-gray-200);
}
.table th {
  padding:.75rem 1rem;
  text-align:left;
  font-size:.8125rem;
  font-weight:600;
  color:var(--color-gray-600);
  text-transform:uppercase;
  letter-spacing:.04em;
  white-space:nowrap;
}
.table td {
  padding:.875rem 1rem;
  border-bottom:1px solid var(--color-gray-100);
  color:var(--color-black);
  vertical-align:middle;
}
.table tbody tr:last-child td { border-bottom:none; }
.table tbody tr:hover td { background:var(--color-gray-50); }
.table .col-actions { text-align:right; }

/* --- Formulaires : aliases additifs ------------------- */
.form-group {
  display:flex;
  flex-direction:column;
  gap:.375rem;
}
.form-label {
  font-size:.875rem;
  font-weight:600;
  color:var(--color-gray-800);
}
.form-label.required::after {
  content:' *';
  color:var(--color-error);
  font-weight:700;
}
.form-input {
  width:100%;
  padding:.625rem .875rem;
  border:1.5px solid var(--color-gray-200);
  border-radius:var(--radius-sm);
  font-family:var(--font-sans);
  font-size:.9375rem;
  color:var(--color-black);
  background:var(--color-white);
  transition:border-color var(--transition-fast),box-shadow var(--transition-fast);
  appearance:none;
}
.form-input:focus {
  outline:none;
  border-color:var(--color-orange);
  box-shadow:0 0 0 3px rgba(249,115,22,.15);
}
.form-input.error {
  border-color:var(--color-error);
  background:var(--color-error-bg);
}
.form-hint { font-size:.8125rem; color:var(--color-gray-400); }
.form-error { font-size:.8125rem; color:var(--color-error); font-weight:500; }

.form-row { display:grid; grid-template-columns:1fr; gap:1rem; }
@media (min-width:600px) { .form-row { grid-template-columns:1fr 1fr; } }

.form-section {
  border:1px solid var(--color-gray-200);
  border-radius:var(--radius-md);
  overflow:hidden;
  margin-bottom:1.25rem;
}
.form-section__title {
  font-size:.875rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--color-gray-600);
  background:var(--color-gray-50);
  padding:.75rem 1.25rem;
  border-bottom:1px solid var(--color-gray-200);
}
.form-section__body {
  padding:1.25rem;
  display:grid;
  gap:1rem;
}

/* --- Alert info : fix couleur (bleu sémantique) ------- */
.alert--info {
  background:var(--color-info-bg);
  color:var(--color-info);
  border-left-color:var(--color-info);
}

/* --- Empty states ------------------------------------- */
.empty-state {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:3rem 1.5rem;
  text-align:center;
  gap:.75rem;
}
.empty-state__icon {
  width:3rem;
  height:3rem;
  color:var(--color-gray-400);
  flex-shrink:0;
}
.empty-state__title {
  font-size:1.125rem;
  font-weight:600;
  color:var(--color-black);
}
.empty-state__desc {
  font-size:.9rem;
  color:var(--color-gray-500);
  max-width:360px;
  line-height:1.5;
}

/* --- Spinner variants --------------------------------- */
.spinner--sm {
  width:1rem;
  height:1rem;
  border-width:2px;
  margin:0;
  display:inline-block;
}
.spinner--page {
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:2.5rem;
  height:2.5rem;
  margin:0;
}

/* --- Skeleton ----------------------------------------- */
@keyframes shimmer {
  0%   { background-position:-200% 0; }
  100% { background-position: 200% 0; }
}
.skeleton {
  background:linear-gradient(
    90deg,
    var(--color-gray-100) 25%,
    var(--color-gray-200) 50%,
    var(--color-gray-100) 75%
  );
  background-size:200% 100%;
  animation:shimmer 1.5s infinite;
  border-radius:var(--radius-sm);
}
.skeleton--text {
  height:.875rem;
  border-radius:100px;
  width:100%;
  display:block;
}
.skeleton--text + .skeleton--text { margin-top:.5rem; width:75%; }
.skeleton--card {
  height:120px;
  border-radius:var(--radius-md);
}

/* --- Toasts ------------------------------------------- */
@keyframes toast-in  { from { opacity:0; transform:translateX(1rem); } to { opacity:1; transform:none; } }
@keyframes toast-out { to   { opacity:0; transform:translateX(1rem); } }

.toast-container {
  position:fixed;
  bottom:1.5rem;
  right:1.5rem;
  z-index:500;
  display:flex;
  flex-direction:column;
  gap:.5rem;
  max-width:360px;
  width:calc(100vw - 3rem);
  pointer-events:none;
}
.toast {
  display:flex;
  align-items:flex-start;
  gap:.75rem;
  padding:.875rem 1rem;
  background:var(--color-white);
  border-radius:var(--radius-md);
  box-shadow:0 4px 20px rgba(0,0,0,.15);
  border-left:3px solid var(--color-gray-300);
  animation:toast-in .2s ease;
  pointer-events:all;
}
.toast.is-dismissing { animation:toast-out .2s ease forwards; }
.toast--success { border-left-color:var(--color-success); }
.toast--error   { border-left-color:var(--color-error); }
.toast--info    { border-left-color:var(--color-info); }
.toast__icon    { flex-shrink:0; font-size:1rem; margin-top:.1rem; }
.toast__body    { flex:1; min-width:0; }
.toast__message { font-size:.9rem; font-weight:500; color:var(--color-black); line-height:1.4; }
.toast__close {
  flex-shrink:0;
  background:none;
  border:none;
  cursor:pointer;
  color:var(--color-gray-400);
  font-size:1rem;
  padding:.125rem;
  line-height:1;
  border-radius:var(--radius-sm);
  transition:color var(--transition-fast);
}
.toast__close:hover { color:var(--color-black); }

/* --- Page header extensions --------------------------- */
.page-header--flex {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}
.page-actions {
  display:flex;
  gap:.5rem;
  align-items:center;
  flex-wrap:wrap;
}
.breadcrumb {
  font-size:.8125rem;
  color:var(--color-gray-500);
  display:flex;
  align-items:center;
  gap:.375rem;
  flex-wrap:wrap;
  margin-bottom:.5rem;
}
.breadcrumb__sep { color:var(--color-gray-400); }

/* --- Sidebar extensions ------------------------------- */
.nav-section-label {
  font-size:.6875rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--color-gray-500);
  padding:1rem .875rem .375rem;
  display:block;
}

/* =========================================================
   012-refonte-ui-portail — Phase 1 : contrats CSS exacts
   Aliases additifs pour le design system documenté
   ========================================================= */

/* --- Boutons : aliases sans modifier les classes legacy - */
.btn-primary,
.btn--primary {
  background:var(--color-btn-primary);
  color:var(--color-white);
  border-color:var(--color-btn-primary);
  box-shadow:var(--shadow-btn);
}
.btn-primary:hover:not(:disabled):not([disabled]),
.btn--primary:hover:not(:disabled):not([disabled]) {
  background:var(--color-btn-primary-dark);
  border-color:var(--color-btn-primary-dark);
  box-shadow:0 3px 8px rgba(194,65,12,.35);
}

.btn-secondary,
.btn--secondary {
  background:var(--color-white);
  color:var(--color-black);
  border-color:var(--color-gray-300);
  box-shadow:none;
}
.btn-secondary:hover:not(:disabled):not([disabled]),
.btn--secondary:hover:not(:disabled):not([disabled]) {
  background:var(--color-gray-50);
  border-color:var(--color-gray-500);
}

.btn-danger,
.btn--danger {
  background:var(--color-error);
  color:var(--color-white);
  border-color:var(--color-error);
  box-shadow:var(--shadow-btn);
}
.btn-danger:hover:not(:disabled):not([disabled]),
.btn--danger:hover:not(:disabled):not([disabled]) {
  background:#b91c1c;
  border-color:#b91c1c;
}

.btn-ghost,
.btn--ghost {
  background:transparent;
  color:var(--color-orange);
  border-color:transparent;
  box-shadow:none;
}
.btn-ghost:hover:not(:disabled):not([disabled]),
.btn--ghost:hover:not(:disabled):not([disabled]) {
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
}

.btn-sm,
.btn--sm {
  font-size:var(--text-sm);
  padding:var(--space-2) var(--space-3);
}
.btn-lg,
.btn--lg {
  min-height:3rem;
  padding:.875rem 1.75rem;
  font-size:var(--text-base);
}
.btn-full,
.btn--full { width:100%; }

.btn[disabled],
.btn:disabled {
  opacity:.45;
  cursor:not-allowed;
  pointer-events:none;
  transform:none;
}

.btn-loading,
.btn--loading {
  position:relative;
  color:transparent !important;
  pointer-events:none;
}
.btn-loading::after,
.btn--loading::after {
  content:'';
  position:absolute;
  width:1rem;
  height:1rem;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  border:2px solid rgba(255,255,255,.35);
  border-top-color:var(--color-white);
  border-radius:50%;
  animation:spin .7s linear infinite;
}
.btn-secondary.btn-loading::after,
.btn--secondary.btn--loading::after,
.btn-ghost.btn-loading::after,
.btn--ghost.btn--loading::after {
  border-color:rgba(17,17,17,.2);
  border-top-color:var(--color-black);
}

/* --- Badges : noms de contrats Phase 1 ---------------- */
.badge-pending,
.badge--en_attente {
  background:var(--color-warning-bg);
  color:var(--color-warning);
  border:1px solid var(--color-warning-border);
}
.badge-assigned,
.badge--assignee,
.badge--confirme {
  background:var(--color-info-bg);
  color:var(--color-info);
  border:1px solid var(--color-info-border);
}
.badge-pickup,
.badge--en_cours_de_collecte {
  background:#dbeafe;
  color:#1d4ed8;
  border:1px solid #bfdbfe;
}
.badge-transit,
.badge--en_transit {
  background:#e0e7ff;
  color:#4338ca;
  border:1px solid #c7d2fe;
}
.badge-delivered,
.badge--livree,
.badge--livre {
  background:var(--color-success-bg);
  color:var(--color-success);
  border:1px solid var(--color-success-border);
}
.badge-cancelled,
.badge--annulee {
  background:var(--color-gray-100);
  color:var(--color-gray-700);
  border:1px solid var(--color-gray-200);
}
.badge-active,
.badge--actif {
  background:var(--color-success-bg);
  color:var(--color-success);
  border:1px solid var(--color-success-border);
}
.badge-inactive,
.badge--inactif {
  background:var(--color-gray-100);
  color:var(--color-gray-700);
  border:1px solid var(--color-gray-200);
}
.badge-hotel,
.badge--hotel {
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
  border:1px solid #fed7aa;
}
.badge-colis,
.badge--colis {
  background:var(--color-gray-100);
  color:var(--color-gray-800);
  border:1px solid var(--color-gray-200);
}

/* --- Cards ------------------------------------------- */
.card {
  box-shadow:0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.04);
}
.card-header,
.card__header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-4);
  margin-bottom:var(--space-5);
  padding-bottom:var(--space-3);
  border-bottom:1px solid var(--color-gray-100);
}
.card-body {
  display:grid;
  gap:var(--space-4);
}
.card-footer,
.card__footer {
  margin-top:var(--space-5);
  padding-top:var(--space-3);
  border-top:1px solid var(--color-gray-100);
  display:flex;
  gap:var(--space-2);
  justify-content:flex-end;
  flex-wrap:wrap;
}

/* --- Alerts : aliases sémantiques -------------------- */
.alert {
  border:1px solid transparent;
  border-left-width:4px;
}
.alert-success,
.alert--success {
  background:var(--color-success-bg);
  color:var(--color-success);
  border-color:var(--color-success-border);
  border-left-color:var(--color-success);
}
.alert-error,
.alert--error {
  background:var(--color-error-bg);
  color:var(--color-error);
  border-color:var(--color-error-border);
  border-left-color:var(--color-error);
}
.alert-warning,
.alert--warning {
  background:var(--color-warning-bg);
  color:var(--color-warning);
  border-color:var(--color-warning-border);
  border-left-color:var(--color-warning);
}
.alert-info,
.alert--info {
  background:var(--color-info-bg);
  color:var(--color-info);
  border-color:var(--color-info-border);
  border-left-color:var(--color-info);
}
.alert[dismissible] {
  padding-right:var(--space-4);
  justify-content:space-between;
}
.alert__close,
.alert-close {
  margin-left:auto;
  background:none;
  border:none;
  color:currentColor;
  cursor:pointer;
  font:inherit;
  line-height:1;
  opacity:.7;
}
.alert__close:hover,
.alert-close:hover { opacity:1; }

/* --- Formulaires globaux ----------------------------- */
.form-input:focus,
.field__input:focus,
.field__select:focus,
.field__textarea:focus {
  outline:2px solid var(--color-orange);
  outline-offset:2px;
  border-color:var(--color-orange);
  box-shadow:none;
}
.form-input.error,
.field__input[aria-invalid="true"],
.field__select[aria-invalid="true"],
.field__textarea[aria-invalid="true"] {
  border-color:var(--color-error);
  background:var(--color-error-bg);
}

/* --- Tableaux ---------------------------------------- */
.table-wrapper {
  background:var(--color-white);
  scrollbar-width:thin;
  scrollbar-color:var(--color-gray-300) transparent;
}
.table thead,
.data-table thead {
  background:var(--color-gray-100);
}
.table tbody tr,
.data-table tbody tr {
  transition:background var(--transition-fast);
}

/* --- Empty states : aliases exacts ------------------- */
.empty-state-icon,
.empty-state__icon {
  width:3rem;
  height:3rem;
  color:var(--color-gray-400);
  flex-shrink:0;
}
.empty-state-title,
.empty-state__title {
  font-size:var(--text-lg);
  font-weight:var(--font-semibold);
  color:var(--color-black);
}
.empty-state-desc,
.empty-state__desc {
  font-size:var(--text-sm);
  color:var(--color-gray-500);
  max-width:360px;
  line-height:1.5;
}
.empty-state-action {
  margin-top:var(--space-2);
}

/* --- Chargement : aliases exacts --------------------- */
.spinner-sm,
.spinner--sm {
  width:1rem;
  height:1rem;
  border-width:2px;
  margin:0;
  display:inline-block;
}
.spinner-page,
.spinner--page {
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:2.5rem;
  height:2.5rem;
  margin:0;
  z-index:450;
}
.skeleton-text,
.skeleton--text {
  height:.875rem;
  border-radius:100px;
  width:100%;
  display:block;
}
.skeleton-text + .skeleton-text,
.skeleton--text + .skeleton--text {
  margin-top:var(--space-2);
  width:75%;
}
.skeleton-card,
.skeleton--card {
  min-height:120px;
  border-radius:var(--radius-md);
}

/* --- Toasts : aliases exacts ------------------------- */
.toast-success,
.toast--success { border-left-color:var(--color-success); }
.toast-error,
.toast--error { border-left-color:var(--color-error); }
.toast-info,
.toast--info { border-left-color:var(--color-info); }

/* --- Page header & sidebar : aliases exacts ---------- */
.page-header {
  display:flex;
  flex-direction:column;
  gap:var(--space-2);
}
.page-header--flex {
  flex-direction:row;
}
.sidebar-footer,
.sidebar__footer {
  padding:.75rem 1.25rem;
  border-top:1px solid rgba(255,255,255,.08);
}

/* =========================================================
   Client Dashboard — section eyebrow & stat value size
   ========================================================= */
.client-dashboard-section {
  display:grid;
  gap:var(--space-4);
}

.client-dashboard-section__eyebrow {
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--color-gray-500);
}

/* Text-based stat values need a smaller size than numeric KPIs */
.client-stat-card .stat-card__value {
  font-size:var(--text-xl);
  font-weight:var(--font-bold);
  margin-top:var(--space-1);
}

/* Client orders toolbar — border needs a base to override */
.client-orders-toolbar {
  border:1px solid rgba(17,17,17,.08);
}

/* =========================================================
   Admin Dashboard — hero, stats, quick-links premium
   Miroir du portail client validé — tokens partagés
   ========================================================= */
.admin-dashboard {
  background:
    linear-gradient(135deg, rgba(249,115,22,.09), transparent 28rem),
    linear-gradient(180deg, #fff7ed 0, #f7f5f2 17rem, #f1f3f5 100%);
}

.admin-dashboard .page-content {
  padding:0 var(--space-4) var(--space-10);
}

.admin-dashboard__hero {
  margin:var(--space-4);
  padding:var(--space-6);
  border-radius:var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(17,17,17,.97), rgba(194,65,12,.88)),
    var(--color-black);
  color:var(--color-white);
  box-shadow:0 24px 70px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.08);
  position:relative;
  overflow:hidden;
}

.admin-dashboard__hero::after {
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.06) 48%, transparent 49%),
    linear-gradient(0deg, transparent, rgba(255,255,255,.04) 48%, transparent 49%);
  background-size:6rem 6rem;
  opacity:.22;
  pointer-events:none;
}

.admin-dashboard__hero-copy,
.admin-dashboard__actions { position:relative; z-index:1; }

.admin-dashboard__eyebrow {
  color:rgba(255,255,255,.62);
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.1em;
  text-transform:uppercase;
}

.admin-dashboard__title {
  color:var(--color-white);
  font-size:var(--text-3xl);
  margin-top:var(--space-2);
}

.admin-dashboard__subtitle {
  color:rgba(255,255,255,.7);
  max-width:44rem;
}

.admin-dashboard__actions {
  margin-top:var(--space-5);
  gap:var(--space-3);
}

.admin-dashboard__actions .btn-ghost {
  color:var(--color-white);
  border-color:rgba(255,255,255,.28);
}

.admin-dashboard__actions .btn-ghost:hover {
  background:rgba(255,255,255,.1);
  color:var(--color-white);
}

.admin-dashboard__content {
  display:grid;
  gap:var(--space-8);
  max-width:1120px;
  margin:0 auto;
  width:100%;
}

/* --- Stat cards admin --------------------------------- */
.admin-dashboard__stats {
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:var(--space-5);
  margin-bottom:0;
}

.admin-stat-card {
  display:flex;
  align-items:center;
  gap:var(--space-4);
  min-height:7.5rem;
  border-radius:var(--radius-md);
  padding:var(--space-6);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
  border:1px solid rgba(17,17,17,.08);
  position:relative;
  overflow:hidden;
}

.admin-stat-card::before {
  content:'';
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:var(--color-orange);
}

.admin-stat-card--active::before { background:var(--color-success); }

.admin-stat-card__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:3rem;
  height:3rem;
  border-radius:var(--radius-md);
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
  font-weight:var(--font-bold);
  flex-shrink:0;
  font-size:var(--text-sm);
  box-shadow:inset 0 0 0 1px rgba(194,65,12,.12);
}

.admin-stat-card--active .admin-stat-card__icon {
  background:var(--color-success-bg);
  color:var(--color-success);
  box-shadow:inset 0 0 0 1px var(--color-success-border);
}

.admin-stat-card__icon--muted {
  background:var(--color-gray-100);
  color:var(--color-gray-600);
  box-shadow:inset 0 0 0 1px var(--color-gray-200);
}

.admin-stat-card__icon--total {
  background:var(--color-info-bg);
  color:var(--color-info);
  box-shadow:inset 0 0 0 1px var(--color-info-border);
}

.admin-stat-card .stat-card__value {
  font-size:var(--text-2xl);
  font-weight:var(--font-bold);
  margin-top:var(--space-1);
  line-height:1.15;
}

/* --- Cards admin -------------------------------------- */
.admin-dashboard-card {
  border-radius:var(--radius-md);
  padding:var(--space-6);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
  border:1px solid rgba(17,17,17,.08);
}

.admin-dashboard-card__header {
  margin-bottom:var(--space-5);
  padding-bottom:var(--space-4);
  border-bottom:1px solid var(--color-gray-100);
}

.admin-dashboard-card__title {
  margin-bottom:var(--space-1);
  padding-bottom:0;
  border-bottom:none;
}

/* --- Quick links admin -------------------------------- */
.admin-dashboard__quick-links {
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:var(--space-4);
  margin-bottom:0;
}

.admin-dashboard__quick-links .quick-link {
  justify-content:space-between;
  min-height:10.5rem;
  padding:var(--space-5);
  border:1px solid rgba(17,17,17,.08);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
}

.admin-dashboard__quick-links .quick-link:hover {
  border-color:rgba(194,65,12,.34);
  box-shadow:0 12px 28px rgba(194,65,12,.12), inset 0 1px 0 rgba(255,255,255,.65);
}

.admin-dashboard__quick-links .quick-link__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.5rem;
  height:2.5rem;
  border-radius:var(--radius-md);
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
  font-size:var(--text-xs);
  font-weight:var(--font-bold);
  letter-spacing:.04em;
  box-shadow:inset 0 0 0 1px rgba(194,65,12,.12);
}

.admin-dashboard__quick-links .quick-link__icon--clients {
  background:var(--color-info-bg);
  color:var(--color-info);
  box-shadow:inset 0 0 0 1px var(--color-info-border);
}

.admin-dashboard__quick-links .quick-link__icon--orders {
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
}

.admin-dashboard__quick-links .quick-link__icon--drivers {
  background:var(--color-success-bg);
  color:var(--color-success);
  box-shadow:inset 0 0 0 1px var(--color-success-border);
}

.admin-dashboard__quick-links .quick-link__icon--create {
  background:var(--color-btn-primary);
  color:var(--color-white);
  box-shadow:none;
}

.admin-dashboard__quick-links .quick-link__title { font-size:var(--text-base); }
.admin-dashboard__quick-links .quick-link__desc  { line-height:1.45; }

/* --- Section eyebrow --------------------------------- */
.admin-dashboard-section {
  display:grid;
  gap:var(--space-4);
}

.admin-dashboard-section__eyebrow {
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--color-gray-500);
}

.admin-dashboard #spinner-area {
  min-height:16rem;
  display:grid;
  place-items:center;
}

/* --- Responsive admin dashboard ---------------------- */
@media (min-width:768px) {
  .admin-dashboard__hero {
    margin:var(--space-6);
    padding:var(--space-8);
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:var(--space-6);
  }

  .admin-dashboard .page-content {
    padding:0 var(--space-6) var(--space-12);
  }

  .admin-dashboard__actions { margin-top:0; justify-content:flex-end; }
}

@media (max-width:767px) {
  .admin-dashboard__hero {
    margin:var(--space-3);
    padding:var(--space-5);
  }

  .admin-dashboard__title { font-size:var(--text-2xl); }

  .admin-dashboard__actions { align-items:stretch; }

  .admin-dashboard__actions .btn {
    width:100%;
    white-space:normal;
  }

  .admin-stat-card,
  .admin-dashboard-card { padding:var(--space-5); }

  .admin-dashboard__quick-links { grid-template-columns:1fr; }

  .admin-dashboard__quick-links .quick-link { min-height:0; }
}

/* =========================================================
   Chauffeur Dashboard — mobile-first mission cockpit
   ========================================================= */
.chauffeur-dashboard {
  background:
    linear-gradient(135deg, rgba(249,115,22,.1), transparent 26rem),
    linear-gradient(180deg, #fff7ed 0, #f7f5f2 16rem, #f1f3f5 100%);
}

.chauffeur-dashboard .page-content {
  padding:0 var(--space-4) var(--space-10);
}

.chauffeur-dashboard__hero {
  margin:var(--space-4);
  padding:var(--space-6);
  border-radius:var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(17,17,17,.97), rgba(194,65,12,.9)),
    var(--color-black);
  color:var(--color-white);
  box-shadow:0 24px 70px rgba(0,0,0,.2),0 1px 2px rgba(0,0,0,.08);
  position:relative;
  overflow:hidden;
}

.chauffeur-dashboard__hero::after {
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.06) 48%, transparent 49%),
    linear-gradient(0deg, transparent, rgba(255,255,255,.04) 48%, transparent 49%);
  background-size:5rem 5rem;
  opacity:.24;
  pointer-events:none;
}

.chauffeur-dashboard__hero-copy,
.chauffeur-dashboard__actions {
  position:relative;
  z-index:1;
}

.chauffeur-dashboard__eyebrow,
.chauffeur-dashboard-section__eyebrow {
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.chauffeur-dashboard__eyebrow {
  color:rgba(255,255,255,.68);
}

.chauffeur-dashboard__title {
  margin-top:var(--space-2);
  color:var(--color-white);
  font-size:var(--text-3xl);
  line-height:1.12;
}

.chauffeur-dashboard__subtitle {
  margin-top:var(--space-3);
  max-width:42rem;
  color:rgba(255,255,255,.74);
}

.chauffeur-dashboard__actions {
  margin-top:var(--space-5);
}

.chauffeur-dashboard__actions .btn {
  min-height:3.25rem;
  box-shadow:0 12px 28px rgba(194,65,12,.28);
}

.chauffeur-dashboard__content {
  display:grid;
  gap:var(--space-8);
  max-width:1120px;
  width:100%;
  margin:0 auto;
}

.chauffeur-dashboard-section {
  display:grid;
  gap:var(--space-4);
}

.chauffeur-dashboard-section__eyebrow {
  color:var(--color-gray-500);
}

.chauffeur-dashboard-section__title {
  color:var(--color-black);
  font-size:var(--text-xl);
  line-height:1.25;
}

.chauffeur-dashboard__stats {
  grid-template-columns:1fr;
  gap:var(--space-4);
  margin-bottom:0;
}

.chauffeur-stat-card {
  display:flex;
  align-items:center;
  gap:var(--space-4);
  min-height:7.5rem;
  padding:var(--space-5);
  border:1px solid rgba(17,17,17,.08);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
  position:relative;
  overflow:hidden;
}

.chauffeur-stat-card::before {
  content:'';
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:var(--color-orange);
}

.chauffeur-stat-card--active::before {
  background:var(--color-success);
}

.chauffeur-stat-card__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:3rem;
  height:3rem;
  border-radius:var(--radius-md);
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
  font-size:var(--text-xs);
  font-weight:var(--font-bold);
  letter-spacing:.04em;
  flex-shrink:0;
  box-shadow:inset 0 0 0 1px rgba(194,65,12,.12);
}

.chauffeur-stat-card__icon--done {
  background:var(--color-success-bg);
  color:var(--color-success);
  box-shadow:inset 0 0 0 1px var(--color-success-border);
}

.chauffeur-stat-card__icon--driver {
  background:var(--color-info-bg);
  color:var(--color-info);
  box-shadow:inset 0 0 0 1px var(--color-info-border);
}

.chauffeur-stat-card .stat-card__value {
  font-size:var(--text-2xl);
  font-weight:var(--font-bold);
  margin-top:var(--space-1);
  line-height:1.15;
}

.chauffeur-dashboard__quick-links {
  grid-template-columns:1fr;
  gap:var(--space-4);
  margin-bottom:0;
}

.chauffeur-dashboard__quick-links .quick-link {
  min-height:9.5rem;
  justify-content:space-between;
  padding:var(--space-5);
  border:1px solid rgba(17,17,17,.08);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
}

.chauffeur-dashboard__quick-links .quick-link:hover {
  border-color:rgba(194,65,12,.34);
  box-shadow:0 12px 28px rgba(194,65,12,.12),inset 0 1px 0 rgba(255,255,255,.65);
}

.chauffeur-dashboard__quick-links .quick-link__icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.75rem;
  height:2.75rem;
  border-radius:var(--radius-md);
  background:var(--color-orange-light);
  color:var(--color-btn-primary);
  font-size:var(--text-xs);
  font-weight:var(--font-bold);
  letter-spacing:.04em;
  box-shadow:inset 0 0 0 1px rgba(194,65,12,.12);
}

.chauffeur-dashboard__quick-links .quick-link__icon--create {
  background:var(--color-btn-primary);
  color:var(--color-white);
  box-shadow:none;
}

.chauffeur-dashboard__quick-links .quick-link__title {
  font-size:var(--text-base);
}

.chauffeur-dashboard-card {
  padding:var(--space-5);
  border:1px solid rgba(17,17,17,.08);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
}

.chauffeur-dashboard-card--priority {
  border-left:4px solid var(--color-orange);
}

.chauffeur-dashboard-card .card-header {
  align-items:flex-start;
  margin-bottom:var(--space-5);
}

.chauffeur-dashboard-card__title {
  margin:var(--space-1) 0 0;
  padding:0;
  border:0;
}

.chauffeur-dashboard #spinner-area {
  min-height:16rem;
  display:grid;
  place-items:center;
}

.chauffeur-dashboard #alert-area:not(:empty) {
  max-width:1120px;
  width:100%;
  margin:0 auto var(--space-4);
}

.chauffeur-dashboard #active-missions-area,
.chauffeur-dashboard #recent-deliveries-area {
  display:grid;
  gap:var(--space-4);
}

.chauffeur-dashboard #active-missions-area > .text-muted,
.chauffeur-dashboard #recent-deliveries-area > .text-muted {
  margin:0;
  padding:var(--space-8) var(--space-4);
  border:1px dashed var(--color-gray-300);
  border-radius:var(--radius-md);
  background:var(--color-gray-50);
  text-align:center;
  color:var(--color-gray-500);
}

.chauffeur-dashboard .order-card {
  margin-bottom:0;
  border:1px solid rgba(17,17,17,.08);
  border-radius:var(--radius-md);
  background:var(--color-white);
  box-shadow:0 8px 24px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
}

.chauffeur-dashboard .order-card__body {
  padding:var(--space-5);
  gap:var(--space-5);
}

.chauffeur-dashboard .order-details__summary-title {
  font-size:var(--text-lg);
}

.chauffeur-dashboard .order-details__summary-meta {
  color:var(--color-gray-500);
}

.chauffeur-dashboard .order-card section {
  padding:var(--space-4);
  border:1px solid rgba(17,17,17,.07);
  border-radius:var(--radius-md);
  background:rgba(249,250,251,.64);
}

.chauffeur-dashboard .order-section-title {
  color:var(--color-gray-700);
}

.chauffeur-dashboard .order-meta {
  gap:var(--space-4);
}

.chauffeur-dashboard .order-meta > div {
  min-width:0;
  padding-bottom:var(--space-3);
  border-bottom:1px solid var(--color-gray-100);
}

.chauffeur-dashboard .order-meta > div span:last-child {
  word-break:break-word;
}

.chauffeur-dashboard .order-card .btn-group {
  align-items:stretch;
}

.chauffeur-dashboard .order-card .btn {
  width:100%;
  min-height:3rem;
  font-size:var(--text-base);
}

@media (min-width:768px) {
  .chauffeur-dashboard__hero {
    margin:var(--space-6);
    padding:var(--space-8);
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:var(--space-6);
  }

  .chauffeur-dashboard .page-content {
    padding:0 var(--space-6) var(--space-12);
  }

  .chauffeur-dashboard__actions {
    margin-top:0;
    min-width:14rem;
  }

  .chauffeur-dashboard__stats {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .chauffeur-dashboard__quick-links {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .chauffeur-dashboard .order-card .btn-group {
    justify-content:flex-end;
  }

  .chauffeur-dashboard .order-card .btn {
    width:auto;
  }
}

@media (max-width:767px) {
  .chauffeur-dashboard__hero {
    margin:var(--space-3);
    padding:var(--space-5);
  }

  .chauffeur-dashboard__title {
    font-size:var(--text-2xl);
  }

  .chauffeur-dashboard__actions {
    align-items:stretch;
  }

  .chauffeur-dashboard-card .card-header {
    flex-direction:column;
  }

  .chauffeur-dashboard-card .card-header .btn {
    width:100%;
    min-height:3rem;
  }

  .chauffeur-dashboard .order-meta {
    grid-template-columns:1fr;
  }
}

/* =========================================================
   Chauffeur Livraisons — mission list
   ========================================================= */
.chauffeur-livraisons {
  background:
    linear-gradient(135deg, rgba(249,115,22,.1), transparent 26rem),
    linear-gradient(180deg, #fff7ed 0, #f7f5f2 16rem, #f1f3f5 100%);
}

.chauffeur-livraisons .page-content {
  padding:0 var(--space-4) var(--space-10);
}

.chauffeur-livraisons__hero {
  margin:var(--space-4);
  padding:var(--space-6);
  border-radius:var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(17,17,17,.97), rgba(194,65,12,.9)),
    var(--color-black);
  color:var(--color-white);
  box-shadow:0 24px 70px rgba(0,0,0,.2),0 1px 2px rgba(0,0,0,.08);
  position:relative;
  overflow:hidden;
}

.chauffeur-livraisons__hero::after {
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.06) 48%, transparent 49%),
    linear-gradient(0deg, transparent, rgba(255,255,255,.04) 48%, transparent 49%);
  background-size:5rem 5rem;
  opacity:.24;
  pointer-events:none;
}

.chauffeur-livraisons__hero-copy,
.chauffeur-livraisons__actions {
  position:relative;
  z-index:1;
}

.chauffeur-livraisons__eyebrow,
.chauffeur-livraisons-section__eyebrow {
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.chauffeur-livraisons__eyebrow {
  color:rgba(255,255,255,.68);
}

.chauffeur-livraisons__title {
  margin-top:var(--space-2);
  color:var(--color-white);
  font-size:var(--text-3xl);
  line-height:1.12;
}

.chauffeur-livraisons__subtitle {
  margin-top:var(--space-3);
  max-width:42rem;
  color:rgba(255,255,255,.74);
}

.chauffeur-livraisons__actions {
  margin-top:var(--space-5);
}

.chauffeur-livraisons__actions .btn {
  min-height:3.25rem;
  border-color:rgba(255,255,255,.28);
  background:rgba(255,255,255,.08);
  color:var(--color-white);
}

.chauffeur-livraisons__actions .btn:hover {
  background:rgba(255,255,255,.14);
  color:var(--color-white);
}

.chauffeur-livraisons__content {
  max-width:1120px;
  width:100%;
  margin:0 auto;
  display:grid;
  gap:var(--space-6);
}

.chauffeur-livraisons-toolbar {
  padding:var(--space-5) var(--space-6);
  border:1px solid rgba(17,17,17,.08);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 4px 16px rgba(17,17,17,.04),0 1px 2px rgba(17,17,17,.04);
  display:flex;
  flex-direction:column;
  gap:var(--space-1);
}

.chauffeur-livraisons-section {
  display:grid;
  gap:var(--space-4);
}

.chauffeur-livraisons-section__eyebrow {
  color:var(--color-gray-500);
}

.chauffeur-livraisons-section__title {
  color:var(--color-black);
  font-size:var(--text-xl);
  line-height:1.25;
}

.chauffeur-livraisons__list {
  display:grid;
  gap:var(--space-5);
}

.chauffeur-livraisons #spinner-area {
  min-height:16rem;
  display:grid;
  place-items:center;
}

.chauffeur-livraisons #alert-area:not(:empty) {
  max-width:1120px;
  width:100%;
  margin:0 auto var(--space-4);
}

.chauffeur-livraisons__empty {
  min-height:20rem;
  border:1px solid rgba(17,17,17,.08);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
}

.chauffeur-livraisons__empty .empty-state-icon {
  border-radius:var(--radius-md);
  background:var(--color-orange-light);
  box-shadow:inset 0 0 0 1px rgba(194,65,12,.12);
}

.chauffeur-livraisons .chauffeur-delivery-card {
  margin-bottom:0;
  border:1px solid rgba(17,17,17,.08);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg, var(--color-white), #fffdfb);
  box-shadow:0 10px 30px rgba(17,17,17,.06),0 1px 2px rgba(17,17,17,.05);
  overflow:hidden;
}

.chauffeur-livraisons .order-details {
  border-top:0;
  margin-top:0;
}

.chauffeur-livraisons .order-details__summary {
  padding:var(--space-5);
  background:var(--color-white);
  border-bottom:1px solid var(--color-gray-100);
}

.chauffeur-livraisons .order-details__summary-title {
  font-size:var(--text-lg);
}

.chauffeur-livraisons .order-details__summary-meta {
  color:var(--color-gray-500);
}

.chauffeur-livraisons .order-details__summary-aside {
  gap:var(--space-2);
}

.chauffeur-livraisons .badge {
  border:1px solid transparent;
}

.chauffeur-livraisons .order-card__body {
  padding:var(--space-5);
  gap:var(--space-5);
}

.chauffeur-livraisons .order-card__body section {
  padding:var(--space-4);
  border:1px solid rgba(17,17,17,.07);
  border-radius:var(--radius-md);
  background:rgba(249,250,251,.64);
}

.chauffeur-livraisons .order-section-title {
  color:var(--color-gray-700);
}

.chauffeur-livraisons .order-meta {
  gap:var(--space-4);
}

.chauffeur-livraisons .order-meta > div {
  min-width:0;
  padding-bottom:var(--space-3);
  border-bottom:1px solid var(--color-gray-100);
}

.chauffeur-livraisons .order-meta > div span:last-child {
  word-break:break-word;
}

.chauffeur-livraisons .order-timeline {
  margin-bottom:0;
}

.chauffeur-livraisons .btn-group {
  align-items:stretch;
}

.chauffeur-livraisons .order-card .btn {
  min-height:3rem;
  font-size:var(--text-base);
  box-shadow:0 10px 24px rgba(17,17,17,.08);
}

@media (min-width:768px) {
  .chauffeur-livraisons__hero {
    margin:var(--space-6);
    padding:var(--space-8);
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:var(--space-6);
  }

  .chauffeur-livraisons .page-content {
    padding:0 var(--space-6) var(--space-12);
  }

  .chauffeur-livraisons__actions {
    margin-top:0;
    min-width:14rem;
  }

  .chauffeur-livraisons .order-card .btn-group {
    justify-content:flex-end;
  }

  .chauffeur-livraisons .order-card .btn {
    width:auto;
  }
}

@media (max-width:767px) {
  .chauffeur-livraisons__hero {
    margin:var(--space-3);
    padding:var(--space-5);
  }

  .chauffeur-livraisons__title {
    font-size:var(--text-2xl);
  }

  .chauffeur-livraisons__actions,
  .chauffeur-livraisons .order-details__summary-aside {
    align-items:stretch;
  }

  .chauffeur-livraisons .order-details__summary {
    align-items:flex-start;
  }

  .chauffeur-livraisons .order-details__summary-aside {
    width:100%;
    justify-content:flex-start;
  }

  .chauffeur-livraisons .order-meta {
    grid-template-columns:1fr;
  }
}

/* ============================================================
   CHAUFFEUR LIVRAISON DETAIL
   ============================================================ */

.chauffeur-livraison-detail {
  background:
    linear-gradient(135deg, rgba(249,115,22,.1), transparent 26rem),
    linear-gradient(180deg, #fff7ed 0, #f7f5f2 16rem, #f1f3f5 100%);
}

.chauffeur-livraison-detail .page-content {
  padding:0 var(--space-4) var(--space-10);
}

/* Hero */
.delivery-detail__hero {
  margin:var(--space-4);
  padding:var(--space-6);
  border-radius:var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(17,17,17,.97), rgba(194,65,12,.9)),
    var(--color-black);
  color:var(--color-white);
  box-shadow:0 24px 70px rgba(0,0,0,.2),0 1px 2px rgba(0,0,0,.08);
  position:relative;
  overflow:hidden;
}

.delivery-detail__hero::after {
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.06) 48%, transparent 49%),
    linear-gradient(0deg, transparent, rgba(255,255,255,.04) 48%, transparent 49%);
  background-size:5rem 5rem;
  opacity:.24;
  pointer-events:none;
}

.delivery-detail__hero-copy,
.delivery-detail__hero-actions {
  position:relative;
  z-index:1;
}

.delivery-detail__eyebrow {
  font-size:var(--text-xs);
  font-weight:var(--font-semibold);
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,.68);
}

.delivery-detail__title {
  margin-top:var(--space-2);
  color:var(--color-white);
  font-size:var(--text-3xl);
  line-height:1.12;
}

.delivery-detail__subtitle {
  margin-top:var(--space-3);
  max-width:42rem;
  color:rgba(255,255,255,.74);
}

.delivery-detail__hero-actions {
  margin-top:var(--space-5);
}

.delivery-detail__hero-actions .btn {
  min-height:3.25rem;
  border-color:rgba(255,255,255,.28);
  background:rgba(255,255,255,.08);
  color:var(--color-white);
}

.delivery-detail__hero-actions .btn:hover {
  background:rgba(255,255,255,.14);
  color:var(--color-white);
}

/* Layout */
.chauffeur-livraison-detail .order-layout {
  max-width:1120px;
  margin:0 auto;
  gap:var(--space-5);
}

.chauffeur-livraison-detail #spinner-area {
  min-height:16rem;
  display:grid;
  place-items:center;
}

.chauffeur-livraison-detail #alert-area:not(:empty) {
  max-width:1120px;
  width:100%;
  margin:0 auto var(--space-4);
}

/* Form card */
.delivery-detail__form {
  display:flex;
  flex-direction:column;
  gap:var(--space-4);
}

.delivery-detail__form-header {
  padding-bottom:var(--space-4);
  border-bottom:1px solid var(--color-gray-100);
}

.delivery-detail__form-header .card__title {
  margin-bottom:var(--space-1);
}

/* Sections */
.delivery-detail__section {
  padding:var(--space-4);
  border:1px solid rgba(17,17,17,.07);
  border-radius:var(--radius-md);
  background:rgba(249,250,251,.64);
  display:flex;
  flex-direction:column;
  gap:var(--space-3);
}

.delivery-detail__section-header {
  display:flex;
  flex-direction:column;
  gap:var(--space-1);
}

.delivery-detail__section-desc {
  font-size:var(--text-sm);
  color:var(--color-gray-500);
  margin:0;
}

/* Code section — highlighted */
.delivery-detail__section--code {
  background:linear-gradient(135deg, rgba(249,115,22,.06), rgba(249,115,22,.02));
  border-color:rgba(194,65,12,.2);
}

.delivery-detail__code-row {
  display:flex;
  gap:var(--space-3);
  align-items:stretch;
}

.delivery-detail__code-input {
  flex:1;
  font-size:var(--text-lg);
  font-weight:var(--font-semibold);
  letter-spacing:.1em;
  text-transform:uppercase;
  min-height:3rem;
}

/* Baggage confirm section */
.delivery-detail__section--confirm {
  border-color:rgba(22,163,74,.2);
  background:linear-gradient(135deg, rgba(22,163,74,.04), rgba(22,163,74,.01));
}

.delivery-detail__section--confirm .option-check {
  border-color:rgba(22,163,74,.24);
  background:var(--color-success-bg);
  padding:var(--space-4);
}

/* Form actions */
.delivery-detail__form-actions {
  display:flex;
  flex-direction:column;
  gap:var(--space-3);
  padding-top:var(--space-2);
  border-top:1px solid var(--color-gray-100);
}

/* Aside */
.delivery-detail__aside {
  display:flex;
  flex-direction:column;
  gap:var(--space-4);
}

.delivery-detail__proof-section {
  padding-top:var(--space-4);
  border-top:1px solid var(--color-gray-100);
  display:flex;
  flex-direction:column;
  gap:var(--space-3);
}

/* Section titles */
.chauffeur-livraison-detail .order-section-title {
  font-size:var(--text-sm);
  font-weight:var(--font-semibold);
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--color-gray-600);
  margin:0;
}

/* Baggage items list */
.chauffeur-livraison-detail .baggage-items-list {
  list-style:none;
  padding:0;
  margin:var(--space-1) 0 0;
  display:flex;
  flex-direction:column;
  gap:var(--space-2);
}

.chauffeur-livraison-detail .baggage-items-list li {
  padding:var(--space-3) var(--space-4);
  border:1px solid var(--color-gray-200);
  border-radius:var(--radius-sm);
  background:var(--color-white);
  font-size:var(--text-sm);
  font-weight:var(--font-medium);
}

/* Signature pad */
.chauffeur-livraison-detail .signature-pad {
  min-height:160px;
  border:1.5px dashed var(--color-gray-300);
  border-radius:var(--radius-md);
  background:var(--color-gray-50);
}

/* Buttons in form */
.chauffeur-livraison-detail #submit-proof-btn {
  box-shadow:0 10px 24px rgba(17,17,17,.1);
}

@media (min-width:768px) {
  .delivery-detail__hero {
    margin:var(--space-6);
    padding:var(--space-8);
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:var(--space-6);
  }

  .chauffeur-livraison-detail .page-content {
    padding:0 var(--space-6) var(--space-12);
  }

  .delivery-detail__hero-actions {
    margin-top:0;
    min-width:14rem;
  }

  .delivery-detail__code-row {
    max-width:36rem;
  }

  .delivery-detail__form-actions {
    flex-direction:row;
    justify-content:flex-end;
  }

  .delivery-detail__form-actions .btn {
    width:auto;
  }
}

@media (min-width:1024px) {
  .delivery-detail__aside {
    position:sticky;
    top:var(--space-4);
  }
}

@media (max-width:767px) {
  .delivery-detail__hero {
    margin:var(--space-3);
    padding:var(--space-5);
  }

  .delivery-detail__title {
    font-size:var(--text-2xl);
  }

  .delivery-detail__hero-actions {
    align-items:stretch;
  }

  .delivery-detail__code-row {
    flex-direction:column;
  }
}

/* ── Mission summary (chauffeur detail + livraisons) ─────────── */
.mission-summary__header {
  display:flex;
  flex-direction:column;
  gap:.375rem;
  padding-bottom:.75rem;
  border-bottom:1px solid var(--color-gray-100);
  margin-bottom:.25rem;
}

.mission-summary__ref {
  font-size:1rem;
  font-weight:700;
  color:var(--color-gray-800);
}

.mission-summary__badges {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.375rem;
}

.mission-summary__service {
  font-size:.8125rem;
  color:var(--color-gray-600);
  font-weight:500;
}

.mission-meta {
  margin-top:.25rem;
}

/* Address block */
.mission-address {
  padding:.75rem 1rem;
  border:1px solid var(--color-gray-200);
  border-radius:var(--radius-md);
  background:var(--color-gray-50);
  display:flex;
  flex-direction:column;
  gap:.375rem;
}

.mission-address__label {
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--color-gray-600);
}

.mission-address__lines {
  display:flex;
  flex-direction:column;
  gap:.125rem;
  font-size:.9375rem;
  line-height:1.45;
}

.mission-address__name {
  font-weight:600;
  color:var(--color-gray-800);
}

.mission-address__contact {
  color:var(--color-gray-600);
  font-size:.875rem;
}

.mission-address__phone {
  font-size:.875rem;
  color:var(--color-gray-600);
  font-weight:500;
}

.mission-address__instructions {
  font-size:.8125rem;
  color:var(--color-orange-dark);
  font-style:italic;
  padding:.375rem .5rem;
  background:var(--color-orange-light);
  border-radius:var(--radius-sm);
}

.mission-address__actions {
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
  margin-top:.25rem;
}

/* Code notice in secure parcel section */
.delivery-detail__code-notice {
  font-size:.875rem;
  font-weight:600;
  color:#92400e;
  background:#fef3c7;
  border:1px solid #fcd34d;
  border-radius:var(--radius-sm);
  padding:.625rem .875rem;
}

/* Note below submit button when code required */
.delivery-detail__code-note {
  font-size:.875rem;
  color:var(--color-orange-dark);
  font-weight:500;
  text-align:center;
  margin:0;
}

/* ── Phase 5 — Structured addresses ─────────────────────────── */
.radio-group { display:flex; flex-direction:column; gap:.5rem; }
.radio-option { display:flex; align-items:center; gap:.5rem; cursor:pointer; font-size:var(--text-sm); }
.pickup-address-readonly {
  font-style:normal;
  background:var(--color-gray-50);
  border:1px solid var(--color-gray-200);
  border-radius:var(--radius-sm);
  padding:var(--space-3);
  color:var(--color-gray-700);
  font-size:var(--text-sm);
  line-height:1.6;
  white-space:pre-line;
}
.pickup-no-address-alert { margin-bottom:var(--space-3); }

/* ── Inscription publique ────────────────────────────────── */
.inscription-shell                { align-items:flex-start; }
.inscription-box                  { max-width:560px; }
.inscription-type-field           { border:none; padding:0; }
.inscription-type-field legend    { font-size:.875rem; font-weight:500; color:var(--color-gray-800); margin-bottom:.5rem; }
.inscription-radio-group          { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:.25rem; }
.inscription-radio                { display:inline-flex; align-items:center; gap:.4rem; cursor:pointer; font-size:.9rem; }
.inscription-radio input[type="radio"] { accent-color:var(--color-orange); }
.inscription-submit               { width:100%; margin-top:.5rem; }

/* ── Admin — page inscriptions ───────────────────────────── */
.inscription-filters              { display:flex; flex-wrap:wrap; gap:.5rem; }
.inscription-filter-btn           { background:var(--color-gray-100); color:var(--color-gray-600); border:1px solid var(--color-gray-200); }
.inscription-filter-btn:hover     { background:var(--color-gray-200); }
.inscription-filter-btn--active   { background:var(--color-orange); color:#fff; border-color:var(--color-orange); }
.inscription-filter-count         { font-size:.75rem; }

.inscription-card                 { padding:1.25rem; margin-bottom:1rem; }
.inscription-card__header         { display:flex; justify-content:space-between; align-items:flex-start; gap:.75rem; margin-bottom:.75rem; }
.inscription-card__name           { font-weight:600; font-size:1rem; }
.inscription-card__company        { color:var(--color-gray-600); font-size:.9rem; }
.inscription-card__details        { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:.35rem .75rem; font-size:.85rem; margin-bottom:.75rem; }
.inscription-card__details dt     { color:var(--color-gray-400); font-size:.75rem; text-transform:uppercase; letter-spacing:.04em; }
.inscription-card__details dd     { color:var(--color-gray-800); }
.inscription-card__message        { font-style:italic; color:var(--color-gray-600); font-size:.875rem; border-left:3px solid var(--color-gray-200); padding-left:.75rem; margin:.75rem 0; }
.inscription-card__note           { font-size:.8rem; color:var(--color-gray-400); margin:.5rem 0; }
.inscription-card__client-link    { font-size:.8rem; color:var(--color-orange); }
.inscription-card__actions        { display:flex; gap:.75rem; margin-top:1rem; flex-wrap:wrap; }

.inscription-modal-email          { font-weight:600; color:var(--color-orange); margin:.5rem 0; word-break:break-all; }

.btn-danger                       { background:var(--color-error); color:#fff; border:none; }
.btn-danger:hover                 { background:#b91c1c; }
.btn-danger-outline               { background:transparent; color:var(--color-error); border:1px solid var(--color-error); }
.btn-danger-outline:hover         { background:var(--color-error-bg); }

/* ── Page client — Mes informations ─────────────────── */
.client-profil__hero        { /* réutilise .page-header */ }
.client-profil__eyebrow     { font-size:.75rem; font-weight:600; text-transform:uppercase;
                              letter-spacing:.08em; color:var(--color-orange); margin-bottom:.35rem; }
.client-profil__title       { /* hérite .page-title */ }
.client-profil__subtitle    { /* hérite .page-subtitle */ }

.client-profil-card         { padding:1.5rem; margin-bottom:1.5rem; }
.client-profil-card .card-header { margin-bottom:1.25rem; }

.client-profil__actions     { display:flex; gap:1rem; margin-top:.5rem; padding-bottom:2rem; }