/* Formulaires (formSheet, js/ui.js) : une feuille par action, cellules groupées façon Réglages d'iOS.
   Mêmes marges, mêmes hauteurs (52 px sur tablette), libellé à gauche, valeur ou saisie à droite. */
.modal.fsheet { width: min(560px, 100%); max-height: min(920px, calc(100dvh - 40px)); }
.modal.fsheet.wide { width: min(760px, 100%); }
.modal.fsheet .body { padding: 0 16px 16px; gap: 0; }
.fs-body { display: flex; flex-direction: column; gap: 22px; margin: 0; }
.fs-sec .section-title { margin-top: 0; }
.fs-sec[hidden], .fs-cell[hidden] { display: none !important; }
.fs-list > .item.fs-cell { flex-direction: column; align-items: stretch; gap: 0; padding: 0 16px; min-height: 52px; justify-content: center; }
.fs-row { display: flex; align-items: center; gap: 12px; min-height: 52px; min-width: 0; }
.fs-row.full { flex-direction: column; align-items: stretch; gap: 8px; padding: 12px 0; }
.fs-row.wrap { flex-wrap: wrap; row-gap: 8px; padding: 8px 0; }
.fs-l { flex: 1 1 auto; min-width: 0; font-size: 17px; color: var(--text); font-weight: 400; letter-spacing: -.02em; }
.fs-row.full > .fs-l { flex: none; font-size: 13px; color: var(--muted); }
.fs-v { flex: 0 1 auto; min-width: 0; color: var(--muted); font-size: 17px; text-align: right; }
.fs-v.ph { color: var(--faint); }
.fs-cell .chev { margin-right: -4px; }
/* Saisie : sans fond, alignée à droite, dans la cellule. */
.fs-in { flex: 0 1 60%; width: auto; min-width: 0; min-height: 44px; padding: 0; background: transparent; border-radius: 0; text-align: right; font-size: 17px; box-shadow: none !important; }
.fs-in:focus { box-shadow: none !important; }
.fs-in.num { font-variant-numeric: tabular-nums; }
.fs-row > .fs-in:only-child { flex: 1; text-align: left; }
.fs-ta { width: 100%; min-height: 84px; background: transparent; padding: 0; border-radius: 0; resize: vertical; box-shadow: none !important; }
.fs-row.full > .fs-ta:first-child { padding-top: 2px; }
/* Montant : saisie + bouton $ / FC. */
.fs-money { display: inline-flex; align-items: center; gap: 8px; flex: 0 1 62%; min-width: 0; }
.fs-money .fs-in { flex: 1; font-family: var(--rounded); font-weight: 600; font-size: 20px; }
.fs-ccy, .fs-unit { flex: none; min-width: 44px; height: 34px; padding: 0 10px; border-radius: 9px; display: inline-grid; place-items: center; font-weight: 600; font-size: 15px; }
.fs-ccy { background: var(--fill); color: var(--accent-text); }
.fs-unit { color: var(--muted); min-width: 0; padding: 0 2px; }
/* Quantité : − saisie + */
.fs-step { display: inline-flex; align-items: center; gap: 6px; flex: none; }
.fs-step button { width: 40px; height: 36px; border-radius: 9px; background: var(--fill); color: var(--accent-text); display: grid; place-items: center; }
.fs-step button:active { background: var(--fill-2); }
/* [GPT 2026-10-25] Consistent 44 px touch targets in every shared form. */
.fs-step button { width: 44px; height: 44px; }
.fs-step .fs-in { min-height: 44px; }
.fs-step .fs-in { flex: none; width: 76px; text-align: center; font-family: var(--rounded); font-weight: 600; font-size: 19px; background: var(--fill); border-radius: 9px; min-height: 44px; }
.fs-step .fs-unit { margin-left: -2px; }
/* Choix en ligne */
.fs-seg { flex: 1 1 260px; display: flex; justify-content: flex-end; min-width: 0; }
.fs-seg .seg { max-width: 360px; }
.fs-seg .seg button { min-height: 34px; font-size: 14px; }
/* [GPT 2026-10-25] Field switches remain easy to tap without adding another navigation row. */
.fs-seg .seg button { min-height: 44px; }
.fs-chips { padding-bottom: 2px; }
.fs-cell.fs-photo .ph-edit { padding: 6px 0; }
/* Messages : sous le champ (rouge), en haut de la feuille (erreur du serveur), une ligne d'aide grise. */
.fs-err { color: var(--red); font-size: 13px; padding: 0 0 10px; margin-top: -6px; }
.fs-err[hidden] { display: none; }
.fs-cell.bad .fs-l { color: var(--red); }
.fs-hint { color: var(--muted); font-size: 13px; padding: 0 0 10px; margin-top: -6px; }
.fs-alert { background: var(--red-soft); color: var(--text); border-radius: var(--radius); padding: 12px 14px; font-size: 15px; }
.fs-alert[hidden] { display: none; }
.fs-appr .section-title { color: var(--orange); }
.fs-danger { color: var(--red); justify-content: center !important; align-items: center !important; font-size: 17px; }
/* Gros bouton principal en bas (téléphone, tablette) ; sur PC, le bouton de l'en-tête suffit. */
.fs-foot { padding: 10px 16px calc(14px + env(safe-area-inset-bottom)); background: var(--bg); border-top: .5px solid var(--line); }
.fs-go .spin { display: none; }
.fs-go.busy span:first-child { opacity: .5; }
.fs-go.busy .spin { display: inline-block; width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; animation: spin .8s linear infinite; }
.modal header .btn.busy { opacity: .4; pointer-events: none; }
/* [GPT 2026-10-26] Unknown pointer capability still gets exactly one submit action; wide touch screens keep the large footer button. */
@media (min-width: 1100px) { .modal.fsheet .fs-foot { display: none; } }
/* [GPT 2026-10-25] One visible submit action: sticky footer on touch layouts, header on large desktops. */
@media (max-width: 1099px), (pointer: coarse) { .modal.fsheet header .hr { display: none; } }
@media (min-width: 1100px) and (pointer: coarse) { .modal.fsheet .fs-foot { display: block; } }
@media (max-width: 640px) {
  .overlay:has(> .modal.fsheet) { padding-top: 0; }
  .modal.fsheet, .modal.fsheet.wide { height: 100dvh; max-height: 100dvh; border-radius: 0; padding-top: env(safe-area-inset-top); }
  .modal.fsheet .grab { display: none; }
  .fs-l { font-size: 16px; }
}
.sl-search { flex: none; min-height: 40px; }
.fs-sugg { padding: 0 0 12px; gap: 6px; } .fs-sugg .chip { min-height: 32px; font-size: 14px; }
@media (max-width: 640px) { .modal.fsheet .body { flex: 1; } }

/* [GPT 2026-10-25] Optional inputs remain legible in both appearances. */
.fsheet input::placeholder, .fsheet textarea::placeholder { color: var(--muted); }

/* [GPT 2026-10-28] The shared submit feels like an action, with readable progress and no invented success. */
.fs-go{min-height:54px;border-radius:16px;gap:12px;justify-content:center;}
.fs-go>span:first-child{opacity:1;font-weight:650;}
.fs-go .fs-send-icon{display:inline-flex;align-items:center;transition:transform .18s var(--spring);}
.fs-go .fs-send-icon .i{width:18px;height:18px;}
.fs-go.busy>span:first-child{opacity:1;}
.fs-go.busy .fs-send-icon{display:none;}
.fs-go.busy .spin{border-width:2px;opacity:1;}
.modal.fsheet header .btn.hr.strong{background:var(--accent);color:#fff;padding:10px 16px;min-height:44px;border-radius:12px;font-weight:600;}
.modal.fsheet header .btn.hr.busy{opacity:1;cursor:progress;}
@media(hover:hover) and (pointer:fine){.fs-go:not(:disabled):hover .fs-send-icon{transform:translateX(3px);}}
@media(prefers-reduced-motion:reduce){.fs-go .fs-send-icon{transition:none;}.fs-go:not(:disabled):hover .fs-send-icon{transform:none;}.fs-go.busy .spin{animation:none;}}

/* [GPT 2026-10-29] Payroll is one editable review grid, with a frozen employee identity and no per-cell posting. */
.payroll-editor-scroll{max-width:100%;overflow:auto}.payroll-editor{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0;font-size:14px}.payroll-editor td,.payroll-editor th{padding:8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.payroll-editor thead th{position:sticky;top:0;background:var(--surface);z-index:2;white-space:nowrap}.payroll-editor tbody th{position:sticky;left:0;background:var(--surface);min-width:150px;max-width:200px;z-index:1}.payroll-editor input[type=text]{width:110px;min-height:44px;padding:9px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);font:inherit}.payroll-editor td:last-child input[type=text]{width:220px}.payroll-editor input[aria-invalid=true]{border-color:var(--red)}.payroll-editor input[type=checkbox]{width:22px;height:22px;margin:11px}.payroll-editor details{max-width:260px;margin-top:8px}.payroll-editor summary{cursor:pointer;color:var(--accent-text)}.payroll-proposal{display:flex;align-items:center;gap:5px;font-size:13px;white-space:normal}.payroll-draft-totals{display:flex;justify-content:flex-end;gap:14px;flex-wrap:wrap;font-weight:600}

/* [Claude 2026-11-05] « Code du gérant »: the manager picked before his PIN (PINs are not unique); random PIN button. */
.fs-appr-who:has(> .appr-who[hidden]){display:none}.appr-who{padding:2px 0}.appr-who .chip.on{background:var(--accent);color:#fff}.modal .appr-who{justify-content:center;margin:4px 0 2px}
.fs-rand{flex:none;white-space:nowrap}.fs-row:has(> .fs-rand) > .fs-in{min-width:7ch;font-variant-numeric:tabular-nums}
/* [Claude 2026-11-06] FE-15: the field segments keep 44 px on touch screens even on a phone. */
@media (pointer: coarse) { .fs-seg .seg button { min-height: 44px; } }