/* ==========================================================================
   Helveticard — thème clair (par défaut)
   Chargé sur toutes les pages via [meta] (html/meta.html), avant dark.css.
   Les couleurs « en dur » qui dépendent du thème sont ici, sous forme de jetons --t-*.
   Les couleurs des éléments toujours sombres (cartes bancaires, sections navy,
   éditeur de code) ne changent pas avec le thème et restent dans leurs fichiers.
   ========================================================================== */

:root {
  color-scheme: light;

  /* Fonds */
  --t-page: #FFFFFF;            /* fond de page (body) */
  --t-page-inner: #F5F2EC;      /* fond des pages internes ≤ 960px (style.css) */
  --t-surface: #FFFFFF;         /* cartes, encadrés, champs au focus */
  --t-stage-a: #E9E3D8;         /* panneau derrière les cartes du hero (dégradé) */
  --t-stage-b: #DCD3C4;
  --t-pill-bg: rgba(255,255,255,.6);  /* pastilles devises (#cards) */
  --t-footer-classic: #FAFAFA;  /* ancien footer (style.css) */
  --nav-bg: #FFFFFF;            /* menu fixe (style.css) */

  /* Textes */
  --t-heading: #13213A;         /* titres et textes navy sur fond clair */
  --t-title: #041B31;           /* .title h1, .desc-title (style.css) */
  --t-text: #6B6B6B;            /* texte courant global : p, a, li, label, .desc-text */
  --t-body: #4A5668;            /* paragraphes et tableaux des pages légales */
  --t-accent: #876536;          /* gold pour texte sur fond clair (contact) */
  --t-link: #3A5896;            /* liens au survol, focus des champs (style.css) */
  --t-link-strong: #1A4FA0;     /* liens dans les cartes (contact, pages légales) */
  --t-footer-link: #000000;     /* ancien footer (style.css) */
  --t-menu-text: #777777;       /* sous-menu déroulant (style.css) */

  /* Traits */
  --t-field-line: #CCCCCC;      /* bordure .form-control.main (style.css) */
  --t-menu-line: #EBEBEB;       /* sous-menu déroulant (style.css) */
  --t-ring: #FFFFFF;            /* contour des repères numérotés (app) = fond de l'écran */

  /* Bouton plein principal sur fond clair */
  --t-btn-bg: #13213A;
  --t-btn-fg: #FFFFFF;
  --t-btn-hover-bg: #1C2D4D;
}

/* ===== Bouton clair / sombre (html/nav.html, js/theme.js) ===== */
/* Interrupteur (role="switch") : éteint = clair, allumé = sombre. Zone cliquable 44 × 44 px. */
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; min-height: 44px; margin-top: 12px; padding: 0;
  background: none; border: 0; cursor: pointer;
}
.theme-switch-track {
  position: relative; display: block; width: 40px; height: 22px; border-radius: 999px;
  background: #8A94A3;          /* 3.1:1 sur blanc (contraste des composants, WCAG 1.4.11) */
  transition: background .2s;
}
.theme-switch-thumb {
  position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%;
  background: #FFFFFF; box-shadow: 0 1px 2px rgba(0,0,0,.3);
  transition: transform .2s;
}
.theme-toggle:hover .theme-switch-track { background: #6F7A8B; }
.theme-toggle[aria-checked="true"] .theme-switch-track { background: var(--gold, #B8925A); }
.theme-toggle[aria-checked="true"]:hover .theme-switch-track { background: #C9A46A; }
.theme-toggle[aria-checked="true"] .theme-switch-thumb { transform: translateX(18px); }
.theme-toggle:focus-visible { outline: none; }
.theme-toggle:focus-visible .theme-switch-track { outline: 2px solid var(--gold, #B8925A); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  .theme-switch-track, .theme-switch-thumb { transition: none; }
}
.main-nav .nav-item-theme { vertical-align: top; }
@media (max-width: 991px) {
  .theme-toggle { margin: 8px 0 0; }
}