/* ============================================================================
   theme-dark.css — thème sombre adSociusOnline
   ----------------------------------------------------------------------------
   SB Admin 2 / Bootstrap 3.3.7 n'ont PAS de dark mode natif (ça, c'est BS5
   data-bs-theme). On applique donc des overrides ciblés, tous scopés sous la
   classe body.theme-dark (ajoutée/retirée par core/App.Theme.pas, sans reload).

   Palette : gris ardoise sombre + texte clair désaturé.
   Itérer écran par écran ; commencer par les conteneurs principaux.
   ============================================================================ */

body.theme-dark {
  /* variables locales pour ajuster la palette en un seul endroit */
  --dk-bg:        #1b1f24;   /* fond page */
  --dk-surface:   #242a31;   /* panneaux / navbar / sidebar */
  --dk-surface-2: #2d343c;   /* surfaces surélevées (heading, hover) */
  --dk-border:    #3a424c;   /* bordures */
  --dk-text:      #d6dae0;   /* texte principal */
  --dk-text-dim:  #9aa3ad;   /* texte secondaire */
  --dk-link:      #6cb2ff;   /* liens */
  --dk-accent:    #4a90d9;   /* accent (actif) */

  background-color: var(--dk-bg);
  color: var(--dk-text);
}

/* ---- conteneurs principaux ---------------------------------------------- */
body.theme-dark #wrapper,
body.theme-dark #page-wrapper {
  background-color: var(--dk-bg);
  color: var(--dk-text);
}

/* ---- navbar / barre du haut --------------------------------------------- */
body.theme-dark .navbar-default,
body.theme-dark .navbar-static-top {
  background-color: var(--dk-surface);
  border-color: var(--dk-border);
}
body.theme-dark .navbar-default .navbar-brand,
body.theme-dark .navbar-top-links > li > a {
  color: var(--dk-text);
}
body.theme-dark .navbar-top-links > li > a:hover,
body.theme-dark .navbar-top-links > li > a:focus {
  background-color: var(--dk-surface-2);
  color: #fff;
}

/* ---- sidebar / menu latéral --------------------------------------------- */
body.theme-dark .sidebar,
body.theme-dark .navbar-default.sidebar {
  background-color: var(--dk-surface);
  border-color: var(--dk-border);
}
body.theme-dark .sidebar ul li a {
  color: var(--dk-text);
  border-color: var(--dk-border);
}
body.theme-dark .sidebar ul li a:hover,
body.theme-dark .sidebar ul li a:focus,
body.theme-dark .sidebar ul li.active > a {
  background-color: var(--dk-surface-2);
  color: #fff;
}
body.theme-dark .sidebar .nav-second-level li a {
  background-color: var(--dk-surface);
}
/* les en-têtes de section ont un style inline clair dans View.Main.html */
body.theme-dark .sidebar a[style] {
  background-color: var(--dk-surface-2) !important;
  color: var(--dk-text) !important;
  border-color: var(--dk-accent) !important;
}

/* ---- panneaux ------------------------------------------------------------ */
body.theme-dark .panel {
  background-color: var(--dk-surface);
  border-color: var(--dk-border);
}
body.theme-dark .panel-default > .panel-heading {
  background-color: var(--dk-surface-2);
  color: var(--dk-text);
  border-color: var(--dk-border);
}
body.theme-dark .panel-body {
  color: var(--dk-text);
}
body.theme-dark .well,
body.theme-dark .jumbotron {
  background-color: var(--dk-surface-2);
  border-color: var(--dk-border);
}

/* ---- menus déroulants ---------------------------------------------------- */
body.theme-dark .dropdown-menu {
  background-color: var(--dk-surface-2);
  border-color: var(--dk-border);
}
body.theme-dark .dropdown-menu > li > a {
  color: var(--dk-text);
}
body.theme-dark .dropdown-menu > li > a:hover,
body.theme-dark .dropdown-menu > li > a:focus,
body.theme-dark .dropdown-menu > .active > a {
  background-color: var(--dk-accent);
  color: #fff;
}
body.theme-dark .dropdown-menu .divider {
  background-color: var(--dk-border);
}

/* ---- titres, textes, liens ---------------------------------------------- */
body.theme-dark h1, body.theme-dark h2, body.theme-dark h3,
body.theme-dark h4, body.theme-dark h5, body.theme-dark h6 {
  color: var(--dk-text);
}
body.theme-dark .text-muted,
body.theme-dark small {
  color: var(--dk-text-dim);
}
body.theme-dark a {
  color: var(--dk-link);
}
body.theme-dark a:hover,
body.theme-dark a:focus {
  color: #9fccff;
}
body.theme-dark hr {
  border-color: var(--dk-border);
}

/* ---- formulaires --------------------------------------------------------- */
body.theme-dark .form-control {
  background-color: #20262d;
  border-color: var(--dk-border);
  color: var(--dk-text);
}
body.theme-dark .form-control:focus {
  border-color: var(--dk-accent);
  box-shadow: 0 0 0 2px rgba(74, 144, 217, 0.25);
}
body.theme-dark .form-control::placeholder {
  color: var(--dk-text-dim);
}
body.theme-dark .input-group-addon {
  background-color: var(--dk-surface-2);
  border-color: var(--dk-border);
  color: var(--dk-text);
}
body.theme-dark label {
  color: var(--dk-text);
}

/* ---- tableaux + DataTables ---------------------------------------------- */
body.theme-dark .table {
  color: var(--dk-text);
}
body.theme-dark .table > thead > tr > th,
body.theme-dark .table > tbody > tr > td,
body.theme-dark .table > tbody > tr > th,
body.theme-dark .table > tfoot > tr > td {
  border-color: var(--dk-border);
}
body.theme-dark .table-striped > tbody > tr:nth-of-type(odd) {
  background-color: rgba(255, 255, 255, 0.03);
}
body.theme-dark .table-hover > tbody > tr:hover {
  background-color: var(--dk-surface-2);
}
body.theme-dark .dataTables_wrapper,
body.theme-dark .dataTables_wrapper .dataTables_info,
body.theme-dark .dataTables_wrapper .dataTables_length,
body.theme-dark .dataTables_wrapper .dataTables_filter {
  color: var(--dk-text);
}
body.theme-dark .dataTables_wrapper .dataTables_paginate .paginate_button {
  color: var(--dk-text) !important;
}
body.theme-dark .dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: var(--dk-accent);
  border-color: var(--dk-border);
  color: #fff !important;
}

/* ---- boutons : on garde les couleurs Bootstrap (primary/success/danger),
        on n'ajuste que le bouton « par défaut » trop clair ----------------- */
body.theme-dark .btn-default {
  background-color: var(--dk-surface-2);
  border-color: var(--dk-border);
  color: var(--dk-text);
}
body.theme-dark .btn-default:hover,
body.theme-dark .btn-default:focus {
  background-color: #39414a;
  color: #fff;
}

/* ---- listes / alerts ----------------------------------------------------- */
body.theme-dark .list-group-item {
  background-color: var(--dk-surface);
  border-color: var(--dk-border);
  color: var(--dk-text);
}

/* ----------------------------------------------------------------------------
   Animation du toggle de thème (jouée seulement au clic — la classe est posée par
   View.Main sur le SVG fraîchement regénéré). Hors scope dark : toujours active.
   ---------------------------------------------------------------------------- */
@keyframes themeIcoAnim {
  0%   { transform: rotate(-120deg) scale(0.5); opacity: 0; }
  60%  { transform: rotate(12deg)   scale(1.15); opacity: 1; }
  100% { transform: rotate(0)       scale(1);    opacity: 1; }
}
.theme-ico-anim {
  animation: themeIcoAnim 0.35s ease-out;
  transform-origin: 50% 50%;
}

/* transition douce lors du basculement de thème */
body,
body #wrapper, body #page-wrapper,
body .navbar-default, body .sidebar, body .panel {
  transition: background-color 0.2s ease, color 0.2s ease;
}