/* Kit de formulaire natif Le Fil pour les écrans de fonction (lot 2A : profil, comptes, outils, retours, quiz, réglementation).
   Remplace le kit classique de css/styles.css (.auth-input, .auth-submit, .sf-btn, .sf-input, .c-btn, .glass, .sv-ph, .sv-panel) sur ces écrans :
   mêmes gestes que la fabrique du budget (css/fil-budget.css : .fb-bouton, .fb-saisie, .fb-carte…), jetons --f-* seulement.
   Ce fichier ne porte que ce que le budget ne fournit pas : bouton réduit, états des champs, focus, [hidden] gardé malgré un display fixe. */

/* un élément masqué par [hidden] le reste, même si sa classe fixe un display */
.fb-bouton[hidden], .fb-saisie[hidden], .fb-carte[hidden], .fb-case[hidden], .fb-champ[hidden] { display: none !important; }
:is(.fb-bouton, .fb-saisie, .fb-case input, .fb-segment):focus-visible { outline: 2px solid var(--f-encre); outline-offset: 3px; }

/* Boutons */
a.fb-bouton { text-decoration: none; }
.fb-bouton--petit { padding: 0 14px; }
.fb-bouton--plein:disabled { opacity: .5; }
.fb-bouton--danger { border-color: var(--f-urgent); }
.fb-bouton--actif { border-color: var(--f-encre); box-shadow: inset 0 0 0 1px var(--f-encre); }

/* Champs */
.fb-saisie::placeholder { color: var(--f-encre-2); opacity: 1; }
.fb-saisie[aria-invalid="true"] { border-color: var(--f-urgent); }
.fb-saisie[readonly], .fb-saisie--lecture { background: var(--f-surface-2); color: var(--f-encre-2); cursor: default; }
.fb-saisie--lecture { display: flex; align-items: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
textarea.fb-saisie { min-height: 88px; line-height: 1.45; resize: vertical; }
.fb-saisie--court { width: auto; flex: 0 1 auto; }

/* Cartes : l'état « à plat » (dans un bloc qui porte déjà son filet) et l'alerte */
.fb-carte--plate { padding: 0; background: none; border: 0; border-radius: 0; }
.fb-carte--filet { padding: 14px 0; background: none; border: 0; border-top: 1px solid var(--f-filet); border-radius: 0; }
.fb-carte[data-etat="attention"] { border-color: var(--f-attention); }
.fb-carte[data-etat="urgent"] { border-color: var(--f-urgent); }
.fb-carte[data-etat="ok"] { border-color: var(--f-fait); }
.fb-carte-ligne > .fb-carte-total:empty { display: none; }

/* Tête de carte à compteur (remplace .sv-ph : titre, compteur au bout de la ligne) */
.fb-carte-ligne--tete { margin: 0 0 10px; padding: 0 0 8px; border-bottom: 1px solid var(--f-filet); }

/* Dialogue de confirmation et choix d'un séjour (js/fil/dialogue.js : confirmDialog, pickSejour) : une feuille du kit (.fb-voile / .fb-feuille, css/fil-budget.css),
   en bas de l'écran au téléphone, au centre au bureau. Au-dessus d'une autre feuille ouverte (on supprime depuis une fiche en édition). */
.fb-voile--dialogue { z-index: 210; }
.fb-feuille--dialogue { width: min(100%, 440px); }
.fb-dialogue-msg { margin: 0; font: 400 16px/1.5 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fb-dialogue-choix { display: flex; flex-direction: column; gap: 8px; }
.fb-dialogue-choix .fb-bouton { width: 100%; justify-content: flex-start; text-align: left; }

/* Profil : lignes de qualifications et d'expérience (js/render.js : profilQualifsSection, profilExperienceSection ; js/qualif-select.js) */
.qedit-list { display: flex; flex-direction: column; gap: 8px; }
.qedit-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--f-filet); border-radius: 14px; background: var(--f-surface-2); }
.qedit-row .fb-saisie { flex: 1 1 130px; width: auto; min-width: 0; }
.qedit-row .qedit-num { flex: 0 1 110px; }
.qedit-del { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border: 1px solid var(--f-filet); border-radius: 14px; background: var(--f-surface); color: var(--f-encre-2); cursor: pointer; }
.qedit-del:hover { color: var(--f-urgent); border-color: var(--f-urgent); }
.qedit-del .ico { width: 16px; height: 16px; }
.qedit-actions { display: flex; }
.exp-row { display: flex; align-items: center; gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--f-filet); }
.exp-row:last-of-type { border-bottom: 0; }
.exp-lbl { flex: 1; color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; }
.fb-saisie.exp-count { flex: none; width: 80px; text-align: center; }
