/* Interface « Synthèse » en version mobile (lot M1) : la version mobile garde l'aspect Synthèse (cartes en relief, fond teinté par rubrique, barre du bas flottante).
   Cette feuille ne fait que retirer ce qui n'a pas de sens sans colonne de gauche (tiroir, rangée de tuiles, barre de lecture), aligner l'en-tête sur la maquette
   (une seule ligne : retour, titre, cloche) et teinter le fond par onglet. Le reste (barre d'onglets, pages) est dans mobile.css. Règles en var(--…) uniquement. */

/* ── Sans colonne de gauche : ni tiroir, ni rangée de tuiles, ni barre de lecture ── */
:root[data-interface="synthese"][data-mobile] .v5-voile,
:root[data-interface="synthese"][data-mobile] .v5-rangee,
:root[data-interface="synthese"][data-mobile] .v5-lecture { display: none !important; }
:root[data-interface="synthese"][data-mobile] #content,
:root[data-interface="synthese"][data-mobile] #sidebar.collapsed ~ #content { margin-left: 0; }

/* ── En-tête sur une ligne (la Synthèse étroite le coupe en deux niveaux) ── */
:root[data-interface="synthese"][data-mobile] .topbar {
  flex-wrap: nowrap;
  height: auto;
  row-gap: 0;
  background: var(--bg);      /* opaque : le contenu qui défile passe dessous sans se superposer au titre (signalement iPhone du 2026-11-09) */
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
:root[data-interface="synthese"][data-mobile] .tb-crumb {
  order: 0;
  flex: 1 1 auto;
  align-items: center;
  font-size: calc(var(--s-4) + 3px);
}
:root[data-interface="synthese"][data-mobile] .tb-crumb .crumb-link[data-back] {
  width: var(--mb-cible);
  height: var(--mb-cible);
}
:root[data-interface="synthese"][data-mobile] .tb-crumb .crumb-link[data-back] svg { width: 22px; height: 22px; }
:root[data-interface="synthese"][data-mobile] .tb-crumb-cur {
  display: block;
  -webkit-line-clamp: unset;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-top: 0;
}
:root[data-interface="synthese"][data-mobile] .topbar .nt-wrap { order: 4; }

/* ── Page : la gouttière de la Synthèse est celle de la version mobile (mobile.css) ── */
:root[data-interface="synthese"][data-mobile] .page { padding-top: var(--s-3); }

/* ── Fond teinté par onglet (comme la maquette : Projets bleu, Tâches vert, Photo cyan, Documents ocre, Plus violet) ── */
:root[data-interface="synthese"][data-mobile][data-mtab="projets"]:not([data-fond="accueil"]) { --v5-ah: calc(255 + var(--v5-dh, 0)); }
:root[data-interface="synthese"][data-mobile][data-mtab="taches"]:not([data-fond="accueil"]) { --v5-ah: calc(160 + var(--v5-dh, 0)); }
:root[data-interface="synthese"][data-mobile][data-mtab="photo"]:not([data-fond="accueil"]) { --v5-ah: calc(195 + var(--v5-dh, 0)); }
:root[data-interface="synthese"][data-mobile][data-mtab="docs"]:not([data-fond="accueil"]) { --v5-ah: calc(70 + var(--v5-dh, 0)); }
:root[data-interface="synthese"][data-mobile][data-mtab="contacts"]:not([data-fond="accueil"]) { --v5-ah: calc(25 + var(--v5-dh, 0)); }
:root[data-interface="synthese"][data-mobile][data-mtab="sav"]:not([data-fond="accueil"]) { --v5-ah: calc(120 + var(--v5-dh, 0)); }
:root[data-interface="synthese"][data-mobile][data-mtab="plus"]:not([data-fond="accueil"]) { --v5-ah: calc(300 + var(--v5-dh, 0)); }

/* ── Réduire la transparence : plus de flou derrière les fenêtres ── */
@media (prefers-reduced-transparency: reduce) {
  :root[data-interface="synthese"][data-mobile] #modal-overlay,
  :root[data-interface="synthese"][data-mobile] .nt-panneau { -webkit-backdrop-filter: none; backdrop-filter: none; }
  :root[data-interface="synthese"][data-mobile] .topbar { background: var(--bg); -webkit-backdrop-filter: none; backdrop-filter: none; }
}
