/*
 * Mode sombre du site (demande de l'utilisateur du 2026-10-27), sur ordinateur seulement (768 px de large et plus).
 * Pour le moment, seul l'en-tête change, en gris très foncé (demande de l'utilisateur du 2026-10-27, avant #16171a,
 * presque noir, comme Abitickets, qui a pris le même gris) ; texte et liens comme ceux d'Abitickets
 * (css/abitickets_sombre.css).
 * Les règles de couleur dépendent de la classe site-sombre de <html>, posée par themeSiteBalises() d'après le cookie
 * abidex_theme et changée sans rechargement par js/site_theme.js. Le bouton et le logo blanc ont l'attribut hidden :
 * ils restent cachés sous 768 px, ou si ce fichier n'est pas chargé.
 */

@media screen and (min-width: 768px) {

  html.site-sombre {
    --site-sombre-entete: #2b2d31;
    --site-sombre-cadre: #33363b;
    --site-sombre-surface: #3d4046;
    --site-sombre-bord: #555a62;
    --site-sombre-texte: #e3e5e8;
    --site-sombre-lien: #8ab4f8;
    --site-sombre-bouton-bord: #5f8fd6;
  }

  /* Bouton à gauche des drapeaux (getSectionTopbar2()), de leur hauteur */
  .site-theme-basculer[hidden] {
    display: inline-flex;
  }

  .site-theme-basculer {
    box-sizing: border-box;
    align-items: center;
    gap: 4px;
    height: 23.4px;
    margin: 0 6px 0 0;
    padding: 0 8px;
    vertical-align: top;
    border: 1px solid rgb(0, 56, 136);
    border-radius: 4px;
    color: rgb(0, 56, 136);
    background-color: #ffffff;
    font-family: Arial, sans-serif;
    font-size: 12px;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
  }

  .site-theme-basculer:hover {
    color: #ffffff;
    background-color: rgb(0, 56, 136);
  }

  .site-theme-basculer svg {
    width: 14px;
    height: 14px;
  }

  .site-theme-basculer .site-theme-soleil,
  html.site-sombre .site-theme-basculer .site-theme-lune {
    display: none;
  }

  html.site-sombre .site-theme-basculer .site-theme-soleil {
    display: inline;
  }

  html.site-sombre .site-theme-basculer {
    color: var(--site-sombre-lien);
    background-color: var(--site-sombre-surface);
    border-color: var(--site-sombre-bouton-bord);
  }

  html.site-sombre .site-theme-basculer:hover {
    color: #ffffff;
    background-color: #1f56b0;
  }

  /* Logo : le blanc remplace celui du site (themeSiteLogoSombre()) */
  html.site-sombre .site-logo-sombre[hidden] {
    display: block;
  }

  html.site-sombre .menuImg:not(.site-logo-sombre) {
    display: none;
  }

  /* En-tête et menu clair sur fond gris très foncé */
  html.site-sombre .headerAbidex {
    background-color: var(--site-sombre-entete);
  }

  html.site-sombre .topnavB {
    color: var(--site-sombre-texte);
    background-color: var(--site-sombre-entete);
  }

  html.site-sombre .topnavB a {
    color: var(--site-sombre-texte);
  }

  html.site-sombre .topnavB a.menushop {
    color: rgb(255, 102, 0) !important;
  }

  html.site-sombre .topnavB a.active,
  html.site-sombre .topnavB a:hover {
    color: #ffffff !important;
  }

  /* Burger et panneau du menu (de 768 à 1200 px de large) */
  html.site-sombre .burger {
    color: var(--site-sombre-texte);
  }

  html.site-sombre .drawer {
    background: var(--site-sombre-cadre);
  }

  html.site-sombre .drawer .close {
    color: var(--site-sombre-texte);
  }

  html.site-sombre .menu a {
    color: var(--site-sombre-texte);
    border-bottom-color: var(--site-sombre-bord);
  }

  html.site-sombre .menu a:hover {
    color: var(--site-sombre-lien);
  }
}