/* Field Ops v2 components: overlays (sheet on <dialog>, confirm dialog). Tokens only. */

dialog.fld-sheet { position: fixed; inset: auto 0 0 0; width: 100%; max-width: var(--fld-column); max-height: 92dvh; margin: 0 auto; padding: .5rem var(--fld-gutter) calc(var(--fld-safe-bottom) + 1.5rem); border: 0; border-radius: var(--fld-r-sheet) var(--fld-r-sheet) 0 0; background: var(--fld-bg); color: var(--fld-ink); overflow-y: auto; overscroll-behavior: contain; transform: translateY(105%); transition: transform var(--fld-dur-sheet) var(--fld-ease), overlay var(--fld-dur-sheet) allow-discrete, display var(--fld-dur-sheet) allow-discrete; }
dialog.fld-sheet[open] { transform: none; }
@starting-style { dialog.fld-sheet[open] { transform: translateY(105%); } }
dialog.fld-sheet::backdrop { background: var(--fld-scrim); }
/* v3 iPhone (iOS 26): a partial-height sheet floats inset from the screen edges with all corners rounded; the full-height Hand out sheet keeps the edge-to-edge shape.
   Android keeps the M3 bottom sheet: full width, top corners, drag handle. */
:root:not([data-platform="android"]) dialog.fld-sheet:not(.fld-sheet--full) { inset: auto .5rem calc(var(--fld-safe-bottom) + .5rem) .5rem; width: auto; border-radius: 2.125rem; padding-bottom: 1.25rem; box-shadow: 0 -10px 40px var(--fld-knob-shadow); }
dialog.fld-sheet--full { top: calc(var(--fld-safe-top) + 2.75rem); height: calc(100dvh - var(--fld-safe-top) - 2.75rem); max-height: none; display: flex; flex-direction: column; }   /* a dialog is height: fit-content by default: give it the screen's height so the sheet scrolls inside itself instead of running off it */
dialog.fld-sheet--full:not([open]) { display: none; }
.fld-brandfoot { display: flex; justify-content: center; padding-top: .5rem; }.fld-sheet__grab { width: 2.375rem; height: .3125rem; margin: .25rem auto .75rem; border-radius: .1875rem; background: var(--fld-control); opacity: .6; touch-action: none; }
.fld-sheet__head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; }
.fld-sheet__title { font-family: var(--fld-num); font-weight: 700; font-size: var(--fld-fs-sheet); line-height: 1.15; }
:root[data-platform="android"] .fld-sheet__title { font-weight: 600; }
.fld-sheet__body { flex: 1; min-height: 0; }
.fld-sheet__foot { display: flex; flex-direction: column; gap: .5rem; padding-top: .875rem; }
/* A vertical stack of blocks (list, note, button) inside a sheet or a swappable panel: 12 px between neighbours, so two blocks never touch (the phone test fails under 8 px). */
.fld-stack { display: flex; flex-direction: column; gap: .75rem; }
.fld-stack > [data-shift-figures]:not(:has(*)) { display: none; }                   /* the shift figures box is empty until a screen or the server gives it rows */
.fld-stack > .fld-section-label { margin: .25rem .25rem -.375rem; }                          /* the gap already separates blocks: a section label needs a little extra above it only */
.fld-stack > .fld-list:not(:has(> .fld-list__row:not([hidden]))) { display: none; } /* a group whose rows are all hidden (Install app once installed) leaves no empty gap */

/* Confirm dialog (destructive only). iPhone: iOS 26 alert, centred text, capsule buttons side by side. Android: M3 basic dialog, 28 corners, text buttons on the right. */
dialog.fld-dialog { width: min(17.5rem, calc(100vw - 2.5rem)); max-width: none; padding: 1.25rem 1rem 1rem; border: 0; border-radius: 1.625rem; background: var(--fld-surface); color: var(--fld-ink); text-align: center; }
dialog.fld-dialog::backdrop { background: var(--fld-scrim); }
.fld-dialog__title { font-weight: 600; font-size: var(--fld-fs-body); line-height: 1.3; }
.fld-dialog__body { margin: .25rem 0 1rem; color: var(--fld-ink2); font-size: var(--fld-fs-sub); }
.fld-dialog__actions { display: flex; flex-direction: row-reverse; gap: .5rem; }
.fld-dialog__actions > .fld-btn { flex: 1; min-height: var(--fld-tap); padding: 0 .75rem; }
:root[data-platform="android"] dialog.fld-dialog { width: min(19rem, calc(100vw - 3rem)); padding: 1.5rem 1.5rem 1rem; border-radius: 1.75rem; background: var(--fld-bg); text-align: left; }
:root[data-platform="android"] .fld-dialog__title { font-size: 1.5rem; font-weight: 400; line-height: 2rem; }
:root[data-platform="android"] .fld-dialog__body { margin: 1rem 0 1.5rem; font-size: .875rem; line-height: 1.25rem; }
:root[data-platform="android"] .fld-dialog__actions { justify-content: flex-start; }
:root[data-platform="android"] .fld-dialog__actions > .fld-btn { flex: none; width: auto; min-height: 2.5rem; background: transparent; color: var(--fld-brand); font-size: .875rem; }
:root[data-platform="android"] .fld-dialog__actions > .fld-btn--bad { color: var(--fld-bad); }
