/* BASE F&B POS — Nextera BASE product-family theme. Tokens mirror BASE ERP (IBM Plex Sans, steel-blue ramp, navy shell)
   and retune the shared component classes so every POS screen inherits one design system. */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');
:root{
  --color-bg:#F5F7FA;--color-surface:#FFFFFF;--color-text:#17263B;--color-divider:#E2E8F0;--color-accent:#356FBC;
  --color-accent-100:#EEF4FC;--color-accent-200:#DCE8F8;--color-accent-300:#BCD3F0;--color-accent-400:#8DB2E3;--color-accent-500:#5C8ED2;
  --color-accent-600:#356FBC;--color-accent-700:#2B5B9C;--color-accent-800:#21487D;--color-accent-900:#11233D;
  --color-neutral-100:#F8FAFC;--color-neutral-200:#EDF1F5;--color-neutral-300:#CBD5E1;--color-neutral-400:#94A3B8;--color-neutral-500:#7B8BA1;
  --color-neutral-600:#64748B;--color-neutral-700:#4B5A6E;--color-neutral-800:#334155;--color-neutral-900:#17263B;
  --color-success:#1E7A4A;--color-success-100:#E7F5EE;--color-warning:#9A5B00;--color-warning-100:#FDF3E1;--color-danger:#B42318;--color-danger-100:#FDECEA;
  --nav-bg:#11233D;--nav-fg:#FFFFFF;--nav-text:#C9D3E0;--nav-muted:#7F90A8;--nav-hover:rgba(255,255,255,.08);--nav-active:rgba(255,255,255,.12);--nav-line:rgba(255,255,255,.12);
  --font-heading:"IBM Plex Sans",system-ui,sans-serif;--font-body:"IBM Plex Sans",system-ui,sans-serif;--font-mono:"IBM Plex Mono",ui-monospace,monospace;--font-heading-weight:600;
  --radius-sm:4px;--radius-md:6px;--radius-lg:12px;
  --shadow-sm:0 1px 2px rgba(16,24,40,.04);--shadow-md:0 6px 16px rgba(16,24,40,.10);--shadow-lg:0 16px 40px rgba(16,24,40,.16);
}
html body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);font-size:13.5px;line-height:1.45;}
h1,h2,h3,h4{font-family:var(--font-body);font-weight:600;letter-spacing:-.01em;}
.blueprint>.corner{display:none;}
.blueprint{border:1px solid #E1E4E9;border-radius:8px;}
.card,.dialog{background:var(--color-surface);border:1px solid #E1E4E9;border-radius:8px;box-shadow:var(--shadow-sm);}
.dialog{border-radius:12px;}
.card-title{font-family:var(--font-body);font-weight:600;letter-spacing:0;}
.btn{white-space:nowrap;border-radius:6px;font-family:var(--font-body);font-weight:500;letter-spacing:0;border:1px solid #D5D9E0;}
.btn-primary{background:var(--color-accent-600);border-color:var(--color-accent-600);color:#fff;}
.btn-primary:hover{background:var(--color-accent-700);border-color:var(--color-accent-700);}
.btn-primary:active{background:var(--color-accent-800);}
.btn-primary:disabled{background:var(--color-accent-400);border-color:var(--color-accent-400);opacity:.75;}
.btn-secondary{background:#fff;border-color:#D5D9E0;color:var(--color-text);}
.btn-secondary:hover{background:#F3F5F8;}
.btn-ghost{border-color:transparent;background:transparent;color:var(--color-accent-600);}
.btn-ghost:hover{background:var(--color-accent-100);}
.btn-danger{background:var(--color-danger);border-color:var(--color-danger);color:#fff;}
.btn-danger:hover{background:#912018;border-color:#912018;}
.input{background:#fff;border:1px solid #D5D9E0;border-radius:6px;}
.input:focus-visible{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-200);}
.field>label{color:var(--color-neutral-700);font-weight:500;}
.tag{border-radius:5px;font-weight:500;font-size:11px;letter-spacing:0;padding:2px 8px;gap:.3em;white-space:nowrap;}
.tag-accent{background:var(--color-accent-100);color:var(--color-accent-700);}
.tag-neutral{background:var(--color-neutral-200);color:var(--color-neutral-700);}
.tag-outline{border:1px solid var(--color-accent-300);color:var(--color-accent-700);background:#fff;}
.tag-success{background:var(--color-success-100);color:var(--color-success);}
.tag-warning{background:var(--color-warning-100);color:var(--color-warning);}
.tag-danger{background:var(--color-danger-100);color:var(--color-danger);}
.table{background:#fff;border:1px solid #E1E4E9;border-radius:8px;border-collapse:separate;border-spacing:0;overflow:hidden;font-size:13px;}
.table th{background:var(--color-neutral-100);color:var(--color-neutral-600);font-size:10.5px;font-weight:500;letter-spacing:.08em;padding:10px 8px;}
.table tbody tr:hover{background:var(--color-accent-100);}
:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;border-radius:4px;}

main h1{white-space:nowrap;}
strong,b{font-weight:600;}
.card-title{font-weight:600;font-size:15px;}
main{scroll-padding-bottom:96px;}
input,textarea{scroll-margin-bottom:120px;}
@media (display-mode: standalone){html body{overscroll-behavior:none;}}
