:root{
  --brand:#0F5951;--brand-deep:#0A3B36;--brand-tint:#E6F0EE;--brand-tint2:#D3E4E0;
  --ground:#F4F1EA;--surface:#fff;--ink:#13201E;--muted:#5A6B68;--faint:#849691;
  --line:#E3EBE8;--line2:#CAD8D4;
  --danger:#B0432C;--danger-bg:#FBEEEA;--good:#2E7D5B;--good-bg:#E8F2EC;
  --warn:#B0842B;--warn-bg:#FaF3E4;--info:#2C6E8F;--info-bg:#E7F1F6;--accent:#C0703C;
  --r:16px;--shadow:0 1px 2px rgba(10,40,36,.04),0 6px 24px rgba(10,40,36,.06);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
#messages{scroll-margin-top:76px}
body{margin:0;background:var(--ground);color:var(--ink);font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased;padding-bottom:80px}
a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}
h1{font-size:24px;line-height:1.15;letter-spacing:-.02em;margin:0 0 4px;font-weight:700;text-wrap:balance}
h3{font-size:15px;font-weight:700;letter-spacing:-.01em;margin:0}

/* layout */
.wrap{max-width:440px;margin:52px auto;padding:0 20px}
.wide{max-width:860px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px 22px;box-shadow:var(--shadow)}
.card+.card{margin-top:16px}

/* auth screens */
.mk{width:54px;height:54px;border-radius:14px;background:linear-gradient(145deg,var(--brand),var(--brand-deep));color:#fff;display:grid;place-items:center;font-weight:800;font-size:19px;letter-spacing:-.03em;margin:0 auto;box-shadow:0 6px 16px rgba(15,89,81,.28)}
.wrap>.card>h1{text-align:center;margin-top:16px}
.sub{color:var(--muted);text-align:center;margin:0 0 22px;font-size:14px}

/* top bar */
.topbar{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--line);padding:11px 20px;display:flex;align-items:center;gap:11px}
.topbar .mk{width:32px;height:32px;font-size:13px;border-radius:9px;margin:0;box-shadow:none}
.topbar b{font-size:15px;letter-spacing:-.01em}
.brandlink{display:flex;align-items:center;gap:11px;text-decoration:none;color:inherit}
.brandlink:hover{text-decoration:none;opacity:.85}
.topbar .sp{margin-left:auto;display:flex;gap:14px;align-items:center;font-size:13px}

/* forms */
label{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin:15px 0 6px}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input[type=tel],input[type=search],input:not([type]),select{width:100%;padding:11px 13px;border:1px solid var(--line2);border-radius:10px;font-size:14px;background:var(--surface);font-family:inherit;color:var(--ink);transition:border-color .12s,box-shadow .12s}
input:focus,select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-tint)}
select{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><path d='M2 4l4 4 4-4' fill='none' stroke='%235A6B68' stroke-width='1.5'/></svg>");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:100%;text-align:center;border:1px solid transparent;background:var(--brand);color:#fff;font-size:15px;font-weight:600;padding:12px 16px;border-radius:11px;cursor:pointer;margin-top:20px;font-family:inherit;transition:background .12s,transform .04s,box-shadow .12s;box-shadow:0 1px 2px rgba(10,40,36,.12)}
.btn:hover{background:var(--brand-deep);text-decoration:none}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.5;cursor:default}
.btn.sm{width:auto;padding:8px 14px;font-size:13px;margin:0;border-radius:9px}
.btn.ghost{background:var(--surface);border-color:var(--line2);color:var(--ink);box-shadow:none}
.btn.ghost:hover{background:var(--ground);border-color:var(--brand);color:var(--brand-deep)}

/* alerts */
.err,.ok{padding:11px 14px;border-radius:11px;font-size:13px;margin-bottom:16px;line-height:1.45}
.err{background:var(--danger-bg);border:1px solid #EAC9BF;color:#8F3120}
.ok{background:var(--good-bg);border:1px solid #C3E0CE;color:#1E6444;word-break:break-word}

/* text */
.muted{color:var(--muted)}.small{font-size:13px}.faint{color:var(--faint)}
.lbl{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--faint);font-weight:700}

/* tables */
table{width:100%;border-collapse:collapse;font-size:14px;margin-top:8px}
th{text-align:left;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--faint);padding:9px 8px;border-bottom:1px solid var(--line);font-weight:700}
td{padding:11px 8px;border-bottom:1px solid var(--line)}
tr:last-child td{border-bottom:0}
.r{text-align:right}th.r,td.r{text-align:right;font-variant-numeric:tabular-nums}

/* pills — semantic */
.pill{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;letter-spacing:.02em;padding:3px 9px;border-radius:999px;background:var(--brand-tint);color:var(--brand-deep);white-space:nowrap;text-transform:capitalize}
.pill.info{background:var(--info-bg);color:var(--info)}
.pill.warn{background:var(--warn-bg);color:#8A6512}
.pill.good{background:var(--good-bg);color:#1E6444}
.pill.bad{background:var(--danger-bg);color:#8F3120}
.pill.neutral{background:#EDF1F0;color:var(--muted)}

/* grids */
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.row2{grid-template-columns:1fr}}
/* Ledger ORDERS|PAYMENTS: respond to the CONTAINER's width, not the screen's,
   so it stacks when boxed into the narrow profile column and only splits when there's real room. */
.ledgerwrap{container-type:inline-size}
.ledgercols{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@container (max-width:620px){.ledgercols{grid-template-columns:1fr}}
.stat3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:14px}
@media(max-width:560px){.stat3{grid-template-columns:1fr}}
.stat{background:var(--ground);border:1px solid var(--line);border-radius:12px;padding:13px 15px}
.stat .v{font-size:20px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-top:3px}

/* ledger */
.ledrow{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 4px;border-top:1px solid var(--line);font-size:13px}
.num{font-variant-numeric:tabular-nums;font-weight:600}

/* status timeline */
.timeline{display:flex;gap:0;margin:14px 0 4px;padding:0;list-style:none}
.tl{flex:1;position:relative;text-align:center;font-size:11px;color:var(--faint);font-weight:600}
.tl::before{content:"";position:absolute;top:9px;left:-50%;width:100%;height:2px;background:var(--line2)}
.tl:first-child::before{display:none}
.tl .dot{width:20px;height:20px;border-radius:50%;background:var(--surface);border:2px solid var(--line2);margin:0 auto 6px;position:relative;z-index:1;display:grid;place-items:center;font-size:10px;color:transparent}
.tl.done{color:var(--brand-deep)}
.tl.done::before{background:var(--brand)}
.tl.done .dot{background:var(--brand);border-color:var(--brand);color:#fff}
.tl.now{color:var(--brand-deep)}
.tl.now .dot{border-color:var(--brand);box-shadow:0 0 0 4px var(--brand-tint)}

/* shop */
#shopsearch{width:100%;padding:12px 14px;border:1px solid var(--line2);border-radius:11px;font-size:14px;font-family:inherit;position:sticky;top:56px;z-index:5;background:var(--surface)}
#shopsearch:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-tint)}
.prow{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:14px;padding:11px 10px;border:1px solid transparent;border-bottom:1px solid var(--line);transition:background .1s}
.prow:hover{background:var(--ground)}
.prow.active{background:var(--brand-tint);border-radius:10px;border-color:var(--brand-tint2)}
.pname{font-size:14px;font-weight:500;display:flex;align-items:center;gap:8px}
.favstar{background:none;border:0;cursor:pointer;color:var(--line2);font-size:16px;line-height:1;padding:0;flex:none}
.favstar:hover,.favstar.on{color:var(--accent)}
.pprice{font-variant-numeric:tabular-nums;font-weight:700;min-width:74px;text-align:right;color:var(--brand-deep)}
.poa{font-size:11px;font-weight:600;font-style:italic;color:var(--muted);white-space:nowrap;letter-spacing:.01em}
.wkchart{display:flex;gap:6px;align-items:flex-end;height:190px;overflow-x:auto;padding-top:4px}
.wkbar{flex:1 0 34px;min-width:34px;display:flex;flex-direction:column;align-items:center;height:100%;cursor:default}
.wkval{font-size:10px;font-weight:700;color:var(--muted);height:14px;white-space:nowrap;font-variant-numeric:tabular-nums}
.wkfillwrap{flex:1;width:64%;display:flex;align-items:flex-end}
.wkstack{width:100%;display:flex;flex-direction:column-reverse;border-radius:5px 5px 0 0;overflow:hidden;min-height:2px}
.wkseg{width:100%;min-height:1px}
.wkbar:hover .wkstack{filter:brightness(1.08)}
.wkx{font-size:10px;color:var(--faint);margin-top:5px;white-space:nowrap}
.wklegend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.wklg{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink)}
.wkdot{width:11px;height:11px;border-radius:3px;display:inline-block;flex:0 0 auto}
.wkmpill{display:inline-flex;align-items:center;gap:5px;font-size:10px;background:#EDF1F0;border-radius:999px;padding:2px 8px;margin:2px 4px 0 0;white-space:nowrap}
.wkmpill .wkdot{width:8px;height:8px}
.impbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:center;gap:14px;background:#5C5B98;color:#fff;font-size:13px;font-weight:600;padding:9px 14px}
.impmsg{white-space:nowrap;line-height:1}
.impbar b{font-weight:800}
.btn.xs{margin:0;width:auto;padding:5px 15px;font-size:12px;line-height:1;background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.5)}
.btn.xs:hover{background:rgba(255,255,255,.28)}
.qtybox{display:flex;align-items:center;gap:2px;background:var(--ground);border-radius:10px;padding:3px}
.qtybox button{width:30px;height:30px;border-radius:8px;border:0;background:transparent;font-size:17px;cursor:pointer;line-height:1;color:var(--brand-deep);font-weight:600;transition:background .1s}
.qtybox button:hover{background:var(--surface)}
.qn{min-width:26px;text-align:center;font-variant-numeric:tabular-nums;font-weight:700;font-size:14px}
.pastebox{background:var(--brand-tint);border:1px solid var(--brand-tint2);border-radius:11px;padding:12px 14px;margin-bottom:12px}
.pastebox textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(15,89,81,.12)}
.catpills{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 4px}
.catpill{border:1px solid var(--line2);background:var(--surface);color:var(--muted);font-size:12px;font-weight:600;padding:6px 11px;border-radius:999px;cursor:pointer;font-family:inherit;line-height:1}
.catpill:hover{border-color:var(--brand);color:var(--brand-deep)}
.catpill.on{background:var(--brand);border-color:var(--brand);color:#fff}
.catpill.on .faint{color:rgba(255,255,255,.7)}
.cathdr{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--brand-deep);padding:14px 6px 6px;border-bottom:2px solid var(--brand-tint);margin-bottom:2px}
.catsec:first-child .cathdr{padding-top:4px}

/* cart bar */
#cartbar{position:fixed;left:0;right:0;bottom:0;background:var(--brand-deep);color:#fff;display:none;align-items:center;justify-content:space-between;gap:14px;padding:13px 22px;box-shadow:0 -6px 24px rgba(10,40,36,.22);z-index:50}
#cartbar.show{display:flex}
#cartbar .btn{margin:0;background:var(--accent);border-color:transparent;box-shadow:none}
#cartbar .btn:hover{background:#A85F30}
#cartbar .btn:disabled{opacity:.6}
#cartsummary{font-weight:700;font-variant-numeric:tabular-nums;font-size:15px}
.reviewov{position:fixed;inset:0;background:rgba(10,40,36,.45);display:none;align-items:flex-end;justify-content:center;z-index:60}
.reviewov.show{display:flex}
.reviewbox{background:var(--surface);border-radius:18px 18px 0 0;padding:22px;width:100%;max-width:520px;max-height:86vh;overflow-y:auto;box-shadow:0 -8px 30px rgba(10,40,36,.25)}
@media(min-width:560px){.reviewov{align-items:center;padding:20px}.reviewbox{border-radius:16px}}

/* notifications */
.bell{position:relative;background:none;border:0;cursor:pointer;padding:0;font-size:18px;line-height:1;filter:grayscale(.25);text-decoration:none;color:inherit}
.bell:hover{filter:grayscale(0)}
.bellwrap{position:relative;display:flex}
.notifpanel{position:absolute;top:32px;right:0;width:330px;max-width:88vw;max-height:70vh;overflow-y:auto;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 34px rgba(10,40,36,.2);display:none;z-index:70}
.notifpanel.show{display:block}
.notifhdr{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);padding:12px 14px 4px}
.notiflist{padding:0 6px 6px}
.nti{display:block;padding:10px;border-radius:9px;text-decoration:none;color:var(--ink)}
a.nti:hover{background:var(--ground)}
.nti+.nti{border-top:1px solid var(--line)}
.nti-t{font-weight:700;font-size:13px}
.nti-b{font-size:13px;color:var(--muted);margin-top:2px;line-height:1.4}
.nti-w{font-size:11px;color:var(--faint);margin-top:3px}
.badge{position:absolute;top:-7px;right:-9px;background:var(--accent);color:#fff;font-size:10px;font-weight:700;min-width:16px;height:16px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;padding:0 4px}
.noti{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:13px 6px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.noti:last-child{border-bottom:0}
a.noti:hover{background:var(--ground);border-radius:9px}

/* invoice */
.invwrap{max-width:720px;margin:30px auto;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:36px 40px;box-shadow:var(--shadow)}
.invhead{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:2px solid var(--brand);padding-bottom:16px;margin-bottom:20px}
.invpayee{font-size:20px;font-weight:800;letter-spacing:-.02em;color:var(--brand-deep)}
.invword{font-size:12px;letter-spacing:.24em;color:var(--faint);font-weight:700}
.invbill{margin-bottom:18px;font-size:14px}
.invtable{width:100%;border-collapse:collapse;font-size:14px}
.invtable th{border-bottom:1px solid var(--line);color:var(--faint);text-transform:uppercase;font-size:11px;padding:8px 6px;text-align:left}
.invtable td{padding:9px 6px;border-bottom:1px solid var(--line)}
.invtotal{display:flex;justify-content:space-between;font-weight:800;font-size:18px;padding:14px 6px;border-bottom:2px solid var(--brand);font-variant-numeric:tabular-nums}
.invpay{margin-top:20px;background:var(--ground);border-radius:12px;padding:16px}
.invbank{font-size:13px;border-collapse:collapse}
.invbank td{padding:3px 0}.invbank td.bl{color:var(--faint);width:140px}
.actpanel{margin-top:16px}

/* dashboard hero */
.hero{background:linear-gradient(100deg,#08332C 0%,#0F5951 52%,#1A8476 100%);color:#fff;border-radius:16px;padding:24px 26px;box-shadow:var(--shadow)}
.heroeye{font-size:11px;letter-spacing:.18em;color:rgba(255,255,255,.6);font-weight:700;text-transform:uppercase}
.herorow{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-top:8px}
.heroh{color:#fff;font-size:26px;margin:0;letter-spacing:-.02em}
.herosub{color:rgba(255,255,255,.78);margin:6px 0 0;font-size:14px;max-width:48ch}
.hbal{text-align:right;white-space:nowrap;background:linear-gradient(135deg,#F4CB6B 0%,#E29A43 100%);border:1px solid rgba(255,255,255,.35);border-radius:14px;padding:12px 20px;box-shadow:0 8px 22px rgba(0,0,0,.2)}
.hbal .lbl{color:#7A531D}
.hbalv{font-size:30px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-top:3px;color:#3D2A0E;text-shadow:0 1px 0 rgba(255,255,255,.25)}
.stat.balowed{background:linear-gradient(135deg,#F4CB6B 0%,#E29A43 100%);border:1px solid rgba(180,120,40,.35)}
.stat.balowed .lbl{color:#7A531D}
.stat.balowed .v{color:#3D2A0E}
.clhead{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.clhead-id{display:flex;align-items:center;gap:14px;flex:1 1 220px;min-width:0}
.clhead-id h1{font-size:23px;line-height:1.15}
.clhead-act{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
@media(max-width:600px){.clhead-act{width:100%;margin-top:2px}.clhead-act form{flex:1 1 45%;margin:0;display:flex}.clhead-act>a,.clhead-act>span{flex:1 1 45%;text-align:center}.clhead-act .btn{width:100%;margin-top:0}}
.ledbox-ord,.stat.stat-ord{background:#E4ECF7;border:1px solid #C8D7EC}
.ledbox-pay,.stat.stat-pay{background:var(--brand-tint);border:1px solid var(--brand-tint2)}
.btn.plum{background:#8E7FC7;box-shadow:0 1px 2px rgba(142,127,199,.3)}
.btn.plum:hover{background:#7A6BB5}
.bigbtn{display:block;text-align:center;background:var(--accent);color:#fff;font-weight:700;font-size:16px;padding:15px;border-radius:14px;margin-top:14px;box-shadow:0 2px 10px rgba(192,112,60,.28)}
.bigbtn:hover{background:#A85F30;text-decoration:none}
.pendban{background:var(--warn-bg);border:1px solid #EAD9AE;color:#8A6512;border-radius:12px;padding:12px 15px;margin-top:12px;font-size:14px}
.rejban{background:var(--danger-bg);border:1px solid #EAC9BF;color:#8F3120;border-radius:12px;padding:12px 15px;margin-top:12px;font-size:14px}
.rejban a{color:#8F3120;font-weight:700;white-space:nowrap}
.btn.danger{background:var(--danger-bg);color:#8F3120;border:1px solid #EAC9BF}
.btn.danger:hover{background:#F4DDD5}
.seclbl{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:700;margin:22px 4px 8px}
.todaycard{background:var(--warn-bg);border:1px solid #EAD9AE;border-radius:14px;padding:18px 20px;display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.todaystat{color:var(--warn);font-weight:700;font-size:13px}
.todayh{font-weight:700;font-size:16px;margin-top:4px}
.todaylines{color:var(--muted);font-size:13px;margin-top:4px}

/* rich order rows */
.orow{display:grid;grid-template-columns:118px 1fr auto auto 18px;align-items:center;gap:14px;padding:14px 18px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.orow:last-child{border-bottom:0}.orow:hover{background:var(--ground)}
.odate{font-weight:700;font-size:14px}
.oref{font-size:12px;color:var(--faint)}
.ochev{color:var(--faint);font-size:20px;text-align:center}
.mtl{display:flex;align-items:flex-start;max-width:330px}
.ms{flex:1;text-align:center;font-size:10px;color:var(--faint);position:relative;font-weight:600}
.ms .msd{display:block;width:14px;height:14px;border-radius:50%;background:var(--surface);border:2px solid var(--line2);margin:0 auto 4px;position:relative;z-index:1}
.ms::before{content:"";position:absolute;top:6px;left:-50%;width:100%;height:2px;background:var(--line2)}
.ms:first-child::before{display:none}
.ms.done{color:var(--brand-deep)}.ms.done .msd{background:var(--accent);border-color:var(--accent)}.ms.done::before{background:var(--accent)}
.ms.now{color:var(--brand-deep)}.ms.now .msd{border-color:var(--accent);box-shadow:0 0 0 3px rgba(192,112,60,.18)}
@media(max-width:640px){.orow{grid-template-columns:1fr auto auto}.mtlcol{display:none}}

/* admin dashboard + profile */
.av{width:38px;height:38px;border-radius:10px;background:var(--brand-tint);color:var(--brand-deep);display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;flex:none}
.av.lg{width:56px;height:56px;border-radius:14px;font-size:19px}
.stat4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:14px}
@media(max-width:720px){.stat4{grid-template-columns:1fr 1fr}}
.herostats{display:flex;gap:24px;text-align:center;flex:none}
.herostats .hn{font-size:26px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.herostats .hl{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-top:5px}
.appcard{display:flex;align-items:center;gap:14px;padding:15px 18px;border-bottom:1px solid var(--line)}
.appcard:last-child{border-bottom:0}
.appcard .g{flex:1;min-width:0}
.appcard .nm{font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.appcard .mt{color:var(--muted);font-size:13px;margin-top:3px;font-variant-numeric:tabular-nums}
.appcard .ac{display:flex;gap:8px;flex:none;align-items:center}
.pill.newpill{background:var(--good);color:#fff}
.pbar{height:12px;border-radius:999px;background:var(--danger);overflow:hidden;margin-top:8px}
.pbar>span{display:block;height:100%;background:var(--good)}
.profcols{display:grid;grid-template-columns:1.35fr 1fr;gap:16px;margin-top:16px;align-items:start}
@media(max-width:720px){.profcols{grid-template-columns:1fr}}
.fact{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:11px 0;border-top:1px solid var(--line);font-size:14px}
.fact:first-of-type{border-top:0}
.fact .fl{color:var(--muted)}
.subnav{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:16px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:5px}
.subnav a{font-size:13px;padding:6px 12px;border-radius:9px;color:var(--muted);font-weight:600}
.subnav a:hover{background:var(--ground);text-decoration:none;color:var(--ink)}
.subnav a.on{background:var(--brand-tint);color:var(--brand-deep)}

@media print{body{background:#fff;padding:0}.noprint{display:none!important}.invwrap{border:0;margin:0;max-width:100%;box-shadow:none}}
/* editable line price (admin edit-order) */
.pprice{white-space:nowrap}
.pprice .curpre{color:var(--muted);font-size:13px;margin-right:1px}
.pprice .priceinput{width:66px;padding:4px 6px;border:1px solid var(--line2);border-radius:7px;font-size:13px;text-align:right;font-family:inherit}
.pprice .priceinput:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(15,89,81,.12)}
/* "Saved" toast */
.savedflash{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:80;background:var(--good);color:#fff;padding:10px 20px;border-radius:999px;font-size:14px;font-weight:600;letter-spacing:-.01em;box-shadow:0 6px 22px rgba(10,40,36,.20);opacity:1;transition:opacity .4s ease,transform .4s ease}
.savedflash.hide{opacity:0;transform:translateX(-50%) translateY(-10px)}
@media(prefers-reduced-motion:reduce){.savedflash{transition:opacity .2s}}
/* row delete button (stock / payments log) */
.xbtn{background:none;border:0;color:var(--faint);font-size:18px;line-height:1;cursor:pointer;padding:2px 6px;border-radius:6px}
.xbtn:hover{color:var(--danger);background:var(--danger-bg)}
/* stock count sheet */
.stocktbl{font-variant-numeric:tabular-nums}
.stocktbl td,.stocktbl th{padding:7px 10px}
.stocktbl tbody tr:hover{background:var(--ground)}
tr.stkcat td{background:var(--brand-tint);color:var(--brand-deep);font-size:11px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;padding:6px 10px}
tr.stkcat:hover td{background:var(--brand-tint)}
.countrow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 2px;border-bottom:1px solid var(--line)}
.countrow:last-child{border-bottom:0}
.countrow span{font-size:14px}
.countrow input{width:96px;text-align:right;padding:8px 10px}
/* account switcher (multi-business logins) */
.acctswitch{appearance:none;-webkit-appearance:none;background:var(--brand-tint);border:1px solid var(--brand-soft);color:var(--brand-deep);font-size:13px;font-weight:600;padding:5px 26px 5px 10px;border-radius:8px;cursor:pointer;font-family:inherit;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><path d='M2 4l4 4 4-4' fill='none' stroke='%230F5951' stroke-width='1.5'/></svg>");background-repeat:no-repeat;background-position:right 9px center;max-width:200px}
.acctswitch:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-tint)}

/* stock count — inline live-edit cell */
.stkcell{width:66px;text-align:right;padding:5px 8px;border:1px solid var(--line2);border-radius:7px;font-size:14px;font-family:inherit;font-variant-numeric:tabular-nums;background:var(--surface);transition:border-color .12s,background .3s}
.stkcell:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-tint)}
.stkcell.cellok{border-color:var(--good);background:var(--good-bg)}
.stkcell.cellerr{border-color:var(--danger);background:var(--danger-bg)}
/* stock in/out board */
.stkctrl{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.stkqty{width:60px;text-align:right;padding:5px 7px;border:1px solid var(--line2);border-radius:7px;font-size:14px;font-family:inherit;font-variant-numeric:tabular-nums}
.stkqty:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-tint)}
.stkmove{border:1px solid var(--line2);background:var(--surface);color:var(--ink);font-size:12px;font-weight:700;padding:5px 9px;border-radius:7px;cursor:pointer;font-family:inherit}
.stkmove[data-kind=in]{color:var(--good);border-color:#C3E0CE}
.stkmove[data-kind=in]:hover{background:var(--good-bg)}
.stkmove[data-kind=out]{color:var(--danger);border-color:#EAC9BF}
.stkmove[data-kind=out]:hover{background:var(--danger-bg)}
.stkmove.setbtn:hover{background:var(--ground)}
.stkmove:disabled{opacity:.5;cursor:default}
.stkhist{color:var(--faint);text-decoration:none;font-size:17px;padding:0 6px}
.stkhist:hover{color:var(--brand)}
.stocktbl tr.moved{background:var(--good-bg)!important}
.stocktbl .stklevel{font-size:16px;font-weight:800}
/* typable qty box + review line-remove */
.qtybox .qn{width:40px;text-align:center;border:0;background:transparent;font-size:15px;font-weight:700;font-family:inherit;font-variant-numeric:tabular-nums;color:var(--ink);padding:2px 0;-moz-appearance:textfield}
.qtybox .qn::-webkit-outer-spin-button,.qtybox .qn::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.qtybox .qn:focus{outline:none;background:var(--surface);border-radius:6px;box-shadow:0 0 0 2px var(--brand-tint)}
.revrm{background:none;border:0;color:var(--faint);font-size:18px;line-height:1;cursor:pointer;padding:0 5px;border-radius:6px}
.revrm:hover{color:var(--danger);background:var(--danger-bg)}

/* order timeline timestamps + owner order log */
.tltime{font-size:10px;color:var(--faint);margin-top:3px;text-align:center;white-space:nowrap;font-weight:500}
.mstime{display:block;font-size:9px;color:var(--faint);margin-top:1px;white-space:nowrap}
.oplaced{font-size:11px;color:var(--faint);margin-top:2px}
.olog{display:flex;flex-direction:column}
.ologrow{display:flex;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.ologrow:last-child{border-bottom:0}
.ologtime{flex:0 0 112px;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.ologbody{flex:1;font-size:13px}
.ologact{font-weight:600}
.ologwho{font-size:11px;color:var(--muted);margin-top:2px}

/* nav bubble for pending staff-logged payments */
.subnav .navbadge{display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:17px;padding:0 5px;border-radius:9px;background:var(--danger,#c0392b);color:#fff;font-size:10px;font-weight:700;line-height:1;margin-left:4px;vertical-align:middle}

/* systematic order action panel */
.actpanel .actstatus{display:flex;gap:11px;align-items:flex-start;padding:12px 14px;border-radius:10px;background:var(--good-bg)}
.actpanel .actstatus.warn{background:var(--warn-bg)}
.actpanel .actstatus.info{background:#eaf1fb}
.actpanel .actstatus.neutral{background:#eef1f0}
.actpanel .actstatus.bad{background:var(--danger-bg)}
.actpanel .actdot{width:10px;height:10px;border-radius:50%;background:var(--good);margin-top:5px;flex:0 0 auto}
.actpanel .actstatus.warn .actdot{background:var(--warn)}
.actpanel .actstatus.info .actdot{background:#3b6fd4}
.actpanel .actstatus.neutral .actdot{background:var(--faint)}
.actpanel .actstatus.bad .actdot{background:var(--danger)}
.actstatustxt b{font-size:15px}
.actstatustxt .actexplain{font-size:13px;color:var(--muted);margin-top:3px;line-height:1.45}
.actnext{margin-top:14px}
.actsec{margin-top:14px;border-top:1px solid var(--line);padding-top:13px}
.actfooter{border-top:1px solid var(--line);margin-top:14px;padding-top:13px}
.actbody{margin-top:13px}
.actlbl{display:block;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);font-weight:800;margin-bottom:8px}
.actbtns{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.actnext .btn{font-size:15px}

/* primary forward CTA (release / confirm / approve) — orange so it stands out from ghost + brand buttons */
.btn.cta{background:var(--accent);box-shadow:0 1px 2px rgba(192,112,60,.28)}
.btn.cta:hover{background:#A85E30}
.actnote{flex-basis:100%;font-size:12.5px;color:var(--muted);line-height:1.5;margin:9px 0 0;max-width:620px}

/* owings / to-follow (out of stock) highlighting */
.owedrow{background:#FBEBEB}
.owedrow td{border-bottom-color:#F1CFCB}
.owflag{display:inline-block;font-size:10px;font-weight:700;color:#9A3B2A;background:#F6D9D4;border-radius:6px;padding:1px 6px;margin-left:6px;vertical-align:middle;text-transform:uppercase;letter-spacing:.03em}
.owings{margin-top:12px;background:#FBEBEB;border:1px solid #F1CFCB;border-radius:10px;padding:11px 13px}
.owings .owhdr{font-size:12px;font-weight:800;letter-spacing:.02em;color:#9A3B2A;margin-bottom:5px}
.owings ul{margin:0;padding-left:18px;font-size:13px;color:#7E3324}
.owings li{margin:2px 0}

/* owings nav badge (amber) */
.subnav .navbadge.owb{background:var(--warn)}

/* blue button variant (e.g. Log a payment) */
.btn.blue{background:#2F6DB4;box-shadow:0 1px 2px rgba(47,109,180,.28)}
.btn.blue:hover{background:#275C99}

/* order-builder steps */
.stepeyebrow{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--brand-deep);margin:16px 0 8px}
.stepnum{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--brand);color:#fff;font-size:11px;font-weight:800;flex:0 0 auto}
/* collapsible paste box (customers) */
details.pastebox summary.pastesummary{cursor:pointer;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);list-style:none;display:flex;align-items:center;gap:6px}
details.pastebox summary.pastesummary::-webkit-details-marker{display:none}
details.pastebox summary.pastesummary::after{content:"▸";margin-left:auto;font-size:10px}
details.pastebox[open] summary.pastesummary::after{content:"▾"}

/* searchable recipient picker */
.recippick{position:relative}
.reciplist{display:none;position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:30;background:var(--surface);border:1px solid var(--line2);border-radius:10px;box-shadow:var(--shadow);max-height:300px;overflow-y:auto}
.recipitem{padding:9px 12px;font-size:14px;cursor:pointer;border-bottom:1px solid var(--line)}
.recipitem:last-child{border-bottom:0}
.recipitem:hover{background:var(--ground)}
.recipitem.recipnew{color:var(--brand);font-weight:600}

/* recipient search box — make it obviously searchable (magnifier + chevron) */
.recipsearch{cursor:pointer;padding-left:38px !important;padding-right:32px !important;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235A6B68' stroke-width='2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='M20 20l-3.8-3.8'/></svg>"),url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><path d='M2 4l4 4 4-4' fill='none' stroke='%235A6B68' stroke-width='1.5'/></svg>");
  background-repeat:no-repeat,no-repeat;background-position:left 12px center,right 12px center}
/* Stock sheet */
.sthead{display:grid;grid-template-columns:1fr 82px 62px 158px 118px 26px;gap:7px;font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--faint);font-weight:700;padding:6px 4px 4px}
.strow{display:grid;grid-template-columns:1fr 82px 62px 158px 118px 26px;gap:7px;align-items:center;padding:5px 4px;border-top:1px solid var(--line);position:relative}
.strow.low{background:var(--danger-bg);border-radius:8px}
.strow.low .stname{font-weight:700;color:#8F3120}
.stname{font-size:14px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.addbatch{background:none;border:0;color:var(--brand);font-size:11px;font-weight:700;cursor:pointer;padding:0}
.addbatch:hover{text-decoration:underline}
.stprod{border:1px solid var(--line);border-radius:10px;padding:8px 10px;margin-top:6px}
.stprod.low{background:var(--danger-bg);border-color:#EAC9BF}
.stprodhead{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.stprod.low .stname{color:#8F3120;font-weight:700}
.stctl{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--faint);text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.stctl input{padding:6px 7px;border:1px solid var(--line2);border-radius:8px;font-size:13px;font-family:inherit;background:#fff}
.stctl .stro{width:54px;text-align:center}
.stctl .stnote{width:120px;text-transform:none;font-weight:400}
.stbadge{font-size:11px;font-weight:700;background:var(--brand-tint);color:var(--brand-deep);padding:1px 8px;border-radius:20px}
.exptag{font-size:11px;font-weight:600;padding:1px 7px;border-radius:20px;background:#EDF1F0;color:var(--muted);white-space:nowrap}
.exptag.soon{background:var(--warn-bg);color:#8A6512}
.exptag.expired{background:var(--danger-bg);color:#8F3120}
.stbatches{margin-top:6px}
.stbhead{display:grid;grid-template-columns:86px 158px 62px 26px;gap:7px;font-size:9px;text-transform:uppercase;letter-spacing:.05em;color:var(--faint);font-weight:700;padding:2px 0}
.stbatch{display:grid;grid-template-columns:86px 158px 62px 26px;gap:7px;align-items:center;padding:2px 0}
.stbatch input{padding:6px 7px;border:1px solid var(--line2);border-radius:8px;font-size:13px;font-family:inherit;background:#fff;min-width:0}
.stbatch .stqty{text-align:center}
.strow input{padding:6px 7px;border:1px solid var(--line2);border-radius:8px;font-family:inherit;font-size:13px;background:#fff;min-width:0}
.stqty,.stro,.stcost{text-align:center;font-variant-numeric:tabular-nums}
.strow.low .stqty{border-color:var(--danger);color:#8F3120;font-weight:700}
.stexp.soon{border-color:var(--warn);background:var(--warn-bg);color:#8A6512;font-weight:600}
.stexp.expired{border-color:var(--danger);background:var(--danger-bg);color:#8F3120;font-weight:700}
.stdel{background:none;border:0;color:var(--faint);font-size:20px;line-height:1;cursor:pointer;padding:0}
.stdel:hover{color:var(--danger)}
.savebar{position:sticky;bottom:0;background:linear-gradient(transparent,var(--ground) 45%);padding:16px 0 6px;display:flex;justify-content:flex-end;z-index:5}
@media(max-width:720px){.sthead{display:none}.strow{grid-template-columns:1fr 84px 64px;grid-auto-flow:row}.strow .stcost{grid-column:1/2}.strow .stexp{grid-column:2/4}.strow .stnote{grid-column:1/-1}.strow .stdel{position:absolute;top:5px;right:6px}}
/* Stock row "+" actions menu */
.stmenu{position:relative;display:inline-block;justify-self:end}
.stmenutrig{width:26px;height:26px;border:1px solid var(--line2);background:var(--surface);border-radius:8px;font-size:17px;line-height:1;color:var(--muted);cursor:pointer;padding:0;display:grid;place-items:center}
.stmenutrig:hover{border-color:var(--brand);color:var(--brand)}
.stmenu.open .stmenutrig{border-color:var(--brand);background:var(--brand-tint);color:var(--brand-deep)}
.stmenulist{display:none;position:absolute;right:0;top:31px;background:var(--surface);border:1px solid var(--line2);border-radius:10px;box-shadow:var(--shadow);z-index:30;min-width:168px;padding:5px;flex-direction:column;gap:2px}
.stmenu.open .stmenulist{display:flex}
.stmenuitem{display:block;width:100%;text-align:left;background:none;border:0;padding:9px 11px;font-size:13px;font-family:inherit;color:var(--ink);cursor:pointer;border-radius:7px;white-space:nowrap}
.stmenuitem:hover{background:var(--ground)}
.stmenuitem.del{color:var(--danger)}
.stmenuitem.del:hover{background:var(--danger-bg)}
/* Stock search */
#stocksearch{width:100%;padding:11px 14px;margin-bottom:12px;border:1px solid var(--line2);border-radius:11px;font-size:14px;font-family:inherit;background:var(--surface);position:sticky;top:56px;z-index:6}
#stocksearch:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-tint)}
/* Stock sort bar + supplier tag (flat views) */
.sortbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:12px;font-size:12px}
.sortbar>span.faint{margin-right:2px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;font-size:10px}
.sortbar a{padding:5px 11px;border-radius:20px;background:var(--ground);color:var(--muted);font-weight:600}
.sortbar a:hover{text-decoration:none;background:var(--brand-tint);color:var(--brand-deep)}
.sortbar a.on{background:var(--brand);color:#fff}
.supptag{font-size:11px;font-weight:600;color:var(--muted);background:var(--ground);padding:1px 7px;border-radius:20px}
/* To-order tab — distinct colour, sits at the end */
.subnav a.toorderlink{background:var(--accent);color:#fff;font-weight:700;margin-left:auto}
.subnav a.toorderlink .faint{color:rgba(255,255,255,.8)}
.subnav a.toorderlink:hover{background:#A85F30;color:#fff;text-decoration:none}
.subnav a.toorderlink.on{background:#8F4E28;color:#fff}
@media(max-width:720px){.subnav a.toorderlink{margin-left:0}}
/* Re-order field inside the + menu */
.stmenurow{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 11px;font-size:12px;color:var(--muted);white-space:nowrap}
.stmenuinput{width:64px;padding:6px 7px;border:1px solid var(--line2);border-radius:7px;font-size:13px;font-family:inherit;text-align:center}
/* Margin warning banner */
.marginwarn{background:var(--danger-bg);border:1px solid #EAC9BF;color:#8F3120;border-radius:12px;padding:14px 16px;margin-bottom:14px;font-size:14px;line-height:1.6}
.marginwarn .small{display:inline-block;margin-top:4px;color:#A85235}
/* Stock change log */
.logrow{display:grid;grid-template-columns:1fr auto;gap:2px 14px;padding:9px 2px;border-top:1px solid var(--line);font-size:13px;align-items:center}
.logchg{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.logmeta{grid-column:1/-1;font-size:11px;color:var(--faint)}
/* Margin warning — one client per line */
.marginlines{margin:9px 0 6px}
.marginline{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:6px 0;border-top:1px solid #EDCFC6}
.marginline:first-child{border-top:0}
.mloss{color:#B0432C;font-weight:700;white-space:nowrap}
/* Margin fix — inline set-price */
.marginset{display:flex;align-items:center;gap:12px;white-space:nowrap}
.marginform{display:flex;align-items:center;gap:6px;margin:0}
.mprice{width:80px;padding:6px 8px;border:1px solid #E0B9AE;border-radius:8px;font-size:13px;font-family:inherit;text-align:center;background:#fff}
.marginform .btn.sm{margin:0}
@media(max-width:600px){.marginline{flex-wrap:wrap}.marginset{width:100%;justify-content:space-between;margin-top:4px}}

/* Finances secondary sub-tabs — lighter than the main subnav so it reads as nested */
.subnav.fintabs{background:transparent;border:0;padding:0;gap:6px;margin-top:-4px}
.subnav.fintabs a{border:1px solid var(--line2)}
.subnav.fintabs a.on{border-color:var(--brand-tint)}

/* ---- mobile polish (<=640px): stack hero, wrap card actions, declutter topbar ---- */
@media(max-width:640px){
  .topbar{padding:10px 14px;gap:8px}
  .topbar .sp{gap:10px}
  .topbar .sp .muted{display:none}                 /* hide email · role on small screens */
  .topbar .sp a.btn{white-space:nowrap}
  .hero{padding:18px 18px}
  .herorow{flex-direction:column;align-items:stretch;gap:14px}
  .heroh{font-size:21px}
  .herosub{max-width:none}
  .herostats{width:100%;justify-content:space-between;gap:10px;text-align:left}
  .herostats>div{flex:1}
  .herostats .hn{font-size:19px}
  .appcard{flex-wrap:wrap}
  .appcard .ac{width:100%;justify-content:flex-end;margin-top:6px}
}

#clientsearch{width:100%;padding:11px 15px;border:1px solid var(--line2);border-radius:12px;font-size:14px;font-family:inherit;background:var(--surface);color:var(--ink)}
#clientsearch:focus{outline:none;border-color:var(--brand)}

/* stock location breakdown + move controls */
.loctag{display:inline-block;font-size:10px;font-weight:700;color:var(--brand-deep);background:var(--brand-tint);border-radius:6px;padding:1px 6px;margin-left:4px;vertical-align:middle}
.stmoverow{display:flex;align-items:center;gap:5px;padding:7px 10px;font-size:12px;flex-wrap:wrap;border-top:1px solid var(--line)}
.stmoverow .stmvqty{width:50px}
.stmoverow select{font-size:11px;padding:3px 5px;border:1px solid var(--line2);border-radius:6px;font-family:inherit;background:var(--surface)}
.stmvbtn{font-size:11px;font-weight:700;background:var(--brand);color:#fff;border:0;border-radius:6px;padding:4px 11px;cursor:pointer;font-family:inherit}
.stmvbtn:hover{background:var(--brand-deep)}

/* stock number inputs — hide spinners so 4-5 digit quantities aren't clipped */
.stqty::-webkit-inner-spin-button,.stqty::-webkit-outer-spin-button,.stcost::-webkit-inner-spin-button,.stcost::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.stqty,.stcost{-moz-appearance:textfield;appearance:textfield}

.stmoverow .stmvlbl{font-size:11px;color:var(--muted);font-weight:600;white-space:nowrap}

/* wider stock actions menu + roomier move controls */
.stmenulist{min-width:320px;max-width:360px;padding:8px}
.stmenuitem{font-size:14px;padding:10px 12px}
.stmenurow{font-size:13px;padding:9px 12px}
.stmenurow .stmenuinput{width:80px}
.stmoverow{gap:7px 9px;padding:10px 12px;font-size:13px;align-items:center}
.stmoverow .stmvlbl{font-size:12.5px}
.stmoverow .stmvqty{width:76px;text-align:center;-moz-appearance:textfield;appearance:textfield}
.stmoverow .stmvqty::-webkit-inner-spin-button,.stmoverow .stmvqty::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.stmoverow select{flex:1;min-width:140px;font-size:13px;padding:7px 9px;border-radius:8px}
.stmvbtn{padding:7px 16px;font-size:13px}

/* stock actions menu — distinct tinted sections */
.stmenulist{gap:8px;padding:9px}
.stmsec{border-radius:10px;padding:5px;display:flex;flex-direction:column;gap:2px}
.stmsec-stock{background:var(--ground)}
.stmsec-manage{background:#F6F1EC}
.stmovebox{background:var(--brand-tint);padding:9px 11px}
.stmsectitle{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--brand-deep);font-weight:800;margin:0 2px 5px}
.stmsec .stmoverow{border-top:0;padding:0;background:transparent}
.stmsec .stmenuitem:hover{background:var(--surface)}
.stmsec .stmenuitem.del:hover{background:var(--danger-bg)}
.stmsec .stmenurow{background:transparent}

.locbar a.on{background:var(--brand);border-color:var(--brand);color:#fff}

/* per-location colour coding for the breakdown tags */
.loctag.loc-main{background:#e6ebe9;color:#4a5652}
.loctag.loc-safe{background:#dde8f4;color:#2f5d8a}
.loctag.loc-sure{background:#f4e9d2;color:#8a6a2a}

/* staff view — cost column hidden */
.sthead.nocost,.strow.nocost{grid-template-columns:1fr 84px 158px 118px 26px}
.stbhead.nocost,.stbatch.nocost{grid-template-columns:86px 158px 26px}
@media(max-width:720px){.strow.nocost{grid-template-columns:1fr 84px}}

/* per-batch location chip (multi-batch rows) */
.stbhead,.stbatch{grid-template-columns:90px 82px 62px 158px 26px}
.stbhead.nocost,.stbatch.nocost{grid-template-columns:90px 82px 158px 26px}
.stempty{color:var(--line2);text-align:center;font-size:14px;user-select:none}
.strow.stparent .stname{font-weight:600}
.strow.stsub{border-top:1px solid #F3F1EC}
.strow.stsub .stname{padding-left:16px}
.strow.stsub .stbloc{font-size:10px;font-weight:800;border-radius:6px;padding:4px 8px}
.stdel{border:1px solid var(--line2);background:#fff;border-radius:8px;height:30px;width:26px;color:var(--faint);cursor:pointer;font-size:15px;line-height:1;padding:0;display:flex;align-items:center;justify-content:center}
.stdel:hover{border-color:var(--danger);color:var(--danger)}
.stbloc{display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;border-radius:6px;padding:4px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stbloc.loc-main{background:#e6ebe9;color:#4a5652}
.stbloc.loc-safe{background:#dde8f4;color:#2f5d8a}
.stbloc.loc-sure{background:#f4e9d2;color:#8a6a2a}

.stqty.rolocked{background:#f1f0ed;color:var(--muted);cursor:not-allowed;border-style:dashed}

.stmsec-count{background:var(--info-bg)}
.btncount{background:var(--info);border-color:transparent;box-shadow:none;transition:background .12s}
.btncount:hover{background:#245B77}
.btncount:active{background:#1E4D64}
.btn.savebtn{background:#6D54A8;box-shadow:0 2px 10px rgba(109,84,168,.30)}
.btn.savebtn:hover{background:#5A4590}

/* ---- Order queue card grid ---- */
.oqtabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.oqtab{border:1px solid var(--line2);background:var(--surface);color:var(--muted);border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;transition:background .1s,border-color .1s}
.oqtab:hover{border-color:var(--brand)}
.oqtab.on{background:var(--brand);border-color:var(--brand);color:#fff}
.oqtab .faint{opacity:.7}.oqtab.on .faint{color:#DCEBE8;opacity:.9}
.oqgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.oqcard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:15px 16px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:10px}
.oqhead{display:flex;align-items:center;gap:10px}
.oqwho{min-width:0;flex:1}
.oqwho b{display:block;font-size:15px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oqsub{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:5px;margin-top:1px}
.oqmeta{font-size:12px;color:var(--faint);border-top:1px solid var(--line);padding-top:9px}
.oqitems{display:flex;flex-direction:column;gap:5px}
.oqline{display:flex;align-items:baseline;gap:8px;font-size:13px}
.oqq{color:var(--faint);font-variant-numeric:tabular-nums;min-width:22px}
.oqn{flex:1;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oqp{font-variant-numeric:tabular-nums;color:var(--muted)}
.oqmore{font-size:12px;color:var(--faint)}
.oqtrack{font-size:12px;color:#1E6444;background:var(--good-bg);border-radius:8px;padding:6px 9px;font-weight:600}
.oqtot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:10px;font-weight:800;font-size:16px}
.oqtot span:first-child{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);font-weight:700}
.oqact{display:grid;grid-template-columns:1fr 1.35fr;gap:8px}
.oqact .btn{margin:0}
@media(max-width:520px){.oqgrid{grid-template-columns:1fr}}
/* new (submitted) orders pop; released orders recede */
.oqcard.oq-new{background:#FFFCF4;border-color:#E7D3A2;box-shadow:0 3px 18px rgba(176,132,43,.16)}
.oqcard.oq-new .oqmeta,.oqcard.oq-new .oqtot{border-color:#EFE1BE}
.oqcard.oq-done{background:#FAFBFB}
.oqcard.oq-done .oqwho b{color:var(--muted)}

/* ---- palette: coloured stat cards (client summary) ---- */
.stat.stgreen,.stat.stindigo,.stat.stcoral{color:#fff;padding:17px 18px;border-radius:16px;box-shadow:0 5px 16px rgba(10,40,36,.10)}
.stat.stgreen{background:#8CA888;border-color:#8CA888}
.stat.stindigo{background:#5C5B98;border-color:#5C5B98}
.stat.stcoral{background:#CE6A57;border-color:#CE6A57}
.stat.stgreen .lbl,.stat.stindigo .lbl,.stat.stcoral .lbl{color:rgba(255,255,255,.82)}
.stat.stgreen .v,.stat.stindigo .v,.stat.stcoral .v{color:#fff;font-size:24px}
/* new-order approve button pop (indigo, matches palette) */
.btn.oqapprove{background:#5C5B98;border-color:transparent;box-shadow:0 3px 14px rgba(92,91,152,.34)}
.btn.oqapprove:hover{background:#4B4A80}
.loc-rainbow{background:#F1E4F6;color:#8A3F97}
.loctag.loc-rainbow{background:#F1E4F6;color:#8A3F97}
.loc-hut,.loctag.loc-hut,.stbloc.loc-hut{background:#E2EFDD;color:#3E6B45}
/* --- Ask Pharmacy intranet add-ons (appended to the AW app.css base) --- */
.appwrap{max-width:960px;margin:22px auto 60px;padding:0 20px}
.brandlink{display:flex;align-items:center;gap:9px;color:var(--ink);font-weight:700}
.brandlink:hover{text-decoration:none}
.savedflash{background:var(--brand-tint);color:var(--brand-deep);border:1px solid var(--brand-tint2);border-radius:10px;padding:9px 13px;font-size:13px;font-weight:600;margin-bottom:14px}
.stat3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
.statcard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:15px 16px}
.statcard .n{font-size:24px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--brand-deep)}
.statcard .l{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-weight:700;margin-bottom:3px}
table.grid{width:100%;border-collapse:collapse;font-size:14px}
table.grid th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:8px 10px;border-bottom:2px solid var(--line)}
table.grid td{padding:9px 10px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
table.grid tr:last-child td{border-bottom:0}
table.grid .num{text-align:right}
.secttag{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--brand-deep);background:var(--brand-tint);padding:9px 12px;border-top:2px solid var(--brand-tint2)}
table.grid tr:first-child .secttag{border-top:0}
.catpills{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.catpill{font-size:13px;font-weight:600;padding:6px 13px;border-radius:999px;border:1px solid var(--line2);background:var(--surface);color:var(--muted);cursor:pointer;font-family:inherit}
.catpill:hover{border-color:var(--brand);color:var(--brand-deep)}
.catpill.on{background:var(--brand);border-color:var(--brand);color:#fff}
input[type=month]{width:100%;padding:11px 13px;border:1px solid var(--line2);border-radius:10px;font-size:14px;background:var(--surface);font-family:inherit;color:var(--ink);box-sizing:border-box}
input[type=month]:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-tint)}
.locpill{display:inline-block;font-size:10px;font-weight:600;padding:2px 9px;border-radius:999px;margin:0 5px 3px 0;letter-spacing:.02em;white-space:nowrap}
.locpill b{font-weight:800}
@media(max-width:560px){.stat3{grid-template-columns:1fr}.appwrap{padding:0 12px}}
