/* ============================================================================
   BlueCresta — couche de design (interface SaaS B2B)
   Réf. charte graphique BlueCresta v1.0, août 2026.
   Les design tokens (couleurs, rayons, ombres) sont définis dans app.css :
   cette couche ajoute la typographie Poppins, l'écran de connexion, la
   navigation catégorisée, la sémantique de couleur et les micro-interactions.
   Chargée après app.css : elle prime sur l'ancien thème en cas de conflit.
   ========================================================================== */

/* --- Typographie officielle : Poppins (auto-hébergée, hors ligne / PWA) --- */
@font-face{font-family:Poppins;font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/poppins-400.woff2") format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/poppins-500.woff2") format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/poppins-600.woff2") format("woff2")}
@font-face{font-family:Poppins;font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/poppins-700.woff2") format("woff2")}

body{font-family:Poppins,Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:-.006em}
h1,h2,h3,.page-head h1,.metric strong,.stat-highlight strong,.super-metric strong{font-weight:700}
.panel-title h2,.knowledge-card h3,.report-card h3{font-weight:600}
.primary-button,.secondary-button,.danger-button,.ghost-button{font-size:12px;font-weight:600;letter-spacing:0}
.sidebar nav button{font-weight:500}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Icônes SVG cohérentes : héritent de la couleur du texte, trait fin. */
svg.bc-ic{width:1em;height:1em;display:inline-block;vertical-align:-.12em;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}

/* ============================ ÉCRAN DE CONNEXION ========================== */
.login-screen{background:radial-gradient(1100px 620px at 78% -8%,#12244a 0%,rgba(9,14,26,0) 60%),radial-gradient(900px 520px at 0% 108%,#0f1c37 0%,rgba(9,14,26,0) 55%),#090E1A;color:#E6ECF5;padding:34px clamp(22px,5vw,72px)}
.login-screen::before{opacity:.16}
.login-brand{align-items:center;gap:12px}
.login-brand img{height:38px;width:auto}
.login-card{background:#0F1B2E;border:1px solid #22314C;border-radius:16px;box-shadow:0 40px 120px rgba(0,0,0,.5);padding:36px}
.login-card .eyebrow{color:#5C93F3}
.login-card h1{font-size:30px;font-weight:700;letter-spacing:-.03em;margin:8px 0 8px;color:#F8FAFC}
.login-card>p{color:#93A2B8;line-height:1.6}
.login-card label span,.field>span{color:#AEBACB;font-weight:500;letter-spacing:.01em;text-transform:none;font-size:11px}
.login-card input{height:46px;background:#0A1422;border:1px solid #2A3B57;border-radius:9px;color:#F8FAFC}
.login-card input::placeholder{color:#586A85}
.login-card input:focus{border-color:#3B82F6;box-shadow:0 0 0 3px rgba(59,130,246,.22)}
.login-card .primary-button,.login-card .primary-button.full{background:#2563EB;border-color:#2563EB;color:#fff;border-radius:9px;min-height:46px;font-size:13px}
.login-card .primary-button:hover{background:#1D4ED8;border-color:#1D4ED8}
.login-security{border-top:1px solid #22314C;color:#7D8DA5}
.login-security .status-dot{background:#22C55E;box-shadow:0 0 0 3px rgba(34,197,94,.16)}
.form-error{background:#3A1D22;color:#FCA5A5!important;border-left:3px solid #DC2626;border-radius:6px}
.login-screen>footer{color:#5E708A}
.login-screen>footer strong{color:#8FA3C2}

/* ================================ SIDEBAR ================================= */
.sidebar{gap:0}
.brand{flex-direction:column;align-items:flex-start;justify-content:center;gap:3px}
.brand .brand-lockup{height:24px;width:auto;max-width:158px;object-fit:contain;object-position:left center}
.brand .brand-symbol{display:none;height:30px;width:auto}
#brand-org{font-size:10.5px;font-weight:500;color:color-mix(in srgb,var(--sidebar-text) 52%,transparent)}
.sidebar nav{gap:2px;padding-top:10px}
.nav-section{margin:15px 11px 6px;font-size:9.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:color-mix(in srgb,var(--sidebar-text) 36%,transparent)}
.nav-section:first-child{margin-top:2px}
.sidebar nav button{gap:11px;transition:background .14s ease,color .14s ease}
.sidebar nav button .nav-glyph{width:20px;height:20px;display:grid;place-items:center;font-size:0;color:color-mix(in srgb,var(--sidebar-text) 74%,transparent)}
.sidebar nav button .nav-glyph svg{width:18px;height:18px;stroke-width:1.8}
.sidebar nav button:hover{background:color-mix(in srgb,var(--sidebar-text) 8%,transparent);color:var(--sidebar-text)}
.sidebar nav button:hover .nav-glyph{color:var(--sidebar-text)}
.sidebar nav button.active{background:color-mix(in srgb,var(--accent) 20%,transparent);color:#fff;box-shadow:inset 3px 0 var(--accent)}
.sidebar nav button.active .nav-glyph{color:#fff}
.sidebar nav b{margin-left:auto;min-width:19px;height:18px;padding:0 5px;font-size:9.5px;font-weight:600;color:var(--sidebar-text);background:color-mix(in srgb,var(--sidebar-text) 14%,transparent)}
.sidebar nav button.active b{background:rgba(255,255,255,.22)}
.sidebar-footer .status-dot{background:#22C55E}

/* ================================= TOPBAR ================================ */
.topbar{gap:14px}
.org-context{display:flex;align-items:center;gap:9px;height:38px;padding:0 12px 0 9px;border:1px solid var(--line);background:var(--surface-2);border-radius:9px;cursor:pointer;color:var(--text);transition:border-color .15s,background .15s}
.org-context:hover{border-color:var(--line-strong);background:var(--surface-3)}
.org-context img{width:22px;height:22px;object-fit:contain;flex:0 0 auto}
.org-context .oc-copy{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.org-context .oc-plat{font-size:8.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.org-context .oc-org{font-size:11px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}
.org-context .bc-ic{color:var(--faint);font-size:13px}
.global-search span{display:grid;place-items:center;color:var(--faint)}
.global-search .bc-ic{font-size:15px}
.icon-button{transition:background .15s,border-color .15s,color .15s}
.icon-button:hover{border-color:var(--line-strong);background:var(--surface-2);color:var(--text)}
.icon-button .bc-ic{font-size:17px}
.online-pill i{background:var(--success)}
.account-button{border-radius:9px;padding:3px 8px 3px 6px;transition:background .15s}
.account-button:hover{background:var(--surface-2)}
.account-button>span{background:var(--accent-soft);color:var(--accent);font-weight:700}

/* ======================= FOREGROUND SUR L'ACCENT ========================= */
/* L'accent bleu impose un texte blanc là où l'ancien thème teal posait du
   texte sombre. */
.primary-button{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.primary-button:hover{filter:brightness(.93)}
.check-button:hover,.check-button.checked{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.mini-calendar .today{background:var(--accent);color:var(--on-accent)}
.annual-checklist label>input:checked+span,.pdf-check input:checked+span{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.pdf-sheet-section>h3 i{background:var(--accent);color:var(--on-accent)}
.quick-success>span,.device-icon,.vault-icon,.empty-state>span{background:var(--accent-soft);color:var(--accent)}

/* ================== SÉMANTIQUE FONCTIONNELLE DES COULEURS ================= */
/* Succès (vert) : résolu, clôturé, terminé, signé, actif, service UP. */
.status.resolved,.status.closed,.status.completed,.status.signed,.status.active,.status.up{background:var(--success-soft);color:var(--success)}
.status-dot{background:var(--success)}
.status-dot.warning{background:var(--warning)}
.status-dot.offline{background:var(--red)}
.super-metric.good{border-left-color:var(--success)}
.health-card.up{border-top-color:var(--success)}
.health-card.up header i{background:var(--success)}
.backup-check>span{background:var(--success-soft);color:var(--success)}
.movement-delta.positive{background:var(--success-soft);color:var(--success)}
.checklist-card{border-left-color:var(--accent)}
.status.escalated,.status.urgent{background:var(--red-soft);color:var(--red)}
.priority.high,.priority.urgent{background:var(--brand-accent-soft);color:var(--brand-accent)}

/* Bouton flottant mobile : unique touche orange de marque. */
.mobile-create>span{background:var(--brand-accent);color:#fff;border-color:var(--surface);box-shadow:0 6px 18px color-mix(in srgb,var(--brand-accent) 34%,transparent)}
.mobile-nav button.active{color:var(--accent)}

/* ============================ TABLES & SURFACES ========================== */
.data-table th{font-weight:700;color:var(--muted);letter-spacing:.06em}
.data-table tbody tr{transition:background .12s}
.data-table tbody tr:hover{background:var(--accent-soft)}
.panel,.metric,.tool-card,.timeline-day,.knowledge-card{transition:border-color .15s ease,box-shadow .15s ease}
.tool-card:hover,.cockpit-action:hover{border-color:var(--accent)}
.metric-icon{background:var(--accent-soft);color:var(--accent)}
.metric.blue .metric-icon{background:var(--blue-soft);color:var(--blue)}
.metric.amber .metric-icon{background:var(--amber-soft);color:var(--amber)}
.metric.violet .metric-icon{background:var(--brand-accent-soft);color:var(--brand-accent)}
.metric-icon .bc-ic{font-size:18px}
.shortcut>span .bc-ic,.tool-card>span .bc-ic,.cockpit-action>span .bc-ic{font-size:16px}

/* =============================== BOUTONS ================================= */
.secondary-button{transition:background .15s,border-color .15s}
.secondary-button:hover{border-color:var(--line-strong);background:var(--surface-2)}
.ghost-button:hover{background:var(--surface-2);color:var(--text)}
.segmented button.active{color:var(--accent)}
.text-action,.panel-title button{color:var(--accent);font-weight:600}

/* ========================== ÉTATS / TOASTS ============================== */
.empty-state>span{border-radius:14px}
.toast{background:var(--surface);color:var(--text);border:1px solid var(--line);border-left:3px solid var(--accent);box-shadow:0 16px 44px rgba(15,23,42,.18)}
html[data-theme="dark"] .toast{box-shadow:0 16px 44px rgba(0,0,0,.4)}
.toast.error{border-left-color:var(--red)}
.toast.warning{border-left-color:var(--warning)}
.toast.success{border-left-color:var(--success)}
.modal-backdrop{background:rgba(9,14,26,.62)}

/* ======================= RESPONSIVE (contexte org) ====================== */
@media(max-width:1020px){
  .brand{align-items:center}
  .brand .brand-lockup{display:none}
  .brand .brand-symbol{display:block}
  .nav-section{text-align:center;font-size:8px;letter-spacing:.06em;margin-inline:0}
  .sidebar nav button .nav-glyph{width:22px;height:22px}
}
@media(max-width:1180px){.org-context .oc-org{max-width:120px}}
@media(max-width:920px){.org-context{display:none}}
@media(max-width:700px){
  .login-card{padding:26px 22px}
  .login-card h1{font-size:27px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Tailles d'icônes SVG dans les listes et raccourcis. */
.compact-icon .bc-ic{font-size:15px}
.procedure-row>span .bc-ic{font-size:15px}
.tool-card>i,.shortcut small{font-style:normal}

/* ============================================================================
   BlueCresta v5 — SYSTÈME DE COMPOSANTS (refonte structurelle de l'interface)
   Identité bleu + navy + orange. Composants dédiés au contenu : plus de .panel
   générique pour tout. Chargé après le reste : prime en cas de conflit.
   ========================================================================== */

/* Bleus clairs demandés par la charte + navy pour les zones héros/headers. */
:root{
  --bc-blue:#2563EB;--bc-blue-deep:#1D4ED8;--bc-blue-700:#1E40AF;
  --bc-blue-050:#EFF6FF;--bc-blue-100:#DBEAFE;--bc-blue-200:#BFDBFE;--bc-blue-300:#93C5FD;
  --bc-navy:#0B1B3A;--bc-navy-2:#0E2350;
  --bc-orange:#F97316;--bc-orange-050:#FFF2E6;
  --bc-hero-from:#0B1B3A;--bc-hero-mid:#123A8C;--bc-hero-to:#1D4ED8;
  --bc-head-from:#1D4ED8;--bc-head-to:#2563EB;
  --bc-head-ink:#EAF1FF;--bc-head-ink-soft:#B8CCF4;
  --bc-tint:#EFF6FF;--bc-tint-line:#DBEAFE;
  --bc-on-tint:#1D4ED8;
}
html[data-theme="dark"]{
  --bc-blue-050:#16233B;--bc-blue-100:#1B2E4E;--bc-blue-200:#24406B;--bc-blue-300:#2E4F82;
  --bc-hero-from:#0A1326;--bc-hero-mid:#122a5e;--bc-hero-to:#1B3A83;
  --bc-head-from:#14284f;--bc-head-to:#0F1E3B;
  --bc-head-ink:#EAF1FF;--bc-head-ink-soft:#93A9D6;
  --bc-tint:#14233D;--bc-tint-line:#24406B;--bc-on-tint:#93C5FD;
}

/* ============================ HEADER DE PAGE ============================= */
/* Bandeau bleu présent sur TOUTES les pages via les helpers head()/pageHead(). */
.bc-page-header{position:relative;overflow:hidden;margin-bottom:22px;padding:24px 26px;border-radius:16px;
  background:linear-gradient(120deg,var(--bc-head-from),var(--bc-head-to));
  color:var(--bc-head-ink);display:flex;align-items:flex-end;gap:22px;flex-wrap:wrap;
  box-shadow:0 14px 34px color-mix(in srgb,var(--bc-blue) 22%,transparent)}
html[data-theme="dark"] .bc-page-header{border:1px solid #223a63}
.bc-page-header::before{content:"";position:absolute;inset:0;background:
  radial-gradient(520px 220px at 100% -40%,rgba(249,115,22,.22),transparent 70%),
  radial-gradient(560px 260px at -6% 130%,rgba(255,255,255,.14),transparent 62%);pointer-events:none}
.bc-page-header::after{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--bc-orange)}
.bc-page-header__main{position:relative;flex:1 1 340px;min-width:0}
.bc-page-header .bc-kicker{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:#fff}
.bc-page-header .bc-kicker::before{content:"";width:16px;height:3px;border-radius:2px;background:var(--bc-orange)}
.bc-page-header h1{margin:10px 0 6px;font-size:27px;line-height:1.1;font-weight:700;letter-spacing:-.02em;color:#fff}
.bc-page-header p{margin:0;max-width:70ch;color:var(--bc-head-ink);opacity:.9;line-height:1.55;font-size:13px}
.bc-page-header__aside{position:relative;display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.bc-page-header__aside .primary-button{background:#fff;border-color:#fff;color:var(--bc-blue-deep)}
.bc-page-header__aside .primary-button:hover{background:var(--bc-blue-050);border-color:var(--bc-blue-050);filter:none}
.bc-page-header__aside .secondary-button{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.34);color:#fff}
.bc-page-header__aside .secondary-button:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.5)}
.bc-page-header__aside .head-actions{display:flex;gap:9px;flex-wrap:wrap}
/* Bandeau de statistiques intégré au header (Rapports, Stock, Tâches…). */
.bc-page-header__stats{position:relative;display:flex;gap:10px;flex-wrap:wrap;width:100%;margin-top:4px}
.bc-hstat{display:flex;flex-direction:column;gap:2px;padding:9px 15px;border-radius:11px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);min-width:92px}
.bc-hstat strong{font-size:20px;font-weight:700;color:#fff;line-height:1}
.bc-hstat span{font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--bc-head-ink);opacity:.85}
.bc-hstat.is-accent{background:rgba(249,115,22,.22);border-color:rgba(249,115,22,.42)}

/* ============================= HÉRO ACCUEIL ============================= */
.bc-hero{position:relative;overflow:hidden;border-radius:20px;padding:30px 32px;margin-bottom:22px;
  background:linear-gradient(125deg,var(--bc-hero-from) 0%,var(--bc-hero-mid) 52%,var(--bc-hero-to) 100%);
  color:#fff;box-shadow:0 22px 50px color-mix(in srgb,var(--bc-navy) 40%,transparent)}
.bc-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(640px 300px at 108% -30%,rgba(249,115,22,.30),transparent 66%),
  radial-gradient(520px 320px at -8% 128%,rgba(96,165,250,.28),transparent 60%)}
.bc-hero::after{content:"";position:absolute;right:-90px;top:-90px;width:280px;height:280px;border-radius:32px;
  border:2px solid rgba(255,255,255,.12);transform:rotate(24deg);pointer-events:none}
.bc-hero__row{position:relative;display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap}
.bc-hero__copy{flex:1 1 360px;min-width:0}
.bc-hero .bc-kicker{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.bc-hero .bc-kicker::before{content:"";width:20px;height:3px;border-radius:2px;background:var(--bc-orange)}
.bc-hero h1{margin:13px 0 8px;font-size:31px;line-height:1.08;font-weight:700;letter-spacing:-.025em;color:#fff}
.bc-hero h1 b{color:var(--bc-blue-200);font-weight:700}
.bc-hero p{margin:0;max-width:60ch;color:#D6E2FB;line-height:1.55;font-size:14px}
.bc-hero__actions{position:relative;display:flex;gap:11px;flex-wrap:wrap;margin-top:20px}
.bc-hero__actions button{display:inline-flex;align-items:center;gap:9px;height:42px;padding:0 17px;border-radius:11px;
  font-size:13px;font-weight:600;cursor:pointer;border:1px solid transparent;transition:transform .12s,background .15s,border-color .15s}
.bc-hero__actions button .bc-ic{font-size:17px}
.bc-hero__actions button:hover{transform:translateY(-1px)}
.bc-hero__actions .is-primary{background:#fff;color:var(--bc-blue-deep)}
.bc-hero__actions .is-primary:hover{background:var(--bc-blue-050)}
.bc-hero__actions .is-accent{background:var(--bc-orange);color:#fff;box-shadow:0 8px 20px rgba(249,115,22,.4)}
.bc-hero__actions .is-accent:hover{background:#EA6A0C}
.bc-hero__actions .is-ghost{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28);color:#fff}
.bc-hero__actions .is-ghost:hover{background:rgba(255,255,255,.18)}
.bc-hero__side{position:relative;display:flex;gap:14px;flex-wrap:wrap}
.bc-hero__pulse{min-width:118px;padding:15px 17px;border-radius:14px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(2px)}
.bc-hero__pulse strong{display:block;font-size:26px;font-weight:700;line-height:1;color:#fff}
.bc-hero__pulse span{display:block;margin-top:5px;font-size:11px;letter-spacing:.03em;color:#C9D8F5}
.bc-hero__pulse.is-accent{background:rgba(249,115,22,.18);border-color:rgba(249,115,22,.4)}
.bc-hero__pulse.is-accent strong{color:#FFD9BC}

/* ============================ CARTES STAT (KPI) ========================= */
/* Refonte de .metric : KPI bleu affirmé, chiffre large, tuile d'icône colorée. */
.metric-grid{gap:16px}
.metric{position:relative;overflow:hidden;padding:18px 18px 17px;border-radius:15px;background:var(--surface);
  border:1px solid var(--line);display:flex;align-items:center;gap:15px;box-shadow:var(--shadow)}
.metric::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--bc-blue)}
.metric .metric-icon{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;flex:0 0 auto;
  background:var(--bc-blue-050);color:var(--bc-blue-deep)}
.metric p{display:flex;flex-direction:column;gap:2px;min-width:0}
.metric strong{font-size:27px;font-weight:700;line-height:1;color:var(--text)}
.metric span{font-size:12px;color:var(--muted);font-weight:500}
.metric.blue::before{background:var(--bc-blue)}
.metric.amber::before{background:var(--warning)}
.metric.amber .metric-icon{background:var(--amber-soft);color:var(--amber)}
.metric.violet::before{background:var(--bc-orange)}
.metric.violet .metric-icon{background:var(--brand-accent-soft);color:var(--brand-accent)}
.metric.is-success::before{background:var(--success)}
.metric.is-success .metric-icon{background:var(--success-soft);color:var(--success)}
.metric:hover{border-color:var(--bc-blue-200);box-shadow:0 10px 26px color-mix(in srgb,var(--bc-blue) 14%,transparent)}

/* ============================ SECTION BLOC ============================= */
/* En-tête de section à accent bleu, pour remplacer visuellement les .panel-title nus. */
.panel{border-radius:15px}
.panel>.panel-title,.panel .panel-title{align-items:flex-start}
.panel-title{position:relative;padding-left:13px}
.panel-title::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:3px;border-radius:2px;
  background:linear-gradient(var(--bc-blue),var(--bc-blue-deep))}
.panel-title .eyebrow{color:var(--bc-blue-deep)}
html[data-theme="dark"] .panel-title .eyebrow{color:var(--bc-blue-300)}

/* ======================= BARRE DE COMMANDE / FILTRES ==================== */
.toolbar{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px;gap:12px;box-shadow:var(--shadow)}
.filter-input,.filter-select{border-radius:10px;border:1px solid var(--line-strong);background:var(--surface)}
.filter-input:focus,.filter-select:focus{border-color:var(--bc-blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--bc-blue) 20%,transparent);outline:none}
.filter-input[type=search]{padding-left:12px}
.segmented{background:var(--bc-blue-050);border:1px solid var(--bc-tint-line);border-radius:11px;padding:3px}
.segmented button{border-radius:8px;font-weight:600;color:var(--muted)}
.segmented button.active{background:var(--bc-blue);color:#fff;box-shadow:0 2px 6px color-mix(in srgb,var(--bc-blue) 40%,transparent)}

/* ============================= TABLES ================================= */
.table-panel{border-radius:15px;overflow:hidden}
.data-table thead{background:var(--bc-blue-050)}
.data-table th{color:var(--bc-on-tint);font-weight:700;letter-spacing:.05em;border-bottom:1px solid var(--bc-tint-line)}
html[data-theme="dark"] .data-table thead{background:#14233D}
.data-table tbody tr{transition:background .12s,box-shadow .12s}
.data-table tbody tr:hover{background:var(--bc-blue-050)}
.table-number{color:var(--bc-blue-deep);font-weight:700}
html[data-theme="dark"] .table-number{color:var(--bc-blue-300)}

/* ============================== STATUTS ================================ */
.status{font-weight:600;border-radius:999px}
.status.waiting,.status.follow_up,.status.pending,.status.in_progress,.status.monitoring{background:var(--bc-blue-050);color:var(--bc-on-tint)}
.priority.normal{background:var(--bc-blue-050);color:var(--bc-on-tint)}
.priority.high,.priority.urgent{background:var(--brand-accent-soft);color:var(--brand-accent)}

/* =================== ALERTES DASHBOARD (management-alerts) ============= */
.management-alerts{gap:12px}
.management-alert{position:relative;border-radius:14px;border:1px solid var(--line);background:var(--surface);
  padding:14px 15px;display:flex;flex-direction:column;gap:2px;align-items:flex-start;box-shadow:var(--shadow);transition:transform .12s,border-color .15s}
.management-alert::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:4px 0 0 4px;background:var(--bc-blue)}
.management-alert:hover{transform:translateY(-1px);border-color:var(--bc-blue-200)}
.management-alert>span{font-size:15px;color:var(--bc-blue-deep)}
.management-alert strong{font-size:22px;font-weight:700;color:var(--text)}
.management-alert small{color:var(--muted)}
.management-alert.amber::before{background:var(--warning)}
.management-alert.amber>span{color:var(--amber)}
.management-alert.red::before{background:var(--bc-orange)}
.management-alert.red>span{color:var(--bc-orange)}
.management-alert.violet::before{background:var(--bc-orange)}
.management-alert.violet>span{color:var(--bc-orange)}

/* =========================== HÉRO : cockpit actions ==================== */
.bc-quick{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:12px}
.bc-quick .cockpit-action{border-radius:13px;border:1px solid var(--line);background:var(--surface);padding:14px 15px;box-shadow:var(--shadow)}
.bc-quick .cockpit-action:hover{border-color:var(--bc-blue);box-shadow:0 8px 20px color-mix(in srgb,var(--bc-blue) 15%,transparent)}
.bc-quick .cockpit-action>span{background:var(--bc-blue-050);color:var(--bc-blue-deep);border-radius:11px}

/* ========================= ACTIVITÉ / LISTES COMPACTES ================= */
.compact-row{border-radius:12px}
.compact-row:hover{background:var(--bc-blue-050)}
.compact-icon{background:var(--bc-blue-050);color:var(--bc-blue-deep);border-radius:10px}

/* ======================= TÂCHES EN COLONNES (Kanban léger) ============= */
.bc-taskboard{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;align-items:start}
.bc-taskcol{background:var(--surface);border:1px solid var(--line);border-radius:15px;overflow:hidden;box-shadow:var(--shadow)}
.bc-taskcol__head{display:flex;align-items:center;gap:9px;padding:13px 15px;border-bottom:1px solid var(--line);
  background:linear-gradient(var(--bc-blue-050),transparent)}
.bc-taskcol__head i{width:9px;height:9px;border-radius:3px;background:var(--bc-blue);flex:0 0 auto}
.bc-taskcol__head strong{font-size:13px;font-weight:600;flex:1}
.bc-taskcol__head b{min-width:22px;height:20px;padding:0 6px;border-radius:7px;display:grid;place-items:center;
  font-size:11px;font-weight:700;background:var(--bc-blue-050);color:var(--bc-on-tint)}
.bc-taskcol.is-late .bc-taskcol__head i{background:var(--bc-orange)}
.bc-taskcol.is-late .bc-taskcol__head{background:linear-gradient(var(--bc-orange-050),transparent)}
.bc-taskcol.is-late .bc-taskcol__head b{background:var(--brand-accent-soft);color:var(--brand-accent)}
.bc-taskcol.is-done .bc-taskcol__head i{background:var(--success)}
.bc-taskcol__body{padding:11px;display:flex;flex-direction:column;gap:9px;min-height:60px}
.bc-taskcard{position:relative;border:1px solid var(--line);border-radius:12px;padding:12px 12px 12px 14px;background:var(--surface);transition:border-color .14s,box-shadow .14s}
.bc-taskcard::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:3px;background:var(--bc-blue)}
.bc-taskcard.pr-urgent::before,.bc-taskcard.pr-high::before{background:var(--bc-orange)}
.bc-taskcard:hover{border-color:var(--bc-blue-200);box-shadow:0 6px 16px color-mix(in srgb,var(--bc-blue) 12%,transparent)}
.bc-taskcard__top{display:flex;align-items:flex-start;gap:10px}
.bc-taskcard .check-button{margin-top:1px}
.bc-taskcard h4{margin:0;font-size:13px;font-weight:600;line-height:1.3}
.bc-taskcard__ctx{font-size:11.5px;color:var(--muted)}
.bc-taskcard__foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px}
.bc-taskcard__foot time{font-size:11px;color:var(--faint)}
.bc-taskcard.is-done{opacity:.62}
.bc-taskcard.is-done h4{text-decoration:line-through}
.bc-taskcol__empty{padding:16px;text-align:center;font-size:12px;color:var(--faint)}

/* ============================= SUPERVISION ============================ */
.supervision-summary{gap:14px}
.super-metric{position:relative;border-radius:15px;border:1px solid var(--line);background:var(--surface);
  padding:17px 18px;box-shadow:var(--shadow);overflow:hidden}
.super-metric::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--bc-blue)}
.super-metric strong{font-size:28px;font-weight:700}
.super-metric.good::before{background:var(--success)}
.super-metric.warning::before{background:var(--warning)}
.super-metric.bad::before{background:var(--bc-orange)}
.supervision-strip{border-radius:12px;background:var(--bc-blue-050);border:1px solid var(--bc-tint-line);color:var(--bc-on-tint)}
.health-grid{gap:14px}
.health-card{border-radius:14px;border:1px solid var(--line);border-top:3px solid var(--bc-blue);background:var(--surface);box-shadow:var(--shadow)}
.health-card.warning{border-top-color:var(--warning)}
.health-card.down{border-top-color:var(--bc-orange)}
.health-card.down header i{background:var(--bc-orange)}
.health-card header i{background:var(--bc-blue)}

/* ============================ INFRASTRUCTURE =========================== */
.bc-cockpit{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-bottom:20px}
.bc-cockpit__card{position:relative;border-radius:15px;border:1px solid var(--line);background:var(--surface);padding:18px;box-shadow:var(--shadow);overflow:hidden}
.bc-cockpit__card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--bc-blue)}
.bc-cockpit__card .bc-cockpit__ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--bc-blue-050);color:var(--bc-blue-deep);margin-bottom:12px}
.bc-cockpit__card h3{margin:0;font-size:26px;font-weight:700}
.bc-cockpit__card span{font-size:12px;color:var(--muted)}
.bc-cockpit__card small{display:block;margin-top:4px;font-size:11px;color:var(--faint)}
.bc-cockpit__card.is-orange::before{background:var(--bc-orange)}
.bc-cockpit__card.is-orange .bc-cockpit__ic{background:var(--brand-accent-soft);color:var(--brand-accent)}

/* ============================ KNOWLEDGE (doc app) ====================== */
.knowledge-toolbar{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px;box-shadow:var(--shadow)}
.knowledge-card{border-radius:15px;border:1px solid var(--line);box-shadow:var(--shadow);transition:transform .12s,border-color .14s,box-shadow .14s}
.knowledge-card:hover{transform:translateY(-2px);border-color:var(--bc-blue-200);box-shadow:0 12px 26px color-mix(in srgb,var(--bc-blue) 14%,transparent)}
.knowledge-card.pinned{border-color:var(--bc-blue-200)}
.knowledge-card header span:first-child{color:var(--bc-blue-deep);font-weight:600}
.tag-list span{background:var(--bc-blue-050);color:var(--bc-on-tint);border-radius:999px}

/* ============================== OUTILS ================================= */
.tool-card{border-radius:14px}
.tool-card:hover{border-color:var(--bc-blue);box-shadow:0 8px 20px color-mix(in srgb,var(--bc-blue) 14%,transparent)}
.tool-card>span{background:var(--bc-blue-050);color:var(--bc-blue-deep);border-radius:12px}
.tool-card[data-action="quick-stock"]>span,.tool-card[data-action="scan-qr"]>span{background:var(--brand-accent-soft);color:var(--brand-accent)}
.shortcut>span{background:var(--bc-blue-050);color:var(--bc-blue-deep)}

/* ========================= BOUTON ORANGE SIGNATURE ===================== */
/* « Sortie rapide » = action signature orange. */
.primary-button.bc-accent,button.bc-accent{background:var(--bc-orange);border-color:var(--bc-orange);color:#fff}
.primary-button.bc-accent:hover,button.bc-accent:hover{background:#EA6A0C;border-color:#EA6A0C;filter:none}

/* ===================== CONNEXION EN DEUX COLONNES ====================== */
@media(min-width:860px){
  .login-screen.bc-split{display:grid;grid-template-columns:1.05fr .95fr;grid-template-rows:1fr;gap:0;padding:0;align-items:stretch;min-height:100vh}
  .login-screen.bc-split>.login-brand,.login-screen.bc-split>.login-security,.login-screen.bc-split>footer{display:none}
  .login-screen.bc-split .bc-login-aside{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;
    padding:52px 54px;color:#fff;background:linear-gradient(150deg,var(--bc-hero-from),var(--bc-hero-mid) 55%,var(--bc-hero-to))}
  .bc-login-aside::before{content:"";position:absolute;inset:0;pointer-events:none;background:
    radial-gradient(560px 300px at 110% -10%,rgba(249,115,22,.28),transparent 62%),
    radial-gradient(520px 320px at -10% 120%,rgba(96,165,250,.32),transparent 60%)}
  .bc-login-aside::after{content:"";position:absolute;right:-70px;bottom:-70px;width:240px;height:240px;border-radius:30px;border:2px solid rgba(255,255,255,.13);transform:rotate(22deg)}
  .bc-login-aside__brand{position:relative;display:flex;align-items:center;gap:13px}
  .bc-login-aside__brand img{height:40px;width:auto}
  .bc-login-aside__mid{position:relative;max-width:34ch}
  .bc-login-aside__mid .bc-kicker{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
  .bc-login-aside__mid .bc-kicker::before{content:"";width:20px;height:3px;border-radius:2px;background:var(--bc-orange)}
  .bc-login-aside__mid h2{font-size:30px;font-weight:700;letter-spacing:-.02em;line-height:1.12;margin:14px 0 12px}
  .bc-login-aside__mid p{color:#D3E0FA;line-height:1.6;font-size:14px}
  .bc-login-aside__points{position:relative;display:flex;flex-direction:column;gap:11px;margin-top:22px}
  .bc-login-aside__points span{display:flex;align-items:center;gap:11px;font-size:13px;color:#E6EEFC}
  .bc-login-aside__points span i{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.12);color:#fff;font-style:normal}
  .bc-login-aside__foot{position:relative;font-size:12px;color:#9FB4DE}
  .login-screen.bc-split>.login-card{align-self:center;justify-self:center;width:100%;max-width:440px;margin:0;
    background:var(--surface);border:1px solid var(--line);color:var(--text);box-shadow:0 30px 80px rgba(15,23,42,.14)}
  html[data-theme="dark"] .login-screen.bc-split>.login-card{background:#0F1B2E;border-color:#22314C}
  .login-screen.bc-split>.login-card .eyebrow{color:var(--bc-blue-deep)}
  html[data-theme="dark"] .login-screen.bc-split>.login-card .eyebrow{color:var(--bc-blue-300)}
  .login-screen.bc-split>.login-card h1{color:var(--text)}
  .login-screen.bc-split>.login-card>p{color:var(--muted)}
  .login-screen.bc-split>.login-card label span{color:var(--muted)}
  .login-screen.bc-split>.login-card input{background:var(--surface);border-color:var(--line-strong);color:var(--text)}
  html[data-theme="dark"] .login-screen.bc-split>.login-card input{background:#0A1422;border-color:#2A3B57;color:#F8FAFC}
  .login-screen.bc-split>.login-card .login-security{display:flex}
}
.bc-login-aside{display:none}

/* ============================== RESPONSIVE ============================= */
@media(max-width:1120px){.bc-taskboard{grid-template-columns:repeat(2,1fr)}}
@media(max-width:1020px){.sidebar nav button.active{box-shadow:none}}
@media(max-width:760px){
  .bc-taskboard{grid-template-columns:1fr}
  .bc-page-header{padding:20px}
  .bc-page-header h1{font-size:22px}
  .bc-hero{padding:24px 22px}
  .bc-hero h1{font-size:25px}
  .bc-hero__actions button{flex:1 1 auto;justify-content:center}
}

/* Sidebar : élément actif = pastille bleue pleine, texte + icône blancs. */
.sidebar nav button.active{background:var(--bc-blue);color:#fff;box-shadow:0 6px 16px color-mix(in srgb,var(--bc-blue) 40%,transparent)}
.sidebar nav button.active .nav-glyph{color:#fff}
.sidebar nav button.active b{background:rgba(255,255,255,.26);color:#fff}

/* ============================================================================
   BlueCresta v5.1 — Peaufinage ADMINISTRATION (menu, modèles, services, corbeille)
   Corrige les boutons trop petits (overrides densité) et harmonise les lignes.
   ========================================================================== */

/* --- Menu latéral de paramètres : vraie nav SaaS --- */
.admin-grid{grid-template-columns:230px minmax(0,1fr);gap:20px}
.admin-menu{padding:10px;border-radius:14px;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow)}
.admin-menu button{width:100%;min-height:42px;height:auto;padding:0 14px;border-radius:10px;text-align:left;
  font-size:12.5px;font-weight:600;letter-spacing:0;color:var(--muted);display:flex;align-items:center;gap:10px;transition:background .14s,color .14s}
.admin-menu button:hover{background:var(--bc-blue-050);color:var(--text)}
.admin-menu button.active{background:var(--bc-blue);color:#fff;box-shadow:0 4px 12px color-mix(in srgb,var(--bc-blue) 34%,transparent)}
.admin-menu button::before{content:"";width:7px;height:7px;border-radius:2px;background:currentColor;opacity:.5;flex:0 0 auto}
.admin-menu button.active::before{opacity:1}

/* --- Ligne d'administration générique, lisible et aérée --- */
.bc-admin-list{display:flex;flex-direction:column;gap:9px}
.bc-admin-row{display:flex;align-items:center;gap:14px;padding:13px 15px;border:1px solid var(--line);
  background:var(--surface);border-radius:12px;transition:border-color .14s,box-shadow .14s}
.bc-admin-row:hover{border-color:var(--bc-blue-200);box-shadow:0 6px 16px color-mix(in srgb,var(--bc-blue) 10%,transparent)}
.bc-admin-row__dot{width:12px;height:12px;border-radius:4px;flex:0 0 auto;background:var(--service-color,var(--bc-blue))}
.bc-admin-row__ic{width:38px;height:38px;border-radius:11px;flex:0 0 auto;display:grid;place-items:center;
  background:var(--bc-blue-050);color:var(--bc-blue-deep)}
.bc-admin-row__ic .bc-ic{font-size:18px}
.bc-admin-row__main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:3px}
.bc-admin-row__main strong{font-size:13px;font-weight:600;line-height:1.25;color:var(--text)}
.bc-admin-row__main small{font-size:11.5px;color:var(--muted);line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60ch}
.bc-admin-row__tag{flex:0 0 auto;font-size:11px;font-weight:600;padding:5px 11px;border-radius:999px;
  background:var(--bc-blue-050);color:var(--bc-on-tint);border:1px solid var(--bc-tint-line);white-space:nowrap}
.bc-admin-row__tag.is-muted{background:var(--surface-2);color:var(--muted);border-color:var(--line)}
.bc-admin-row__actions{flex:0 0 auto;display:flex;gap:8px;align-items:center;margin-left:auto}

/* --- Boutons CONFORTABLES dans l'admin/corbeille (annule les overrides 28px/8px) --- */
.bc-admin-row .secondary-button,.bc-admin-row .danger-button,.bc-admin-row .primary-button,
.trash-footer .danger-button,.trash-footer .secondary-button,
.user-list .secondary-button,.user-list .danger-button,
.service-list .secondary-button,.service-list .danger-button,
.row-actions button{min-height:36px!important;height:auto;padding:0 14px!important;font-size:12px!important;font-weight:600;border-radius:9px}
.bc-admin-row .danger-button,.trash-footer .danger-button,.user-list .danger-button{
  background:var(--red-soft);border-color:color-mix(in srgb,var(--red) 32%,transparent);color:var(--red)}
.bc-admin-row .danger-button:hover,.trash-footer .danger-button:hover{background:color-mix(in srgb,var(--red) 16%,transparent);border-color:color-mix(in srgb,var(--red) 48%,transparent)}

/* --- Pastilles de rôle (users async) lisibles --- */
.role-pill{font-size:11px;padding:5px 11px;border-radius:999px;background:var(--bc-blue-050);color:var(--bc-on-tint);border:1px solid var(--bc-tint-line);font-weight:600}
.user-row{grid-template-columns:42px minmax(0,1fr) auto auto;gap:13px;padding:13px 0;align-items:center}
.user-avatar{width:40px;height:40px;border-radius:12px;background:var(--bc-blue-050);color:var(--bc-blue-deep);font-size:12px;font-weight:700}
.user-row strong{font-size:13px}
.user-row small{font-size:11.5px;margin-top:2px}

/* --- Corbeille : sections claires --- */
.trash-section{margin-top:22px;border-top:1px solid var(--line);padding-top:6px}
.trash-section h3{align-items:center;padding:12px 2px;font-size:13px;font-weight:600}
.trash-section h3 span{min-width:22px;height:20px;padding:0 7px;border-radius:7px;display:grid;place-items:center;
  font-size:11px;font-weight:700;background:var(--bc-blue-050);color:var(--bc-on-tint)}
.trash-footer{padding-top:20px}

/* --- Empty state un peu plus grand pour respirer --- */
.admin-menu+#admin-content .empty-state,#admin-content .empty-state{padding:26px}