/* ═══ TIMAJE — Thème clair universel (pages sans thème clair natif) ═══
   Technique : inversion filtrée appliquée quand html[data-theme=light][data-mode=filter].
   Les médias (images, vidéos, iframes) sont ré-inversés pour rester naturels. */
html[data-theme="light"][data-mode="filter"]{background:#f4f2ec}
html[data-theme="light"][data-mode="filter"] body{
  filter:invert(1) hue-rotate(180deg);
  background:#0b0e17; /* devient ~#f4f1e8 après inversion */
}
html[data-theme="light"][data-mode="filter"] body :is(img,video,iframe,svg.noinvert,.noinvert){
  filter:invert(1) hue-rotate(180deg);
}
/* adoucir les ombres qui deviennent des halos clairs */
html[data-theme="light"][data-mode="filter"] body *{box-shadow:none !important}
/* le bandeau OG / photos dans les cartes restent naturels via la ré-inversion ci-dessus */

/* ═══ Bouton thème (pages où theme.js doit le créer) ═══ */
.tj-theme-btn{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);color:inherit;
  padding:6px 10px;border-radius:6px;cursor:pointer;font:600 12px 'Segoe UI',system-ui,sans-serif;display:inline-flex;align-items:center;gap:6px}
.tj-theme-btn:hover{background:rgba(255,255,255,.12)}

/* ═══ v3 — robustesse : le filtre ne dépend plus de l'attribut posé par JS ═══ */
html[data-theme="light"]:not([data-native-light]){background:#f4f2ec}
html[data-theme="light"]:not([data-native-light]) body{filter:invert(1) hue-rotate(180deg);background:#0b0e17}
html[data-theme="light"]:not([data-native-light]) body img,
html[data-theme="light"]:not([data-native-light]) body video,
html[data-theme="light"]:not([data-native-light]) body iframe,
html[data-theme="light"]:not([data-native-light]) body svg image,
html[data-theme="light"]:not([data-native-light]) body [style*="background-image"]{filter:invert(1) hue-rotate(180deg)}
html[data-theme="light"]:not([data-native-light]) body *{box-shadow:none !important}
/* Listes déroulantes natives : le popup système hérite parfois du texte de la page —
   on force un rendu lisible identique dans les deux modes, sur tout le site. */
select option{background:#ffffff !important;color:#141a33 !important}

/* Lightbox vidéo : en mode clair, on ré-inverse tout le modal (fond sombre conservé)
   et la vidéo à l'intérieur reste en rendu natif — lisible et contrastée dans les 2 modes. */
html[data-theme="light"]:not([data-native-light]) body .video-modal{filter:invert(1) hue-rotate(180deg);background:rgba(0,0,0,.92)}
html[data-theme="light"]:not([data-native-light]) body .video-modal video{filter:none}
