/* Lot « bilan-divers » : onglet Créatives (CreativesView.swift), Réglages (ReglagesView.swift), bilan du soir (BilanSoirView.swift)
   et sa rangée de l'accueil. Valeurs reprises du Swift (marges, tailles, espacements) et des captures reference/bilan/61-76. */

/* ===================================================================== Créatives */
/* VStack(spacing: 24), marges 16 (padding de .ak-page), bas 40 */
.bi-crea { display: flex; flex-direction: column; gap: var(--espace-bloc); }
.bi-crea__vide { padding: 16px; }
.bi-crea__rangee { min-height: 56px; padding-top: 8px; padding-bottom: 8px; }
.bi-crea__gauche { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.bi-crea__droite { flex: none; margin-left: 8px; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; white-space: nowrap; }
.bi-crea__icone { flex: none; width: 24px; display: inline-flex; justify-content: center; }
.bi-crea .ak-groupe__panneau > .ak-filet--systeme { flex: none; }

/* ===================================================================== Rangée « Bilan du soir » de l'accueil */
.bi-rangee-soir__icone { flex: none; width: 24px; display: inline-flex; justify-content: center; }
.bi-rangee-soir__textes { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }

/* ===================================================================== Réglages (Form groupé, composants système) */
.bi-reglages { --bi-cellule: #1C1C1E; font-family: var(--police-systeme); }
dialog.bi-reglages { --bi-cellule: var(--cellule); }
.bi-reglages .ak-feuille__panneau { --bi-cellule: var(--cellule); }

/* grand titre : en largeur téléphone, à sa place de l'app (barre de navigation de 44 + titre ; capture 64 : œil du texte à
   65 pt sous la zone sûre) ; à partir de 600 px, aligné sur les en-têtes des autres onglets (centre à 26 pt du haut de la page). */
.bi-reglages__grand-titre {
  margin: 57px 0 0; padding: 0 0 2px;
  font: 700 var(--taille-grand-titre)/41px var(--police-systeme); letter-spacing: 0.01em; color: var(--couleur-texte);
}
.bi-reglages__form { display: flex; flex-direction: column; }
@media (min-width: 600px) { .bi-reglages__grand-titre { margin-top: 6px; } }
.bi-reglages__section { display: flex; flex-direction: column; margin-top: 20px; }
.bi-reglages--onglet .bi-reglages__section:first-child { margin-top: 8px; }
.bi-reglages--feuille .bi-reglages__section:first-child { margin-top: 4px; }
.bi-reglages__entete {
  padding: 8px 16px 12px;
  font: 600 17px/1.25 var(--police-systeme); color: var(--feuille-texte-systeme, rgba(235, 235, 245, 0.6));
}
.bi-reglages__section:not(:has(.bi-reglages__entete)) { margin-top: 24px; }
.bi-reglages__section:first-child:not(:has(.bi-reglages__entete)) { margin-top: 20px; }
.bi-reglages__bloc { background: var(--bi-cellule); border-radius: 26px; overflow: hidden; }
.bi-reglages__rangee { text-decoration: none; }
.bi-reglages__valeur { flex: none; max-width: 60%; color: var(--feuille-texte-systeme, rgba(235, 235, 245, 0.6)); text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bi-reglages__info { cursor: default; }
.bi-reglages__info:active { background: transparent; }
.bi-reglages__destructif { color: var(--couleur-perte); }
.bi-reglages__lien { color: var(--couleur-teinte); }

/* barre de titre en ligne de l'onglet (le grand titre est sorti de l'écran) */
.bi-reglages__barre {
  position: fixed; z-index: 5; top: 0; left: 0; right: 0;
  height: calc(var(--sur-haut, 0px) + 44px); padding-top: var(--sur-haut, 0px);
  display: flex; align-items: center; justify-content: center;
  font: 600 17px/1 var(--police-systeme); color: var(--couleur-texte);
  background: linear-gradient(to bottom, rgba(12, 11, 10, 0.92) 0%, rgba(12, 11, 10, 0.75) 60%, rgba(12, 11, 10, 0) 100%);
  pointer-events: none; opacity: 0; transition: opacity 180ms ease-out;
}
.bi-reglages__barre.est-visible { opacity: 1; }

/* interrupteur, rangées et pieds de section : communs avec Frais fixes (bilan/styles.css, ecrans/formulaire.js) */

/* ===================================================================== Bilan du soir : feuille */
.bi-soir-contenu { padding: 8px 0 40px; }
.bi-soir-feuille.avec-vocal .bi-soir-contenu { padding-bottom: calc(40px + 72px); }
.bi-soir-feuille.avec-vocal .ak-feuille__contenu { padding-bottom: env(safe-area-inset-bottom, 0px); }
/* la bulle reste fixe en bas de la feuille, le rapport défile dessous (safeAreaInset) */
.bi-soir-feuille .ak-feuille__bas {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  padding: 0 12px calc(8px + env(safe-area-inset-bottom, 0px));
  pointer-events: none;
}
.bi-soir-feuille .ak-feuille__panneau.est-partiel .ak-feuille__bas { padding-bottom: 8px; }
.bi-soir-feuille .ak-feuille__bas > * { pointer-events: auto; }
.bi-soir-choix { display: inline-flex; align-items: center; gap: 4px; padding: 0 4px; white-space: nowrap; }

/* rapport : VStack(spacing: 12) */
.bi-soir-texte {
  display: flex; flex-direction: column; gap: 12px; min-width: 0;
  -webkit-user-select: text; user-select: text; overflow-wrap: anywhere;
}
.bi-soir-texte h3, .bi-soir-texte h4, .bi-soir-texte h5, .bi-soir-texte p { margin: 0; }
.bi-soir-titre { display: flex; flex-direction: column; gap: 4px; padding-bottom: 2px; }
.bi-soir-section { padding-top: 12px; }
.bi-soir-sous { padding-top: 6px; }
.bi-soir-phrases { display: flex; flex-direction: column; gap: 6px; min-width: 0; flex: 1 1 auto; }
.bi-soir-phrase { font-size: var(--taille-sous-titre); line-height: calc(var(--taille-sous-titre) * 1.3 + 3px); }
.bi-soir-gras { font-weight: 600; }
.bi-soir-code { font-family: var(--police-mono); font-size: 0.92em; }
.bi-soir-lien { color: var(--couleur-teinte); text-decoration: underline; text-underline-offset: 2px; }
.bi-soir-source { line-height: 1.35; }
.bi-soir-puce { display: flex; align-items: baseline; gap: 8px; }
.bi-soir-puce__marque { flex: none; min-width: 16px; text-align: right; }

/* fiches : fond surface, rayon 20, marge 16 */
.bi-soir-fiche { background: var(--couleur-surface); border-radius: var(--rayon-xl); padding: 16px; min-width: 0; }
.bi-soir-retenir { display: flex; flex-direction: column; gap: 12px; }
.bi-soir-retenir__point { display: flex; align-items: baseline; gap: 10px; }
.bi-soir-retenir__num { flex: none; }
.bi-soir-objectifs { display: flex; flex-direction: column; gap: 18px; }
.bi-soir-objectifs__produit { display: flex; flex-direction: column; gap: 12px; }
.bi-soir-objectif { display: flex; flex-direction: column; gap: 6px; }
.bi-soir-objectif__tete { display: flex; align-items: center; gap: 6px; min-width: 0; }
.bi-soir-objectif__libelle { flex: 0 1 auto; }
.bi-soir-objectif__cadenas { flex: none; display: inline-flex; }
.bi-soir-ressort { flex: 1 1 8px; min-width: 8px; }
.bi-soir-objectif__tete > :not(.bi-soir-objectif__libelle) { flex-shrink: 0; }
.bi-soir-deux-lignes {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden;
}
.bi-soir-produit, .bi-soir-decision { display: flex; flex-direction: column; gap: 12px; }
.bi-soir-tete { display: flex; align-items: baseline; gap: 8px; }
.bi-soir-tete__gauche { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.bi-soir-tete__droite { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; max-width: 50%; }
.bi-soir-chiffres { display: flex; gap: 8px; }
.bi-soir-chiffres--haut { align-items: flex-start; }
.bi-soir-chiffre { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
/* sous-titre d'un chiffre (« ROAS breakeven 1,47 ») : jusqu'à trois lignes, comme lineLimit(3) de l'app */
.bi-soir-chiffre__sous { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; overflow-wrap: anywhere; }
.bi-soir-part { display: flex; flex-direction: column; gap: 4px; }
.bi-soir-verdict {
  flex: none; align-self: center; padding: 6px 12px; border-radius: var(--rayon-capsule);
  background: var(--couleur-surface-3); white-space: nowrap;
}
.bi-soir-decision .bi-soir-tete { align-items: flex-start; }
.bi-soir-raisons { display: flex; flex-direction: column; gap: 8px; }
.bi-soir-marge { display: flex; flex-direction: column; gap: 6px; }
.bi-soir-examiner { display: inline-flex; align-items: center; gap: 6px; }
.bi-soir-tableau { padding: 0; display: flex; flex-direction: column; }
.bi-soir-tableau__ligne { display: flex; flex-direction: column; gap: 4px; padding: 12px 16px; position: relative; }
.bi-soir-tableau__ligne + .bi-soir-tableau__ligne::before {
  content: ""; position: absolute; top: 0; left: 16px; right: 0; height: 0.5px; background: var(--couleur-filet);
}

/* chargement : ProgressView("Chargement…") centré, 60 du haut */
.bi-soir-attente { display: flex; flex-direction: column; align-items: center; gap: 10px; padding-top: 60px; }


/* menu des soirs (Menu SwiftUI) : liste flottante sous le bouton, coche sur le soir affiché */
.bi-soir-menu {
  position: fixed; inset: auto; margin: 0; top: 0; right: 8px; left: auto; bottom: auto;
  min-width: 190px; max-height: 60vh; overflow-y: auto; padding: 6px 0;
  border: 0; border-radius: 22px; color: var(--couleur-texte);
  background: rgba(44, 43, 41, 0.86);
  -webkit-backdrop-filter: blur(30px) saturate(1.6); backdrop-filter: blur(30px) saturate(1.6);
  box-shadow: inset 0 0.5px 0 rgba(255, 255, 255, 0.14), 0 0 0 0.5px rgba(255, 255, 255, 0.08), 0 14px 44px rgba(0, 0, 0, 0.45);
}
.bi-soir-menu:not([popover]), .bi-soir-menu:not(.est-ouvert):not(:popover-open) { display: none; }
.bi-soir-menu__choix {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 44px; padding: 0 18px 0 12px;
  font: 400 17px/1.3 var(--police-systeme); color: var(--couleur-texte); text-align: left;
}
.bi-soir-menu__choix:active, .bi-soir-menu__choix:focus-visible { background: rgba(255, 255, 255, 0.08); outline: none; }
@media (hover: hover) and (pointer: fine) { .bi-soir-menu__choix:hover { background: rgba(255, 255, 255, 0.06); } }
.bi-soir-menu__coche { flex: none; width: 18px; display: inline-flex; justify-content: center; }

/* bulle du vocal : verre, rayon 30, 12 × 10 ; bouton rond teinte 46 ; vitesse en capsule 50 × 34 */
.bi-soir-vocal { display: flex; align-items: center; gap: 12px; padding: 10px 12px; }
.bi-soir-vocal audio { display: none; }
.bi-soir-vocal__lecture {
  flex: none; width: 46px; height: 46px; border-radius: 50%;
  display: inline-grid; place-items: center;
  background: var(--couleur-teinte); color: var(--couleur-sur-teinte);
}
.bi-soir-vocal__lecture:disabled { cursor: default; }
.bi-soir-vocal__lecture:not(:disabled):active { transform: scale(0.94); }
.bi-soir-vocal__lecture:focus-visible, .bi-soir-vocal__vitesse:focus-visible { outline: 2px solid var(--couleur-teinte); outline-offset: 2px; }
.bi-soir-vocal__icone { display: inline-flex; }
.bi-soir-vocal__icone.est-decale { transform: translateX(2px); }
.bi-soir-vocal__lecture .bi-roue { color: var(--couleur-sur-teinte); }
.bi-soir-vocal__milieu { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.bi-soir-vocal__temps { display: flex; justify-content: space-between; gap: 8px; }
.bi-soir-vocal__vitesse { flex: none; width: 50px; height: 34px; display: inline-grid; place-items: center; }
.bi-soir-vocal__vitesse:active { transform: scale(0.95); }

/* curseur (Slider iOS 26) : piste fine, partie lue teintée, bouton en capsule blanche */
.bi-soir-curseur {
  -webkit-appearance: none; appearance: none; width: 100%; height: 28px; margin: 0; background: transparent; cursor: pointer;
  --avance: 0%;
}
.bi-soir-curseur:disabled { cursor: default; }
.bi-soir-curseur::-webkit-slider-runnable-track {
  height: 6px; border-radius: 3px;
  background: linear-gradient(to right, var(--couleur-teinte) 0 var(--avance), rgba(120, 120, 128, 0.36) var(--avance) 100%);
}
.bi-soir-curseur::-moz-range-track { height: 6px; border-radius: 3px; background: rgba(120, 120, 128, 0.36); }
.bi-soir-curseur::-moz-range-progress { height: 6px; border-radius: 3px; background: var(--couleur-teinte); }
.bi-soir-curseur::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 38px; height: 24px; margin-top: -9px; border-radius: 12px;
  background: #FFFFFF; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.22), 0 0 0 0.5px rgba(0, 0, 0, 0.06);
}
.bi-soir-curseur::-moz-range-thumb {
  width: 38px; height: 24px; border: 0; border-radius: 12px;
  background: #FFFFFF; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.22);
}
.bi-soir-curseur:focus-visible { outline: none; }
.bi-soir-curseur:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 2px var(--couleur-teinte); }

/* grand écran : la feuille est un panneau centré (kit) ; le texte garde une largeur de lecture confortable */
@media (min-width: 600px) {
  .bi-soir-texte { max-width: 640px; }
}