/* ===== Thème clair / sombre — source de vérité unique =====
   data-theme="light|dark" est posé sur <html> par theme.js (script inline dans le <head>, avant tout rendu).
   Les anciens blocs @media (prefers-color-scheme: dark) des autres feuilles sont remplacés par
   :where(:root[data-theme="dark"]) (même spécificité qu'avant → même rendu). */

:root {
  color-scheme: light;
  /* Neutres sémantiques (clair) */
  --bg: #f3f6fa; --bg-elev-1: #ffffff; --bg-elev-2: #f7fbff;
  --surface: #ffffff; --surface-hover: #edf4fb;
  --border: #d4e3f0; --border-strong: #6f89a5;
  --text: #17304d; --text-muted: #51677f; --text-faint: #566b82;
  --accent: #0067c0; --accent-contrast: #ffffff; --accent-soft: #e3f0fc;
  --success: #12704a; --warning: #8a5a00; --danger: #b3261e; --info: #0b5cab;
  --shadow-sm: 0 1px 3px #0a1f3a1f; --shadow-md: 0 8px 22px #0a1f3a24; --shadow-lg: 0 24px 60px #0a1f3a38;
  --overlay: #0b1a2e66;
  --glass-bg: #ffffffd9; --glass-border: #ffffffb3; --glass-blur: 18px;
  --focus-ring: #0067c0; --selection: #0067c033;
  --scrollbar-thumb: #8fa8c2; --scrollbar-track: transparent;
  --code-bg: #eef3f9; --code-text: #17304d;
  --img-filter: none;
  --theme-toggle-bg: #ffffffe6; --theme-toggle-fg: #17304d; --theme-toggle-bd: #17304d33;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #07080f; --bg-elev-1: #16213f; --bg-elev-2: #0e1730;
  --surface: #1c2b48; --surface-hover: #223552;
  --border: #2b3d5d; --border-strong: #6b8bb8;
  --text: #e8f0fb; --text-muted: #a9bbd2; --text-faint: #8a9db7;
  --accent: #60cdff; --accent-contrast: #05233a; --accent-soft: #14304a;
  --success: #6fdcaa; --warning: #f0c36a; --danger: #ff8fa9; --info: #7fb8f5;
  --shadow-sm: 0 1px 2px #0000008c; --shadow-md: 0 8px 22px #00000066; --shadow-lg: 0 24px 60px #0000008c;
  --overlay: #00000099;
  --glass-bg: #2b2b2bd9; --glass-border: #ffffff14; --glass-blur: 18px;
  --focus-ring: #60cdff; --selection: #60cdff40;
  --scrollbar-thumb: #5f7898; --scrollbar-track: transparent;
  --code-bg: #0b1428; --code-text: #d8e6f8;
  --img-filter: brightness(.93);
  --theme-toggle-bg: #1c2b48e6; --theme-toggle-fg: #e8f0fb; --theme-toggle-bd: #ffffff2e;
}

::selection { background: var(--selection); }
:focus-visible { outline-color: var(--focus-ring); }
img.theme-dim, .theme-dim img { filter: var(--img-filter); }
.pg-lightbox img, .pg-lightbox .pg-full { filter: none !important; }

/* Défilement natif */
html { scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track); }
::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: 8px; }
::-webkit-scrollbar-track { background: var(--scrollbar-track); }

/* Transition de thème : classe posée par theme.js ≤ 250 ms seulement */
html.theme-transition, html.theme-transition *, html.theme-transition *::before, html.theme-transition *::after {
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, fill .2s ease, stroke .2s ease !important;
}
@media (prefers-reduced-motion: reduce) {
  html.theme-transition, html.theme-transition * { transition: none !important; }
}

/* Contraste renforcé */
@media (prefers-contrast: more) {
  :root { --border: #5d7691; --border-strong: #17304d; --text-muted: #2c4058; --text-faint: #3b5068; }
  :root[data-theme="dark"] { --border: #8aa4c4; --border-strong: #e8f0fb; --text-muted: #d2deee; --text-faint: #bccbe0; }
}
/* Contraste élevé Windows : les couleurs système prennent le relais */
@media (forced-colors: active) {
  :root { --focus-ring: Highlight; --border: CanvasText; }
  .theme-switch, .theme-switch button { border: 1px solid ButtonText; forced-color-adjust: auto; }
}

/* Impression : thème clair, sans fonds */
@media print {
  :root, :root[data-theme="dark"] { color-scheme: light; }
  *, *::before, *::after { background: transparent !important; box-shadow: none !important; text-shadow: none !important; }
  body { color: #000 !important; }
  .theme-switch, .theme-tray { display: none !important; }
}

/* ===== Commutateur de thème (Clair / Sombre / Auto) — réutilisé par les 3 pages ===== */
.theme-switch { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid var(--theme-toggle-bd); border-radius: 999px; background: var(--theme-toggle-bg); color: var(--theme-toggle-fg); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.theme-switch button { display: inline-grid; place-items: center; width: 30px; height: 28px; padding: 0; border: 0; border-radius: 999px; background: none; color: inherit; font: 600 14px/1 system-ui, sans-serif; cursor: pointer; }
.theme-switch button:hover { background: color-mix(in srgb, currentColor 14%, transparent); }
.theme-switch button[aria-pressed="true"] { background: color-mix(in srgb, currentColor 22%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 40%, transparent); }
.theme-switch button:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 1px; }
.theme-switch svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.theme-fab { position: fixed; top: 14px; right: 170px; z-index: 9000; }
@media (max-width: 520px) { .theme-fab { right: 118px; top: 12px; } }

/* Windows : icône dans la zone de notification + rangée dans le menu Démarrer */
.theme-tray { position: absolute; right: calc(100% + 62px); top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 6px; background: none; color: inherit; cursor: pointer; }
@media (max-width: 899px) { .theme-tray { display: none; } }
.theme-tray:hover { background: #ffffff26; }
.theme-tray:focus-visible { outline: 2px solid #fff; outline-offset: -2px; }
.theme-tray svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.start-theme { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 10px; padding: 8px 12px; border-radius: 8px; background: color-mix(in srgb, currentColor 7%, transparent); font-size: 13px; font-weight: 600; }
.start-theme .theme-switch { --theme-toggle-bg: color-mix(in srgb, currentColor 6%, transparent); --theme-toggle-fg: currentColor; --theme-toggle-bd: color-mix(in srgb, currentColor 25%, transparent); }
/* Linux : rangée « Style » des paramètres rapides */
.q-style { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.q-style > span { font-size: 13px; }
.q-style .theme-switch { --theme-toggle-bg: color-mix(in srgb, currentColor 6%, transparent); --theme-toggle-fg: currentColor; --theme-toggle-bd: color-mix(in srgb, currentColor 25%, transparent); }