/* ============================================================
   ELORK CRM — Système de thèmes
   Mineral (clair) + Obsidian Dark
   Stockage : localStorage key "elork_theme" = "mineral" | "obsidian"
   ============================================================ */

/* ── Variables communes ── */
:root {
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-xl:   20px;
  --transition:  0.18s ease;
  --font-sans:   'Instrument Sans', 'Inter', system-ui, sans-serif;
}

/* ================================================================
   THEME MINERAL — fond crème chaud, sidebar espresso, or doux
   ================================================================ */
:root,
[data-theme="mineral"] {

  /* Backgrounds */
  --bg-page:        #f5f0eb;
  --bg-surface:     #fffdf9;
  --bg-surface-2:   #f0ebe4;
  --bg-sidebar:     #2d2a26;
  --bg-sidebar-2:   #1e1b18;
  --bg-overlay:     rgba(45, 42, 38, 0.55);

  /* Textes */
  --text-primary:   #1c1a17;
  --text-secondary: #6b6056;
  --text-muted:     #a3917f;
  --text-inverse:   #fffdf9;
  --text-sidebar:   #d9cfc4;
  --text-sidebar-active: #fff;

  /* Accents (or doux) */
  --accent:         #c8a96e;
  --accent-hover:   #b8963e;
  --accent-light:   #f5edda;
  --accent-text:    #7a5c1e;

  /* Accent secondaire (terra cotta) */
  --accent2:        #c0603a;
  --accent2-light:  #fdf0eb;
  --accent2-text:   #8b3a1f;

  /* Danger / impayé */
  --danger:         #c0392b;
  --danger-light:   #fff5f5;
  --danger-text:    #8b1a10;
  --danger-border:  #f5c6c2;

  /* Succès */
  --success:        #2d7a4f;
  --success-light:  #edf7f1;
  --success-text:   #1a5c36;

  /* Warning */
  --warning:        #c87c2a;
  --warning-light:  #fff8ee;
  --warning-text:   #8a4e0d;

  /* Bordures */
  --border:         #e5ddd4;
  --border-strong:  #cec0b0;
  --border-sidebar: rgba(255, 255, 255, 0.08);

  /* Ombres */
  --shadow-sm:      0 1px 2px rgba(44,36,28,.06);
  --shadow-md:      0 2px 8px rgba(44,36,28,.08), 0 0 0 1px rgba(44,36,28,.04);
  --shadow-lg:      0 8px 24px rgba(44,36,28,.12);

  /* Hero gradient */
  --hero-from:      #2d2a26;
  --hero-mid:       #3d3630;
  --hero-to:        #c8a96e;

  /* Nav sidebar item active */
  --sidebar-active-bg:    rgba(200, 169, 110, 0.15);
  --sidebar-active-text:  #c8a96e;
  --sidebar-hover-bg:     rgba(255, 255, 255, 0.06);

  /* Inputs */
  --input-bg:       #fffdf9;
  --input-border:   #d9cfc4;
  --input-focus:    #c8a96e;

  /* Tables */
  --table-header-bg:   #f0ebe4;
  --table-row-hover:   #f7f3ee;
  --table-divider:     #ede7de;

  /* Badges types client */
  --badge-pro-bg:       #ede9ff;
  --badge-pro-text:     #5c3d9e;
  --badge-part-bg:      #f5edda;
  --badge-part-text:    #7a5c1e;

  /* Planning statuts */
  --stat-planif-bg:     #f5edda;
  --stat-planif-text:   #7a5c1e;
  --stat-encours-bg:    #fff8ee;
  --stat-encours-text:  #8a4e0d;
  --stat-termine-bg:    #edf7f1;
  --stat-termine-text:  #1a5c36;
  --stat-aplanif-bg:    #f0ebe4;
  --stat-aplanif-text:  #6b6056;

  /* Toggle bouton */
  --toggle-bg:      #e5ddd4;
  --toggle-knob:    #2d2a26;
}

/* ================================================================
   THEME OBSIDIAN DARK — noir charbon, bleu électrique
   ================================================================ */
[data-theme="obsidian"] {

  /* Backgrounds */
  --bg-page:        #0d1117;
  --bg-surface:     #161b22;
  --bg-surface-2:   #1c2128;
  --bg-sidebar:     #010409;
  --bg-sidebar-2:   #000000;
  --bg-overlay:     rgba(0, 0, 0, 0.7);

  /* Textes */
  --text-primary:   #e6edf3;
  --text-secondary: #8b949e;
  --text-muted:     #74808f;
  --text-inverse:   #0d1117;
  --text-sidebar:   #8b949e;
  --text-sidebar-active: #e6edf3;

  /* Accents (bleu électrique) */
  --accent:         #58a6ff;
  --accent-hover:   #79b8ff;
  --accent-light:   rgba(88, 166, 255, 0.1);
  --accent-text:    #58a6ff;

  /* Accent secondaire (cyan) */
  --accent2:        #39d353;
  --accent2-light:  rgba(57, 211, 83, 0.1);
  --accent2-text:   #39d353;

  /* Danger */
  --danger:         #f85149;
  --danger-light:   rgba(248, 81, 73, 0.1);
  --danger-text:    #f85149;
  --danger-border:  rgba(248, 81, 73, 0.3);

  /* Succès */
  --success:        #39d353;
  --success-light:  rgba(57, 211, 83, 0.1);
  --success-text:   #39d353;

  /* Warning */
  --warning:        #e3b341;
  --warning-light:  rgba(227, 179, 65, 0.1);
  --warning-text:   #e3b341;

  /* Bordures */
  --border:         #30363d;
  --border-strong:  #484f58;
  --border-sidebar: rgba(255, 255, 255, 0.06);

  /* Ombres */
  --shadow-sm:      0 1px 2px rgba(0,0,0,.3);
  --shadow-md:      0 2px 8px rgba(0,0,0,.4), 0 0 0 1px rgba(255,255,255,.04);
  --shadow-lg:      0 8px 32px rgba(0,0,0,.5);

  /* Hero gradient */
  --hero-from:      #010409;
  --hero-mid:       #0d1117;
  --hero-to:        #1a2842;

  /* Nav sidebar */
  --sidebar-active-bg:    rgba(88, 166, 255, 0.12);
  --sidebar-active-text:  #58a6ff;
  --sidebar-hover-bg:     rgba(255, 255, 255, 0.04);

  /* Inputs */
  --input-bg:       #1c2128;
  --input-border:   #30363d;
  --input-focus:    #58a6ff;

  /* Tables */
  --table-header-bg:   #1c2128;
  --table-row-hover:   #1c2128;
  --table-divider:     #21262d;

  /* Badges types client */
  --badge-pro-bg:       rgba(188, 140, 255, 0.12);
  --badge-pro-text:     #bc8cff;
  --badge-part-bg:      rgba(88, 166, 255, 0.12);
  --badge-part-text:    #58a6ff;

  /* Planning statuts */
  --stat-planif-bg:     rgba(88, 166, 255, 0.12);
  --stat-planif-text:   #58a6ff;
  --stat-encours-bg:    rgba(227, 179, 65, 0.12);
  --stat-encours-text:  #e3b341;
  --stat-termine-bg:    rgba(57, 211, 83, 0.12);
  --stat-termine-text:  #39d353;
  --stat-aplanif-bg:    rgba(139, 148, 158, 0.12);
  --stat-aplanif-text:  #8b949e;

  /* Toggle bouton */
  --toggle-bg:      #30363d;
  --toggle-knob:    #58a6ff;
}

/* ================================================================
   STYLES GLOBAUX — s'appliquent aux deux thèmes via les variables
   ================================================================ */

* { box-sizing: border-box; }

body {
  font-family: var(--font-sans);
  background: var(--bg-page);
  color: var(--text-primary);
  margin: 0;
  min-height: 100vh;
  transition: background var(--transition), color var(--transition);
}

/* ── Scrollbar ── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 99px; }
[data-theme="obsidian"] ::-webkit-scrollbar-thumb { background: var(--border-strong); }

/* ── Layout wrapper ── */
.elork-layout {
  display: flex;
  min-height: 100vh;
}

/* ================================================================
   SIDEBAR
   ================================================================ */
.elork-sidebar {
  padding-top: env(safe-area-inset-top);
  width: 220px;
  flex-shrink: 0;
  background: var(--bg-sidebar);
  border-right: 1px solid var(--border-sidebar);
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0; left: 0; bottom: 0;
  z-index: 50;
  transition: background var(--transition), transform 0.25s ease;
  overflow-y: auto;
}

.elork-sidebar-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 18px 16px 16px;
  border-bottom: 1px solid var(--border-sidebar);
}

.elork-sidebar-logo-mark {
  width: 32px;
  height: 32px;
  background: var(--accent);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.elork-sidebar-logo-mark svg {
  width: 18px; height: 18px;
  color: var(--bg-sidebar);
}

.elork-sidebar-logo-name {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--text-inverse);
}

[data-theme="obsidian"] .elork-sidebar-logo-name { color: var(--text-primary); }

.elork-sidebar-nav {
  padding: 12px 8px;
  flex: 1;
}

.elork-nav-section {
  margin-bottom: 20px;
}

.elork-nav-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: 0 10px;
  margin-bottom: 4px;
}

.elork-nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border-radius: var(--radius-sm);
  color: var(--text-sidebar);
  text-decoration: none;
  font-size: 13.5px;
  font-weight: 500;
  transition: background var(--transition), color var(--transition);
  cursor: pointer;
  border: none;
  background: transparent;
  width: 100%;
  text-align: left;
  margin-bottom: 1px;
}

.elork-nav-item svg {
  width: 16px; height: 16px;
  flex-shrink: 0;
  opacity: 0.6;
  transition: opacity var(--transition);
}

.elork-nav-item:hover {
  background: var(--sidebar-hover-bg);
  color: var(--text-sidebar-active);
}
.elork-nav-item:hover svg { opacity: 1; }

.elork-nav-item.active {
  background: var(--sidebar-active-bg);
  color: var(--sidebar-active-text);
  font-weight: 600;
}
.elork-nav-item.active svg { opacity: 1; }

/* Société selector dans sidebar */
.elork-societe-select {
  margin: 0 8px 12px;
  padding: 8px 12px;
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--border-sidebar);
  border-radius: var(--radius-sm);
  color: var(--text-sidebar);
  font-size: 12px;
  width: calc(100% - 16px);
  cursor: pointer;
  outline: none;
}
.elork-societe-select option { color: var(--text-primary); background: var(--bg-surface); }

/* Sidebar footer (user + toggle) */
.elork-sidebar-footer {
  padding: 12px 8px;
  border-top: 1px solid var(--border-sidebar);
  padding-bottom: max(12px, env(safe-area-inset-bottom));
}

/* ── Toggle thème ── */
.elork-theme-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  user-select: none;
}

.elork-theme-toggle-label {
  font-size: 12px;
  color: var(--text-muted);
  display: flex;
  align-items: center;
  gap: 6px;
}

.elork-toggle-switch {
  width: 36px;
  height: 20px;
  background: var(--toggle-bg);
  border-radius: 10px;
  position: relative;
  transition: background var(--transition);
  cursor: pointer;
  border: none;
  outline: none;
  flex-shrink: 0;
}

.elork-toggle-switch::after {
  content: '';
  position: absolute;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--toggle-knob);
  top: 3px;
  left: 3px;
  transition: transform var(--transition), background var(--transition);
}

[data-theme="obsidian"] .elork-toggle-switch::after {
  transform: translateX(16px);
}

/* ================================================================
   MAIN CONTENT
   ================================================================ */
.elork-main {
  margin-left: 220px;
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

/* ── Top bar ── */
.elork-topbar {
  height: 52px;
  background: var(--bg-surface);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  padding-left: max(20px, env(safe-area-inset-left));
  padding-right: max(20px, env(safe-area-inset-right));
  gap: 12px;
  position: sticky;
  top: 0;
  z-index: 40;
  transition: background var(--transition), border-color var(--transition);
}

.elork-topbar-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
}

.elork-topbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ── Page content ── */
.elork-content {
  flex: 1;
}

/* ================================================================
   HERO SECTIONS (remplace le dégradé bleu)
   ================================================================ */
.e-hero-sm,
.dash-hero {
  background: linear-gradient(135deg, var(--hero-from) 0%, var(--hero-mid) 55%, var(--hero-to) 100%) !important;
}

/* ================================================================
   CARDS
   ================================================================ */
.c-card,
.e-card {
  background: var(--bg-surface) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-sm) !important;
}

.kpi-sm {
  background: var(--bg-surface) !important;
  border: 1px solid var(--border) !important;
}

/* ================================================================
   TABLES
   ================================================================ */
thead tr,
.bg-slate-50 { background: var(--table-header-bg) !important; }

tbody tr:hover { background: var(--table-row-hover) !important; }

.divide-slate-100 > * + *,
.divide-y > * + * { border-color: var(--table-divider) !important; }

/* ── Textes dans tables ── */
.text-slate-800, .text-slate-700 { color: var(--text-primary) !important; }
.text-slate-600, .text-slate-500 { color: var(--text-secondary) !important; }
.text-slate-400, .text-slate-300 { color: var(--text-muted) !important; }

/* ================================================================
   BOUTONS PRIMAIRES
   ================================================================ */
.btn-hero-primary,
a.elork-bg-2555ff, button.elork-bg-2555ff,
.bg-elork-2555ff, .bg-slate-800 {
  background: var(--accent) !important;
  color: var(--bg-sidebar) !important;
  border-color: var(--accent) !important;
}
.btn-hero-primary:hover,
.bg-elork-2555ff:hover {
  background: var(--accent-hover) !important;
}

/* Boutons hero dans le hero */
.btn-hero {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(255,255,255,0.25) !important;
  color: #fff !important;
}
.btn-hero:hover { background: rgba(255,255,255,0.22) !important; }

/* ================================================================
   ACCENTS / LIENS
   ================================================================ */
.elork-text-2555ff,
[class*="text-blue"],
[class*="text-elork"] {
  color: var(--accent) !important;
}

/* ================================================================
   INPUTS
   ================================================================ */
.e-input,
input[type="text"], input[type="search"], input[type="email"],
input[type="tel"], input[type="password"], input[type="number"],
input[type="date"], textarea, select {
  background: var(--input-bg) !important;
  border-color: var(--input-border) !important;
  color: var(--text-primary) !important;
}

.e-input:focus,
input:focus, textarea:focus, select:focus {
  border-color: var(--input-focus) !important;
  box-shadow: 0 0 0 3px rgba(200, 169, 110, 0.15) !important;
}
[data-theme="obsidian"] input:focus,
[data-theme="obsidian"] .e-input:focus {
  box-shadow: 0 0 0 3px rgba(88, 166, 255, 0.15) !important;
}

/* ================================================================
   PILLS / FILTRES
   ================================================================ */
.pill {
  background: var(--bg-surface) !important;
  border-color: var(--border) !important;
  color: var(--text-secondary) !important;
}
.pill.active, .pill:hover {
  background: var(--accent) !important;
  color: var(--bg-sidebar) !important;
  border-color: var(--accent) !important;
}

/* ================================================================
   BADGES STATUTS
   ================================================================ */
.badge-planifiee,
[class*="bg-elork-e8edff"], [class*="bg-blue"] {
  background: var(--stat-planif-bg) !important;
  color: var(--stat-planif-text) !important;
}
[class*="bg-amber"] { background: var(--stat-encours-bg) !important; color: var(--stat-encours-text) !important; }
[class*="bg-elork-e6ffe0"], [class*="bg-green"] { background: var(--stat-termine-bg) !important; color: var(--stat-termine-text) !important; }
/* text-green-XXX seul (sans bg-green) ne doit pas avoir de background appliqué.
   Cible uniquement la couleur du texte. */
[class*="text-green-600"], [class*="text-green-700"] { color: var(--stat-termine-text) !important; }

/* Badges Pro / Particulier */
.bg-violet-100 { background: var(--badge-pro-bg) !important; }
.text-violet-700 { color: var(--badge-pro-text) !important; }
.elork-bg-eef2ff, .bg-blue-100 { background: var(--badge-part-bg) !important; }
.elork-text-2555ff { color: var(--badge-part-text) !important; }

/* ================================================================
   DANGER / IMPAYÉS
   ================================================================ */
.bg-red-50, [class*="bg-red-50"] { background: var(--danger-light) !important; }
.text-red-600, .text-red-700, [class*="text-red"] { color: var(--danger-text) !important; }
.border-red-100 { border-color: var(--danger-border) !important; }

/* ================================================================
   SUCCÈS / GÉOCODÉ
   ================================================================ */
[class*="bg-green-50"], [class*="bg-elork-f0fff0"] { background: var(--success-light) !important; }
[class*="text-green-400"], [class*="text-green-500"], [class*="text-elork-28a800"] { color: var(--success-text) !important; }

/* ================================================================
   QUICK BUTTONS (accès rapide)
   ================================================================ */
.q-btn {
  background: var(--bg-surface) !important;
  border-color: var(--border) !important;
}
.q-btn:hover {
  border-color: var(--accent) !important;
  background: var(--accent-light) !important;
  box-shadow: 0 4px 12px rgba(200,169,110,.12) !important;
}
.q-icon { background: var(--accent-light) !important; }

/* ================================================================
   PLANNING CALENDAR
   ================================================================ */
.gcal-header, .gcal-wrap {
  background: var(--bg-surface) !important;
  border-color: var(--border) !important;
}
.day-headers, .day-hcol { border-color: var(--border) !important; }
.gcal-nav-btn { color: var(--text-secondary) !important; }
.gcal-nav-btn:hover { background: var(--bg-surface-2) !important; }
.gcal-today-btn {
  background: var(--bg-surface) !important;
  border-color: var(--border) !important;
  color: var(--text-primary) !important;
}
.gcal-add-btn {
  background: var(--accent) !important;
  color: var(--bg-sidebar) !important;
}
.view-tab { color: var(--text-secondary) !important; }
.view-tab.active { color: var(--accent) !important; border-bottom-color: var(--accent) !important; }
.gcal-body { background: var(--bg-page) !important; }
.day-col { border-color: var(--border) !important; }
.day-name { color: var(--text-muted) !important; }
.day-num { color: var(--text-primary) !important; }
.day-num.today { background: var(--accent) !important; color: var(--bg-sidebar) !important; }
.gcal-time-lbl { color: var(--text-muted) !important; }
.slot-ln-h { border-top: 1px solid var(--border) !important; }
.slot-ln-half { border-top: 1px dashed var(--border) !important; }
.now-bar { background: var(--accent) !important; }
.now-dot { background: var(--accent) !important; }
.slot-plus { color: var(--accent) !important; }

/* ================================================================
   STATS — barres
   ================================================================ */
.bar { background: linear-gradient(180deg, var(--accent), var(--accent-hover)) !important; }
.bar-current { background: linear-gradient(180deg, var(--accent2), #a04020) !important; }

/* ================================================================
   PAGINATION
   ================================================================ */
.elork-bg-2555ff { background: var(--accent) !important; }
a[class*="bg-white"][class*="border"] {
  background: var(--bg-surface) !important;
  border-color: var(--border) !important;
  color: var(--text-primary) !important;
}

/* ================================================================
   LOGIN PAGE SPÉCIALE
   ================================================================ */
.elork-login-bg {
  background: var(--bg-page) !important;
}
.elork-login-card {
  background: var(--bg-surface) !important;
  border: 1px solid var(--border) !important;
}

/* Ancien dark (slate-800/900) dans login → override */



.border-slate-600 { border-color: var(--border) !important; }
.text-slate-300 { color: var(--text-secondary) !important; }
.text-white { color: var(--text-primary) !important; }

/* ================================================================
   ADMIN PANEL
   ================================================================ */
.bg-slate-100 { background: var(--bg-surface-2) !important; }
.bg-slate-200 { background: var(--bg-surface-2) !important; }
.border-slate-200 { border-color: var(--border) !important; }

/* ================================================================
   CARTES MOBILE — liens de liste
   ================================================================ */
.hover\:bg-slate-50:hover { background: var(--table-row-hover) !important; }
.hover\:bg-slate-100:hover { background: var(--bg-surface-2) !important; }

/* ================================================================
   TABS CLIENT
   ================================================================ */
.bg-white { background: var(--bg-surface) !important; }
.border-slate-200 { border-color: var(--border) !important; }

/* ================================================================
   FORMULAIRES — labels, wrappers
   ================================================================ */
label { color: var(--text-secondary) !important; }
.bg-amber-50 { background: var(--warning-light) !important; }
.text-amber-700 { color: var(--warning-text) !important; }
.border-amber-400 { border-color: var(--warning) !important; }

/* ================================================================
   MOBILE — hamburger & overlay sidebar
   ================================================================ */
@media (max-width: 768px) {
  .elork-topbar {
    /* Sur iOS en mode web app, décaler sous la barre de statut */
    padding-top: env(safe-area-inset-top);
    height: calc(52px + env(safe-area-inset-top));
  }
  .elork-sidebar {
    padding-top: env(safe-area-inset-top);
    transform: translateX(-100%);
  }
  .elork-sidebar.open {
    transform: translateX(0);
    box-shadow: var(--shadow-lg);
  }
  .elork-main {
    margin-left: 0;
  }
  .elork-sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: var(--bg-overlay);
    z-index: 45;
  }
  .elork-sidebar-overlay.open { display: block; }
}

/* ================================================================
   PATCHES GÉNÉRAUX — Formulaires et vues
   ================================================================ */

/* Bloc inline nouveau client */
.nc-panel, [class*="border-dashed"][style*="border"] {
  background: var(--bg-surface) !important;
}

/* Cartes formulaires */
form .bg-white,
.e-card,
[class*="rounded-2xl"][class*="border-slate"],
[class*="rounded-xl"][class*="border-slate"] {
  background: var(--bg-surface) !important;
  border-color: var(--border) !important;
}

/* Labels */
.text-slate-700, .block.text-sm.font-medium { color: var(--text-secondary) !important; }
.text-slate-800 { color: var(--text-primary) !important; }
.text-slate-500, .text-slate-400 { color: var(--text-muted) !important; }

/* Inputs natifs dans les formulaires */
input[type="text"]:not(.nc-input):not(.pf-input):not(.cp-hex):not(.elork-color-input-hex),
input[type="email"], input[type="tel"], input[type="number"],
input[type="date"], input[type="time"], input[type="password"],
input[type="search"], textarea, select {
  background: var(--input-bg) !important;
  border-color: var(--input-border) !important;
  color: var(--text-primary) !important;
}
input::placeholder, textarea::placeholder { color: var(--text-muted) !important; }

/* Radio pills type client */
.grid.grid-cols-2.bg-slate-100, .grid.grid-cols-2.gap-2.p-1 {
  background: var(--bg-surface-2) !important;
}

/* Headings dans cartes */
.font-bold.text-slate-800 { color: var(--text-primary) !important; }

/* Dividers */
.border-slate-100 { border-color: var(--border) !important; }
.border-slate-200 { border-color: var(--border) !important; }
.divide-slate-100 > * + * { border-color: var(--border) !important; }

/* Bouton annuler */
.bg-slate-100.text-slate-700 { background: var(--bg-surface-2) !important; color: var(--text-secondary) !important; }
.hover\:bg-slate-50:hover { background: var(--bg-surface-2) !important; }

/* Badges statuts */
.bg-slate-100.text-slate-500 { background: var(--bg-surface-2) !important; color: var(--text-muted) !important; }

/* Suggestions adresse */
#adresse-suggestions, #nc-adresse-suggestions {
  background: var(--bg-surface) !important;
  border-color: var(--border) !important;
  box-shadow: var(--shadow-lg) !important;
}

/* Bouton principal accent */
[class*="bg-elork-2555ff"],
[class*="bg-blue-500"],
[class*="bg-blue-600"] {
  background: var(--accent) !important;
  color: var(--bg-sidebar) !important;
}

/* Fond page intervention liste */
.bg-slate-50 { background: var(--bg-page) !important; }

/* ── Protection sidebar — ne jamais écraser ses couleurs ── */
.elork-sidebar,
.elork-sidebar * {
  /* Les règles générales bg-white etc. ne doivent pas toucher la sidebar */
}
.elork-sidebar { background: var(--bg-sidebar) !important; }
.elork-sidebar-footer { border-top: 1px solid var(--border-sidebar) !important; }
.elork-nav-item { 
  color: var(--text-sidebar) !important;
  background: transparent !important;
}
.elork-nav-item:hover {
  background: var(--sidebar-hover-bg) !important;
  color: var(--text-sidebar-active) !important;
}
.elork-nav-item.active {
  background: var(--sidebar-active-bg) !important;
  color: var(--sidebar-active-text) !important;
}
.elork-nav-item svg { color: inherit !important; }
.elork-nav-label { color: var(--text-muted) !important; opacity: 0.7; }
.elork-sidebar-logo-name { color: #fff !important; }
.elork-theme-toggle-label { color: var(--text-muted) !important; }
.elork-theme-toggle { color: var(--text-muted) !important; }
/* Topbar */
.elork-topbar { background: var(--bg-surface) !important; border-bottom-color: var(--border) !important; }
.elork-topbar-title { color: var(--text-primary) !important; }