/* "Paper" look (2026-10-23): one of the two looks in Settings -> Appearance.
 *
 * Loaded by resync.js when the team default is Paper, or when this browser
 * chose Paper; Classic is the pages' own styles. Reference the user gave:
 * warm off-white, square corners, thin beige borders, flat (no shadows),
 * uppercase letter-spaced labels and buttons, a coral-red primary.
 *
 * Works by redefining the colour and shape variables every page shares, then
 * flattening the handful of hard-coded radii and shadows. If Paper becomes the
 * only look, these values move into each page's :root and this file goes.
 */

:root{
  --bg:#fcfaf7;--surface:#fffffd;   /* lightened twice 2026-10-28, first #f7f4ee and #fffdf9 */
  --surface2:#f3efe7;
  --border:#e4ddd0;--border2:#cfc6b5;
  --text:#1f1d1a;--muted:#7a7266;--muted2:#a49b8d;
  --accent:#c8402c;--accent-dim:rgba(200,64,44,0.08);--accent-hover:#a93422;
  --ui:#e04e39;--ui-dim:rgba(224,78,57,0.10);
  --green:#2f9e5b;--green-dim:rgba(47,158,91,0.12);
  --amber:#d99a1e;--amber-dim:rgba(217,154,30,0.14);
  --red:#d33f2b;--red-dim:rgba(211,63,43,0.10);
  --shadow-sm:none;--shadow-lg:none;
  --radius:2px;--radius-sm:2px;
}
body{background:var(--bg);color:var(--text);font-family:var(--sans);}

/* square and flat everywhere... */
*,*::before,*::after{border-radius:2px !important;box-shadow:none !important;}
/* ...except things that are round by meaning: switches, status dots, spinners, tick circles */
.sw,.sw::after,.conn-dot,.ispin,.spin,.spinner,.lctick,.lrowc .lcshow,.lhide,
[class*="dot"],[class*="knob"],[class*="spinner"]{border-radius:999px !important;}


/* buttons: uppercase, letter-spaced, thin weight, like the reference */
button,.btn,.rs-btn,a.btn{font-family:var(--sans) !important;}
.station-name{font-family:var(--display) !important;}   /* the kiosk title is a button but keeps the display font (Oswald) */
.btn,.rs-btn{text-transform:uppercase;letter-spacing:0.12em;font-weight:500 !important;}
.btn-dark{background:var(--ui) !important;border:1px solid var(--ui) !important;color:#fff !important;}
.btn-dark:hover:not(:disabled){background:#c94431 !important;}
.btn-ghost{background:#efebe3 !important;border:1px solid transparent !important;color:var(--text) !important;}
.btn-ghost:hover:not(:disabled){border-color:var(--border2) !important;}
.rs-btn{border:1px solid var(--border2) !important;background:var(--surface) !important;color:var(--text) !important;font-size:12px !important;}

/* inputs: thin beige border, square, roomy */
input[type=text],input[type=search],input[type=number],input:not([type]),select,textarea{
  /* background-color, not background: the shorthand also wiped the pages' own select arrows (a background-image) */
  border:1.5px solid var(--border2) !important;background-color:var(--surface) !important;font-family:var(--sans) !important;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--text) !important;}

/* labels: uppercase, letter-spaced, light */
label,.fld label,.notes-label,.lcols,.samples-head b{letter-spacing:0.12em;}

/* top bar: white with a thin rule, no shadow */
.bar,.topbar,header{background:var(--surface) !important;border-bottom:1px solid var(--border) !important;}
/* the page's own top bar: sand, a clear step darker than the page (option C,
   2026-11-13, Fabio). Only the bar that is a direct child of body: settings
   also uses .bar for its capacity bars. Muted text and surface2 darken inside
   it, as in Classic, so labels keep their contrast and wells still show. */
body>.bar,body>.topbar,body>header.top{background:#ebe4d6 !important;border-bottom-color:#dcd3c3 !important;--muted:#5f574b;--surface2:#e0d8c8;}

/* print kiosk: warm the cool greys that are hard-coded */
.phead{background:#ebe4d6 !important;border-color:var(--border) !important;}   /* a clear step darker than the white garment head above it */
.litem,.prow{border-color:var(--border) !important;}
.litem.collapsed.ready,.litem.collapsed:not(.open){border-color:var(--green) !important;}   /* ticked / printed rows keep their green edge */
.qpb{border-width:1px !important;font-family:var(--sans) !important;letter-spacing:0.08em;text-transform:uppercase;font-weight:500 !important;}
.qpb.sug{background:var(--text) !important;border-color:var(--text) !important;}
.szrow{border-color:var(--border2) !important;}
.gs-sizes .szrow.now{border-color:var(--text) !important;}   /* spotlight: the current size in ink, not amber */
.gs-sizes .szrow.on{border-color:var(--green) !important;}
.notes{background:#fffaf0 !important;}
.ord-right .bgtog{border-width:1.5px !important;}   /* the same edge as the shipping and date boxes beside it */
