/* ============================================================================
 * Confort Sales — Back-Office : DESIGN « APPLE » (épure cupertino).
 * Blanc + gris #f5f5f7, encre #1d1d1f, un seul bleu #0071e3, boutons pilule,
 * typo SF Pro (système) → Inter en repli, ombres très douces, beaucoup d'air.
 * Chargé EN PLUS de Tailwind : surcharge les utilitaires employés par les vues,
 * donc AUCUNE vue n'est réécrite (sans régression).
 * ========================================================================== */

:root{
  --bg:#ffffff;
  --bg-2:#f5f5f7;     /* gris signature Apple                         */
  --ink:#1d1d1f;      /* texte quasi-noir                             */
  --muted:#6e6e73;    /* texte secondaire                             */
  --line:#d2d2d7;     /* séparateurs très clairs                      */
  --accent:#0071e3;   /* bleu Apple (liens / actions)                 */
  --accent-h:#0077ed;
  --radius:18px;
  --shadow:0 4px 24px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-sm:0 1px 3px rgba(0,0,0,.08);
}

/* --- Typo : SF Pro via le stack système, Inter en repli web --- */
body{font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','SF Pro Text','Inter','Segoe UI',sans-serif;
  color:var(--ink);-webkit-font-smoothing:antialiased;letter-spacing:-.01em;}
h1,h2,h3{font-weight:600;letter-spacing:-.022em;}
h1{font-weight:700;}

/* Fond gris Apple : les cartes blanches y respirent */
.bo-bg{background:var(--bg-2);}

/* ============================================================================
 * SURCHARGE DES UTILITAIRES TAILWIND (le look, sans toucher aux vues)
 * ========================================================================== */
.bg-white{background-color:#fff!important;}
.bg-slate-50{background-color:var(--bg-2)!important;}
.bg-slate-100{background-color:#e8e8ed!important;}
.border-slate-100,.border-slate-200,.border-slate-300{border-color:var(--line)!important;}

/* Ombres : très douces, jamais marquées */
.shadow,.shadow-sm,.shadow-md{box-shadow:var(--shadow-sm)!important;}
.shadow-lg,.shadow-xl,.shadow-card{box-shadow:var(--shadow)!important;}
.bg-white.border{box-shadow:var(--shadow)!important;border-color:transparent!important;}

/* Coins arrondis généreux (esprit iOS) sur les cartes */
.rounded-xl{border-radius:14px!important;}
.rounded-2xl,.rounded-3xl{border-radius:18px!important;}

/* Textes : encre Apple plutôt que slate */
.text-slate-900,.text-slate-800{color:var(--ink)!important;}
.text-slate-700{color:#424245!important;}
.text-slate-600,.text-slate-500{color:var(--muted)!important;}
.text-slate-400{color:#86868b!important;}

/* Recolore les accents violets/confort hérités → bleu Apple */
.text-confort-800,.text-confort-700,.text-confort-600,
.text-violet-700,.text-violet-600,.text-violet-800{color:var(--accent)!important;}
.bg-confort-50,.bg-violet-50{background-color:#e8f1fd!important;}
.bg-confort-100{background-color:#d3e6fb!important;}
.border-confort-100,.border-confort-200{border-color:#cfe2fb!important;}

/* ============================================================================
 * COMPOSANTS RÉUTILISABLES (.bo-*)
 * ========================================================================== */
.bo-card{background:#fff;border:none;border-radius:var(--radius);box-shadow:var(--shadow);}
.bo-stat{padding:1.1rem 1.25rem;}
.bo-stat .l{font-size:.78rem;color:var(--muted);font-weight:500;}
.bo-stat .v{font-size:1.85rem;font-weight:600;line-height:1.05;letter-spacing:-.022em;margin-top:.2rem;color:var(--ink);}

/* Boutons : PILULE, bleu plein ou gris doux (esprit Apple) */
.bo-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.7rem;
  padding:0 1.25rem;border-radius:980px;font-weight:500;font-size:.9rem;border:1px solid transparent;
  transition:.18s ease;cursor:pointer;}
.bo-btn-primary{background:var(--accent);color:#fff;}
.bo-btn-primary:hover{background:var(--accent-h);}
.bo-btn-ghost{background:#e8e8ed;color:var(--ink);}
.bo-btn-ghost:hover{background:#dedee3;}
.bo-btn-danger{background:#fff;border-color:#e5b3b0;color:#d70015;}
.bo-btn-danger:hover{background:#fdf0ef;}
.bo-btn:disabled{opacity:.4;cursor:not-allowed;}

.bo-badge{display:inline-flex;align-items:center;gap:.3rem;padding:.14rem .62rem;border-radius:980px;
  font-size:.74rem;font-weight:500;}
.bo-badge-ok{background:#e3f6ea;color:#1a7f37;}
.bo-badge-warn{background:#fdf0db;color:#9a6700;}
.bo-badge-bad{background:#fdeceb;color:#d70015;}
.bo-badge-info{background:#e8f1fd;color:#0071e3;}

.bo-input{width:100%;min-height:2.85rem;padding:.6rem .9rem;border:1px solid var(--line);
  border-radius:12px;background:#fff;font-size:.95rem;color:var(--ink);}
.bo-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(0,113,227,.18);}

/* Focus visible accessible */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:none;box-shadow:0 0 0 4px rgba(0,113,227,.4);border-radius:8px;}

/* Scrollbar fine et discrète */
*::-webkit-scrollbar{width:9px;height:9px;}
*::-webkit-scrollbar-thumb{background:#c7c7cc;border-radius:999px;border:2px solid transparent;background-clip:content-box;}

/* Barre d'action mobile : verre dépoli Apple */
.bo-actionbar{position:fixed;left:0;right:0;bottom:0;z-index:30;
  padding:.65rem .9rem calc(.65rem + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.8);backdrop-filter:saturate(180%) blur(20px);border-top:1px solid var(--line);}

/* ============================================================================
 * DARK MODE (html.dark) — noir Apple, accents bleus éclaircis.
 * ========================================================================== */
html.dark{--bg:#000;--bg-2:#000;--ink:#f5f5f7;--muted:#86868b;--line:#424245;--accent:#2997ff;--accent-h:#3aa0ff;}
html.dark body{color:#f5f5f7;}
html.dark .bo-bg{background:#000;}

html.dark .bg-white{background-color:#1d1d1f!important;}
html.dark .bg-slate-50{background-color:#000!important;}
html.dark .bg-slate-100{background-color:#2c2c2e!important;}
html.dark .bo-card{background:#1d1d1f;box-shadow:0 4px 24px rgba(0,0,0,.5);}
html.dark .bg-white.border{background-color:#1d1d1f!important;}
html.dark .bo-btn-ghost{background:#2c2c2e;color:#f5f5f7;}
html.dark .bo-btn-ghost:hover{background:#3a3a3c;}
html.dark .bo-input{background:#1d1d1f;border-color:#424245;color:#f5f5f7;}
html.dark .bo-actionbar{background:rgba(29,29,31,.8);border-top-color:#424245;}

html.dark .text-slate-900,html.dark .text-slate-800{color:#f5f5f7!important;}
html.dark .text-slate-700{color:#d2d2d7!important;}
html.dark .text-slate-600,html.dark .text-slate-500{color:#86868b!important;}
html.dark .border-slate-100,html.dark .border-slate-200,html.dark .border-slate-300{border-color:#424245!important;}
html.dark .divide-slate-100>:not([hidden])~:not([hidden]){border-color:#424245!important;}
html.dark .bg-confort-50,html.dark .bg-violet-50{background-color:rgba(41,151,255,.16)!important;}

/* États sémantiques (succès/avertissement/erreur) : fonds pastels remappés en
   teintes translucides + textes éclaircis pour rester lisibles sur fond noir. */
html.dark .bg-emerald-50,html.dark .bg-emerald-100{background-color:rgba(48,209,88,.16)!important;}
html.dark .bg-amber-50,html.dark .bg-amber-100{background-color:rgba(255,159,10,.16)!important;}
html.dark .bg-rose-50,html.dark .bg-rose-100{background-color:rgba(255,69,58,.16)!important;}
html.dark .text-emerald-700,html.dark .text-emerald-800{color:#5fe08a!important;}
html.dark .text-amber-700,html.dark .text-amber-800{color:#ffd60a!important;}
html.dark .text-rose-600,html.dark .text-rose-700,html.dark .text-rose-800{color:#ff8a80!important;}
html.dark .border-amber-300{border-color:rgba(255,159,10,.4)!important;}
html.dark .border-emerald-200{border-color:rgba(48,209,88,.4)!important;}
html.dark .border-rose-200{border-color:rgba(255,69,58,.4)!important;}

[x-cloak]{display:none!important;}