/* Choix de profilé : la grille des familles (cadre Données), la sélection en chiffres (Résultat), la vue « Tableau »
   (le tableau de l'écran Streamlit, posé dans la feuille comme un dessin) et les graphiques (sans « à l'échelle »).
   Chargée par l'établi choix-profile seul. */

/* les familles : des cases en grille, alignées */
.pf-fams { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px 10px; padding: 2px 0 0; }
.pf-fams .case { white-space: nowrap; min-width: 0; }
.pf-fams .case span { overflow: hidden; text-overflow: ellipsis; }

/* la sélection en chiffres, sous les vérifications */
.pf-sel { padding: 2px 16px 12px; border-bottom: 1px solid var(--line); }
.pf-sel .facts { grid-template-columns: auto minmax(0, 1fr); font-size: 11.5px; gap: 5px 10px; }
.pf-sel .facts dt { white-space: nowrap; }
.pf-sel .facts dd { margin: 0; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; min-width: 0; }
.pf-or { color: #E0A100; }
/* λ̄ : la barre posée sur la lettre (le macron combinant se décale) */
.pf-barre { text-decoration: overline; }

/* les graphiques et le tableau ne sont pas « à l'échelle » */
.sheet:has(.pf-vue) .stitle .scale, .sheet:has(svg.pf-graphe) .stitle .scale { display: none; }

/* la vue « Tableau » : il défile dans la feuille, en-tête et colonne des noms figés */
.sheet .draw:has(> .pf-vue) { display: block; position: relative; padding: 0; }
.pf-vue { position: absolute; inset: 4px 14px 10px; display: flex; flex-direction: column; gap: 8px; color: #0D1525; min-width: 0; }
.pf-leg { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; font-size: 11.5px; color: #4A5568; }
.pf-leg .lg { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.pf-leg .lg i { display: inline-block; width: 16px; height: 12px; border-radius: 3px; }
.pf-leg .lg.opt i { background: #BBF7D0; box-shadow: inset 0 0 0 1px #4ADE80; }
.pf-leg .lg.ok i { background: #F0FDF4; box-shadow: inset 0 0 0 1px #BBF7D0; }
.pf-leg .lg.nok i { background: #FEF2F2; box-shadow: inset 0 0 0 1px #FECACA; }
.pf-leg .or { color: #E0A100; }
.pf-defile { flex: 1; min-height: 0; overflow: auto; border: 1px solid #E5E8ED; border-radius: 9px; overscroll-behavior: contain; }
.pf-pied { font-size: 10.5px; color: #8B95A7; line-height: 1.4; }
/* aucun profilé : le message au centre de la feuille */
.pf-vide { margin: auto; max-width: 420px; display: flex; flex-direction: column; gap: 8px; text-align: center; color: #4A5568;
  font-size: 13px; line-height: 1.5; padding: 24px 12px; }
.pf-vide b { font-size: 15px; color: #0D1525; }

.pf-tab { border-collapse: separate; border-spacing: 0; width: 100%; font-size: 11px; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.pf-tab th, .pf-tab td { height: 26px; padding: 0 5px; white-space: nowrap; border-bottom: 1px solid #EEF0F3; text-align: right; color: #0D1525; }
.pf-tab thead th { position: sticky; top: 0; z-index: 2; height: 40px; padding-top: 4px; padding-bottom: 4px; background: #F4F5F8; color: #4A5568;
  font-weight: 650; text-align: right; vertical-align: bottom; border-bottom: 1px solid #D3D8E0; line-height: 1.5; }
.pf-tab thead th sub { line-height: 0; }
.pf-tab thead th small { display: block; font-size: 9.5px; font-weight: 500; color: #8B95A7; line-height: 1.2; }
/* au PC, les chiffres prennent la taille que la largeur de la feuille permet (de 10 à 12 px) : aucune colonne cachée */
@media (min-width: 701px) {
  .pf-defile { container-type: inline-size; }
  .pf-tab { font-size: clamp(9.5px, calc((100cqw - 40px) / 78), 12px); }
}
.pf-tab .mk { width: 18px; padding: 0 0 0 8px; text-align: center; font-weight: 700; color: #2B4BCF; }
.pf-tab th.nm { position: sticky; left: 0; z-index: 1; text-align: left; font-weight: 650; background: inherit; }
.pf-tab thead th.nm { z-index: 3; background: #F4F5F8; }
.pf-tab td:nth-child(3), .pf-tab td:nth-child(4) { font-weight: 650; }
.pf-tab tbody tr.opt td, .pf-tab tbody tr.opt th { background: #BBF7D0; }
.pf-tab tbody tr.ok td, .pf-tab tbody tr.ok th { background: #F0FDF4; }
.pf-tab tbody tr.nok td, .pf-tab tbody tr.nok th { background: #FEF2F2; color: #7F1D1D; }
.pf-tab tbody tr.cur td:first-child { box-shadow: inset 3px 0 0 #2B4BCF; }
.pf-tab tbody tr.cur td, .pf-tab tbody tr.cur th { font-weight: 700; }
.pf-tab tbody tr:hover td, .pf-tab tbody tr:hover th { filter: brightness(.97); }
.pf-tab tbody tr td.mk:empty::after { content: ""; }

/* tablette : le tableau se resserre, la sélection en chiffres passe sur deux lignes par fait */
@media (min-width: 701px) and (max-width: 1360px) {
  .pf-tab th, .pf-tab td { padding: 0 3px; }
  .pf-tab { font-size: clamp(9px, calc((100cqw - 30px) / 70), 12px); }
  .pf-sel .facts { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .pf-sel .facts dd { text-align: left; margin-bottom: 5px; }
}
/* téléphone : le tableau prend sa hauteur et défile en largeur */
@media (max-width: 700px) {
  .pf-fams { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sheet:has(.pf-vue), .sheet .draw:has(> .pf-vue) { min-width: 0; }
  .pf-vue { position: static; padding: 2px 10px 10px; }
  .pf-defile { max-height: 72vh; max-width: calc(100vw - 42px); }
}
@media print {
  .pf-vue { position: static; }
  .pf-defile { overflow: visible; max-height: none; border: 0; }
  .pf-tab thead th, .pf-tab th.nm { position: static; }
}

/* un taux démesuré dans le verdict (un IPE A 80 choisi sous 10⁶ kN·m : 25 777 627 %) : la puce se resserre, rien n'est coupé */
.verdict.pf-moyen .chip.xl { font-size: 20px; padding: 0 11px; flex-shrink: 0; }
.verdict.pf-long .chip.xl { font-size: 15px; padding: 0 9px; flex-shrink: 0; }