/**
 * Cadir — Thème clair (overrides des variables CSS).
 * Le thème sombre est défini dans chaque page (défaut).
 * Ce fichier surcharge uniquement les variables quand data-theme="light".
 */

:root[data-theme="light"] {
  --bg:       #f0f4f8;
  --bg-2:     #e4eaf2;
  --panel:    #ffffff;
  --panel-2:  #f7f9fc;
  --line:     #d0dbe8;
  --line-2:   #b8c8db;
  --txt:      #1a2433;
  --txt-2:    #4a6180;
  --txt-dim:  #7890a8;

  /* Accent et couleurs fonctionnelles : inchangées */
  /* --accent, --blue, --amber, --internal restent identiques */

  /* Scrollbar */
  scrollbar-color: var(--line) var(--bg);
}

/* Ajustements visuels spécifiques au thème clair */
:root[data-theme="light"] .side {
  background: linear-gradient(180deg, var(--bg-2), var(--bg));
}

:root[data-theme="light"] .btn-primary {
  color: #04130c;
}

:root[data-theme="light"] .card {
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}

:root[data-theme="light"] .stat {
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
}

/* Bouton toggle thème */
#themeToggle {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  border: 1px solid rgba(128,160,200,.4);
  background: transparent;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: .16s;
  color: var(--txt-2, #8da2bd);
  flex-shrink: 0;
  font-size: 17px;
  line-height: 1;
}
#themeToggle:hover {
  background: rgba(128,160,200,.1);
}
/* Icône via CSS — pas besoin de JS */
#themeToggle::after {
  content: '☀️';
}
:root[data-theme="light"] #themeToggle::after {
  content: '🌙';
}