:root{
  /* ======================================================
     PALETTE CORIS BANK — fond clair, cartes blanches,
     bleu marine profond + bleu vif, accent rouge
     ====================================================== */
  --bg:#f5f7fb;            /* fond application, gris bleuté très clair */
  --bg-soft:#eef2f8;       /* zones secondaires, champs */
  --panel:#ffffff;         /* cartes blanc pur */
  --panel-2:#f3f6fb;       /* en-têtes de tableau, sections */
  --border:#e6ebf3;
  --border-strong:#d9e0ec;
  --text:#0b1f5c;          /* bleu marine Coris — titres et texte principal */
  --text-muted:#3b4a75;    /* texte secondaire */
  --text-dim:#6b7797;      /* texte tertiaire */

  --accent:#1e5bc6;        /* bleu vif Coris (icônes, actions) */
  --accent-soft:#1e5bc614;
  --primary:#0b1f5c;       /* bleu marine profond (dégradé, bannières) */
  --primary-light:#1e5bc6;
  --primary-soft:#0b1f5c12;
  --steel:#2f7de1;         /* bleu clair secondaire */
  --steel-soft:#2f7de114;
  --coris-red:#e8323c;     /* rouge d'alerte Coris (icône réclamations) */
  --coris-red-soft:#e8323c14;
  --coris-grad:linear-gradient(90deg,#1d5fd0 0%,#0b1f5c 100%);
  --coris-grad-soft:linear-gradient(135deg,#e9f0fc 0%,#ffffff 100%);

  --success:#158f4a;
  --warning:#c47a06;
  --danger:#e8323c;
  --info:#1e5bc6;

  --shadow:0 2px 6px rgba(11,31,92,.05), 0 8px 24px rgba(11,31,92,.07);
  --shadow-lg:0 6px 18px rgba(11,31,92,.08), 0 24px 56px rgba(11,31,92,.14);
  --radius:14px;
  --radius-lg:22px;

  --color-scheme:light;

  --font-display:'Jost',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
}
[data-theme="coris"]{
  /* ======================================================
     PALETTE CORIS BANK — fond clair, cartes blanches,
     bleu marine profond + bleu vif, accent rouge
     ====================================================== */
  --bg:#f5f7fb;            /* fond application, gris bleuté très clair */
  --bg-soft:#eef2f8;       /* zones secondaires, champs */
  --panel:#ffffff;         /* cartes blanc pur */
  --panel-2:#f3f6fb;       /* en-têtes de tableau, sections */
  --border:#e6ebf3;
  --border-strong:#d9e0ec;
  --text:#0b1f5c;          /* bleu marine Coris — titres et texte principal */
  --text-muted:#3b4a75;    /* texte secondaire */
  --text-dim:#6b7797;      /* texte tertiaire */

  --accent:#1e5bc6;        /* bleu vif Coris (icônes, actions) */
  --accent-soft:#1e5bc614;
  --primary:#0b1f5c;       /* bleu marine profond (dégradé, bannières) */
  --primary-light:#1e5bc6;
  --primary-soft:#0b1f5c12;
  --steel:#2f7de1;         /* bleu clair secondaire */
  --steel-soft:#2f7de114;
  --coris-red:#e8323c;     /* rouge d'alerte Coris (icône réclamations) */
  --coris-red-soft:#e8323c14;
  --coris-grad:linear-gradient(90deg,#1d5fd0 0%,#0b1f5c 100%);
  --coris-grad-soft:linear-gradient(135deg,#e9f0fc 0%,#ffffff 100%);

  --success:#158f4a;
  --warning:#c47a06;
  --danger:#e8323c;
  --info:#1e5bc6;

  --shadow:0 2px 6px rgba(11,31,92,.05), 0 8px 24px rgba(11,31,92,.07);
  --shadow-lg:0 6px 18px rgba(11,31,92,.08), 0 24px 56px rgba(11,31,92,.14);
  --radius:14px;
  --radius-lg:22px;

  --color-scheme:light;

  --font-display:'Jost',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
}




[data-theme="coris"]{
  /* Palette Clair Pur — blanc cassé éclatant, contraste maximal, style "office moderne" */
  --bg:#fafbfc;          /* Blanc cassé très subtil */
  --bg-soft:#f3f4f6;     /* Gris perle pour zones secondaires */
  --panel:#ffffff;       /* Cartes blanc pur */
  --panel-2:#f8f9fa;     /* Headers de tableau, sections — gris très léger */
  --border:#edeff2;      /* Bordures subtiles */
  --border-strong:#dfe3e8;
  --text:#000000;        /* Noir pur — visibilité maximale */
  --text-muted:#1a1a1a;  /* Texte secondaire — très foncé */
  --text-dim:#2d2d2d;    /* Texte tertiaire — gris très foncé */

  --accent:#dd1a1a;       /* Rouge Nicotram — éclatant sur fond blanc */
  --accent-soft:#dd1a1a14;
  --primary:#1d2086;      /* Bleu marine Nicotram — contraste parfait */
  --primary-light:#3a4ab5;
  --primary-soft:#1d208610;
  --steel:#0369a1;        /* Bleu acier vif */
  --steel-soft:#0369a114;

  --success:#15803d;      /* Vert sapin */
  --warning:#b45309;      /* Ambre profond */
  --danger:#b91c1c;       /* Rouge sombre */
  --info:#1d4ed8;         /* Bleu royal */

  --shadow:0 1px 2px rgba(15,23,42,.06), 0 2px 8px rgba(15,23,42,.06);
  --shadow-lg:0 4px 12px rgba(15,23,42,.08), 0 16px 40px rgba(15,23,42,.12);

  --color-scheme:light;
}

[data-theme="coris"] body {
  background-image:
    radial-gradient(circle at 0% 0%, rgba(74,144,194,.08) 0%, transparent 40%),
    radial-gradient(circle at 100% 100%, rgba(30,91,198,.06) 0%, transparent 40%);
}

[data-theme="coris"] .filters input[type="date"] {
  color-scheme:light;
}

/* Inputs en mode clair : fond légèrement plus clair que panel pour contraste */
[data-theme="coris"] .field input,
[data-theme="coris"] .field select,
[data-theme="coris"] .field textarea,
[data-theme="coris"] .filters input,
[data-theme="coris"] .filters select,
[data-theme="coris"] .field-input {
  background:var(--panel-2);
  border-color:var(--border-strong);
  color:var(--text);
}

/* Sidebar plus tranchée en clair */
[data-theme="coris"] .sidebar {
  background:var(--panel);
  border-right:1px solid var(--border-strong);
}
[data-theme="coris"] .topbar {
  background:var(--panel);
  border-bottom:1px solid var(--border-strong);
}
[data-theme="coris"] .nav-item:hover {
  background:var(--bg-soft);
}
[data-theme="coris"] thead th {
  background:var(--panel-2);
}
[data-theme="coris"] tbody tr:hover {
  background:var(--bg-soft);
}

/* Badges en mode clair : fonds opaques pour meilleur contraste */
[data-theme="coris"] .badge.s-nouvelle{background:#dbeafe;color:#1e3a8a;border:1px solid #bfdbfe}
[data-theme="coris"] .badge.s-encours{background:#fef3c7;color:#92400e;border:1px solid #fde68a}
[data-theme="coris"] .badge.s-repare{background:#cffafe;color:#155e75;border:1px solid #a5f3fc}
[data-theme="coris"] .badge.s-termine{background:#dcfce7;color:#166534;border:1px solid #bbf7d0}
[data-theme="coris"] .badge.s-annule{background:#f1f5f9;color:#475569;border:1px solid #e2e8f0}
[data-theme="coris"] .badge.p-basse{background:#f1f5f9;color:#475569;border:1px solid #e2e8f0}
[data-theme="coris"] .badge.p-normale{background:#dbeafe;color:#1e40af;border:1px solid #bfdbfe}
[data-theme="coris"] .badge.p-haute{background:#fef3c7;color:#92400e;border:1px solid #fde68a}
[data-theme="coris"] .badge.p-urgente{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}
[data-theme="coris"] .badge.t-actif{background:#dcfce7;color:#166534;border:1px solid #bbf7d0}
[data-theme="coris"] .badge.t-panne{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}
[data-theme="coris"] .badge.t-maint{background:#fef3c7;color:#92400e;border:1px solid #fde68a}
[data-theme="coris"] .badge.t-arret{background:#f1f5f9;color:#475569;border:1px solid #e2e8f0}

/* Cell-muted en mode clair : pas trop pâle */
[data-theme="coris"] .cell-muted{color:var(--text-muted)}
[data-theme="coris"] .cell-mono{color:var(--text)}

/* KPI cards : valeurs en mode clair plus contrastées */
[data-theme="coris"] .kpi-value{color:var(--text)}
[data-theme="coris"] .kpi-label{color:var(--text-muted);font-weight:700}
[data-theme="coris"] .kpi-meta{color:var(--text-dim)}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:var(--font-display);
  background:var(--bg);
  color:var(--text);
  font-size:15px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  background-image:
    radial-gradient(circle at 0% 0%, rgba(74,144,194,.06) 0%, transparent 40%),
    radial-gradient(circle at 100% 100%, rgba(30,91,198,.04) 0%, transparent 40%);
  background-attachment:fixed;
}

button{font-family:inherit;cursor:pointer;border:0;outline:0}
input,select,textarea{font-family:inherit;outline:0}

/* ============== LOGIN ============== */
/* ============================================================
   LANDING PAGE — Page d'accueil avant connexion
   ============================================================ */
#landing-screen{
  min-height:100vh;
  background:var(--bg);
  color:var(--text);
  overflow-x:hidden;
}
[data-theme="coris"] #landing-screen {
  background:linear-gradient(180deg, #e8edf5 0%, var(--bg) 50%);
}

/* Navigation */
.landing-nav{
  position:sticky;top:0;z-index:50;
  background:rgba(13,17,23,.85);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
}
[data-theme="coris"] .landing-nav {
  background:rgba(232,237,245,.85);
}
.landing-nav-inner{
  max-width:1200px;margin:0 auto;
  padding:14px 28px;
  display:flex;justify-content:space-between;align-items:center;gap:20px;
}
.landing-brand{display:flex;align-items:center;gap:12px}
.landing-brand-mark{
  width:auto;height:48px;
  background:#fff;
  border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  padding:6px 10px;
  box-shadow:0 4px 12px rgba(11,31,92,.18);
  flex-shrink:0;
}
.landing-brand-mark img{
  height:100%;width:auto;object-fit:contain;display:block;
}
.landing-brand-name{font-weight:800;font-size:18px;letter-spacing:-.01em}
.landing-brand-tag{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.12em;margin-top:1px;font-weight:600}
.landing-brand-tag-side{
  font-size:12px;color:var(--text-muted);
  text-transform:uppercase;letter-spacing:.15em;font-weight:700;
  padding-left:14px;border-left:2px solid var(--accent);
  line-height:1.3;
}
.landing-nav-links{display:flex;align-items:center;gap:24px}
.landing-nav-link{
  color:var(--text-muted);
  text-decoration:none;
  font-size:14px;font-weight:500;
  transition:color .15s;
}
.landing-nav-link:hover{color:var(--text)}
.landing-cta-small{
  background:var(--accent);color:#fff;
  border:none;padding:9px 18px;border-radius:8px;
  font-size:14px;font-weight:600;cursor:pointer;
  transition:transform .15s, box-shadow .15s;
  font-family:inherit;
}
.landing-cta-small:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(30,91,198,.35);
}
@media (max-width:780px){
  .landing-nav-link{display:none}
}

/* Hero */
.landing-hero{
  position:relative;
  padding:80px 28px 40px;
  max-width:1200px;
  margin:0 auto;
  text-align:center;
  overflow:hidden;
}
.landing-hero-bg{
  position:absolute;inset:-10% -20% auto;
  height:600px;
  background:
    radial-gradient(circle at 20% 30%, rgba(30,91,198,.18), transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(11,31,92,.25), transparent 55%),
    radial-gradient(circle at 50% 80%, rgba(168,85,247,.12), transparent 60%);
  pointer-events:none;
  z-index:0;
}
.landing-hero-content{position:relative;z-index:1}
.landing-badge{
  display:inline-block;
  background:var(--accent-soft);
  color:var(--accent);
  border:1px solid rgba(30,91,198,.35);
  padding:6px 14px;border-radius:999px;
  font-size:13px;font-weight:600;
  margin-bottom:24px;
  letter-spacing:.02em;
}
.landing-title{
  font-size:clamp(32px, 5.5vw, 58px);
  font-weight:800;
  letter-spacing:-.025em;
  line-height:1.08;
  margin:0 auto 24px;
  max-width:900px;
}
.grad-text{
  background:linear-gradient(135deg, var(--accent) 0%, var(--primary) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
}
.landing-subtitle{
  font-size:clamp(15px, 1.6vw, 18px);
  color:var(--text-muted);
  line-height:1.6;
  max-width:680px;
  margin:0 auto 36px;
  font-weight:500;
}
.landing-actions{
  display:flex;gap:14px;justify-content:center;flex-wrap:wrap;
  margin-bottom:60px;
}
.landing-cta-primary{
  background:linear-gradient(135deg, var(--accent), #a51111);
  color:#fff;border:none;
  padding:14px 28px;border-radius:10px;
  font-size:16px;font-weight:600;
  cursor:pointer;
  display:inline-flex;align-items:center;gap:10px;
  transition:transform .15s, box-shadow .15s;
  font-family:inherit;
  box-shadow:0 6px 20px rgba(30,91,198,.35);
}
.landing-cta-primary:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(30,91,198,.5);
}
.landing-cta-primary.big{padding:18px 36px;font-size:18px}
.landing-cta-secondary{
  background:transparent;
  color:var(--text);
  border:1px solid var(--border-strong);
  padding:14px 28px;border-radius:10px;
  font-size:16px;font-weight:500;
  cursor:pointer;text-decoration:none;
  display:inline-flex;align-items:center;gap:8px;
  transition:background .15s, border-color .15s;
  font-family:inherit;
}
.landing-cta-secondary:hover{
  background:var(--panel);
  border-color:var(--accent);
}

/* Mockup */
.landing-mockup{
  max-width:920px;margin:0 auto;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:14px;
  box-shadow:0 30px 80px rgba(0,0,0,.4), 0 0 0 1px rgba(30,91,198,.15);
  overflow:hidden;
  text-align:left;
  transform:perspective(1200px) rotateX(2deg);
  transition:transform .3s;
}
.landing-mockup:hover{transform:perspective(1200px) rotateX(0deg)}
[data-theme="coris"] .landing-mockup {
  box-shadow:0 30px 80px rgba(11,31,92,.18), 0 0 0 1px rgba(30,91,198,.2);
}
.landing-mockup-bar{
  background:var(--panel-2);
  padding:10px 16px;
  display:flex;align-items:center;gap:8px;
  border-bottom:1px solid var(--border);
}
.landing-mockup-bar .dot{width:11px;height:11px;border-radius:50%}
.landing-mockup-bar .red{background:#ff5f57}
.landing-mockup-bar .yellow{background:#febc2e}
.landing-mockup-bar .green{background:#28c840}
.landing-mockup-bar .mockup-url{
  margin-left:14px;font-size:12px;color:var(--text-muted);font-family:var(--font-mono);
}
.landing-mockup-body{padding:18px}
.mock-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:10px;margin-bottom:14px}
.mock-card{
  background:var(--bg-soft);
  border:1px solid var(--border);
  border-radius:8px;padding:10px 12px;position:relative;
}
.mock-label{font-size:10px;color:var(--text-muted);font-weight:700;letter-spacing:.08em;margin-bottom:4px}
.mock-val{font-size:19px;font-weight:800;letter-spacing:-.01em}
.mock-val span{font-size:11px;color:var(--text-muted);margin-left:3px;font-weight:600}
.mock-bar{height:3px;background:var(--border);border-radius:2px;overflow:hidden;margin-top:6px}
.mock-bar span{display:block;height:100%;background:var(--accent);border-radius:2px}
.mock-card-accent .mock-val{color:var(--accent)}
.mock-card-success .mock-val{color:var(--success)}
.mock-card-steel .mock-val{color:var(--steel)}
.mock-card-warn .mock-val{color:var(--warning)}

.mock-list{display:flex;flex-direction:column;gap:6px}
.mock-row{
  display:flex;align-items:center;gap:10px;
  padding:8px 10px;
  background:var(--bg-soft);
  border:1px solid var(--border);
  border-radius:7px;
}
.mock-row-icon{
  width:30px;height:30px;border-radius:7px;
  display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;
}
.mock-row-body{flex:1;min-width:0}
.mock-row-title{font-size:13px;font-weight:600;color:var(--text)}
.mock-row-sub{font-size:11px;color:var(--text-muted);margin-top:2px}
.mock-status{font-size:11px;font-weight:700;padding:2px 8px;border-radius:8px;text-transform:uppercase;letter-spacing:.05em}
.mock-status-ok{background:rgba(63,185,80,.15);color:var(--success)}
.mock-status-warn{background:rgba(240,160,32,.15);color:var(--warning)}

@media (max-width:680px){
  .mock-grid{grid-template-columns:repeat(2,1fr)}
  .landing-mockup{transform:none}
}

/* Stats */
.landing-stats{max-width:1100px;margin:40px auto;padding:30px 28px}
.landing-stats-grid{
  display:grid;grid-template-columns:repeat(4, 1fr);gap:24px;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:14px;
  padding:34px 28px;position:relative;overflow:hidden;
}
.landing-stats-grid::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg, var(--primary), var(--accent), var(--primary));
}
.stat-block{text-align:center}
.stat-number{
  font-size:42px;font-weight:800;letter-spacing:-.02em;
  background:linear-gradient(135deg, var(--accent), #a51111);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  margin-bottom:6px;line-height:1;
}
.stat-label{font-size:13px;color:var(--text-muted);font-weight:500;line-height:1.5}
@media (max-width:680px){.landing-stats-grid{grid-template-columns:repeat(2,1fr);gap:20px}}

/* Features */
.landing-features{max-width:1200px;margin:0 auto;padding:80px 28px}
.landing-section-head{text-align:center;max-width:760px;margin:0 auto 50px}
.landing-eyebrow{
  display:inline-block;
  font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);margin-bottom:14px;
}
.landing-section-title{
  font-size:clamp(26px, 4vw, 42px);font-weight:800;
  letter-spacing:-.02em;line-height:1.15;margin:0 0 16px;
}
.landing-section-sub{font-size:16px;color:var(--text-muted);line-height:1.6}
.features-grid{
  display:grid;grid-template-columns:repeat(auto-fit, minmax(290px, 1fr));gap:20px;
}
.feature-card{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:14px;padding:28px;
  transition:transform .2s, border-color .2s, box-shadow .2s;
}
.feature-card:hover{
  transform:translateY(-4px);
  border-color:var(--border-strong);
  box-shadow:0 14px 30px rgba(0,0,0,.2);
}
.feature-icon{
  width:54px;height:54px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;margin-bottom:16px;
}
.feature-card h3{font-size:18px;font-weight:700;margin:0 0 8px;letter-spacing:-.01em}
.feature-card p{font-size:15px;color:var(--text-muted);line-height:1.6;margin:0}

/* Modules */
.landing-modules{max-width:1100px;margin:0 auto;padding:60px 28px 80px}
.modules-list{display:flex;flex-direction:column;gap:18px}
.module-row{
  display:grid;grid-template-columns:80px 1fr 80px;gap:24px;
  align-items:center;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:14px;padding:26px 28px;
  transition:transform .2s, border-color .2s;
}
.module-row:hover{transform:translateX(6px);border-color:var(--accent)}
.module-num{
  font-size:42px;font-weight:800;
  background:linear-gradient(135deg, var(--accent), transparent 80%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  letter-spacing:-.02em;line-height:1;
}
.module-cat{
  font-size:11px;font-weight:700;color:var(--accent);
  text-transform:uppercase;letter-spacing:.12em;margin-bottom:6px;
}
.module-info h3{font-size:20px;font-weight:700;margin:0 0 6px;letter-spacing:-.01em}
.module-info p{font-size:15px;color:var(--text-muted);line-height:1.55;margin:0}
.module-visual{
  font-size:48px;text-align:center;opacity:.5;
  transition:opacity .2s, transform .2s;
}
.module-row:hover .module-visual{opacity:1;transform:scale(1.1)}
@media (max-width:680px){
  .module-row{grid-template-columns:60px 1fr}
  .module-visual{display:none}
  .module-num{font-size:34px}
}

/* CTA Final */
.landing-cta-final{
  padding:60px 28px;
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 50%, var(--accent) 130%);
  color:#fff;text-align:center;
  margin:30px auto;max-width:1100px;
  border-radius:18px;position:relative;overflow:hidden;
}
.landing-cta-final::before{
  content:"";position:absolute;top:-50%;right:-20%;width:500px;height:500px;
  background:radial-gradient(circle, rgba(255,255,255,.1) 0%, transparent 60%);
  border-radius:50%;
}
.landing-cta-final-inner{position:relative;z-index:1;max-width:660px;margin:0 auto}
.landing-cta-final h2{
  font-size:clamp(24px, 3.5vw, 34px);font-weight:800;
  letter-spacing:-.02em;line-height:1.2;margin:0 0 14px;
}
.landing-cta-final p{font-size:17px;opacity:.9;margin:0 0 28px;line-height:1.5}
.landing-cta-final .landing-cta-primary{
  background:#fff;color:var(--primary);
  box-shadow:0 8px 24px rgba(0,0,0,.3);
}
.landing-cta-final .landing-cta-primary:hover{box-shadow:0 14px 36px rgba(0,0,0,.4)}

/* Footer */
.landing-footer{
  border-top:1px solid var(--border);
  padding:30px 28px;background:var(--panel);
}
.landing-footer-inner{
  max-width:1200px;margin:0 auto;
  display:flex;justify-content:space-between;align-items:center;
  gap:20px;flex-wrap:wrap;
}
.landing-footer-brand{display:flex;align-items:center;gap:12px}
.landing-footer-links{display:flex;gap:24px;font-size:13px;flex-wrap:wrap}

/* Animations subtiles */
@keyframes float-in {
  from { opacity:0; transform:translateY(20px); }
  to   { opacity:1; transform:translateY(0); }
}
.landing-hero-content > * { animation:float-in .8s ease-out both; }
.landing-hero-content > *:nth-child(1){animation-delay:.05s}
.landing-hero-content > *:nth-child(2){animation-delay:.15s}
.landing-hero-content > *:nth-child(3){animation-delay:.25s}
.landing-hero-content > *:nth-child(4){animation-delay:.35s}
.landing-hero-content > *:nth-child(5){animation-delay:.45s}

/* Lien retour à l'accueil dans la carte de login */
.login-back-link{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13px;color:var(--text-muted);
  background:transparent;border:none;cursor:pointer;
  padding:6px 10px;border-radius:6px;
  font-family:inherit;
  margin-bottom:14px;
  transition:color .15s, background .15s;
}
.login-back-link:hover{color:var(--accent);background:var(--accent-soft)}

#login-screen{
  display:flex;align-items:center;justify-content:center;
  min-height:100vh;padding:20px;
}
.login-card{
  width:100%;max-width:440px;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:40px;
  box-shadow:var(--shadow-lg);
  position:relative;
  overflow:hidden;
}
.login-card::before{
  content:'';
  position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
}
.login-logo{
  display:flex;align-items:center;gap:12px;margin-bottom:8px;
}
.login-logo-mark{
  width:44px;height:44px;
  background:var(--accent);
  border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:21px;color:#fff;
  box-shadow:0 0 0 4px var(--accent-soft);
}
.login-title{
  font-size:23px;font-weight:800;letter-spacing:-.02em;
}
.login-subtitle{
  color:var(--text-muted);margin-bottom:32px;font-size:14px;
}
.field{margin-bottom:18px}
.field label{
  display:block;font-size:12px;font-weight:600;text-transform:uppercase;
  letter-spacing:.08em;color:var(--text-muted);margin-bottom:8px;
}
.field input,.field select,.field textarea{
  width:100%;
  background:var(--bg-soft);
  border:1px solid var(--border-strong);
  color:var(--text);
  padding:11px 14px;
  border-radius:var(--radius);
  font-size:15px;
  transition:border-color .15s,box-shadow .15s;
}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-soft);
}
.btn{
  background:var(--accent);color:#fff;
  padding:11px 20px;border-radius:var(--radius);
  font-weight:600;font-size:15px;
  display:inline-flex;align-items:center;gap:8px;
  transition:transform .1s,filter .15s;
}
.btn:hover{filter:brightness(1.1)}
.btn:active{transform:translateY(1px)}
.btn.full{width:100%;justify-content:center}
.btn.secondary{background:var(--panel-2);color:var(--text);border:1px solid var(--border)}
.btn.secondary:hover{background:var(--border)}
.btn.danger{background:var(--danger)}
.btn.success{background:var(--success)}
.btn.ghost{background:transparent;color:var(--text-muted);border:1px solid var(--border)}
.btn.ghost:hover{color:var(--text);border-color:var(--border-strong)}
.btn.sm{padding:6px 12px;font-size:13px}

.error-msg{
  background:rgba(248,81,73,.1);
  border:1px solid rgba(248,81,73,.3);
  color:var(--danger);
  padding:10px 14px;border-radius:var(--radius);
  font-size:14px;margin-top:14px;display:none;
}
.error-msg.show{display:block}

/* ============== APP SHELL ============== */
#app{display:none;min-height:100vh}
.shell{display:flex;min-height:100vh}

/* Sidebar */
.sidebar{
  width:240px;flex-shrink:0;
  background:var(--bg-soft);
  border-right:1px solid var(--border-strong);
  padding:20px 0;
  position:sticky;top:0;
  height:100vh;
  display:flex;flex-direction:column;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:var(--border) transparent;
}
/* Masquer les nav-items AVANT que les permissions soient appliquées */
.sidebar.perms-pending .nav-item,
.sidebar.perms-pending .nav-section,
.sidebar.perms-pending .nav-admin-item {
  visibility:hidden;
}
/* Scrollbar discrète style WebKit (Chrome, Safari, Edge) */
.sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-track{background:transparent}
.sidebar::-webkit-scrollbar-thumb{
  background:var(--border);
  border-radius:3px;
}
.sidebar::-webkit-scrollbar-thumb:hover{
  background:var(--text-dim);
}
.sidebar-brand{
  padding:0 16px 16px;
  border-bottom:1px solid var(--border);
  margin-bottom:16px;
}
.brand-mark{
  width:34px;height:34px;background:var(--accent);
  border-radius:7px;display:flex;align-items:center;justify-content:center;
  font-weight:800;color:#fff;font-size:17px;
}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.brand-text strong{font-size:15px;font-weight:800}
.brand-text small{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em}

.nav-section{padding:0 10px;margin-bottom:18px}
.nav-label{
  display:flex;align-items:center;justify-content:space-between;
  background:var(--panel-2);
  border:1px solid var(--border);
  font-size:12px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--text-muted);font-weight:700;
  padding:10px 12px;
  border-radius:8px;
  margin-bottom:6px;
}

/* Menu dépliant (Administration) */
.nav-section-collapsible{margin-bottom:14px}
.nav-label-toggle{
  display:flex;align-items:center;justify-content:space-between;
  width:100%;
  background:var(--panel-2);
  border:1px solid var(--border);
  font-size:12px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--text-muted);font-weight:700;
  padding:10px 12px;
  border-radius:8px;
  cursor:pointer;
  font-family:inherit;
  transition:background .15s, color .15s, border-color .15s;
  margin-bottom:2px;
}
.nav-label-toggle:hover{
  background:var(--panel);
  color:var(--text);
  border-color:var(--accent);
}
.nav-section-collapsible[data-open="true"] .nav-label-toggle{
  background:var(--accent-soft);
  border-color:var(--accent);
  color:var(--accent);
}
.nav-label-text{display:flex;align-items:center;gap:8px}
.nav-label-icon{opacity:.8;transition:transform .25s;flex-shrink:0}
.nav-label-toggle:hover .nav-label-icon{transform:rotate(45deg);opacity:1}
.nav-section-collapsible[data-open="true"] .nav-label-icon{opacity:1}
.nav-label-meta{display:flex;align-items:center;gap:7px}
.nav-label-badge{
  background:var(--accent);color:#fff;
  font-size:10px;font-weight:700;
  padding:1px 6px;border-radius:8px;
  min-width:16px;text-align:center;
  letter-spacing:0;
}
.nav-label-chevron{
  transition:transform .25s ease;
  flex-shrink:0;
  opacity:.7;
}
.nav-label-toggle:hover .nav-label-chevron,
.nav-section-collapsible[data-open="true"] .nav-label-chevron{
  opacity:1;
}
.nav-section-collapsible[data-open="true"] .nav-label-chevron{
  transform:rotate(180deg);
}
.nav-collapsible-items{
  max-height:0;
  overflow:hidden;
  transition:max-height .35s ease, opacity .25s ease, margin-top .25s ease, padding-top .25s ease;
  opacity:0;
  margin-top:0;
  padding-left:2px;
  margin-left:0;
}
.nav-section-collapsible[data-open="true"] .nav-collapsible-items{
  max-height:800px;
  opacity:1;
  margin-top:6px;
  padding-top:4px;
}
.nav-item{
  display:flex;align-items:center;gap:9px;
  padding:9px 9px;border-radius:var(--radius);
  color:var(--text-muted);
  font-size:14px;font-weight:500;
  cursor:pointer;
  transition:background .12s,color .12s;
  user-select:none;
  position:relative;
  overflow:hidden;
}
.nav-item:hover{background:var(--panel);color:var(--text)}
.nav-item.active{background:var(--accent-soft);color:var(--accent);font-weight:600}
.nav-item .ico{width:16px;height:16px;flex-shrink:0}

/* ----------------------------------------------------------------
   Effet brillance — toujours présent en pseudo-éléments,
   animé au survol (:hover) ET au clic (.nav-shine).
   Couleur dorée/orangée chaude qui contraste bien sur fond clair
   ET sur fond sombre.
   ---------------------------------------------------------------- */
.nav-item::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(
    100deg,
    transparent 25%,
    rgba(30,91,198,.30) 42%,
    rgba(255,80,80,.75) 50%,
    rgba(30,91,198,.30) 58%,
    transparent 75%
  );
  background-size:250% 100%;
  background-position:-150% 0;
  pointer-events:none;
  z-index:1;
  opacity:0;
  mix-blend-mode:screen; /* fond sombre : ajoute de la lumière */
}
.nav-item::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  z-index:0;
  box-shadow:0 0 0 0 rgba(30,91,198,0);
  opacity:0;
}
.nav-item > *{position:relative;z-index:2}

/* Déclenchement au survol */
.nav-item:hover::before{
  animation:navShineSweep 1s cubic-bezier(.4,0,.2,1);
}
.nav-item:hover::after{
  animation:navShinePulse 1s cubic-bezier(.4,0,.2,1);
}

/* Déclenchement par classe (clic) — rejoue l'animation même sans changement de hover */
.nav-item.nav-shine::before{
  animation:navShineSweep 1s cubic-bezier(.4,0,.2,1);
}
.nav-item.nav-shine::after{
  animation:navShinePulse 1s cubic-bezier(.4,0,.2,1);
}

/* Adaptation pour le thème clair :
   - mix-blend-mode:multiply pour assombrir (donc colorer) le fond clair
   - couleur orange Nicotram plus saturée pour bien ressortir */
[data-theme="coris"] .nav-item::before {
  background:linear-gradient(
    100deg,
    transparent 25%,
    rgba(30,91,198,.35) 42%,
    rgba(30,91,198,.75) 50%,
    rgba(30,91,198,.35) 58%,
    transparent 75%
  );
  background-size:250% 100%;
  background-position:-150% 0;
  mix-blend-mode:normal; /* sur fond clair, on n'a pas besoin de "screen" */
}

@keyframes navShineSweep{
  0%   { background-position:-150% 0; opacity:0; }
  10%  { opacity:1; }
  90%  { opacity:1; }
  100% { background-position: 250% 0; opacity:0; }
}
@keyframes navShinePulse{
  0%   { box-shadow:0 0 0 0 rgba(30,91,198,0); opacity:.95; }
  50%  { box-shadow:0 0 18px 4px rgba(30,91,198,.7); opacity:.7; }
  100% { box-shadow:0 0 0 0 rgba(30,91,198,0); opacity:0; }
}
@keyframes navShinePulseLight{
  0%   { box-shadow:0 0 0 0 rgba(30,91,198,0); opacity:.95; }
  50%  { box-shadow:0 0 18px 4px rgba(30,91,198,.7); opacity:.7; }
  100% { box-shadow:0 0 0 0 rgba(30,91,198,0); opacity:0; }
}
[data-theme="coris"] .nav-item::after {
  box-shadow:0 0 0 0 rgba(30,91,198,0);
}
[data-theme="coris"] .nav-item:hover::after {
  animation:navShinePulseLight 1s cubic-bezier(.4,0,.2,1);
}
[data-theme="coris"] .nav-item.nav-shine::after {
  animation:navShinePulseLight 1s cubic-bezier(.4,0,.2,1);
}
.nav-badge{
  margin-left:auto;
  background:var(--panel-2);color:var(--text-muted);
  font-size:11px;padding:1px 6px;border-radius:10px;font-weight:600;
  font-family:var(--font-mono);
}
.nav-item.active .nav-badge{background:var(--accent);color:#fff}

/* ============================================================
   Items d'administration système avec préfixe module
   ============================================================
   Chaque item de la section "Administration système" affiche
   le nom du module en préfixe (étiquette en haut, en orange)
   suivi du libellé de l'item en dessous.
*/
.nav-admin-item{
  align-items:flex-start !important;
  padding-top:8px;padding-bottom:8px;
  border-left:3px solid transparent;
  transition:background .15s, border-color .15s, color .15s;
}
.nav-admin-item .ico{margin-top:2px;flex-shrink:0}
.nav-admin-text{
  display:flex;flex-direction:column;
  line-height:1.25;
  gap:1px;flex:1;min-width:0;
}
.nav-admin-module{
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:700;
  color:var(--accent);
  opacity:.9;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.nav-admin-label{
  font-size:13.5px;
  font-weight:500;
  color:inherit;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.nav-admin-item:hover{
  background:var(--accent-soft);
  border-left-color:var(--accent);
  color:var(--accent);
}
.nav-admin-item.active{
  background:var(--accent-soft);
  border-left-color:var(--accent);
  color:var(--accent);
  font-weight:600;
}
.nav-admin-item.active .nav-admin-module{
  opacity:1;
}
/* Mode clair : adapter les couleurs */
[data-theme="coris"] .nav-admin-module {
  color:var(--accent);
}

/* ============================================================
   Badge AUTEUR (utilisateur ayant saisi un enregistrement)
   ============================================================
   Utilisé en première colonne des listes principales pour
   afficher la traçabilité visuelle (qui a saisi quoi).
*/
.author-badge{
  display:inline-flex;align-items:center;gap:7px;
  font-size:12.5px;color:var(--text-muted);
  white-space:nowrap;
  max-width:160px;
}
.author-badge-compact{ gap:0 }
.author-badge .author-name{
  overflow:hidden;text-overflow:ellipsis;
  font-weight:500;color:var(--text);
  max-width:120px;
}
.author-avatar{
  flex-shrink:0;
  border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-weight:700;color:#fff;
  letter-spacing:.02em;
  box-shadow:0 1px 2px rgba(0,0,0,.15);
  user-select:none;
  overflow:hidden;
}
/* Palette colorée déterministe (6 nuances cohérentes avec la charte) */
.author-avatar-c0{background:linear-gradient(135deg,#4a90c2,#1e5a8a)}
.author-avatar-c1{background:linear-gradient(135deg,#dd1a1a,#a8480a)}
.author-avatar-c2{background:linear-gradient(135deg,#7c5cb8,#4d3580)}
.author-avatar-c3{background:linear-gradient(135deg,#3fb950,#1f7a32)}
.author-avatar-c4{background:linear-gradient(135deg,#c2456b,#8a1f47)}
.author-avatar-c5{background:linear-gradient(135deg,#5a8a82,#2d4f4a)}
.author-avatar-unknown{
  background:var(--panel-2);color:var(--text-dim);
  border:1px dashed var(--border);
}
/* Cellule "Saisi par" dans les tableaux : largeur compacte */
td.col-author, th.col-author{
  width:160px;min-width:140px;
}

.sidebar-footer{
  margin-top:auto;padding:16px 20px;
  border-top:1px solid var(--border);
  display:flex;align-items:center;gap:10px;
}
.user-avatar{
  width:32px;height:32px;border-radius:50%;
  background:linear-gradient(135deg,var(--steel),var(--accent));
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:13px;color:#fff;
}
.user-info{flex:1;min-width:0;line-height:1.2}
.user-info strong{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-info small{color:var(--text-dim);font-size:11px}
.logout-btn{
  background:transparent;color:var(--text-muted);
  width:30px;height:30px;border-radius:6px;
  display:flex;align-items:center;justify-content:center;
}
.logout-btn:hover{background:var(--panel);color:var(--danger)}

/* Main content */
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{
  height:60px;
  background:var(--bg-soft);
  border-bottom:1px solid var(--border-strong);
  display:flex;align-items:center;
  padding:0 28px;gap:20px;
  position:sticky;top:0;z-index:50;
}
.topbar h1{font-size:17px;font-weight:700;letter-spacing:-.01em}
.topbar h1 small{
  display:block;font-size:12px;color:var(--text-muted);
  font-weight:500;text-transform:uppercase;letter-spacing:.08em;
}
.topbar-actions{margin-left:auto;display:flex;gap:10px;align-items:center}

/* Bloc utilisateur dans la topbar */
.topbar-user{
  display:flex;align-items:center;gap:8px;
  padding:5px 12px 5px 5px;
  background:var(--bg-soft);
  border:1px solid var(--border);
  border-radius:20px;
  margin-right:2px;
}
.topbar-user-avatar{
  width:30px;height:30px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--primary),var(--primary-light));
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;letter-spacing:.05em;
  flex-shrink:0;
}
.topbar-user-info{
  display:flex;flex-direction:column;line-height:1.15;min-width:0
}
.topbar-user-info strong{
  font-size:13px;font-weight:700;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px;
}
.topbar-user-info small{
  font-size:11px;color:var(--text-muted);font-weight:500;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px;
}

/* Bouton déconnexion dans la topbar */
.topbar-logout{
  display:inline-flex;align-items:center;gap:7px;
  padding:7px 14px;
  background:rgba(248,81,73,.08);
  border:1px solid rgba(248,81,73,.3);
  border-radius:var(--radius);
  color:var(--danger);
  font-size:13px;font-weight:600;
  font-family:inherit;
  cursor:pointer;
  transition:all .15s;
  white-space:nowrap;
}
.topbar-logout:hover{
  background:var(--danger);
  color:#fff;
  border-color:var(--danger);
}
.topbar-logout svg{flex-shrink:0}

/* Sur mobile, on cache le texte du bouton et le bloc user pour gagner de la place */
@media (max-width:768px){
  .topbar-user-info{display:none}
  .topbar-user{padding:4px;border-radius:50%;}
  .topbar-logout span{display:none}
  .topbar-logout{padding:7px;width:34px;justify-content:center}
}

/* Bouton bascule thème */
.theme-toggle{
  width:34px;height:34px;
  background:var(--bg-soft);
  border:1px solid var(--border);
  border-radius:var(--radius);
  color:var(--text-muted);
  display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:all .15s;
  position:relative;
}
.theme-toggle:hover{
  color:var(--accent);
  border-color:var(--accent);
  background:var(--accent-soft);
}

/* Bouton flottant pour l'écran de login (visible par défaut, masqué quand l'app est ouverte) */
.theme-toggle-floating{
  position:fixed;
  top:18px;right:18px;
  width:36px;height:36px;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  color:var(--text-muted);
  display:flex;
  align-items:center;justify-content:center;
  cursor:pointer;
  z-index:150;
  box-shadow:var(--shadow);
  transition:all .15s;
}
.theme-toggle-floating.hidden{display:none}
.theme-toggle-floating:hover{
  color:var(--accent);border-color:var(--accent);
}
.sync-indicator{
  font-size:12px;color:var(--text-muted);
  display:flex;align-items:center;gap:6px;
  font-family:var(--font-mono);
}
.sync-dot{
  width:7px;height:7px;border-radius:50%;
  background:var(--success);
  box-shadow:0 0 0 3px rgba(63,185,80,.15);
  animation:pulse 2s infinite;
}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
.sync-dot.offline{background:var(--text-dim);box-shadow:0 0 0 3px rgba(110,118,129,.15);animation:none}

.content{padding:28px;flex:1;max-width:1400px;width:100%}

/* Page header */
.page-header{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:24px;flex-wrap:wrap;gap:14px;
}
.page-title{
  font-size:24px;font-weight:800;letter-spacing:-.02em;
}

/* ==========================================================
   EN-TÊTE DE PAGE — identité à gauche, outils à droite
   Le bloc d'identité ne doit jamais être écrasé par les
   contrôles : il garde une largeur plancher, et les champs
   de recherche/sélection se rétractent avant lui.
   ========================================================== */
.ph-ident{
  display:flex;align-items:center;gap:12px;
  flex:1 1 300px;min-width:0;
}
.ph-ico{
  width:38px;height:38px;flex-shrink:0;
  background:var(--primary-soft);border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  color:var(--primary-light);
}
.ph-txt{min-width:0}
.ph-sur{
  font-size:12px;color:var(--primary-light);
  font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.ph-sous{
  font-size:13px;color:var(--text-muted);margin-top:1px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.ph-outils{
  display:flex;gap:8px;align-items:center;flex-wrap:wrap;
  flex:1 1 auto;justify-content:flex-end;min-width:0;
}
.ph-outils .ph-champ{flex:1 1 200px;min-width:150px;max-width:330px}

@media (max-width:640px){
  .ph-ident{flex:1 1 100%}
  .ph-sous{white-space:normal}
  .ph-outils{justify-content:flex-start}
  .ph-outils .ph-champ{max-width:none}
}
.page-subtitle{
  color:var(--text-muted);font-size:14px;margin-top:2px;
}

/* KPI Cards */
.kpi-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;margin-bottom:28px;
}

/* Variante centrée : icône, libellé, valeur et légende alignés au centre. */
.kpi-grid.kpi-centre .kpi{
  align-items:center;
  text-align:center;
}
.kpi-grid.kpi-centre .kpi-icon{margin-left:auto;margin-right:auto}
/* .kpi-meta est en flex : text-align ne suffit pas à le centrer. */
.kpi-grid.kpi-centre .kpi-meta{justify-content:center}

/* Grille de 5 indicateurs : les garder sur une seule rangée.
   auto-fit avec un plancher de 220px ne tient que 4 colonnes dans la
   largeur de contenu habituelle et rejette le 5e à la ligne. */
.kpi-grid.kpi-5{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}
.kpi-grid.kpi-5 .kpi{padding:14px 14px 12px}
.kpi-grid.kpi-5 .kpi-icon{width:38px;height:38px;border-radius:10px;margin-bottom:9px}
.kpi-grid.kpi-5 .kpi-icon svg{width:17px;height:17px}
.kpi-grid.kpi-5 .kpi-label{font-size:11px;letter-spacing:.06em}
.kpi-grid.kpi-5 .kpi-value{font-size:21px}
.kpi-grid.kpi-5 .kpi-meta{font-size:11px;margin-top:4px}

@media (max-width:1200px){
  .kpi-grid.kpi-5{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:768px){
  .kpi-grid.kpi-5{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.kpi{
  background:var(--panel);
  border:1px solid var(--border-strong);
  border-radius:var(--radius-lg);
  padding:18px 20px 16px;
  position:relative;overflow:hidden;
  display:flex;flex-direction:column;gap:2px;
}
.kpi::after{
  content:'';position:absolute;top:0;right:0;
  width:80px;height:80px;
  background:radial-gradient(circle,var(--accent-soft) 0%,transparent 70%);
  pointer-events:none;
}
.kpi-icon{
  width:46px;height:46px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:12px;flex-shrink:0;
  box-shadow:0 4px 12px rgba(0,0,0,.15);
}
.kpi-label{
  font-size:12px;font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;color:var(--text-muted);
}
.kpi-value{
  font-size:30px;font-weight:800;letter-spacing:-.02em;
  margin-top:4px;
  font-family:var(--font-mono);
}
.kpi-meta{
  font-size:12px;color:var(--text-dim);margin-top:6px;
  display:flex;align-items:center;gap:6px;
}
.kpi.accent::after{background:radial-gradient(circle,var(--accent-soft) 0%,transparent 70%)}
.kpi.steel::after{background:radial-gradient(circle,var(--steel-soft) 0%,transparent 70%)}
.kpi.danger::after{background:radial-gradient(circle,rgba(248,81,73,.15) 0%,transparent 70%)}
.kpi.success::after{background:radial-gradient(circle,rgba(63,185,80,.15) 0%,transparent 70%)}

/* Card */
.card{
  background:var(--panel);
  border:1px solid var(--border-strong);
  border-radius:var(--radius-lg);
  margin-bottom:20px;
  box-shadow:0 1px 4px rgba(0,0,0,.08);
}
.card-head{
  padding:16px 20px;border-bottom:1px solid var(--border-strong);
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
}
.card-title{font-size:16px;font-weight:700}
.card-body{padding:20px}
.card-body.no-pad{padding:0}

/* Table */
.tbl-wrap{overflow-x:auto;border:1px solid var(--border-strong);border-radius:var(--radius-lg)}
table{
  width:100%;border-collapse:collapse;
  font-size:14px;
}
thead th{
  text-align:left;padding:10px 14px;
  background:var(--bg-soft);
  font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.08em;
  color:var(--text-muted);
  border-bottom:1px solid var(--border-strong);
  white-space:nowrap;
}
tbody td{
  padding:12px 14px;
  border-bottom:1px solid var(--border-strong);
  vertical-align:middle;
}
tbody tr:hover{background:var(--bg-soft)}
tbody tr:last-child td{border-bottom:0}
.cell-strong{font-weight:600;color:var(--text)}
.cell-muted{color:var(--text-muted);font-size:13px}
.cell-mono{font-family:var(--font-mono);font-size:13px}

/* ------------------------------------------------------------------
   Gabarit compact — lignes basses.
   Le contenu ne revient plus a la ligne : la largeur des colonnes
   s'adapte et .tbl-wrap gere le defilement horizontal.
   ------------------------------------------------------------------ */
table.tbl-compact{font-size:13px}
table.tbl-compact thead th{padding:5px 10px;font-size:10px}
table.tbl-compact tbody td{padding:4px 10px;white-space:nowrap}
table.tbl-compact tbody td .cell-strong{white-space:nowrap;font-size:13px}
table.tbl-compact .cell-muted,
table.tbl-compact .cell-mono{font-size:12px}
table.tbl-compact .author-badge{font-size:12px;gap:5px}
table.tbl-compact .author-badge .author-name{white-space:nowrap}
table.tbl-compact .author-avatar{width:18px!important;height:18px!important;font-size:8px!important}
table.tbl-compact .badge{padding:1px 7px;font-size:11px}
table.tbl-compact tbody td > div{overflow:hidden;text-overflow:ellipsis}
table.tbl-compact .row-actions{gap:4px}
table.tbl-compact .icon-btn{width:22px;height:22px}
/* Colonne "Saisi par" resserree dans les tableaux compacts */
table.tbl-compact td.col-author,
table.tbl-compact th.col-author{width:auto;min-width:0}

/* En-tete de carte compact */
.card-head.compact{padding:10px 16px}
.card-head.compact .card-title{font-size:14px}

.empty-state{
  text-align:center;padding:60px 20px;color:var(--text-muted);
}
.empty-state-icon{
  width:50px;height:50px;margin:0 auto 14px;
  border-radius:50%;background:var(--bg-soft);
  display:flex;align-items:center;justify-content:center;
  border:1px dashed var(--border-strong);
  font-size:23px;
}
.empty-state h3{font-size:16px;color:var(--text);margin-bottom:4px}
.empty-state p{font-size:14px;margin-bottom:14px}

/* Badges */
.badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:12px;
  font-size:12px;font-weight:600;
  font-family:var(--font-mono);
  text-transform:uppercase;letter-spacing:.04em;
  white-space:nowrap;
}
.badge.s-nouvelle{background:rgba(88,166,255,.15);color:var(--info)}
.badge.s-encours{background:rgba(240,160,32,.15);color:var(--warning)}
.badge.s-repare{background:rgba(74,144,194,.15);color:var(--steel)}
.badge.s-termine{background:rgba(63,185,80,.15);color:var(--success)}
.badge.s-annule{background:rgba(110,118,129,.15);color:var(--text-dim)}
.badge.p-basse{background:rgba(110,118,129,.15);color:var(--text-muted)}
.badge.p-normale{background:rgba(74,144,194,.15);color:var(--steel)}
.badge.p-haute{background:rgba(240,160,32,.15);color:var(--warning)}
.badge.p-urgente{background:rgba(248,81,73,.15);color:var(--danger)}
.badge.t-actif{background:rgba(63,185,80,.15);color:var(--success)}
.badge.t-panne{background:rgba(248,81,73,.15);color:var(--danger)}
.badge.t-maint{background:rgba(240,160,32,.15);color:var(--warning)}
.badge.t-arret{background:rgba(110,118,129,.15);color:var(--text-dim)}

/* Filters bar */
.filters{
  display:flex;flex-wrap:wrap;gap:10px;align-items:center;
  margin-bottom:16px;
}
.filters input,.filters select{
  background:var(--bg-soft);
  border:1px solid var(--border);
  color:var(--text);
  padding:8px 12px;border-radius:var(--radius);
  font-size:14px;min-width:140px;
}
.filters input:focus,.filters select:focus{
  border-color:var(--accent);
}
.filters input[type="search"]{min-width:240px}
.filters input[type="date"]{
  color-scheme:dark;
  min-width:auto;
}

/* Modal */
.modal-backdrop{
  position:fixed;inset:0;
  background:rgba(0,0,0,.7);
  backdrop-filter:blur(4px);
  display:none;align-items:center;justify-content:center;
  z-index:200;padding:20px;
}
.modal-backdrop.show{display:flex;animation:fadeIn .15s}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal{
  background:var(--panel);
  border:1px solid var(--border-strong);
  border-radius:var(--radius-lg);
  width:100%;max-width:600px;
  max-height:90vh;overflow-y:auto;
  box-shadow:var(--shadow-lg);
  animation:slideUp .2s;
}
@keyframes slideUp{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}
.modal.lg{max-width:800px}
.modal-head{
  padding:18px 22px;border-bottom:1px solid var(--border-strong);
  display:flex;align-items:center;justify-content:space-between;
  position:sticky;top:0;background:var(--panel);z-index:1;
}
.modal-head h2{font-size:17px;font-weight:700}
.modal-close{
  background:transparent;color:var(--text-muted);
  width:30px;height:30px;border-radius:6px;
  display:flex;align-items:center;justify-content:center;font-size:19px;
}
.modal-close:hover{background:var(--bg-soft);color:var(--text)}
.modal-body{padding:22px}
.modal-footer{
  padding:14px 22px;border-top:1px solid var(--border-strong);
  display:flex;justify-content:flex-end;gap:10px;
  position:sticky;bottom:0;background:var(--panel);
}

.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-row.three{grid-template-columns:1fr 1fr 1fr}
@media (max-width:600px){.form-row,.form-row.three{grid-template-columns:1fr}}

/* Actions cell */
.row-actions{display:flex;gap:6px;justify-content:flex-end}
.icon-btn{
  width:28px;height:28px;border-radius:5px;
  background:var(--bg-soft);border:1px solid var(--border);
  color:var(--text-muted);
  display:inline-flex;align-items:center;justify-content:center;
  font-size:14px;
  transition:all .12s;
}
.icon-btn:hover{color:var(--text);border-color:var(--border-strong)}
.icon-btn.danger:hover{color:var(--danger);border-color:var(--danger)}

/* Charts */
.chart-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}
@media (max-width:900px){.chart-grid{grid-template-columns:1fr}}
.chart-wrap{position:relative;height:280px}

/* Status workflow */
.workflow{
  display:flex;align-items:center;gap:8px;
  padding:14px 16px;
  background:var(--bg-soft);border-radius:var(--radius);
  flex-wrap:wrap;
}
.wf-step{
  padding:6px 12px;border-radius:14px;
  font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;
  font-family:var(--font-mono);
  background:var(--panel-2);color:var(--text-muted);
  border:1px solid var(--border);
  cursor:pointer;
  transition:all .15s;
}
.wf-step:hover{border-color:var(--border-strong);color:var(--text)}
.wf-step.current{
  background:var(--accent);color:#fff;border-color:var(--accent);
}
.wf-arrow{color:var(--text-dim);font-size:15px}

/* Detail panel */
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:18px}
.detail-grid.three{grid-template-columns:1fr 1fr 1fr}
@media (max-width:600px){.detail-grid,.detail-grid.three{grid-template-columns:1fr}}
.detail-item label{
  font-size:11px;color:var(--text-muted);
  text-transform:uppercase;letter-spacing:.08em;font-weight:600;
}
.detail-item .val{
  font-size:15px;color:var(--text);margin-top:3px;
  word-break:break-word;
}

/* Frequency badge */
.freq-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 10px;border-radius:12px;
  background:var(--steel-soft);color:var(--steel);
  font-size:12px;font-weight:600;
  font-family:var(--font-mono);
}

/* Mobile */
@media (max-width:768px){
  .sidebar{
    position:fixed;left:-240px;top:0;z-index:100;
    transition:left .2s;
  }
  .sidebar.open{left:0}
  .topbar{padding:0 18px}
  .content{padding:18px}
  .kpi-grid{grid-template-columns:repeat(2,1fr)}
  .menu-toggle{display:flex !important}
}
.menu-toggle{
  display:none;
  width:36px;height:36px;
  background:var(--bg-soft);border:1px solid var(--border);
  border-radius:6px;
  align-items:center;justify-content:center;
  color:var(--text);
}

/* Loader */
.loader{
  display:inline-block;width:14px;height:14px;
  border:2px solid var(--accent-soft);
  border-top-color:var(--accent);
  border-radius:50%;
  animation:spin 0.8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* Toast */
.toast{
  position:fixed;bottom:24px;right:24px;
  background:var(--panel);border:1px solid var(--border);
  border-left:3px solid var(--success);
  padding:12px 18px;border-radius:var(--radius);
  box-shadow:var(--shadow-lg);
  font-size:14px;
  z-index:300;
  animation:slideInRight .2s;
}
.toast.error{border-left-color:var(--danger)}
.toast.warn{border-left-color:var(--warning)}
.toast.action{
  display:flex;align-items:center;gap:14px;
  padding:14px 18px;min-width:320px;
}
.toast.action .toast-msg{flex:1;line-height:1.4}
.toast.action button.toast-btn{
  background:var(--accent);color:#fff;border:0;
  padding:7px 12px;border-radius:6px;font-size:13px;font-weight:700;
  cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:5px;
  white-space:nowrap;
}
.toast.action button.toast-btn:hover{opacity:.9}
.toast.action button.toast-close{
  background:transparent;color:var(--text-muted);border:0;
  width:24px;height:24px;border-radius:4px;cursor:pointer;font-size:17px;
  display:flex;align-items:center;justify-content:center;
}
.toast.action button.toast-close:hover{background:var(--bg-soft);color:var(--text)}
@keyframes slideInRight{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}

hr.sep{border:0;border-top:1px solid var(--border);margin:14px 0}

/* Sub-section in detail */
.sub-section{
  background:var(--bg-soft);
  border:1px solid var(--border-strong);
  border-radius:var(--radius);
  padding:14px;
  margin-top:14px;
}
.sub-section h4{
  font-size:12px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--text-muted);font-weight:700;
  margin-bottom:10px;
}

textarea.field-input{min-height:80px;resize:vertical}

/* ==========================================================
   CHAMP DE RECHERCHE — composant .search-box
   Icone loupe a gauche, bouton d'effacement a droite,
   raccourci clavier "/" et anneau de focus a l'accent.
   ========================================================== */
.search-box{
  position:relative;
  display:inline-flex;align-items:center;
  width:300px;max-width:100%;
}
.search-box .search-ico{
  position:absolute;left:13px;
  width:15px;height:15px;
  color:var(--text-dim);
  pointer-events:none;
  transition:color .15s;
}
.search-box input{
  width:100%;
  background:var(--bg-soft);
  border:1px solid var(--border);
  color:var(--text);
  padding:9px 36px 9px 36px;
  border-radius:999px;
  font-size:14px;font-family:inherit;
  transition:border-color .15s,box-shadow .15s,background .15s;
}
.search-box input::placeholder{color:var(--text-dim)}
.search-box input:hover{border-color:var(--border-strong)}
.search-box input:focus{
  outline:0;
  background:var(--panel);
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-soft);
}
.search-box:focus-within .search-ico{color:var(--accent)}

/* Badge du raccourci clavier — disparait des que le champ sert */
.search-box .search-kbd{
  position:absolute;right:11px;
  font-family:var(--font-mono);font-size:11px;font-weight:600;
  color:var(--text-dim);
  border:1px solid var(--border);border-radius:4px;
  padding:0 5px;line-height:15px;
  pointer-events:none;
  transition:opacity .15s;
}
.search-box:focus-within .search-kbd,
.search-box.has-value .search-kbd{opacity:0}

/* Bouton d'effacement — visible uniquement si le champ est rempli */
.search-box .search-clear{
  position:absolute;right:8px;
  width:20px;height:20px;
  border:0;border-radius:50%;
  background:var(--border);color:var(--text-muted);
  display:none;align-items:center;justify-content:center;
  cursor:pointer;font-size:15px;line-height:1;
  transition:background .15s,color .15s;
}
.search-box .search-clear:hover{background:var(--accent);color:#fff}
.search-box.has-value .search-clear{display:flex}

/* Compteur de resultats affiche a cote du champ */
.search-count{
  font-size:12px;font-weight:600;
  color:var(--text-muted);
  background:var(--bg-soft);
  border:1px solid var(--border);
  border-radius:999px;
  padding:3px 10px;white-space:nowrap;
}
/* Bandeau de compteurs — activités d'un dossier */
.act-compteurs{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:7px 16px;
  background:var(--bg-soft);
  border-bottom:1px solid var(--border);
  font-size:12px;
}
.act-cpt{display:inline-flex;align-items:baseline;gap:5px}
.act-cpt-lbl{
  font-size:10.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;
  opacity:.85;
}
.act-cpt-val{font-size:15px;font-weight:800}

/* Taux d'exécution — jauge à deux segments :
   plein = activités exécutées, hachuré = activités en cours */
.act-taux{
  display:inline-flex;align-items:center;gap:7px;
  margin-left:auto;
  padding-left:16px;
  border-left:1px solid var(--border);
}
.act-jauge{
  display:inline-flex;
  width:90px;height:5px;
  background:var(--border);
  border-radius:3px;overflow:hidden;
}
.act-jauge-exec{background:var(--success);transition:width .3s}
.act-jauge-enc{
  background:repeating-linear-gradient(45deg,var(--warning),var(--warning) 3px,transparent 3px,transparent 6px);
  transition:width .3s;
}
.act-taux-val{font-size:14px;font-weight:800}
.act-taux-detail{
  font-size:11px;color:var(--text-dim);
  border:1px solid var(--border);border-radius:999px;
  padding:1px 7px;
}
@media (max-width:720px){
  .act-taux{margin-left:0;padding-left:0;border-left:0;flex:1 1 100%}
}

/* Bandeau de planification automatique (formulaire de dossier) */
.plan-auto{
  display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;
  padding:10px 12px;margin-bottom:12px;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
}
.plan-auto-champ{display:flex;flex-direction:column;gap:3px;min-width:0}
.plan-auto-champ label{
  font-size:11px;font-weight:700;color:var(--text-dim);
  text-transform:uppercase;letter-spacing:.05em;
}
.plan-auto-champ .field-input{padding:6px 8px;font-size:13px;min-width:0}
.plan-auto-aide{
  font-size:11.5px;color:var(--text-dim);
  flex:1 1 100%;
}
@media (max-width:640px){
  .plan-auto-champ{flex:1 1 100%}
  .plan-auto-champ .field-input{width:100%}
}

/* Champ de saisie du numéro de séquence (catalogue d'activités) */
.seq-input{
  width:50px;
  text-align:center;
  font-family:var(--font-mono);font-size:12px;font-weight:700;
  color:var(--accent);
  background:var(--bg-soft);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:3px 4px;
  transition:border-color .15s,box-shadow .15s;
}
.seq-input:hover{border-color:var(--border-strong)}
.seq-input:focus{
  outline:0;border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-soft);
  background:var(--panel);
}

/* ==========================================================
   BARRE DE FILTRES — Liste des dossiers
   ========================================================== */
.prj-filtres{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:9px 16px;
  border-bottom:1px solid var(--border);
  background:var(--bg-soft);
}
.prj-filtre-lbl{
  display:inline-flex;align-items:center;gap:6px;
  font-size:11px;font-weight:700;color:var(--text-dim);
  text-transform:uppercase;letter-spacing:.05em;
}
.prj-filtre-lbl select{max-width:210px}
.prj-compteur{
  font-size:12px;font-weight:600;color:var(--text-muted);
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:999px;padding:3px 10px;white-space:nowrap;
}
.prj-compteur.vide{color:var(--warning);border-color:var(--warning)}
@media (max-width:640px){
  .prj-filtres{padding:9px 12px}
  .prj-filtre-lbl{flex:1 1 100%}
  .prj-filtre-lbl select{flex:1;max-width:none}
}

/* ==========================================================
   VUE KANBAN — Liste des dossiers
   ========================================================== */
.kb-plateau{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(215px,1fr));
  gap:10px;
  padding:12px;
  align-items:start;
}
.kb-colonne{
  background:var(--bg-soft);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  overflow:hidden;
  min-width:0;
}
.kb-colonne-tete{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:7px 10px;
  background:var(--panel);
  border-bottom:1px solid var(--border);
}
.kb-colonne-titre{
  font-size:12px;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;
  color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.kb-compteur{
  font-family:var(--font-mono);font-size:11px;font-weight:700;
  border:1px solid;border-radius:999px;
  padding:1px 7px;flex-shrink:0;
}
.kb-colonne-corps{
  padding:7px;
  display:flex;flex-direction:column;gap:5px;
  min-height:110px;
  max-height:calc(100vh - 330px);
  overflow-y:auto;
  transition:background .15s;
}
.kb-colonne-corps.kb-survol{
  background:var(--accent-soft);
  box-shadow:inset 0 0 0 2px var(--accent);
}
.kb-colonne-vide{
  text-align:center;
  font-size:12px;color:var(--text-dim);font-style:italic;
  padding:16px 8px;
  border:1px dashed var(--border);
  border-radius:var(--radius);
}

/* --- Carte (gabarit compact : 4 lignes maximum) --- */
.kb-carte{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:6px 8px;
  display:flex;flex-direction:column;gap:3px;
  transition:box-shadow .15s,border-color .15s;
}
.kb-carte:hover{
  border-color:var(--border-strong);
  box-shadow:0 2px 7px rgba(0,0,0,.12);
}
.kb-carte.kb-carte-drag{opacity:.45}

/* Ligne 1 : code, badges type/régime, bouton modifier */
.kb-carte-tete{display:flex;align-items:center;gap:5px;min-width:0}
.kb-code{
  font-size:10.5px;font-weight:700;color:var(--accent);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;
}
.kb-carte-tags{display:inline-flex;gap:3px;flex-shrink:0;margin-left:auto}
.kb-tag{
  font-family:var(--font-mono);font-size:8.5px;font-weight:700;
  border-radius:3px;padding:0 4px;line-height:14px;
}
.kb-carte .kb-edit{
  opacity:0;transition:opacity .15s;
  width:18px;height:18px;flex-shrink:0;
}
.kb-carte:hover .kb-edit{opacity:1}

/* Ligne 2 : intitulé, sur une seule ligne */
.kb-carte-titre{
  font-size:12px;font-weight:700;color:var(--text);line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* Ligne 3 : client, échéance, alertes */
.kb-carte-meta{
  display:flex;align-items:center;gap:4px;
  font-size:10.5px;color:var(--text-muted);
  min-width:0;
}
.kb-meta-item{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.kb-meta-sep{color:var(--text-dim);flex-shrink:0}
.kb-alerte{font-size:10px;font-weight:700;flex-shrink:0;margin-left:auto}
.kb-alerte + .kb-alerte{margin-left:3px}

/* Ligne 4 : avancement et marge */
.kb-carte-barre{display:flex;align-items:center;gap:5px;min-width:0}
.kb-barre-piste{
  flex:1;height:3px;background:var(--bg-soft);
  border-radius:2px;overflow:hidden;min-width:24px;
}
.kb-pct{font-size:10px;font-weight:700;flex-shrink:0}
.kb-marge{font-size:10px;font-weight:700;flex-shrink:0;margin-left:auto}
.kb-carte-vide{font-size:10px;color:var(--text-dim);font-style:italic;flex:1}

.kb-aide{
  display:flex;align-items:center;gap:6px;
  font-size:12px;color:var(--text-dim);
  padding:0 16px 14px;
}
@media (max-width:720px){
  .kb-plateau{grid-template-columns:1fr;padding:10px}
  .kb-colonne-corps{max-height:none}
}

.jrn-select{
  background:var(--bg-soft);
  border:1px solid var(--border);
  color:var(--text);
  padding:7px 10px;
  border-radius:var(--radius);
  font-size:13px;font-family:inherit;
  cursor:pointer;
  transition:border-color .15s;
}
.jrn-select:hover{border-color:var(--border-strong)}
.jrn-select:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}

.search-count.empty{
  color:var(--warning);
  border-color:var(--warning);
  background:transparent;
}

/* ========================================================== */
/* FLATPICKR - Sélecteur de date moderne (intégration thème)   */
/* ========================================================== */
.flatpickr-calendar{
  background:var(--panel) !important;
  border:1px solid var(--border) !important;
  border-radius:14px !important;
  box-shadow:0 16px 48px rgba(0,0,0,.35), 0 4px 12px rgba(0,0,0,.18) !important;
  font-family:inherit !important;
  width:320px !important;
  padding:6px 4px 10px !important;
}
[data-theme="coris"] .flatpickr-calendar {
  box-shadow:0 14px 40px rgba(15,23,42,.18), 0 3px 10px rgba(15,23,42,.08) !important;
}
.flatpickr-calendar.arrowTop:before,
.flatpickr-calendar.arrowTop:after,
.flatpickr-calendar.arrowBottom:before,
.flatpickr-calendar.arrowBottom:after{display:none !important}

.flatpickr-months{
  padding:8px 6px 6px;
  background:transparent !important;
  border-radius:14px 14px 0 0;
}
.flatpickr-month{
  background:transparent !important;
  color:var(--text) !important;
  height:42px !important;
}
.flatpickr-current-month{
  font-size:16px !important;
  font-weight:700 !important;
  padding:6px 0 0 !important;
  color:var(--text) !important;
}
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year{
  background:transparent !important;
  color:var(--text) !important;
  font-weight:700 !important;
  font-family:inherit !important;
}
.flatpickr-current-month .flatpickr-monthDropdown-months:hover{
  background:var(--panel-2) !important;
}
.flatpickr-current-month .flatpickr-monthDropdown-months option{
  background:var(--panel) !important;
  color:var(--text) !important;
}
.flatpickr-prev-month, .flatpickr-next-month{
  fill:var(--text-muted) !important;
  color:var(--text-muted) !important;
  padding:8px 10px !important;
  border-radius:8px;
  transition:all .15s ease;
}
.flatpickr-prev-month:hover, .flatpickr-next-month:hover{
  background:var(--panel-2) !important;
  fill:var(--accent) !important;
  color:var(--accent) !important;
}
.flatpickr-prev-month svg, .flatpickr-next-month svg{
  fill:inherit !important;
}

.flatpickr-weekdays{
  background:transparent !important;
  height:32px !important;
  padding:4px 6px 0;
}
.flatpickr-weekday{
  background:transparent !important;
  color:var(--text-muted) !important;
  font-weight:700 !important;
  font-size:12px !important;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.flatpickr-days{padding:4px 6px 6px;width:auto !important}
.dayContainer{width:auto !important;min-width:0 !important;padding:2px 0}

.flatpickr-day{
  color:var(--text) !important;
  border-radius:8px !important;
  font-weight:500 !important;
  border:1px solid transparent !important;
  max-width:40px !important;
  height:38px !important;
  line-height:38px !important;
  margin:1px !important;
  transition:all .15s ease;
}
.flatpickr-day:hover{
  background:var(--panel-2) !important;
  border-color:var(--border) !important;
  color:var(--accent) !important;
}
.flatpickr-day.today{
  border-color:var(--accent) !important;
  color:var(--accent) !important;
  font-weight:700 !important;
}
.flatpickr-day.today:hover{
  background:var(--accent) !important;
  color:#fff !important;
}
.flatpickr-day.selected,
.flatpickr-day.selected:hover{
  background:var(--accent) !important;
  border-color:var(--accent) !important;
  color:#fff !important;
  font-weight:700 !important;
  box-shadow:0 4px 12px rgba(99,102,241,.35);
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay{
  color:var(--text-muted) !important;
  opacity:.35;
}
.flatpickr-day.inRange,
.flatpickr-day.startRange,
.flatpickr-day.endRange{
  background:var(--accent) !important;
  border-color:var(--accent) !important;
  color:#fff !important;
}

.numInputWrapper:hover{background:transparent !important}
.numInputWrapper span{
  border-color:var(--border) !important;
}
.numInputWrapper span:hover{background:var(--panel-2) !important}
.numInputWrapper span.arrowUp:after{border-bottom-color:var(--text-muted) !important}
.numInputWrapper span.arrowDown:after{border-top-color:var(--text-muted) !important}

/* Champ de date dans le formulaire : icône calendrier visible */
input.flatpickr-input.field-input,
input.flatpickr-input{
  cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='4' width='18' height='18' rx='2' ry='2'/><line x1='16' y1='2' x2='16' y2='6'/><line x1='8' y1='2' x2='8' y2='6'/><line x1='3' y1='10' x2='21' y2='10'/></svg>");
  background-repeat:no-repeat;
  background-position:right 10px center;
  background-size:16px 16px;
  padding-right:34px !important;
}
[data-theme="coris"] input.flatpickr-input.field-input,
[data-theme="coris"] input.flatpickr-input {
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='4' width='18' height='18' rx='2' ry='2'/><line x1='16' y1='2' x2='16' y2='6'/><line x1='8' y1='2' x2='8' y2='6'/><line x1='3' y1='10' x2='21' y2='10'/></svg>");
}

/* Tableaux compacts : icône légèrement plus petite et padding ajusté */
table input.flatpickr-input{
  padding-right:26px !important;
  background-position:right 6px center;
  background-size:13px 13px;
}
/* ==================================================================
   THÈME CORIS BANK — surcharges globales
   Référence : fiche « Utilitaires MyCoris Bank »
   • fond clair, cartes blanches très arrondies, ombre bleutée douce
   • texte bleu marine (#0b1f5c), icônes bleu vif (#1e5bc6), rouge d'alerte
   • bannières en dégradé bleu vif → marine, boutons pilules blancs
   • police géométrique Jost, graisse 600/700 sur les titres
   ================================================================== */

/* ---- Fond d'écran : arcs bleu clair comme sur la fiche Coris ---- */
body{
  background:var(--bg);
  background-image:
    radial-gradient(ellipse 900px 520px at 8% 12%, rgba(30,91,198,.07) 0%, transparent 60%),
    radial-gradient(ellipse 700px 420px at 92% 88%, rgba(11,31,92,.06) 0%, transparent 60%),
    repeating-radial-gradient(circle at 110% -10%, transparent 0 140px, rgba(30,91,198,.045) 141px 143px);
  background-attachment:fixed;
  color-scheme:light;
}
[data-theme="coris"] body{
  background-image:
    radial-gradient(ellipse 900px 520px at 8% 12%, rgba(30,91,198,.07) 0%, transparent 60%),
    radial-gradient(ellipse 700px 420px at 92% 88%, rgba(11,31,92,.06) 0%, transparent 60%),
    repeating-radial-gradient(circle at 110% -10%, transparent 0 140px, rgba(30,91,198,.045) 141px 143px);
}

h1,h2,h3,h4,.page-title,.card-title,.login-title,.modal-head h2,.topbar h1,.landing-title{
  color:var(--text);
}
.page-title{font-weight:700;letter-spacing:-.01em}

/* ---- Cartes : blanc, sans bordure visible, ombre bleutée ---- */
.card,.kpi,.login-card,.modal,.feature-card,.module-row,.landing-stats-grid,.landing-mockup{
  background:var(--panel);
  border:1px solid rgba(11,31,92,.04);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow);
}
.card-head{border-bottom:1px solid var(--border);padding:18px 22px}
.card-title{font-weight:700;font-size:16px}
.kpi{padding:20px 22px 18px}
.kpi::after{background:radial-gradient(circle,rgba(30,91,198,.10) 0%,transparent 70%)}
.kpi-icon{
  border-radius:14px;
  background:var(--coris-grad);
  color:#fff;
  box-shadow:0 8px 18px rgba(30,91,198,.28);
}
.kpi-label{color:var(--text-muted);text-transform:none;letter-spacing:0;font-size:13px;font-weight:600}
.kpi-value{font-family:var(--font-display);font-weight:700;color:var(--text)}
.feature-card:hover,.module-row:hover{box-shadow:var(--shadow-lg);border-color:rgba(30,91,198,.18)}
.feature-icon{border-radius:16px}
.landing-stats-grid::before{background:var(--coris-grad)}
.stat-number{background:var(--coris-grad);-webkit-background-clip:text;background-clip:text}
.module-num{background:linear-gradient(135deg,var(--accent),transparent 85%);-webkit-background-clip:text;background-clip:text}
.module-cat{color:var(--accent)}

/* ---- Barre latérale : blanche, navigation en pilules ---- */
.sidebar{
  background:var(--panel);
  border-right:1px solid var(--border);
  box-shadow:4px 0 24px rgba(11,31,92,.05);
}
.sidebar-brand{border-bottom:1px solid var(--border)}
.brand-mark,.login-logo-mark,.landing-brand-mark{
  background:var(--coris-grad);
  border-radius:12px;
  box-shadow:0 6px 16px rgba(30,91,198,.28);
}
.brand-text strong{color:var(--text)}
.nav-item{
  border-radius:14px;
  color:var(--text-muted);
  font-weight:500;
}
.nav-item:hover{background:var(--bg-soft);color:var(--text)}
.nav-item.active{
  background:var(--accent-soft);
  color:var(--accent);
  font-weight:600;
}
.nav-item.active .ico{color:var(--accent)}
.nav-item.active .nav-badge{background:var(--accent);color:#fff}
.nav-badge{font-family:var(--font-display);background:var(--bg-soft);color:var(--text-muted);border-radius:999px;padding:1px 8px}
.nav-label,.nav-label-text{color:var(--text-dim);font-weight:600}
.nav-admin-module{color:var(--text-dim)}
.sidebar-footer{border-top:1px solid var(--border)}

/* ---- Barre supérieure ---- */
.topbar{
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
}
.topbar h1{color:var(--text);font-weight:700}
.topbar h1 small{color:var(--text-dim);text-transform:none;letter-spacing:0;font-weight:500}
.topbar-user{background:var(--bg-soft);border:1px solid var(--border);border-radius:999px}
.topbar-user-avatar,.user-avatar{background:var(--coris-grad);color:#fff}
.theme-toggle,.theme-toggle-floating,#theme-toggle,#theme-toggle-floating{display:none !important}
.sync-indicator{font-family:var(--font-display)}
.sync-dot{box-shadow:0 0 0 3px rgba(21,143,74,.15)}

/* ---- Boutons : dégradé bleu, angles très arrondis ---- */
.btn{
  background:var(--coris-grad);
  color:#fff;
  border-radius:14px;
  font-weight:600;
  padding:11px 20px;
  box-shadow:0 6px 16px rgba(30,91,198,.22);
  transition:transform .12s, box-shadow .15s, filter .15s;
}
.btn:hover{filter:brightness(1.06);box-shadow:0 10px 22px rgba(30,91,198,.30);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn.secondary{
  background:#fff;color:var(--text);
  border:1.5px solid var(--border-strong);
  box-shadow:none;
}
.btn.secondary:hover{background:var(--bg-soft);border-color:var(--accent)}
.btn.ghost{background:transparent;color:var(--text-muted);border:1.5px solid var(--border-strong);box-shadow:none}
.btn.ghost:hover{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
.btn.danger{background:linear-gradient(90deg,#e8323c,#b3121c);box-shadow:0 6px 16px rgba(232,50,60,.22)}
.btn.success{background:linear-gradient(90deg,#1aa356,#0f7a3f);box-shadow:0 6px 16px rgba(21,143,74,.22)}
.btn.sm{border-radius:11px;padding:6px 13px}
.icon-btn{border-radius:10px;background:var(--bg-soft);border:1px solid var(--border);color:var(--text-muted)}
.icon-btn:hover{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
.landing-cta-small,.landing-cta-primary{
  background:var(--coris-grad);
  border-radius:16px;
  box-shadow:0 8px 20px rgba(30,91,198,.28);
}
.landing-cta-small:hover,.landing-cta-primary:hover{box-shadow:0 12px 28px rgba(30,91,198,.36)}
.landing-cta-secondary{border-radius:16px;border:1.5px solid var(--border-strong);background:#fff}
.landing-cta-secondary:hover{border-color:var(--accent);background:var(--accent-soft)}

/* ---- Champs de saisie : fond gris-bleu, sans bordure dure ---- */
.field label{text-transform:none;letter-spacing:0;font-size:13px;font-weight:600;color:var(--text-muted)}
.field input,.field select,.field textarea,.field-input,
.filters input,.filters select,.search-box input,.jrn-select,.seq-input{
  background:var(--bg-soft);
  border:1.5px solid transparent;
  color:var(--text);
  border-radius:14px;
}
.field input:focus,.field select:focus,.field textarea:focus,.field-input:focus,
.filters input:focus,.filters select:focus,.search-box input:focus{
  background:#fff;
  border-color:var(--accent);
  box-shadow:0 0 0 4px var(--accent-soft);
}
.field input::placeholder,.filters input::placeholder,.search-box input::placeholder{color:var(--text-dim)}
input[type="date"],input[type="datetime-local"],input[type="time"]{color-scheme:light}

/* ---- Tableaux ---- */
.tbl-wrap{border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;background:var(--panel)}
thead th{
  background:var(--panel-2);
  color:var(--text-muted);
  text-transform:none;letter-spacing:0;
  font-size:12.5px;font-weight:700;
  border-bottom:1px solid var(--border);
}
tbody td{border-bottom:1px solid var(--border)}
tbody tr:hover{background:#f6f9fe}
.cell-mono{color:var(--text)}
.cell-muted{color:var(--text-muted)}

/* ---- Badges : pilules, police Jost, tons pastel Coris ---- */
.badge{font-family:var(--font-display);text-transform:none;letter-spacing:0;border-radius:999px;padding:4px 11px;font-weight:600}
.badge.s-nouvelle,.badge.p-normale{background:#e4edfb;color:#1e5bc6}
.badge.s-encours,.badge.p-haute,.badge.t-maint{background:#fdf0dc;color:#9a5e03}
.badge.s-repare{background:#e2f0fd;color:#1a5cb0}
.badge.s-termine,.badge.t-actif{background:#dcf3e5;color:#0f7a3f}
.badge.s-annule,.badge.p-basse,.badge.t-arret{background:#eceff5;color:#4a5677}
.badge.p-urgente,.badge.t-panne{background:#fde3e5;color:#c0121c}
.freq-badge,.kb-tag{border-radius:999px}

/* ---- Fenêtres modales ---- */
.modal{border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:0}
.modal-backdrop{background:rgba(11,31,92,.35);backdrop-filter:blur(3px)}
.modal-head{border-bottom:1px solid var(--border);padding:20px 24px}
.modal-head h2{font-weight:700}
.modal-close{
  width:36px;height:36px;border-radius:50%;
  background:var(--bg-soft);color:var(--text);
  font-weight:700;
}
.modal-close:hover{background:#e3e9f5}
.modal-footer{border-top:1px solid var(--border)}

/* ---- Toasts, états vides, chargement ---- */
.toast{border:0;border-left:4px solid var(--accent);border-radius:14px;box-shadow:var(--shadow-lg);color:var(--text)}
.toast.error{border-left-color:var(--danger)}
.toast.warn{border-left-color:var(--warning)}
.empty-state{color:var(--text-dim)}
.error-msg{background:var(--coris-red-soft);border:1px solid rgba(232,50,60,.25);color:#c0121c;border-radius:14px}

/* ---- Page d'accueil (landing) ---- */
#landing-screen{background:transparent}
.landing-nav{background:rgba(255,255,255,.88);border-bottom:1px solid var(--border);backdrop-filter:blur(14px)}
.landing-nav-link{color:var(--text-muted)}
.landing-nav-link:hover{color:var(--accent)}
.landing-brand-tag,.landing-brand-tag-side{color:var(--text-dim);border-left-color:var(--accent)}
.landing-hero-bg{
  background:
    radial-gradient(circle at 20% 30%, rgba(30,91,198,.16), transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(11,31,92,.14), transparent 55%),
    radial-gradient(circle at 50% 80%, rgba(47,125,225,.10), transparent 60%);
}
.landing-badge{background:var(--accent-soft);color:var(--accent);border:1px solid rgba(30,91,198,.25)}
.grad-text{background:var(--coris-grad);-webkit-background-clip:text;background-clip:text}
.landing-mockup{box-shadow:0 30px 80px rgba(11,31,92,.16), 0 0 0 1px rgba(30,91,198,.10)}
.landing-mockup-bar{background:var(--panel-2)}
.landing-eyebrow{color:var(--accent)}
.landing-cta-final{
  background:var(--coris-grad);
  border-radius:var(--radius-lg);
  box-shadow:0 20px 50px rgba(11,31,92,.25);
}
.landing-footer{border-top:1px solid var(--border)}
.login-card::before{background:var(--coris-grad);height:5px}
.login-back-link:hover{color:var(--accent);background:var(--accent-soft)}

/* ---- Bannière type « Essayer notre démo » (réutilisable) ---- */
.coris-banner{
  display:flex;align-items:center;gap:16px;
  background:var(--coris-grad);color:#fff;
  border-radius:var(--radius-lg);padding:18px 22px;
  box-shadow:0 14px 34px rgba(11,31,92,.25);
}
.coris-banner strong{display:block;font-size:17px;font-weight:700}
.coris-banner span{font-size:14px;opacity:.9}
.coris-banner .btn{
  margin-left:auto;background:#fff;color:var(--text);
  border-radius:20px;padding:12px 30px;font-weight:700;font-size:16px;
  box-shadow:0 6px 16px rgba(0,0,0,.15);
}

/* ---- Kanban, workflow, divers panneaux ---- */
.kb-colonne,.kb-carte,.wf-step,.stat-block,.detail-item,.sub-section{border-radius:14px}
.kb-carte{background:var(--panel);box-shadow:var(--shadow);border:1px solid rgba(11,31,92,.04)}
.kb-colonne{background:var(--bg-soft)}
.wf-step{background:var(--panel);box-shadow:var(--shadow)}
.page-subtitle,.ph-sous{color:var(--text-dim)}
.ph-ico{background:var(--accent-soft);color:var(--accent);border-radius:14px}

/* ---- Flatpickr (calendrier) ---- */
.flatpickr-calendar{border-radius:18px;box-shadow:var(--shadow-lg);border:0;background:#fff}
.flatpickr-day.selected,.flatpickr-day.selected:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.flatpickr-day.today{border-color:var(--accent)}
.flatpickr-months .flatpickr-month,.flatpickr-current-month,.flatpickr-weekday{color:var(--text)}

/* ---- Menu thème (conservé mais masqué) ---- */
#theme-picker{display:none !important}

/* ---- Barres de défilement ---- */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#cfd8ea;border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:#aebbd8}

/* ---- Focus clavier visible ---- */
:focus-visible{outline:3px solid rgba(30,91,198,.45);outline-offset:2px}

/* ==================================================================
   BARRE LATÉRALE — style Coris renforcé (spécificité .sidebar …)
   • titres de sections : petites capitales navy, sans encadré
   • entrées : tuile d'icône bleu pâle arrondie, texte bleu marine
   • entrée active : tuile en dégradé bleu, fond bleu très pâle
   • compteurs : pilules bleues
   ================================================================== */
.sidebar .nav-section{padding:0 12px;margin-bottom:14px}
.sidebar .nav-label,
.sidebar .nav-label-toggle{
  background:#e4edfb;               /* fond bleu pâle fixe */
  border:1px solid #d3e0f7;
  border-radius:14px;
  padding:10px 14px;
  margin-bottom:6px;
  font-size:11px;
  letter-spacing:.12em;
  font-weight:700;
  color:var(--primary);
}
/* Fond stable : aucune variation au survol, au clic ou à l'ouverture */
.sidebar .nav-label-toggle:hover,
.sidebar .nav-label-toggle:active,
.sidebar .nav-label-toggle:focus,
.sidebar .nav-section-collapsible[data-open="true"] .nav-label-toggle{
  background:#e4edfb;border-color:#d3e0f7;color:var(--primary);
}
.sidebar .nav-item{
  padding:7px 10px 7px 7px;
  border-radius:16px;
  color:var(--text);
  font-weight:500;
  font-size:14.5px;
  gap:12px;
  margin-bottom:3px;
}
.sidebar .nav-item .ico{
  width:36px;height:36px;
  padding:9px;
  border-radius:12px;
  background:var(--bg-soft);
  color:var(--accent);
  box-sizing:border-box;
  transition:background .15s, color .15s, box-shadow .15s;
}
.sidebar .nav-item:hover{background:var(--bg-soft);color:var(--text)}
.sidebar .nav-item:hover .ico{background:#e3ecfb}
.sidebar .nav-item.active{
  background:var(--accent-soft);
  color:var(--primary);
  font-weight:600;
}
.sidebar .nav-item.active .ico{
  background:var(--coris-grad);
  color:#fff;
  box-shadow:0 6px 14px rgba(30,91,198,.30);
}
.sidebar .nav-badge{
  background:#e4edfb;
  color:var(--accent);
  border-radius:999px;
  padding:2px 9px;
  font-size:11.5px;
  font-weight:700;
  font-family:var(--font-display);
  min-width:24px;text-align:center;
}
.sidebar .nav-item.active .nav-badge{background:var(--primary);color:#fff}
.sidebar .nav-label-badge{background:var(--accent);border-radius:999px}
.sidebar .nav-admin-item{border-left:0;border-radius:16px}
.sidebar .nav-admin-item:hover,
.sidebar .nav-admin-item.active{background:var(--accent-soft);color:var(--primary);border-left:0}
.sidebar .nav-admin-module{color:var(--accent);opacity:1}
.sidebar .nav-admin-label{color:var(--text)}
/* Effet brillance orange hérité de Nicotram : désactivé en Coris */
.sidebar .nav-item::before,.sidebar .nav-item::after{display:none}