/* 90-retail-standard.css — the Retail tab's ease of use, everywhere.
   Gary 2026-10-06: "Look at how the retail tab functions and looks. Let's add
   this ease of use and style across entire app." The Retail tab was built for
   people who have never used the app: nothing under 14px, 44-50px targets,
   chosen states that fill green, one panel per job.

   What went where:
   - The text floor was applied IN PLACE across every sheet: every readable
     font-size under 14px became 14px (0.875rem), in the block that already
     owned it. The labels drawn inside a room-map tile -- a pot, a dome, a net,
     a bin slot, a burp slot, a zone tick -- stay as they were: the tile is the
     physical object, sized to the room, and the readable version of each is
     one tap away in its panel.
   - Dialogs, tab bars, the phone navbar, the scroll rail and the detail-panel
     buttons were resized in their own blocks.
   - This file holds only the rules that had no home: a floor for every button
     and every input. Both are written at element specificity (0,0,1) with
     :where(), so any class that already sets its own size keeps it. */

/* Every button at least a thumb tall, except the ones that ARE the room map
   (and the small inline links and close crosses that sit inside text).
   Specificity 0: any class that sets its own min-height keeps it. */
:where(button:not(.boh-slot):not(.cr-slot):not(.mr-tile):not(.mr-pot):not(.cr-dome):not(.cure-net):not(.vr-dot-plant):not(.gf-switch):not(.boh-rack-toggle):not(.boh-rack-summary):not(.boh-linkish):not(.gfw-nut-del):not(.gfw-photo-clear):not(.fw-remove-btn):not(.mr-scanner-close):not(.gf-focus-close):not(.cr-focus-close):not(.fr-cell):not(.gf-scroll-thumb)) {
  min-height: 44px;
}

/* 16px in a box stops a phone zooming the whole page in on every tap. These
   sit at element specificity, after the element rule that sets font: inherit,
   so a box whose class sets its own size keeps it. */
input:where(:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]):not([type="hidden"])) {
  min-height: 48px;
  font-size: 16px;
}

select:where(:not([multiple])) {
  min-height: 48px;
  font-size: 16px;
}

textarea:where(:not([readonly])) {
  font-size: 16px;
}

/* A form panel scrolls when its questions outgrow the screen; its answer --
   the line that says what is wrong and the two buttons -- stays pinned to the
   panel's bottom edge (ui-dialog.js wraps them in .gf-dialog-foot). Veg's
   counted death ran 887px in a 724px box on a phone, with "Mark 3 as died"
   and "Only 4 living" both below the fold. 22px is the dialog's own padding. */
.gf-dialog-foot { position: sticky; bottom: -22px; z-index: 1; margin: 0 -22px -22px; padding: 12px 22px 22px; background: var(--sheet); box-shadow: 0 -12px 16px -14px rgba(0, 0, 0, 0.7); }
.gf-dialog-foot .gf-dialog-actions { margin-top: 0; }
