/* Kawn ERP — mobile shell «pro max» (v1.3.1). Loaded after the app styles.
 * Scope: html.kawn-mobile = inside the «كون ERP» app (any size) or any browser viewport ≤ 1024px.
 *        html.kw-phone  < 800px · html.kw-tablet 800–1024px (or the app on a tablet).
 * Desktop ≥ 1025px in a browser: only the login screen below changes.
 * Tokens (Business Galaxy system): navy #0C0A28 · panel #15193D · line #2C3160 · ink #F3F1EC · dim #A9B0CC · accent #34ABE2 · good #4FBF85 · bad #F2766B · warn #F2B84B
 * Type: Cairo = numbers + headings · Tajawal = body · tabular-nums on money · radius 14 (cards) / 12 (controls) / 999 (chips) · one accent. */
:root { --kw-navy:#0C0A28; --kw-panel:#15193D; --kw-panel2:#1C2150; --kw-line:#2C3160; --kw-ink:#F3F1EC; --kw-dim:#A9B0CC; --kw-accent:#34ABE2; --kw-good:#4FBF85; --kw-bad:#F2766B; --kw-warn:#F2B84B;
  --kw-r:14px; --kw-rc:12px; --kw-tabs:56px; --kw-safe:env(safe-area-inset-bottom, 0px); --kw-head:'Cairo','Tajawal',sans-serif; --kw-body:'Tajawal','Segoe UI',sans-serif; }

/* =========================================================== LOGIN — every size: same language as the app's first-run screen =========================================================== */
.login-wrap.pos-landing-shell { background:radial-gradient(120% 80% at 80% 0%, #2B3990 0%, #141A46 45%, #0C0A28 100%) !important; padding:24px 16px calc(24px + var(--kw-safe)); }
.login-wrap .login-logo { height:84px; max-width:200px; margin-bottom:18px; filter:none; }
.login-card { background:#fff !important; color:#151833 !important; border-radius:20px; padding:26px 22px 22px; max-width:400px; box-shadow:0 14px 40px rgba(0,0,0,.35); }
.login-card .kw-login-mark { display:flex; justify-content:center; margin:-4px 0 12px; }
.login-card .kw-login-mark img { width:72px; height:72px; object-fit:contain; border-radius:18px; }
.login-card .kw-login-mark .kw-k { width:72px; height:72px; border-radius:20px; display:flex; align-items:center; justify-content:center; font:900 40px/1 var(--kw-head); color:#fff; background:linear-gradient(135deg,#2B3990,#1B2160); box-shadow:0 10px 24px rgba(27,33,96,.35); }
.login-card .mark { font-family:var(--kw-head); font-size:24px; letter-spacing:0; color:#151833 !important; line-height:1.25; }
.login-card .sub { font-size:13px; letter-spacing:0; color:#5D6485 !important; margin:2px 0 18px; font-weight:700; }
.login-card .lic-login-trial { margin:-10px 0 14px; }
.login-card label { font-size:14px; font-weight:700; color:#151833 !important; margin-bottom:6px; }
.login-card input { min-height:52px; font-size:17px; border:1.5px solid #CBD0E2 !important; border-radius:14px; padding:0 14px; background:#FAFBFE !important; color:#151833 !important; box-sizing:border-box; }
.login-card input:focus { border-color:#1B2160 !important; box-shadow:0 0 0 3px rgba(79,179,232,.25); outline:none; }
.login-card button.btn:not(.login-alt), .login-card #login-submit, .login-card #su-submit, .login-card #cp-submit { min-height:52px; border-radius:14px; font-size:17px; font-weight:800; background:linear-gradient(135deg,#2B3990,#1B2160) !important; color:#fff !important; box-shadow:0 8px 20px rgba(27,33,96,.3); border:0; }
.login-card .login-error { border-radius:12px; }
.login-card .login-links { display:flex; flex-direction:column; gap:4px; margin-top:12px; }
.login-card .login-links button.btn.login-alt { all:unset; box-sizing:border-box; cursor:pointer; display:flex; align-items:center; justify-content:center; min-height:44px; width:100%; font-family:var(--kw-body); font-size:14px; font-weight:700; border-radius:12px; }
.login-card .login-links #login-go-signup { background:#EEF0F7; color:#1B2160; }
.login-card .login-links #login-go-changepw { color:#1B2160; text-decoration:underline; text-underline-offset:3px; opacity:.85; }
.login-card .login-links #login-go-changepw:focus-visible, .login-card .login-links #login-go-signup:focus-visible { outline:2px solid #34ABE2; outline-offset:2px; }
.login-card .login-links [hidden] { display:none !important; }
.login-card #login-back, .login-card #login-owner-req { background:#EEF0F7 !important; color:#1B2160 !important; box-shadow:none; }
html.kawn-app .login-card .kawn-app-settings { color:#5D6485 !important; }

/* =========================================================== MOBILE SHELL =========================================================== */
html.kawn-mobile { -webkit-tap-highlight-color:transparent; }
html.kawn-mobile body { font-family:var(--kw-body); }
html.kawn-mobile h1, html.kawn-mobile h2, html.kawn-mobile h3, html.kawn-mobile .page-title, html.kawn-mobile .card .v, html.kawn-mobile .ow-big, html.kawn-mobile .ow-mid, html.kawn-mobile .pos-grand-bar,
html.kawn-mobile .pos-total-line span:last-child, html.kawn-mobile .pos-product-price, html.kawn-mobile .pos-cart-row .tot, html.kawn-mobile .pos-cart-row .price { font-family:var(--kw-head); font-variant-numeric:tabular-nums; }
html.kawn-mobile td, html.kawn-mobile .ow-tx .am, html.kawn-mobile .ow-stat, html.kawn-mobile .card .v, html.kawn-mobile .kw-cart-m, html.kawn-mobile .kw-badge { font-variant-numeric:tabular-nums; }
html.kawn-mobile .panel, html.kawn-mobile .card, html.kawn-mobile .ow-card, html.kawn-mobile .ow-stat, html.kawn-mobile .me-card, html.kawn-mobile .notif-panel { border-radius:var(--kw-r); }
html.kawn-mobile button.btn, html.kawn-mobile select, html.kawn-mobile input:not([type=checkbox]):not([type=radio]) { border-radius:var(--kw-rc); }
html.kawn-mobile body.m-nav-open .sidebar { box-shadow:-8px 0 30px rgba(0,0,0,.45); }
html.kawn-mobile body:not(.m-nav-open) .sidebar { box-shadow:none !important; }

/* ---------- top bar: ☰ · title + one context line · (licence line) · bell ---------- */
html.kawn-mobile .m-topbar { display:flex; padding:4px 8px 4px 10px; gap:6px; min-height:56px; background:#0B0E2A; box-shadow:0 1px 0 var(--kw-line); }
html.kawn-mobile .m-topbar .m-menu-btn { min-width:44px; min-height:44px; display:flex; align-items:center; justify-content:center; padding:0; font-size:22px; border-radius:12px; background:transparent; }
html.kawn-mobile .m-topbar .kw-tw { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; justify-content:center; gap:1px; }
html.kawn-mobile .m-topbar .m-title { flex:none; font-family:var(--kw-head); font-size:15px; line-height:1.3; }
html.kawn-mobile .m-topbar .kw-ctx { all:unset; box-sizing:border-box; cursor:pointer; display:flex; align-items:center; gap:5px; min-height:44px; margin:-12px 0 -12px; max-width:100%; color:var(--kw-dim); font-size:11.5px; line-height:1.3; }
html.kawn-mobile .m-topbar .kw-ctx:disabled { cursor:default; }
html.kawn-mobile .m-topbar .kw-ctx .kw-ctx-t { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html.kawn-mobile .m-topbar .kw-ctx .kw-ctx-ar { color:var(--kw-accent); font-size:12px; flex:none; }
html.kawn-mobile .m-topbar .kw-ctx:focus-visible { outline:2px solid var(--kw-accent); outline-offset:2px; border-radius:6px; }
html.kawn-mobile .m-topbar .m-bell { min-width:44px; min-height:44px; display:flex; align-items:center; justify-content:center; padding:0; }
html.kawn-mobile .m-topbar .m-bell b { top:4px; left:4px; min-width:17px; height:17px; font-size:11px; font-family:var(--kw-head); }
html.kawn-mobile .m-topbar .lic-line { display:inline-flex; flex:none; max-width:34vw; min-height:32px; align-items:center; }
/* the old dashboard / POS header block (user — activity — branch — safe) moved into the context line + sheet */
html.kawn-mobile .fb-line { display:none !important; }
html.kawn-mobile .pos-shell { padding-top:10px; }
html.kawn-mobile .dash-shell { padding-top:4px; }

/* ---------- bottom sheet: activity / branch / safe ---------- */
.kw-sheet-back { position:fixed; inset:0; z-index:400; background:rgba(5,6,20,.55); display:flex; align-items:flex-end; justify-content:center; }
.kw-sheet { width:100%; max-width:560px; background:var(--kw-panel); color:var(--kw-ink); border-radius:20px 20px 0 0; padding:8px 16px calc(16px + var(--kw-safe)); box-shadow:0 -10px 40px rgba(0,0,0,.45); max-height:85vh; overflow:auto; }
.kw-grip { width:40px; height:4px; border-radius:2px; background:var(--kw-line); margin:4px auto 10px; display:block; }
.kw-sheet-h h4 { margin:0 0 8px; font-family:var(--kw-head); font-size:16px; }
.kw-row { display:flex; flex-direction:column; gap:5px; padding:8px 0; border-bottom:1px solid var(--kw-line); }
.kw-row:last-child { border-bottom:0; }
.kw-row label { font-size:12px; color:var(--kw-dim); }
.kw-row select { min-height:48px; width:100%; background:var(--kw-panel2); color:var(--kw-ink); border:1px solid var(--kw-line); border-radius:var(--kw-rc); padding:0 12px; font:700 15px var(--kw-body); }
.kw-row .kw-static { min-height:48px; display:flex; align-items:center; padding:0 12px; background:rgba(52,171,226,.12); border-radius:var(--kw-rc); font-weight:700; font-size:15px; }
.kw-sheet-done { all:unset; box-sizing:border-box; cursor:pointer; display:flex; align-items:center; justify-content:center; width:100%; min-height:50px; margin-top:12px; border-radius:var(--kw-rc); background:var(--kw-accent); color:#06213a; font:800 16px var(--kw-body); }
.kw-sheet-done:focus-visible { outline:2px solid #fff; outline-offset:2px; }

/* ---------- bottom tab bar ---------- */
#kw-tabs { position:fixed; left:0; right:0; bottom:0; z-index:280; display:flex; align-items:stretch; height:calc(var(--kw-tabs) + var(--kw-safe)); padding:0 2px var(--kw-safe); background:#0B0E2A; border-top:1px solid var(--kw-line); box-shadow:0 -6px 20px rgba(0,0,0,.35); }
.kw-tab { all:unset; box-sizing:border-box; cursor:pointer; flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-height:var(--kw-tabs); color:var(--kw-dim); position:relative; -webkit-user-select:none; user-select:none; }
.kw-tab svg { width:23px; height:23px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.kw-tab .kw-tab-l { font:700 11px/1 var(--kw-body); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.kw-tab.active { color:var(--kw-accent); }
.kw-tab.active::before { content:""; position:absolute; top:0; left:50%; width:28px; height:3px; border-radius:0 0 3px 3px; background:var(--kw-accent); transform:translateX(-50%); }
.kw-tab:focus-visible { outline:2px solid var(--kw-accent); outline-offset:-3px; border-radius:10px; }
.kw-tab .kw-badge { position:absolute; top:5px; left:calc(50% + 6px); min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:var(--kw-bad); color:#fff; font:800 10.5px/17px var(--kw-head); text-align:center; }
body.kw-has-tabs #app > main { padding-bottom:calc(var(--kw-tabs) + 24px + var(--kw-safe)) !important; }
body.kw-has-tabs #app > main.main-fullscreen { padding-bottom:calc(var(--kw-tabs) + 8px + var(--kw-safe)) !important; }
body.kw-has-tabs .pos-mbar { bottom:calc(var(--kw-tabs) + 10px + var(--kw-safe)); }
body.kw-has-tabs .notif-panel { max-height:calc(100vh - 64px - var(--kw-tabs) - var(--kw-safe)); }
@media print { #kw-tabs, .kw-sheet-back, #kw-cart-back { display:none !important; } }

/* ---------- side menu (drawer): search · favourites · groups · footer (user / logout / password) ---------- */
html.kawn-mobile .sidebar { padding:14px 14px calc(14px + var(--kw-safe)); }
html.kawn-mobile .sidebar-inner-rtl { display:flex; flex-direction:column; min-height:100%; }
html.kawn-mobile .sidebar .brand { order:1; padding-bottom:6px; margin-top:-4px; }
html.kawn-mobile .sidebar .brand .notif-wide-btn, html.kawn-mobile .sidebar .brand > div:last-child { display:none !important; }
html.kawn-mobile .sidebar .brand .sub { display:none; }
html.kawn-mobile .sidebar .kw-side-scope { display:none !important; }
html.kawn-mobile .sidebar .nav-find { order:2; }
html.kawn-mobile .sidebar nav { order:3; }
html.kawn-mobile .sidebar .kw-side-user { order:9; margin:auto 0 0; padding:12px 6px 0; border-bottom:0; border-top:1px solid rgba(239,226,204,.12); }
html.kawn-mobile .sidebar .kw-side-user > label, html.kawn-mobile .sidebar .kw-side-user > .locked-field { display:none !important; }
html.kawn-mobile .sidebar .kw-side-foot { font-size:13px; font-weight:700; color:var(--sidebar-ink,#FDF8F2); margin-bottom:8px; }
html.kawn-mobile .sidebar #logout-btn, html.kawn-mobile .sidebar #change-pw-btn { min-height:44px; font-size:12.5px !important; border-radius:var(--kw-rc); }
html.kawn-mobile .sidebar #nav-q { min-height:46px; font-size:15px; border-radius:var(--kw-rc); }
html.kawn-mobile .sidebar .nav-group > .group-btn, html.kawn-mobile .sidebar .nav-sub button, html.kawn-mobile .sidebar .nav-subsub button { min-height:46px; font-size:14px; }

/* ---------- notifications: grouped, each group → the screen that fixes it ---------- */
html.kawn-mobile .notif-panel { position:fixed; top:60px; left:8px; right:8px; width:auto; z-index:310; overflow:hidden; display:flex; flex-direction:column; }
html.kawn-mobile .notif-panel .notif-panel-body { overflow:auto; -webkit-overflow-scrolling:touch; }
html.kawn-mobile .notif-panel .notif-panel-close { min-width:44px; min-height:44px; }
.kw-nhead { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:8px 14px; font-size:12.5px; color:var(--ink-soft,#9aa); border-bottom:1px solid var(--line,#2C3160); }
.kw-nread { all:unset; cursor:pointer; min-height:44px; padding:0 10px; border-radius:999px; font-size:12.5px; font-weight:700; color:var(--kw-accent); }
.kw-nempty { padding:28px 16px; text-align:center; color:var(--ink-soft,#9aa); font-size:14px; }
.notif-item.kw-ng { display:block; padding:0; }
.notif-item.kw-ng.read { opacity:.62; }
.kw-ng-h { all:unset; box-sizing:border-box; cursor:pointer; display:flex; align-items:center; gap:10px; width:100%; min-height:52px; padding:8px 14px; font-size:14px; line-height:1.45; text-align:start; }
.kw-ng-dot { flex:none; width:8px; height:8px; border-radius:50%; background:var(--kw-warn); }
.kw-ng.read .kw-ng-dot { background:var(--kw-line); }
.kw-ng-t { flex:1; min-width:0; }
.kw-ng-t b { color:var(--kw-accent); font-family:var(--kw-head); }
.kw-ng-ar { color:var(--ink-soft,#9aa); font-size:12px; transition:transform .15s; }
.kw-ng-h[aria-expanded="true"] .kw-ng-ar { transform:rotate(180deg); }
.kw-ng-l { list-style:none; margin:0; padding:0 46px 8px 14px; font-size:13px; color:var(--ink-soft,#bbb); }
.kw-ng-l li { padding:5px 0; border-top:1px dashed var(--line,#2C3160); }
.kw-ng-l li.read { opacity:.6; }
.kw-ng-go { all:unset; box-sizing:border-box; cursor:pointer; display:flex; align-items:center; justify-content:center; min-height:44px; margin:0 14px 10px 46px; padding:0 14px; border-radius:999px; background:rgba(52,171,226,.14); color:var(--kw-accent); font-size:13.5px; font-weight:800; }
.kw-ng-go:focus-visible, .kw-ng-h:focus-visible, .kw-nread:focus-visible { outline:2px solid var(--kw-accent); outline-offset:-2px; }

/* ---------- home (owner): today's sales first · cash + net profit · «محتاج منك» · quick actions · the rest · licence boxes last ---------- */
html.kawn-mobile .ow-wrap { display:flex; flex-direction:column; gap:12px; padding:8px 0 16px; }
html.kawn-mobile .ow-grid { display:contents; }
html.kawn-mobile .ow-head { order:0; margin:0; }
html.kawn-mobile .ow-hero { order:1; gap:10px; }
html.kawn-mobile .ow-card.ow-attn { order:2; }
html.kawn-mobile .ow-quick { order:3; margin:0; gap:8px; }
html.kawn-mobile .ow-card.ow-brands { order:4; }
html.kawn-mobile .ow-card { order:5; margin:0; }
html.kawn-mobile .kw-fold { order:6; }
html.kawn-mobile .ow-card.ow-wide, html.kawn-mobile .ow-grid > .ow-wide, html.kawn-mobile #kpi-card { order:7; }
html.kawn-mobile .lic-mcards { order:8; }
html.kawn-mobile .ow-wrap > .lic-strip.kw-lic-last { order:9; position:static; margin:4px 0 0; padding:0; background:transparent; box-shadow:none; display:flex; flex-wrap:wrap; gap:6px; overflow:visible; }
html.kawn-mobile .ow-wrap > .lic-strip.kw-lic-last .lic-boxes { display:flex; flex-wrap:wrap; gap:6px; flex:1 1 auto; }
html.kawn-mobile .ow-wrap > .lic-strip.kw-lic-last .lic-box { flex:1 1 140px; width:auto; min-height:40px; height:auto; padding:6px 8px; border-radius:var(--kw-rc); }
html.kawn-mobile .ow-wrap > .lic-strip.kw-lic-last .lic-act { min-height:40px; height:auto; }
html.kawn-mobile .ow-hero-main { background:var(--kw-panel); border:1px solid var(--kw-line); border-radius:var(--kw-r); padding:16px 16px 0; }
html.kawn-mobile .ow-hero-main .ow-big { font-size:36px; letter-spacing:-.5px; line-height:1.1; }
html.kawn-mobile .ow-stat { border-radius:var(--kw-r); }
html.kawn-mobile .ow-stat .ow-mid { font-size:21px; }
html.kawn-mobile .ow-quick button { min-height:50px; border-radius:var(--kw-rc); font-weight:800; }
html.kawn-mobile .ow-attn li { min-height:52px; }
html.kawn-mobile .ow-head .ow-greet { font-size:21px; font-family:var(--kw-head); }
.kw-fold { padding:0 !important; overflow:hidden; }
.kw-fold > summary { list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; min-height:50px; padding:0 14px; font:800 14.5px var(--kw-head); color:var(--ow-ink,#F3F1EC); }
.kw-fold > summary::-webkit-details-marker { display:none; }
.kw-fold > summary .kw-fold-ar { color:var(--kw-accent); transition:transform .15s; }
.kw-fold[open] > summary .kw-fold-ar { transform:rotate(180deg); }
.kw-fold > summary:focus-visible { outline:2px solid var(--kw-accent); outline-offset:-2px; }
.kw-fold > .ow-wide, .kw-fold > #kpi-card { margin:0 10px 10px !important; }
.kw-fold > #kpi-card { grid-column:auto !important; }
html.kawn-mobile .ow-wrap .lic-mcards { margin:0; }

/* ---------- POS ---------- */
html.kawn-mobile .pos-topbar { gap:8px; margin-bottom:8px; }
html.kawn-mobile .pos-cats-row { margin-bottom:8px; }
html.kawn-mobile .pos-product-card { border-radius:var(--kw-rc); }
html.kawn-mobile .pos-complete-btn { width:100%; min-height:52px; border-radius:var(--kw-rc); font-size:16px; }
html.kawn-mobile .pos-pay-btn { border-radius:var(--kw-rc); }
.kw-seg { display:flex; gap:4px; padding:4px; margin:0 0 10px; border-radius:var(--kw-r); background:var(--kw-panel2); border:1px solid var(--kw-line); }
.kw-seg button { all:unset; box-sizing:border-box; cursor:pointer; flex:1 1 0; min-width:0; min-height:44px; display:flex; align-items:center; justify-content:center; gap:4px; border-radius:10px; padding:2px 4px; font:800 12.5px/1.2 var(--kw-body); color:var(--kw-dim); text-align:center; }
.kw-seg button.on { background:var(--kw-accent); color:#06213a; }
.kw-seg button:focus-visible { outline:2px solid #fff; outline-offset:-2px; }
/* phone: category chips scroll sideways, 3-column grid of ≥ 96px tiles, cart as a bottom sheet */
html.kw-phone .pos-topbar { flex-wrap:wrap; }
html.kw-phone .kw-seg ~ .pos-topbar #pos-back { display:none; }
html.kw-phone .kw-seg ~ .pos-topbar .pos-topbar-channel-col:only-child, html.kw-phone .kw-seg ~ .pos-topbar .pos-topbar-center:empty { display:none; }
html.kw-phone .kw-seg ~ .pos-topbar .pos-ctx-badge:not([id]) { display:none; }
html.kw-phone .pos-cats-row > .pos-cats { display:flex !important; flex-wrap:nowrap !important; overflow-x:auto; gap:6px; padding-bottom:4px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
html.kw-phone .pos-cats-row > .pos-cats::-webkit-scrollbar { display:none; }
html.kw-phone .pos-cats-row > .pos-cats > * { flex:0 0 auto; }
html.kw-phone .pos-cats-row .pos-cat { min-height:40px; white-space:nowrap; }
html.kw-phone .pos-product-grid { grid-template-columns:repeat(3, minmax(0, 1fr)) !important; gap:8px; }
html.kw-phone .pos-product-card { min-height:96px !important; padding:10px 6px 28px; }
html.kw-phone .pos-product-name { font-size:13px; line-height:1.3; }
html.kw-phone .pos-shell { padding-bottom:calc(var(--kw-tabs) + 84px + var(--kw-safe)) !important; }
html.kw-phone .pos-mbar.kw-hide { display:none !important; }
html.kw-phone .pos-main-grid { grid-template-columns:1fr !important; }
html.kw-phone .pos-order-panel { position:fixed; left:0; right:0; bottom:calc(var(--kw-tabs) + var(--kw-safe)); z-index:270; margin:0; max-height:calc(100vh - 110px); border-radius:20px 20px 0 0 !important; border:1px solid var(--kw-line); border-bottom:0; box-shadow:0 -10px 40px rgba(0,0,0,.5) !important;
  padding:0 14px 14px; overflow-y:auto; -webkit-overflow-scrolling:touch; transform:translateY(calc(100% - 66px)); transition:transform .25s ease; display:flex; flex-direction:column; gap:2px; }
html.kw-phone body.kw-cart-open .pos-order-panel { transform:none; }
html.kw-phone .pos-order-panel .kw-cart-h { all:unset; box-sizing:border-box; cursor:pointer; position:sticky; top:0; z-index:2; display:flex; align-items:center; gap:10px; flex-wrap:wrap; min-height:66px; margin:0 -14px 6px; padding:6px 16px 8px; background:var(--pn-panel,var(--kw-panel)); border-bottom:1px solid var(--kw-line); }
html.kw-phone .pos-order-panel .kw-cart-h .kw-grip { flex-basis:100%; margin:0 auto 2px; }
html.kw-phone .pos-order-panel .kw-cart-h .kw-cart-t { flex:1; font:800 15px var(--kw-body); color:var(--kw-accent); }
html.kw-phone .pos-order-panel .kw-cart-h .kw-cart-m { font:800 20px var(--kw-head); color:#fff; }
html.kw-phone .pos-order-panel .kw-cart-h:focus-visible { outline:2px solid var(--kw-accent); outline-offset:-2px; }
html.kw-phone .pos-order-panel .pos-order-head { padding-top:2px; }
#kw-cart-back { display:none; position:fixed; inset:0; z-index:265; background:rgba(5,6,20,.5); }
html.kw-phone body.kw-cart-open #kw-cart-back { display:block; }
html.kw-phone body.kw-cart-open { overflow:hidden; }
html.kw-phone .pos-bottombar button { min-height:44px; border-radius:var(--kw-rc); }
/* tablet (800–1024): two panes — products 60% / cart 40% always visible, numeric keypad for cash */
html.kw-tablet .pos-main-grid { grid-template-columns:minmax(0,3fr) minmax(300px,2fr) !important; gap:12px; align-items:start; }
html.kw-tablet .pos-order-panel { position:sticky; top:64px; max-height:calc(100vh - 64px - var(--kw-tabs) - 14px - var(--kw-safe)); overflow-y:auto; -webkit-overflow-scrolling:touch; }
html.kw-tablet .pos-product-grid { grid-template-columns:repeat(auto-fill, minmax(118px, 1fr)) !important; gap:8px; max-height:none; overflow:visible; }
html.kw-tablet .pos-product-card { min-height:96px; }
html.kw-tablet .pos-mbar { display:none !important; }
.kw-pad { display:grid; grid-template-columns:repeat(3, 1fr); gap:6px; margin:6px 0 10px; flex:1 1 100%; width:100%; }
.kw-pad button { all:unset; box-sizing:border-box; cursor:pointer; min-height:48px; display:flex; align-items:center; justify-content:center; border-radius:10px; background:var(--pn-panel2,var(--kw-panel2)); border:1px solid var(--pn-line,var(--kw-line)); color:#fff; font:800 18px var(--kw-head); }
.kw-pad button.kw-pad-fn { color:var(--kw-warn); font-size:15px; font-family:var(--kw-body); }
.kw-pad button.kw-pad-exact { grid-column:1 / -1; background:rgba(52,171,226,.16); color:var(--kw-accent); font:800 14px var(--kw-body); }
.kw-pad button:active { transform:translateY(1px); }
.kw-pad button:focus-visible { outline:2px solid var(--kw-accent); outline-offset:-2px; }

/* ---------- dialogs / prompts (guests count, confirmations) as a bottom sheet on a phone ---------- */
html.kw-phone .ui-dlg-back { align-items:flex-end; padding:0; }
html.kw-phone .ui-dlg { width:100%; max-width:none; border-radius:20px 20px 0 0; padding:14px 16px calc(16px + var(--kw-safe)); box-shadow:0 -10px 40px rgba(0,0,0,.45); }
html.kw-phone .ui-dlg::before { content:""; display:block; width:40px; height:4px; border-radius:2px; background:var(--line,#2C3160); margin:0 auto 4px; }
html.kw-phone .ui-dlg button, html.kw-phone .ui-dlg input { min-height:48px; font-size:16px; border-radius:var(--kw-rc); }
html.kw-phone .ui-dlg #ui-dlg-input { font-family:var(--kw-head); font-size:22px; text-align:center; }

/* ---------- light pages (HR forms, approvals, settings …): one line of help + «؟» ---------- */
html.kawn-mobile .kw-help { position:relative; display:flex; align-items:flex-start; gap:8px; }
html.kawn-mobile .kw-help:not(.open) { max-height:calc(1.5em + 4px); overflow:hidden; }
html.kawn-mobile .kw-help .kw-help-q { all:unset; box-sizing:border-box; cursor:pointer; flex:none; width:28px; height:28px; margin:-4px 0 0; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:rgba(52,171,226,.16); color:var(--kw-accent); font:800 14px var(--kw-head); }
html.kawn-mobile .kw-help .kw-help-q::after { content:""; position:absolute; inset:-8px; }
html.kawn-mobile .kw-help .kw-help-q:focus-visible { outline:2px solid var(--kw-accent); }
html.kawn-mobile .page-title { font-size:20px; margin-bottom:4px; }
html.kawn-mobile #main-inner button.btn { min-height:46px; border-radius:var(--kw-rc); }
html.kawn-mobile #main-inner .req-card { border-radius:var(--kw-rc); }
html.kawn-mobile .req-approve { max-width:calc(100vw - 48px); }
html.kawn-mobile .req-approve .field { min-width:0 !important; flex:1 1 100%; }
html.kawn-mobile .empty { padding:22px 14px; font-size:14px; }

/* =========================================================== inside the app only (html.kawn-app) =========================================================== */
html.kawn-app { overscroll-behavior-y:none; }
html.kawn-app body { overscroll-behavior-y:none; }
html.kawn-app button, html.kawn-app .btn, html.kawn-app nav, html.kawn-app .sidebar, html.kawn-app .m-topbar, html.kawn-app #kw-tabs,
html.kawn-app [class^="pos-"], html.kawn-app [class*=" pos-"], html.kawn-app .card .k, html.kawn-app label, html.kawn-app img { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
html.kawn-app input, html.kawn-app textarea, html.kawn-app select, html.kawn-app [contenteditable], html.kawn-app table, html.kawn-app .notif-item { -webkit-user-select:text; user-select:text; -webkit-touch-callout:default; }
html.kawn-app button, html.kawn-app .btn, html.kawn-app a { touch-action:manipulation; }
html.kawn-app .kawn-app-settings { color:inherit; }
/* in-app the whole program is one dark/navy theme (html[data-theme=dark] set by kawn-mobile.js) — printing stays white */
@media print {
  :root[data-theme="dark"] { --ink:#151833; --ink-soft:#5D6485; --bg:#fff; --panel:#fff; --line:#D7DBE8; --brass:#1B2160; --brass-deep:#2B3990; --focus:#34ABE2; --sidebar:#fff; --sidebar-ink:#151833; --sidebar-ink-dim:#5D6485; --good:#1F6B45; --bad:#B42318; --line-input:#CBD0E2; }
  :root[data-theme="dark"] body { background:#fff !important; color:#151833 !important; }
  .m-topbar, .kw-ctx, .kw-seg, .kw-pad, .kw-help-q { display:none !important; }
}
/* touch screens (any browser): bigger login fields and licence pill, bell items ≥ 44px */
@media (pointer: coarse) {
  #relogin-user, #relogin-pass { min-height:48px; font-size:16px !important; box-sizing:border-box; }
  .lic-line { min-height:32px; display:inline-flex; align-items:center; }
  .notif-panel-close { min-width:44px; min-height:44px; }
  .notif-item { min-height:44px; }
}