/* AJMAL FLOW DESIGN SYSTEM: DAY (soft ivory, sage, forest green) AND NIGHT
   (matte black, graphite, silver grey). Owner's brief, 10 Oct 2026.

   One set of semantic tokens, the same names in both themes. Everything older
   -- the website's --bg/--ink/--primary-soft, the phone shell's --b25..--b950
   blue scale, --surf/--tx/--line, its bar and side gradients -- is mapped onto
   them below, so existing components follow without being rewritten one by
   one. The phone shell injects its own stylesheet after this one; the mapped
   names carry !important so the theme here is the one that applies.

   Night is neutral grey on purpose: no blue-, green- or purple-tinted blacks.
   Its primary action is light grey with dark text, so anything that sits on
   --primary takes --primary-foreground, never a literal white. Green appears
   at night only where it means something (success, a positive figure). */
html:root, html[data-theme="light"] {
  color-scheme: light;
  --background: #F4F7F2;
  --background-secondary: #EDF3EB;
  --surface: #FFFFFF;
  --surface-elevated: #FFFFFF;
  --surface-hover: #EDF3EB;
  --surface-secondary: #EDF3EB;
  --border: #DEE7DC;
  --border-strong: #6D8373;
  --text-primary: #17251D;
  --text-secondary: #607266;
  --text-muted: #607266;
  --text-disabled: #64746A;
  --primary: #245C43;
  --primary-hover: #1B4935;
  --primary-foreground: #FFFFFF;
  --primary-light: #DFEDE0;
  --link: #245C43;
  --input-background: #FFFFFF;
  --input-border: #6D8373;
  --selected-background: #DFEDE0;
  --hover-background: #EDF3EB;
  --focus-ring: #245C43;
  --nav-surface: #EDF3EB;
  --nav-text: #17251D;
  --nav-selected: #DFEDE0;
  --success: #21734E;
  --success-light: #E2F1E8;
  --warning: #975800;
  --warning-light: #F8EDDC;
  --danger: #B52F3F;
  --danger-light: #F8E3E5;
  --info: #205F9D;
  --info-light: #E2ECF7;
  --scrim: rgba(23, 37, 29, .45);
  --elevation: 0 1px 2px rgba(23, 37, 29, .06), 0 8px 24px -16px rgba(23, 37, 29, .22);
  --skeleton: #E4ECE2;
  /* Charts: distinct, calm, readable on ivory and white. */
  --chart-1: #245C43;
  --chart-2: #205F9D;
  --chart-3: #975800;
  --chart-4: #6B4E8F;
  --chart-5: #2F7F86;
  --chart-6: #B5523A;
  --chart-7: #B52F3F;
  --chart-grid: #DEE7DC;
  --chart-axis: #607266;
  --accent: var(--info);
  --brand-navy: #17352A;
  --brand-navy-light: #1F4535;
  --cash: #2F7F86;
  --bank: #205F9D;
  --inventory: #6B4E8F;
  --purchases: #B5523A;
}
html[data-theme="dark"] {
  color-scheme: dark;
  --background: #080809;
  --background-secondary: #121214;
  --surface: #1C1C1F;
  --surface-elevated: #29292D;
  --surface-hover: #323237;
  --surface-secondary: #121214;
  --border: #38383E;
  --border-strong: #55555C;
  --text-primary: #F1F1F2;
  --text-secondary: #BDBDC2;
  --text-muted: #A3A3A9;
  --text-disabled: #77777E;
  --primary: #E3E3E3;
  --primary-hover: #FFFFFF;
  --primary-foreground: #111111;
  --primary-light: #323237;
  --link: #E3E3E3;
  --input-background: #121214;
  --input-border: #898990;
  --selected-background: #323237;
  --hover-background: #29292D;
  --focus-ring: #E3E3E3;
  --nav-surface: #121214;
  --nav-text: #F1F1F2;
  --nav-selected: #29292D;
  --success: #4CC994;
  --success-light: #15291F;
  --warning: #F2B86B;
  --warning-light: #2E2416;
  --danger: #F18185;
  --danger-light: #2E1A1B;
  --info: #83B9F5;
  --info-light: #182230;
  --scrim: rgba(0, 0, 0, .66);
  --elevation: 0 10px 30px -18px rgba(0, 0, 0, .9);
  --skeleton: #29292D;
  --chart-1: #E3E3E3;
  --chart-2: #83B9F5;
  --chart-3: #F2B86B;
  --chart-4: #C3A6F0;
  --chart-5: #6FD3D8;
  --chart-6: #F09A7A;
  --chart-7: #F18185;
  --chart-grid: #38383E;
  --chart-axis: #A3A3A9;
  --accent: var(--info);
  --brand-navy: #121214;
  --brand-navy-light: #29292D;
  --cash: #6FD3D8;
  --bank: #83B9F5;
  --inventory: #C3A6F0;
  --purchases: #F09A7A;
}
/* The website's own names (styles/app.css), both themes. */
html:root, html[data-theme="light"], html[data-theme="dark"] {
  --bg: var(--background) !important;
  --surface2: var(--surface-secondary) !important;
  --ink: var(--text-primary) !important;
  --muted: var(--text-muted) !important;
  --primary-strong: var(--primary-hover) !important;
  --primary-soft: var(--primary-light) !important;
  --accent-soft: var(--info-light) !important;
  --danger-soft: var(--danger-light) !important;
  --ok: var(--success) !important;
  --ok-text: var(--success) !important;
  --warn: var(--warning) !important;
  --warn-soft: var(--warning-light) !important;
  --bg-subtle: var(--surface-secondary) !important;
  --shadow: var(--elevation) !important;
  --glow1: transparent !important;
  --glow2: transparent !important;
  --dot: transparent !important;
}

/* The phone shell's names. Its blue scale becomes forest green by day and a
   graphite-to-silver ramp by night; --b600/--b700 are its accent text and
   primary fills, --b50/--b100 its selected and soft fills. */
#shopRoot {
  --b950: #0E2A1D !important;
  --b900: #133826 !important;
  --b800: #1B4935 !important;
  --b700: #1B4935 !important;
  --b600: #245C43 !important;
  --b500: #245C43 !important;
  --b400: #5C8F74 !important;
  --b300: #A9BCAC !important;
  --b200: #CFDDD0 !important;
  --b100: #DFEDE0 !important;
  --b50: #EDF3EB !important;
  --b25: #F4F7F2 !important;
  --bg: var(--background) !important;
  --surf: var(--surface) !important;
  --surf2: var(--surface-secondary) !important;
  --line: var(--border) !important;
  --line2: var(--background-secondary) !important;
  --tx: var(--text-primary) !important;
  --tx2: var(--text-secondary) !important;
  --tx3: var(--text-muted) !important;
  --barA: var(--surface) !important;
  --barB: var(--surface) !important;
  --sideA: var(--nav-surface) !important;
  --sideB: var(--nav-surface) !important;
  --shadow: rgba(23, 37, 29, .07) !important;
  --scrim: rgba(23, 37, 29, .45) !important;
}
[data-theme="dark"] #shopRoot {
  --b950: #080809 !important;
  --b900: #121214 !important;
  --b800: #29292D !important;
  --b700: #F1F1F2 !important;
  --b600: #E3E3E3 !important;
  --b500: #E3E3E3 !important;
  --b400: #898990 !important;
  --b300: #55555C !important;
  --b200: #45454B !important;
  --b100: #323237 !important;
  --b50: #29292D !important;
  --b25: #121214 !important;
  --shadow: rgba(0, 0, 0, .5) !important;
  --scrim: rgba(0, 0, 0, .66) !important;
}

/* Shared components, both themes, from the tokens only. */
#shopRoot .shell, #shopRoot .main { background: var(--background) !important; color: var(--text-primary); }
#shopRoot .topbar {
  background: var(--surface) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: none !important;
}
#shopRoot .topbar .tb-btn, #shopRoot .topbar .conn {
  background: var(--surface-secondary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
}
#shopRoot .topbar .conn b, #shopRoot .topbar .conn.off b { color: var(--text-primary) !important; }
#shopRoot .topbar .conn i { background: var(--success) !important; box-shadow: 0 0 0 3px var(--success-light) !important; }
#shopRoot .topbar .conn.off i { background: var(--text-disabled) !important; box-shadow: 0 0 0 3px var(--surface-hover) !important; }
#shopRoot .topbar .search { background: var(--surface-secondary) !important; border: 1px solid var(--border) !important; }
#shopRoot .topbar .search input { color: var(--text-primary) !important; }
#shopRoot .topbar .search input::placeholder { color: var(--text-muted) !important; }
#shopRoot .side { background: var(--nav-surface) !important; color: var(--nav-text) !important; border-right: 1px solid var(--border); }
#shopRoot .side :is(b, span, a, .ni, .nl) { color: var(--nav-text) !important; }
#shopRoot .side .on { background: var(--nav-selected) !important; color: var(--nav-text) !important; }
#shopRoot .side .on::before { background: var(--primary) !important; }
#shopRoot .botnav { background: var(--surface) !important; border-top: 1px solid var(--border) !important; }
#shopRoot .bn { color: var(--text-muted) !important; }
#shopRoot .bn.on { color: var(--primary) !important; background: var(--selected-background) !important; }
#shopRoot .fab, #shopRoot .btn.solid, #shopRoot .qv-mic {
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
}
#shopRoot .btn.solid:hover, #shopRoot .fab:hover { background: var(--primary-hover) !important; }
#shopRoot .qv-mic { box-shadow: 0 0 0 10px var(--selected-background) !important; }
#shopRoot .btn:not(.solid):not(.btn--primary):not(.btn--accent):not(.btn--danger) { color: var(--link) !important; border-color: var(--border-strong) !important; }
#shopRoot .kpi::before { background: var(--primary) !important; opacity: .85; }
#shopRoot .toast { background: var(--text-primary) !important; color: var(--background) !important; }
#shopRoot .sheet { background: var(--surface-elevated) !important; }
#shopRoot .sheetbg { background: var(--scrim) !important; }
#shopRoot :is(input, select, textarea):not([type=checkbox]):not([type=radio]):not([type=range]) {
  background-color: var(--input-background);
  border-color: var(--input-border);
  color: var(--text-primary);
}
#shopRoot .auth { background: var(--background) !important; }
#shopRoot .auth .authcard { background: var(--surface) !important; border: 1px solid var(--border); box-shadow: var(--elevation); }
#shopRoot .authtop b { color: var(--text-primary) !important; }
#shopRoot .authtop span { color: var(--text-secondary) !important; }
#shopRoot .brand-mark, #shopRoot .authtop .mk, .brand__mark {
  background: url("/assets/ajmal-flow-icon.png?v=179343259124-62d6b7dc36cb") center / cover no-repeat !important;
  font-size: 0 !important;
  box-shadow: none !important;
}
#shopRoot .dash-action.primary:hover, #shopRoot .btn-primary:hover { background: var(--primary-hover) !important; }
#shopRoot :is(input, select, textarea, button, a):focus-visible,
:is(input, select, textarea, button, a):focus-visible {
  outline: 2px solid var(--focus-ring) !important;
  outline-offset: 2px;
}
/* Night: the shell's own dark rules hard-code light blues for links, icons,
   chips and the active tab. Silver instead, from the tokens. */
html[data-theme="dark"] #shopRoot :is(.ritem i, .kpi-d b, .sec a, .t1, .t2, .t3, .t4, .t5, .p1, .p2, .rc-ic, .opt-ic, .cflag,
  .btn:not(.solid):not(.btn--primary):not(.btn--accent):not(.btn--danger), .chip.on, .codeprev b, .q i, .syncrow .big, .iconbtn, .prod .pp, .prod .bdg, .stp button, .tr.big b,
  .pay i, .bank i, .authtab.on, .lnk, .offcard .oi, .steplbl) { color: var(--text-primary) !important; }
html[data-theme="dark"] #shopRoot .bn.on { color: var(--text-primary) !important; }
html[data-theme="dark"] #shopRoot .note.ledbad { background: var(--danger-light) !important; border-color: var(--danger) !important; color: var(--danger) !important; }
@media (prefers-reduced-motion: reduce) {
  #shopRoot *, #shopRoot *::before, #shopRoot *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Marketing pages use the same brand tokens. */
:root { --green: var(--primary); --green2: var(--primary-hover); --paper: var(--background); --line: var(--border); }
.site-header { background: var(--surface) !important; }
.btn-primary { background: var(--primary) !important; color: var(--primary-foreground) !important; }
.btn-primary:hover { background: var(--primary-hover) !important; }

.payroll-workspace .payroll-slip{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:10px}
.payroll-workspace .payroll-slip summary{min-height:44px;cursor:pointer;overflow-wrap:anywhere}
.payroll-workspace .payroll-slip dl div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}
.payroll-workspace .payroll-slip dd{margin:0;text-align:end;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
@media(max-width:768px){
  .payroll-workspace button{min-height:44px;white-space:normal}
  .payroll-workspace .data-table{display:block;width:100%;min-width:0!important}
  .payroll-workspace .data-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .payroll-workspace .data-table tbody,.payroll-workspace .data-table tr{display:block;width:100%}
  .payroll-workspace .data-table tr{padding:12px 0;border-bottom:1px solid var(--line)}
  .payroll-workspace .data-table td{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;border:0;white-space:normal!important;overflow-wrap:anywhere;padding:8px 0}
  .payroll-workspace .data-table td::before{content:attr(data-label);font-size:12px;color:var(--text-muted)}
  .payroll-workspace .data-table td:last-child{display:flex;flex-wrap:wrap;align-items:center}
}

.payroll-record-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:12px;align-items:end}.payroll-record-form .fld{display:flex;flex-direction:column;gap:4px}.payroll-record-form .input{width:100%;min-height:44px;box-sizing:border-box}.payroll-workspace summary{min-height:44px;cursor:pointer}

.management-metric{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:12px 0;border-bottom:1px solid var(--border,#e2e8f0)}.management-metric small{grid-column:1/-1;color:var(--text-muted,#475569)}#managementPeriodSummary{padding:16px;margin-bottom:16px}#managementPeriodSummary .daily-actions{display:flex;flex-wrap:wrap;gap:8px}#managementPeriodSummary button{min-height:44px}

.bill-line{margin:12px 0;padding:12px;border:1px solid var(--border,#e2e8f0);border-radius:12px;min-width:0}.bill-line legend{font-weight:600;padding:0 4px}.bill-line input,.bill-line select{width:100%;box-sizing:border-box;min-height:44px}.bill-line-preview{margin:0}.bill-remove-line{min-height:44px}@media(max-width:480px){#billForm,#billForm .bill-line{grid-template-columns:minmax(0,1fr)}#billForm .span2{grid-column:1/-1}}

#dashLedgerWarn .note{display:block;overflow-wrap:anywhere}
#dashLedgerWarn .ledger-warning summary{min-height:44px;cursor:pointer;line-height:1.5;font-weight:600;list-style-position:inside}
#dashLedgerWarn .ledger-warning summary span{font-weight:400;color:var(--link);white-space:nowrap}
#dashLedgerWarn .ledger-warning p,#dashLedgerWarn .ledbad p{margin:10px 0 0;line-height:1.55}

[data-theme="dark"] #shopRoot .daily-actions button:first-child,
[data-theme="dark"] #shopRoot [data-pcat].on { color: var(--primary-foreground) !important; }

#shopRoot #dailyCollections .reminder-select { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; flex: 0 0 44px; }
#shopRoot #dailyCollections .reminder-select input { width: 24px; height: 24px; min-height: 24px; }
#shopRoot #dailyReminderReview .sheet-h button, #shopRoot #dailyReminderReview select { min-height: 44px; }

.party-screen th, .party-dialog th,
#shopRoot#shopRoot .mod-body .party-screen th { color: var(--text-secondary, #475569); }
.party-screen .btn, .party-screen .icon-btn, .party-dialog .btn, .party-dialog .icon-btn,
#shopRoot#shopRoot .mod-body .party-screen .btn,
#shopRoot#shopRoot .mod-body .party-screen .icon-btn { min-height: 44px; min-width: 44px; }
[data-theme="dark"] .party-dialog .btn--primary,
[data-theme="dark"] .party-screen .btn--primary,
[data-theme="dark"] #shopRoot#shopRoot .mod-body .party-screen .btn--primary { color: var(--primary-foreground); }
.party-dialog [role="region"]:focus-visible, .party-screen [role="region"]:focus-visible { outline: 2px solid var(--primary, #2563EB); outline-offset: 2px; }

#shopRoot#shopRoot #mh-recon th { color: var(--text-secondary); }
#shopRoot#shopRoot #mh-recon .chip--ok { color: var(--success); background: var(--success-light); }
#shopRoot#shopRoot #mh-recon [data-match] input, #shopRoot#shopRoot #mh-recon [data-match] select, #shopRoot#shopRoot #mh-recon [data-match] textarea { width: 100%; box-sizing: border-box; min-height: 44px; }
#shopRoot#shopRoot #mh-recon button { min-height: 44px; }
@media (max-width: 600px) {
  #shopRoot#shopRoot #mh-recon #recSummaryBar > div { grid-template-columns: minmax(0, 1fr) !important; }
  #shopRoot#shopRoot #mh-recon #recSummaryBar > div > div { grid-column: auto !important; }
  #shopRoot#shopRoot #mh-recon .page-head__actions, #shopRoot#shopRoot #mh-recon #recTabSeg { flex-wrap: wrap; }
  #shopRoot#shopRoot #mh-recon [data-match] { grid-template-columns: minmax(0, 1fr) !important; }
}
#shopRoot#shopRoot #mh-recon #sumClearedBal { color: var(--success) !important; }

/* Everything painted in the primary colour carries the primary foreground,
   flat (no gradients), in both themes. */
#shopRoot#shopRoot :is(.avatar, .brand-mark, .nav.on, .ruser .av, .addbtn, .p3, .tab.on, .opt.on .opt-ic,
  .prod .bdg.low, .prod .incart, .bigbtn, .lastuser .av, .daily-actions button:first-child, [data-pcat].on) {
  background: var(--primary) !important; color: var(--primary-foreground) !important; border-color: var(--primary) !important;
}
#shopRoot#shopRoot :is(.warn, .errbox) { background: var(--danger-light) !important; color: var(--danger) !important; }
#shopRoot#shopRoot .kpi :is(b, strong, .v, .val) { color: var(--text-primary); }
[data-theme="dark"] #shopRoot#shopRoot :is(.tog, .toggle, .sw) :is(input:checked + *, .on)::after { background: var(--primary-foreground) !important; }
#shopRoot#shopRoot .auth :is(small, .foot, footer, .muted) { color: var(--text-secondary) !important; }
#shopRoot#shopRoot .kpi { --k: var(--primary) !important; }
#shopRoot#shopRoot .kpi-v { color: var(--text-primary) !important; font-variant-numeric: tabular-nums; }
#shopRoot#shopRoot .authfoot { color: var(--text-secondary) !important; }
#shopRoot#shopRoot :is(.btn--primary, .btn--accent) { background: var(--primary) !important; color: var(--primary-foreground) !important; border-color: var(--primary) !important; background-image: none !important; }
#shopRoot#shopRoot :is(.btn--primary, .btn--accent):hover { background: var(--primary-hover) !important; }
#shopRoot#shopRoot .btn--danger { background: var(--danger) !important; color: var(--background) !important; border-color: var(--danger) !important; }
#shopRoot#shopRoot :is(.seg__btn.active, .seg__btn[aria-selected="true"]),
#shopRoot#shopRoot :is(.seg__btn.active, .seg__btn[aria-selected="true"]) * { background-color: var(--primary) !important; color: var(--primary-foreground) !important; }
#shopRoot#shopRoot :is(.seg__btn.active, .seg__btn[aria-selected="true"]) * { background-color: transparent !important; }
#shopRoot#shopRoot .side .brand-name { color: var(--nav-text, var(--text-primary)) !important; }
#shopRoot#shopRoot .side :is(.brand-sub, #brandSub) { color: var(--text-secondary) !important; }
#shopRoot#shopRoot .side .grp-t { color: var(--text-secondary) !important; }
#shopRoot#shopRoot .side .nav.on, #shopRoot#shopRoot .side .nav.on * { color: var(--primary-foreground) !important; }

#shopRoot #dailySetup .card { color: var(--tx); }
#shopRoot #dailySetup h2 { color: var(--tx); }
#shopRoot #dailySetup button { min-height:44px; color:var(--tx); background:var(--surf) !important; border-color:var(--line); }
#shopRoot#shopRoot #p-detailedreports .chip--btn { color:var(--text-secondary); background:var(--surface-secondary); min-height:44px; }
#shopRoot#shopRoot #p-detailedreports .chip--btn[aria-pressed="true"] { color:var(--text-primary); border-color:var(--primary); }
.invoice-dialog .invoice .inv-meta, .invoice-dialog .invoice .text-muted { color:var(--text-secondary); }
.invoice-dialog .btn, .invoice-dialog .icon-btn { min-height:44px; min-width:44px; }
#overlay-root .invoice-dialog .btn--ghost { background:var(--surface) !important; color:var(--text-primary); }
[data-theme="dark"] .invoice-dialog .btn--primary { color:var(--primary-foreground); }
[data-theme="dark"] .return-dialog :is(.btn--primary,.seg__btn.active) { color:var(--primary-foreground); }
.return-dialog :is(.btn,.icon-btn,.seg__btn,.voice-field-button,input,select), .returns-screen .icon-btn { min-height:44px; min-width:44px; }

/* The financial module is scoped inside the shell; retain readable dark actions. */
[data-theme="dark"] #shopRoot#shopRoot #p-financialreports .mod-body .btn--primary,
[data-theme="dark"] #shopRoot#shopRoot #p-financialreports .mod-body .seg__btn.active { color:var(--primary-foreground); }
#shopRoot #p-financialreports .page-head button,
#shopRoot #p-financialreports .seg__btn,
#shopRoot #p-financialreports .chip--btn { min-height:44px; }

/* Reuse the reviewed split-source form with a deliberate phone reflow. */
.payment-scope{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:12px;background:var(--bg-subtle);border-radius:10px;overflow-wrap:anywhere}
.payment-source-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-block:12px}
.payment-source-head h4{margin:0}
.payment-source-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(140px,1fr) 44px;gap:8px;align-items:end;padding:12px;border:1px solid var(--border);border-radius:10px}
.payment-source-row .f{min-width:0;margin:0}
.payment-source-row :is(input,select){width:100%}
:is(.split-payment-review,.receive-payment-review) :is(input,select,button,.voice-field-button){min-height:44px;min-width:44px}
[data-theme="dark"] :is(.split-payment-review,.receive-payment-review) .btn--primary{color:var(--primary-foreground)}
@media(max-width:550px){.payment-source-row{grid-template-columns:minmax(0,1fr) 44px}.payment-source-row .f{grid-column:1}.payment-source-row .split-del-btn{grid-column:2;grid-row:1/4;align-self:center}.payment-scope{grid-template-columns:repeat(2,minmax(0,1fr))}.payment-scope>div:last-child:nth-child(3){grid-column:1/-1}.payment-source-head{flex-wrap:wrap}}
:is(.goods-received-review,.goods-dispatched-review) :is(.btn,.icon-btn){min-width:44px;min-height:44px}
:is(.goods-received-review,.goods-dispatched-review) .kv{gap:12px;flex-wrap:wrap}
:is(.goods-received-review,.goods-dispatched-review) .kv b{overflow-wrap:anywhere}
[data-theme="dark"] .overlay__panel:has(.goods-received-review,.goods-dispatched-review) .btn--primary{color:var(--primary-foreground)}
.overlay__panel:has(.goods-received-review,.goods-dispatched-review) .modal-foot .btn{min-width:44px;min-height:44px}
#shopRoot #clsChips .chip{min-height:44px;font:inherit}
#shopRoot #qgrid button.q{font:inherit;color:var(--tx)}

[data-theme="dark"] .delivery-challan-review .btn--primary{color:var(--primary-foreground)}
.delivery-challan-review :is(input,select,button){min-height:44px;min-width:44px}
@media(max-width:550px){.delivery-challan-review #dcForm>div[style*="grid-template-columns"]{grid-template-columns:minmax(0,1fr)!important}}
.invoice-dialog .invoice th{color:var(--text-primary)}

.pos-receipt-review :is(button,textarea){min-height:44px;min-width:44px}
.pos-receipt-review textarea{width:100%;min-height:130px;box-sizing:border-box}
.pos-receipt-review .row-actions{display:flex;gap:8px;flex-wrap:wrap}
[data-theme="dark"] :is(.pos-receipt-review,.sale-completed-review,.camera-scanner-review,.return-dialog,.purchase-create-review,.expense-bill-review) .btn--primary{background:var(--primary);color:var(--primary-foreground)}
[data-theme="dark"] :is(.pos-receipt-review,.sale-completed-review,.camera-scanner-review,.return-dialog,.purchase-create-review,.expense-bill-review) .btn--primary:hover{background:var(--primary-hover)}
:is(.pos-grid,.sale-grid) :is(.stepper button,.stepper input,.cart-row .icon-btn){min-width:44px;min-height:44px}
@media(max-width:600px){:is(.pos-grid,.sale-grid) .cart-row{flex-wrap:wrap}:is(.pos-grid,.sale-grid) .cart-row__name{flex-basis:100%}:is(.pos-grid,.sale-grid) .cart-row__total{margin-inline-start:auto}.pos-grid .pos-header{flex-wrap:wrap}}

.sale-completed-review :is(button,a){min-width:44px;min-height:44px}

.camera-scanner-review :is(button,input){min-width:44px;min-height:44px}
.purchase-create-review :is(button,input,select){min-width:44px;min-height:44px}
.purchase-create-review #poItems{min-width:0;max-width:100%}
.purchase-create-review #receiveForm > .span2{min-width:0;max-width:100%}
.purchase-create-review .modal-foot{flex-wrap:wrap}
.purchase-create-review .modal-foot .btn{white-space:normal;max-width:100%}
.expense-bill-review :is(button,input,select),.expense-bills-screen .row-actions button{min-width:44px;min-height:44px}
.expense-bill-review :is(.bill-line,.span2){min-width:0;max-width:100%}
.expense-bill-review .modal-foot{flex-wrap:wrap}
.expense-bill-review .modal-foot .btn{white-space:normal;max-width:100%}
[data-reverse-doc]{min-width:44px;min-height:44px;white-space:normal}
.reversal-review-note{max-width:32rem;white-space:normal;overflow-wrap:anywhere}

/* Existing GL invoices retain all lines; narrow screens keep controls usable. */
.invoice-review-modal :is(button,input,select,textarea),.invoice-review-screen .row-actions button{min-width:44px;min-height:44px}
.invoice-review-modal :is(.invoice-line,.span2){min-width:0;max-width:100%}
.invoice-review-modal .invoice-line{margin:12px 0;padding:12px;border:1px solid var(--border);border-radius:12px}
.invoice-review-modal .invoice-line :is(input,select){width:100%;box-sizing:border-box}
.invoice-review-modal .modal-foot{flex-wrap:wrap}
[data-theme="dark"] .invoice-review-modal .btn--primary{background:var(--primary)!important;color:var(--primary-foreground)!important}
[data-theme="dark"] .invoice-review-modal .btn--primary:hover{background:var(--primary-hover)!important}

:is(.bank-account-review,.partial-invoice-review) :is(button,input,select){min-height:44px}
[data-theme="dark"] :is(.bank-account-review,.partial-invoice-review) .btn--primary{background:var(--primary);color:var(--primary-foreground)}
[data-theme="dark"] :is(.bank-account-review,.partial-invoice-review) .btn--primary:hover{background:var(--primary-hover)}
@media(max-width:480px){#invForm,#invForm .invoice-line{grid-template-columns:minmax(0,1fr)}#invForm .span2{grid-column:1/-1}.invoice-review-modal .modal-foot .btn{flex:1 1 140px}}

.invoice-review-modal .voice-wrap{position:relative;display:block;min-height:44px;margin:0}
.invoice-review-modal .voice-field-button{top:0;transform:none;width:44px;height:44px}
.invoice-review-modal .voice-wrap-area .voice-field-button{top:8px}

.invoice-review-modal [hidden]{display:none!important}

#invForm{align-items:stretch;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr) auto;max-height:68vh;min-height:0}
#invForm>.invoice-review-fields{overflow-y:auto;min-height:0;min-width:0;padding:2px}
#invForm>.modal-foot{position:static;margin-bottom:0}
@media(max-width:480px){#invForm>.invoice-review-fields{grid-template-columns:minmax(0,1fr)!important}}

/* Supported item review uses the established dialog and theme tokens. */
.product-editor-review #pForm :is(input, select, button) { min-height: 44px; }
[data-theme="dark"] .product-editor-review .btn--primary { background: var(--primary); color: var(--primary-foreground); }
[data-theme="dark"] .product-editor-review .btn--primary:hover { background: var(--primary-hover); }
[data-theme="dark"] [data-credential-form] .btn--primary { background: var(--primary); color: var(--primary-foreground); }
[data-theme="dark"] [data-credential-form] .btn--primary:hover { background: var(--primary-hover); }

/* Column headings retain AA contrast on the existing pale table surface. */
th { color: var(--text-secondary, var(--muted)); }