/* The calm redesign (Oct 16, 2026): Stock (inventory/stock.js). Loaded after styles.css, so a rule here wins over the same rule there.
   Docs/Hub design standard.md has the rules (Motion; Calm and focus). Colours only from the tokens in styles.css. */

/* The hero: items Low or Out ("1 out · 1 low"), each name a button that opens that item on Receive. */
.st-screen .hero { gap: 4px; }
.st-hero-items { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.st-hero-items .meta { font-size: .875rem; }
.st-hero-items .btn.st-short { gap: 10px; min-height: 44px; padding: 0 14px; border-color: transparent; background: var(--surface-2); color: var(--text); }
.st-hero-items .btn.st-short:hover { background: var(--rt-hover); }
.st-short-n { font: 600 .9375rem/1.2 var(--rt-body); text-align: left; }
.st-short-c { font: 800 1.125rem/1 var(--rt-cond); font-variant-numeric: tabular-nums; color: var(--text); }
.st-short-c.out { color: var(--rt-bad); }

/* Add item and the mail drawing beside Find an item; with no hero, the search box is the top of the page and a little larger. */
.st-tools { align-items: center; flex-wrap: nowrap; }
.st-tools .field.search { flex: 1 1 0; min-width: 0; }
.st-tools .btn.st-add { flex: none; }
.st-tools .ib.st-mail { flex: none; }
.st-tools .btn.st-add { gap: 6px; }
.st-tools .btn.st-add .ic { width: 18px; height: 18px; }
.st-tools .ib.st-mail { width: 46px; height: 46px; border-color: transparent; background: var(--surface); }
.st-tools .ib.st-mail:hover { background: var(--rt-hover); }
.st-tools-solo .field input[type="search"] { min-height: 56px; height: 56px; font-size: 1.0625rem; }
.st-tools-solo .search .ic { top: 19px; }
.st-tools-solo .btn, .st-tools-solo .ib.st-mail { min-height: 56px; }
.st-tools-solo .ib.st-mail { width: 56px; height: 56px; }
body.big-text .st-tools .ib.st-mail { width: 56px; height: 56px; }

/* The items: a quiet tile for an item that is fine, a tinted one for Low and Out; the row opens the item (a chevron says so). */
.st-screen .st-item .st-tile:not(.low):not(.out) { background: var(--surface-2); color: var(--text); }
.st-screen .st-item .lrow { gap: 14px; min-height: 56px; }
.st-screen .st-item .lrow .l1 { font: 600 1rem/1.3 var(--rt-body); }
.st-screen .st-item .lrow .l2 { font-size: .8125rem; }
.st-screen .st-item .lrow:hover .l1 { text-decoration: none; }
.st-screen .st-item .st-go { flex: none; width: 18px; height: 18px; margin-right: 6px; color: var(--text-3); transform: rotate(-90deg); }

/* Folds in the page (Not in use, Last check, Nothing to do, Invoices left out, History): quiet cards that open with a tap. */
.st-screen .more.st-off, .st-side .more.st-left, .st-side .more.st-hist, .st-side .more.st-check, .st-side .more.drift-quiet { border-radius: 14px; background: var(--surface); }
.st-screen .more.st-off > .more-s, .st-side .more.st-left > .more-s, .st-side .more.st-hist > .more-s, .st-side .more.st-check > .more-s,
.st-side .more.drift-quiet > .more-s { padding: 0 14px; }
.st-screen .more.st-off > .more-b, .st-side .more.st-left > .more-b, .st-side .more.st-hist > .more-b, .st-side .more.st-check > .more-b,
.st-side .more.drift-quiet > .more-b { padding: 2px 10px 12px; }
.st-side .more.st-check > .more-s { font-weight: 500; font-size: .875rem; }
.st-side .more .st-row { background: var(--surface-2); }
.st-side .more.st-older { background: none; }
.st-side .more.st-older > .more-s { min-height: 44px; padding: 0 4px; font-size: .8125rem; }
.st-side .more.st-older > .more-b { padding: 2px 0 0; }
.st-side .st-row .ib.st-undo { margin: -4px -4px -4px 0; }
.st-side .st-left-acts { padding: 0 4px; }
.st-side .st-about { gap: 6px; }

/* Lines to check: the question and its two buttons; what the second button does is one tap away. */
.card.drift .drift-more > .more-s { min-height: 44px; padding: 0; font-size: .8125rem; font-weight: 500; color: var(--text-3); }
.card.drift .drift-more > .more-b { padding: 0 0 4px; }
.st-side .more.drift-quiet .drift-story { font-size: .875rem; }
.st-side .more.drift-quiet .drift-quiet-list { padding: 0 4px; }
.st-side .more.drift-quiet .acts { padding: 0 4px; }

/* An item's sheet: its recent changes fold away under the head. */
.st-sheet .more.st-moves-more > .more-s { min-height: 40px; padding: 0 2px; font-size: .8125rem; font-weight: 500; color: var(--text-3); }
.st-sheet .more.st-moves-more > .more-b { padding: 0 2px 6px; }

/* Larger text: the search box takes the whole first line, Add item and the mail drawing under it. */
body.big-text .st-tools { flex-wrap: wrap; }
body.big-text .st-tools .field.search { flex: 1 1 100%; }
body.big-text .st-tools .btn.st-add { flex: 1 1 auto; }
@media (min-width: 900px) { body.big-text .st-tools .field.search { flex: 1 1 0; } body.big-text .st-tools .btn.st-add { flex: none; } }