/* Visuel demandé. Ajout seulement. Thèmes clairs lisibles. Pas l’écran Nutrition. */

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) :is(.tr-mois, .tr-mois-nav h1, .tr-cal-jour, .tr-cal-tete) {
  color: var(--tr-texte);
  text-shadow: none;
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-cal-smart .tr-cal-jour.aujourdhui:not(.choisi) span {
  color: var(--tr-bronze) !important;
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-accueil .tr-mode:not(.choisi) {
  color: var(--tr-texte);
  background: var(--tr-carte);
  border-color: var(--tr-ligne);
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-accueil .tr-nutri-logo :is(.tr-tr, .tr-perf) {
  color: var(--tr-texte);
  text-shadow: none;
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-accueil .tr-nutri-logo :is(.tr-nut, .tr-tr em) {
  color: var(--tr-bronze);
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) :is(.tr-sv-chiffre, .tr-sv-jours .fait, .tr-sv-barres i) {
  color: var(--tr-bronze);
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-sv-barres i {
  background: var(--tr-bronze);
}

.tr-ops-famille {
  min-height: 88px;
  background-image: linear-gradient(180deg, rgba(18, 18, 18, .35), rgba(18, 18, 18, .82)), url('./photos/fond-ops.jpg');
  background-size: cover;
  background-position: center;
}
.tr-ops .tr-metier {
  min-height: 120px;
  background-image: linear-gradient(180deg, rgba(18, 18, 18, .25), rgba(18, 18, 18, .78)), url('./photos/tr-militaire.jpg');
  background-size: cover;
  background-position: center 22%;
  color: var(--tr-texte);
}

.tr-bandeau {
  position: relative;
  height: 148px;
  margin: 0 0 12px;
  border-radius: var(--tr-rond, 16px);
  overflow: hidden;
  border: 1px solid var(--tr-ligne);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14);
}
.tr-bandeau img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; display: block; }
figure.tr-bandeau { display: block; padding: 0; }
html:not([data-theme="clair"]):not([data-theme="light"]) figure.tr-bandeau {
  background-color: var(--tr-fond);
  background-image: none;
}
figure.tr-bandeau img { height: 100%; object-position: center 16%; }
figure.tr-bandeau::after {
  background: linear-gradient(180deg, rgba(18, 18, 18, .04) 30%, rgba(18, 18, 18, .5));
}
.tr-ops figure.tr-bandeau img { object-position: center 34%; }
.tr-page:has(> figure.tr-bandeau) > .tr-fond-chapitre { display: none; }
.tr-ops:has(> figure.tr-bandeau) .tr-metier,
.tr-ops:has(> figure.tr-bandeau) > .tr-carte:first-of-type:not(.tr-metier) { margin-top: 12px; }
.tr-seances .tr-seance-carte.tr-seance-detail { margin-top: 12px; }
.tr-seances:has(.tr-seance-detail) > .tr-fond-chapitre { display: none; }
.tr-ops-famille { background-position: center 36%; }
html[data-page="seance-du-jour"] figure.tr-bandeau,
html[data-page="historique"] figure.tr-bandeau,
html[data-page="ops"] figure.tr-bandeau,
html[data-page="box"] figure.tr-bandeau {
  height: 188px;
  margin-bottom: -58px;
}
html[data-page="seance-du-jour"] .tr-seance-tete,
html[data-page="historique"] .tr-page > h1,
html[data-page="ops"] .tr-ops > h1,
html[data-page="box"] .tr-grand-titre,
html[data-page="ops"] .tr-chapitre-sous {
  position: relative;
  z-index: 2;
  color: var(--tr-champagne);
  text-shadow: 0 2px 14px rgba(0, 0, 0, .9);
}
.tr-exo-fiche { padding: 14px; margin-top: 8px; }
.tr-exo-fiche h1 { margin-top: 0; }
.tr-exo-fiche .tr-cta { margin-top: 12px; }
html[data-page="nutrition"] .tr-photo { height: 128px; background-position: center 42%; }
html[data-page^="seance/"] figure.tr-bandeau {
  height: 200px;
  margin-bottom: -62px;
}
html[data-page^="seance/"] h1 {
  position: relative;
  z-index: 2;
  color: var(--tr-champagne);
  text-shadow: 0 2px 14px rgba(0, 0, 0, .9);
}
.bloc ul:has(.tr-deroule) { margin: 0; padding-left: 0; }
html[data-page^="seance/"] h1 + p {
  position: relative;
  z-index: 2;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .85);
}
.tr-deroule {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  padding: 8px 0;
  list-style: none;
}
.tr-deroule .tr-seance-num {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  margin-top: 10px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  border: 1.5px solid var(--tr-or);
  color: var(--tr-or);
  font: 700 14px/1 var(--tr-police, inherit);
}
.tr-deroule-corps { flex: 1; min-width: 0; }
.tr-deroule .tr-ligne { min-height: 44px; }
html[data-page="box"] .box-disc-grid { padding-right: 42px; }
html[data-page="box"] .box-disc-grid .cartes { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
html[data-page="box"] .box-disc-card { min-width: 0; width: 100%; }
.heros img[src*="tr-boxe.jpg"] { object-position: 74% 68% !important; }
html[data-page^="chapitre/"] #app > :not(.heros),
html[data-page^="filiere/"] #app > :not(.heros) { margin-right: 36px; }
html[data-page^="seance/"] .video-absente {
  border-style: solid;
  border-color: var(--tr-ligne);
  background: color-mix(in srgb, var(--tr-carte) 72%, transparent);
  border-radius: 16px;
}
.tr-ligne-chapitre {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 64px;
  width: 100%;
  text-align: left;
}
.tr-ligne-chapitre .corps { display: grid; gap: 2px; flex: 1; min-width: 0; }
.tr-ligne-chapitre .nom { font: 700 16px/1.25 var(--tr-police, inherit); }
.tr-ligne-chapitre .meta { color: var(--tr-texte-2); font-size: 13px; }
.tr-ligne-chapitre .tr-seance-num {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  margin: 0;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  border: 1.5px solid var(--tr-or);
  color: var(--tr-or);
  font: 700 13px/1 var(--tr-police, inherit);
}
.filiere-tuile {
  min-height: 72px;
  text-align: left;
  border-radius: 16px;
}
.filiere-tuile .numero { color: var(--tr-or); letter-spacing: .08em; text-transform: uppercase; font-size: 12px; }
html[data-page="filieres"] figure.tr-bandeau { height: 168px; margin-bottom: -52px; }
html[data-page="filieres"] h1 {
  position: relative;
  z-index: 2;
  color: var(--tr-champagne);
  text-shadow: 0 2px 14px rgba(0, 0, 0, .9);
}
html[data-page="filieres"] #filiere-q { min-height: 44px; }
html[data-page="filieres"] #app > label,
html[data-page="filieres"] #filiere-compte,
html[data-page="filieres"] #filiere-grille { margin-right: 36px; }
html[data-page="filieres"] .filiere-tuile {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 10px 12px;
}
html[data-page="filieres"] .filiere-tuile .corps { display: grid; gap: 2px; min-width: 0; flex: 1; }
html[data-page="filieres"] .filiere-tuile .titre { font: 700 16px/1.25 var(--tr-police, inherit); color: var(--tr-texte); }
html[data-page="fin-seance"] figure.tr-bandeau { height: 168px; margin-bottom: -48px; }
html[data-page="fin-seance"] .tr-grand-titre,
html[data-page="fin-seance"] .tr-surtitre,
html[data-page="fin-seance"] .tr-fin-titre {
  position: relative;
  z-index: 2;
}
html[data-page="fin-seance"] .tr-fin-noter,
html[data-page="fin-seance"] .tr-fin-journal { min-height: 44px; }
html.tr-plein-ecran .tr-avant { width: min(100%, 360px); }
html.tr-plein-ecran .tr-avant-meta {
  margin: 0 0 8px;
  text-align: center;
  color: var(--tr-or);
  font: 600 14px/1.2 var(--tr-police, inherit);
}
html.tr-plein-ecran .tr-avant-geste {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin: 0;
  color: var(--tr-texte);
}
:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
).tr-plein-ecran .tr-avant-meta { color: var(--tr-bronze); }
html[data-page^="nutrition/"] .rec-post {
  border: 1px solid var(--tr-ligne);
  border-radius: 16px;
  overflow: hidden;
  margin: 0 0 12px;
}
html[data-page^="nutrition/"] .rec-post.is-open { border-color: var(--tr-or); }
html[data-page^="nutrition/"] .rec-ico,
html[data-page^="nutrition/"] .rec-seg-btn,
html[data-page^="nutrition/"] #recettes-cats .puce {
  min-height: 44px;
  min-width: 44px;
}
html[data-page^="nutrition/"] .rec-ico.on { color: var(--tr-or); }
html[data-page^="nutrition/"] #al-allergenes .puce {
  min-height: 44px;
  min-width: 44px;
  padding: 10px 14px;
}
html[data-page^="nutrition/"] #rec-allergies-filtre > summary { min-height: 44px; }
html[data-page^="nutrition/"] #al-noter { min-height: 44px; }
html[data-page^="fiche/"] figure.tr-bandeau { height: 168px; margin-bottom: -52px; }
html[data-page^="fiche/"] h1 {
  position: relative;
  z-index: 2;
  color: var(--tr-champagne);
  text-shadow: 0 2px 14px rgba(0, 0, 0, .9);
}
html[data-page^="fiche/"] #app > :not(figure) { margin-right: 36px; }
.tr-fiche-bloc { padding: 14px; margin: 12px 0; }
.tr-fiche-bloc h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font: 700 18px/1.25 var(--tr-police, inherit); }
.tr-points-ecrits { list-style: none; margin: 12px 0 0; padding: 0; }
.tr-points-ecrits .nom { white-space: normal; }
html[data-page="plan"] figure.tr-bandeau { height: 160px; margin-bottom: -48px; }
html[data-page="plan"] .tr-grand-titre {
  position: relative;
  z-index: 2;
  color: var(--tr-champagne);
  text-shadow: 0 2px 14px rgba(0, 0, 0, .9);
}
html[data-page="plan"] .tr-page > :not(figure) { margin-right: 36px; }
html[data-page="plan"] fieldset {
  background: color-mix(in srgb, var(--tr-carte) 72%, transparent);
  border-color: var(--tr-ligne);
}
html[data-page="plan"] legend { color: var(--tr-or); }
html[data-page="plan"] .pli > summary { min-height: 44px; }
:is(
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
)[data-page="plan"] .champ input {
  background-color: var(--tr-carte);
  color: var(--tr-texte);
}
html[data-page^="recherche"] figure.tr-bandeau { height: 160px; margin-bottom: -48px; }
html[data-page^="recherche"] h1 {
  position: relative;
  z-index: 2;
  color: var(--tr-champagne);
  text-shadow: 0 2px 14px rgba(0, 0, 0, .9);
}
html[data-page^="recherche"] #app > :not(figure) { margin-right: 36px; }
html[data-page="mange"] figure.tr-bandeau { height: 168px; margin-bottom: -56px; }
html[data-page="mange"] .tr-grand-titre {
  position: relative;
  z-index: 2;
  color: var(--tr-champagne);
  text-shadow: 0 2px 14px rgba(0, 0, 0, .9);
}
html[data-page="mange"] .tr-mange > :not(figure) { margin-right: 36px; }
html[data-page="mange"] .tr-mange-ligne { min-height: 44px; }
html[data-page="mange"] .tr-mange-ligne input {
  width: 72px;
  height: 44px;
  min-height: 44px;
  min-width: 44px;
}
:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
)[data-page="mange"] :is(.tr-mange-champ input, .tr-mange-macro, .tr-mange-ligne, .tr-mange-ligne input) {
  color: var(--tr-texte);
}
:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
)[data-page="mange"] .tr-mange-ico.l { background: var(--tr-bronze); }
html[data-page="filieres"] .filiere-tuile .quoi,
html[data-page="filieres"] .filiere-tuile .compte {
  color: var(--tr-texte-2);
  font-size: 13px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
html[data-page^="chapitre/"] .exo-pli,
html[data-page^="filiere/"] .exo-pli {
  margin: 0 0 8px;
  padding: 4px 12px;
  border-radius: var(--tr-rond, 16px);
  border: 1px solid var(--tr-ligne);
  background: color-mix(in srgb, var(--tr-carte) 72%, transparent);
  list-style: none;
}
html[data-page^="chapitre/"] .exo-pli summary,
html[data-page^="filiere/"] .exo-pli summary {
  min-height: 44px;
  display: flex;
  align-items: center;
  list-style: none;
}
html[data-page^="chapitre/"] .exo-pli summary::-webkit-details-marker,
html[data-page^="filiere/"] .exo-pli summary::-webkit-details-marker { display: none; }
html[data-page^="chapitre/"] .exo-pli-main,
html[data-page^="filiere/"] .exo-pli-main {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
html[data-page^="chapitre/"] .exo-pli-num,
html[data-page^="filiere/"] .exo-pli-num {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  border: 1.5px solid var(--tr-or);
  color: var(--tr-or);
  font-weight: 700;
}
html[data-page^="chapitre/"] .liste-peel,
html[data-page^="filiere/"] .liste-peel { margin: 0; padding: 0; list-style: none; }
html[data-page^="nutrition/"] figure.tr-bandeau { height: 160px; margin-bottom: -48px; }
html[data-page^="nutrition/"] .tr-grand-titre {
  position: relative;
  z-index: 2;
  color: var(--tr-champagne);
  text-shadow: 0 2px 14px rgba(0, 0, 0, .9);
}
html[data-page^="nutrition/"] #app > :not(figure) { margin-right: 36px; }
html[data-page^="nutrition/"] .tr-nutri-porte {
  min-height: 44px;
  flex: 1;
  border-radius: 999px;
  border: 1px solid var(--tr-ligne);
  background: color-mix(in srgb, var(--tr-carte) 78%, transparent);
  color: var(--tr-texte);
}
html[data-page^="nutrition/"] .tr-nutri-porte[aria-pressed="true"] {
  background: var(--tr-or);
  color: var(--tr-sur-or, var(--tr-fond));
  border-color: var(--tr-or);
}
html[data-page="nutrition"] .tr-nutri-porte {
  min-height: 72px;
  border-radius: 16px;
  border: 1px solid var(--tr-or);
  background: color-mix(in srgb, var(--tr-carte) 78%, transparent);
  color: var(--tr-texte);
  font: 700 16px/1.2 var(--tr-police, inherit);
}
.tr-disc-vignette {
  width: 64px;
  height: 64px;
  flex: 0 0 64px;
  border-radius: 16px;
  object-fit: cover;
  border: 1px solid var(--tr-ligne);
}
.rangee-poser .bouton { min-height: 44px; }
html[data-page="nutrition"] .tr-photo b {
  font-size: 13px;
  line-height: 1.15;
  white-space: normal;
  letter-spacing: 0;
}
.tr-bandeau::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(18, 18, 18, .12), rgba(18, 18, 18, .72));
  pointer-events: none;
}
.tr-eau { display: flex; align-items: center; gap: 12px; padding: 12px 14px; }
.tr-eau-goutte, .tr-eau-moins {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border-radius: 50%;
  border: 1px solid var(--tr-or);
  background: transparent;
  color: var(--tr-or);
  font: 600 22px/1 var(--tr-police, inherit);
}
.tr-eau-goutte { background: var(--tr-or); color: var(--tr-sur-or); scroll-margin-bottom: 120px; }
.tr-eau-mot { flex: 1; min-width: 0; }
.tr-eau-mot b, .tr-eau-mot small { display: block; }
.tr-eau-mot small { color: var(--tr-texte-2); font-size: 13px; font-weight: 400; }
.tr-eau-moins:disabled { opacity: .35; }

.tr-sv h1 {
  margin: 4px 0 6px;
  color: var(--tr-texte);
  font: 700 28px/1.15 var(--tr-police, inherit);
  letter-spacing: -0.02em;
}

.tr-sv h2 {
  margin: 0 0 10px;
  font: 600 17px/1.2 var(--tr-police, inherit);
}

.tr-sv-ligne {
  align-items: start;
}

.tr-sv-ligne p {
  margin: 0;
  min-width: 0;
}

.tr-sv-barres {
  width: 100%;
  height: 36px;
}

.tr-sv-lancer {
  color: var(--tr-sur-or, var(--tr-fond));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35);
}

.tr-sv-bloc {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.box-disc-card {
  height: auto;
  overflow: visible;
}

.box-disc-card .corps b {
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-run,
:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) :is(.tr-chiffre, .tr-exo-nom, .tr-fin-titre) {
  color: var(--tr-texte) !important;
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-etat {
  color: var(--tr-bronze) !important;
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-run-quitter {
  background: var(--tr-carte);
  color: var(--tr-texte);
  border: 1px solid var(--tr-ligne);
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-cadran .anneau .creux {
  stroke: color-mix(in srgb, var(--tr-bronze) 40%, var(--tr-ligne));
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-cadran .anneau .plein {
  stroke: var(--tr-bronze);
  filter: none;
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-lien:active {
  color: var(--tr-texte);
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) :is(
  .tr-grand-titre,
  .tr-titre-section,
  .tr-seance-nom,
  .tr-accueil-titre,
  .tr-accueil-jour-titre,
  .tr-accueil-jour .tr-ligne-mot b,
  .tr-seance-prete .tr-ligne-mot b,
  .tr-plan .tr-plan-mot b,
  .tr-metier,
  .tr-vide h3,
  .tr-ressenti h2,
  .tr-ligne,
  .tr-notifs .tr-ligne-mot b,
  .tr-code-grand,
  .tr-voix-titre,
  .tr-fin-titre,
  .tr-choix
) {
  color: var(--tr-texte);
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) :is(.tr-seance-duree, .tr-pastille-jour) {
  color: var(--tr-bronze);
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) :is(.tr-cta, .tr-plan-btn, .tr-sv-lancer) {
  color: var(--tr-sur-or);
}

:is(
  html[data-theme="clair"],
  html[data-theme="light"],
  html[data-theme="crystal-light"],
  html[data-theme="crystal-glass-light"],
  html[data-theme="liquid-glass-light"]
) .tr-choix {
  background: var(--tr-carte);
}

@media (prefers-reduced-motion: reduce) {
  .tr-sv-bloc,
  .tr-sv-lancer,
  .tr-accueil .tr-mode,
  .tr-chiffre,
  .tr-exo-nom {
    transition: none;
    animation: none;
  }
}
