/*
  Peppermall Source-Led Component Design System
  CDBT18 P2.11.7n.7.2c.9
  Version: 2.1-p2.11.7n7_2c9i_a
  One complete CSS file: tokens + component group rules + receipt rules.
  Production font weights: 300 and 400 only. No in-between or heavy weights.
  Auth is light with centered logo-left / brand-right identity.
  Shared by POS and online shop. No runtime finalizer.
*/

:root {
  color-scheme: light;
  --pm-white:#FFFFFF; --pm-off-white:#F6F6F5; --pm-surface:#FFFFFF; --pm-surface-2:#F2F2F1; --pm-surface-3:#E8E8E6; --pm-surface-4:#DCDCDA; --pm-border:#E0E0DE; --pm-border-strong:#D0D0D0;
  --pm-black:#111111; --pm-ink-1:#1C1C1C; --pm-ink-2:#444441; --pm-ink-3:#7A7A77; --pm-ink-4:#A9A9A5; --pm-muted:#8C8C8C;
  --pm-green:#3B6D11; --pm-green-hover:#4A7F1B; --pm-green-tint:#EAF3DE;
  --pm-yellow:#B38A00; --pm-yellow-hover:#C99D06; --pm-yellow-tint:#FFFBE6;
  --pm-orange:#B55A10; --pm-orange-hover:#C96A1E; --pm-orange-tint:#FFF0E6;
  --pm-red:#A32D2D; --pm-red-hover:#B83A3A; --pm-red-tint:#FCEBEB;
  --pm-purple:#534AB7; --pm-purple-hover:#6258CB; --pm-purple-tint:#EEEDFE;
  --pm-blue:#185FA5; --pm-blue-hover:#2471BD; --pm-blue-tint:#E6F1FB;
  --pm-teal:#0F6E56; --pm-teal-hover:#168565; --pm-teal-tint:#E1F5EE;
  --pm-gold:#B8860B; --pm-gold-hover:#C99518; --pm-gold-tint:#FDF6E3;
  --pm-neutral:#444441; --pm-neutral-hover:#565651; --pm-neutral-tint:#F4F4F4;
  --pm-font-family:Roboto,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  --pm-weight-normal:300; --pm-weight-strong:400;
  --pm-font-xs:11px; --pm-font-sm:12px; --pm-font-base:14px; --pm-font-md:16px; --pm-font-lg:18px; --pm-font-xl:24px;
  --pm-control-height:40px; --pm-control-height-compact:30px; --pm-control-radius:8px; --pm-control-radius-compact:6px; --pm-icon-button:36px; --pm-icon-button-mobile:30px;
  --pm-card-radius:10px; --pm-card-padding:20px; --pm-space-1:4px; --pm-space-2:8px; --pm-space-3:12px; --pm-space-4:16px; --pm-space-5:20px; --pm-space-6:24px;
  --pm-shadow-soft:0 2px 12px rgba(0,0,0,.08); --pm-shadow-card:0 1px 3px rgba(0,0,0,.08); --pm-transition:.13s ease; --pm-focus-ring:0 0 0 3px rgba(59,109,17,.12);
  --pm-design-system-version:"2.1-p2.11.7n7_2c9d"; --pm-design-system-mode:"source-led-component-system-no-finalizer";
}
html,body { font-family:var(--pm-font-family); font-size:var(--pm-font-base); font-weight:var(--pm-weight-normal); color:var(--pm-ink-1); background:var(--pm-off-white); line-height:1.5; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
button,input,select,textarea { font-family:var(--pm-font-family); } button { font-weight:var(--pm-weight-strong); cursor:pointer; } input,select,textarea { font-weight:var(--pm-weight-normal); } svg { stroke-width:1.5; }
.pm-page-title,h1.pm-page-title{font-size:var(--pm-font-xl);font-weight:var(--pm-weight-strong);color:var(--pm-ink-1);letter-spacing:-.2px} .pm-section-title,h2.pm-section-title{font-size:var(--pm-font-lg);font-weight:var(--pm-weight-strong)} .pm-card-title,h3.pm-card-title{font-size:var(--pm-font-md);font-weight:var(--pm-weight-strong)} .pm-helper,.pm-caption,.pm-meta{font-size:var(--pm-font-xs);font-weight:var(--pm-weight-normal);color:var(--pm-ink-3)}
/* Brand */
.pm-brand{display:inline-flex;align-items:center;gap:var(--pm-space-2);min-width:0} .pm-brand-logo{width:32px;height:32px;border-radius:var(--pm-control-radius-compact);background:var(--pm-green);color:var(--pm-white);display:inline-flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0} .pm-brand-logo img,.pm-receipt-logo img{width:100%;height:100%;object-fit:contain} .pm-brand-copy{display:inline-flex;flex-direction:column;line-height:1.05} .pm-brand-name{font-size:var(--pm-font-md);font-weight:var(--pm-weight-strong);letter-spacing:.08em;text-transform:uppercase;color:var(--pm-ink-1)} .pm-brand-context{font-size:var(--pm-font-xs);font-weight:var(--pm-weight-normal);letter-spacing:.12em;text-transform:uppercase;color:var(--pm-ink-3)}
/* Auth light */
.pm-auth-shell,:where(#lockScreen,#lock-screen,.lock-screen,.locked-screen,.auth-screen,.login-screen,.unlock-screen,.pin-screen){background:var(--pm-off-white);color:var(--pm-ink-1)} .pm-auth-card{width:min(100%,380px);background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);padding:28px;box-shadow:var(--pm-shadow-card);display:flex;flex-direction:column;gap:var(--pm-space-5)} .pm-auth-brand{display:flex;align-items:center;justify-content:center;gap:var(--pm-space-2);margin-bottom:var(--pm-space-1)} .pm-auth-title{font-size:var(--pm-font-md);font-weight:var(--pm-weight-strong);text-align:center} .pm-auth-subtitle{font-size:var(--pm-font-sm);color:var(--pm-ink-3);text-align:center;margin-top:calc(-1 * var(--pm-space-3))} .pm-auth-user-chip{display:flex;align-items:center;gap:var(--pm-space-2);background:var(--pm-surface-2);border:1px solid var(--pm-border);border-radius:var(--pm-control-radius);padding:10px 14px;width:100%;color:var(--pm-ink-2);font-size:var(--pm-font-base)} .pm-auth-avatar{width:28px;height:28px;border-radius:999px;background:var(--pm-green);color:var(--pm-white);display:inline-flex;align-items:center;justify-content:center;font-size:var(--pm-font-xs);font-weight:var(--pm-weight-strong);flex-shrink:0} .pm-auth-pin-dots{display:flex;gap:10px;justify-content:center} .pm-auth-dot{width:12px;height:12px;border-radius:999px;border:1px solid var(--pm-border-strong);background:var(--pm-white)} .pm-auth-dot.is-filled,.pm-auth-dot.filled{background:var(--pm-green);border-color:var(--pm-green)} .pm-auth-keypad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--pm-space-2)} .pm-auth-key{height:52px;border:1px solid var(--pm-border);border-radius:var(--pm-control-radius);background:var(--pm-white);color:var(--pm-ink-1);font-size:var(--pm-font-md);font-weight:var(--pm-weight-strong);display:inline-flex;align-items:center;justify-content:center;transition:background var(--pm-transition),color var(--pm-transition),border-color var(--pm-transition)} .pm-auth-key:hover{background:var(--pm-surface-2);border-color:var(--pm-border-strong)} .pm-auth-key:active{background:var(--pm-green);border-color:var(--pm-green);color:var(--pm-white)} .pm-auth-key--back,.pm-auth-key--delete{color:var(--pm-neutral)} .pm-auth-key--ok,.pm-auth-key--tick{background:var(--pm-green);border-color:var(--pm-green);color:var(--pm-white)} .pm-auth-key--ok:hover,.pm-auth-key--tick:hover{background:var(--pm-green-hover);border-color:var(--pm-green-hover)} .pm-auth-actions{display:flex;gap:var(--pm-space-2);width:100%} .pm-auth-btn{flex:1;min-height:44px;border-radius:var(--pm-control-radius);border:1px solid var(--pm-border);font-size:var(--pm-font-base);font-weight:var(--pm-weight-strong);display:inline-flex;align-items:center;justify-content:center;gap:var(--pm-space-2);transition:background var(--pm-transition),color var(--pm-transition),border-color var(--pm-transition)} .pm-auth-btn--next{background:var(--pm-green);border-color:var(--pm-green);color:var(--pm-white)} .pm-auth-btn--next:hover{background:var(--pm-green-hover);border-color:var(--pm-green-hover)} .pm-auth-btn--fob,.pm-auth-btn--secondary{background:var(--pm-white);color:var(--pm-neutral);border-color:var(--pm-border)} .pm-auth-btn--fob:hover,.pm-auth-btn--secondary:hover{background:var(--pm-neutral-tint);border-color:var(--pm-border-strong)} .pm-auth-btn--back,.pm-auth-btn--ghost{background:transparent;color:var(--pm-neutral);border-color:transparent} .pm-auth-btn--back:hover,.pm-auth-btn--ghost:hover{background:var(--pm-surface-2);color:var(--pm-ink-1)}
/* Header */
.pm-shell-header,.header-shell{min-height:52px;background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);display:flex;align-items:center;gap:var(--pm-space-1);padding:0 var(--pm-space-4)} .pm-shell-icon,.pm-header-icon-btn,.h-icon,.pm-header-action,.pm-topbar-icon{width:var(--pm-icon-button);height:var(--pm-icon-button);background:transparent;border:none;border-radius:7px;color:var(--pm-ink-3);display:inline-flex;align-items:center;justify-content:center;padding:0;transition:background var(--pm-transition),color var(--pm-transition)} .pm-shell-icon:hover,.pm-header-icon-btn:hover,.h-icon:hover,.pm-header-action:hover,.pm-topbar-icon:hover{background:var(--pm-surface-2);color:var(--pm-ink-1)} .pm-shell-icon svg,.pm-header-icon-btn svg,.h-icon svg,.pm-header-action svg,.pm-topbar-icon svg{width:18px;height:18px} .pm-header-logout,.mobile-logout-btn,.h-logout{height:var(--pm-control-height-compact);padding:0 10px;background:transparent;border:1px solid var(--pm-border);border-radius:var(--pm-control-radius-compact);color:var(--pm-ink-3);font-size:var(--pm-font-xs);font-weight:var(--pm-weight-strong);display:inline-flex;align-items:center;gap:6px;transition:background var(--pm-transition),color var(--pm-transition),border-color var(--pm-transition)} .pm-header-logout:hover,.mobile-logout-btn:hover,.h-logout:hover{background:var(--pm-surface-2);color:var(--pm-ink-1);border-color:var(--pm-border-strong)}
/* Tabs */
.pm-main-tab-bar,.main-tab-bar{display:flex;align-items:stretch;background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);overflow:hidden;padding:0 8px;gap:2px} .pm-main-tab,.main-tab,.tab{height:44px;padding:0 14px;background:transparent;border:none;border-bottom:2px solid transparent;border-radius:0;color:var(--pm-ink-3);font-size:var(--pm-font-sm);font-weight:var(--pm-weight-strong);white-space:nowrap;transition:color var(--pm-transition),border-color var(--pm-transition),background var(--pm-transition);display:inline-flex;align-items:center;justify-content:center} .pm-main-tab:hover,.main-tab:hover,.tab:hover{color:var(--pm-ink-1);background:transparent} .pm-main-tab.is-active,.pm-main-tab.active,.main-tab.active,.tab.active{color:var(--pm-ink-1);border-bottom-color:var(--pm-ink-1);background:transparent}
.pm-sub-tab-bar,.sub-tab-bar{display:flex;gap:2px;background:var(--pm-surface-2);border-radius:var(--pm-control-radius);padding:3px;width:fit-content;max-width:100%;overflow-x:auto} .pm-sub-tab,.sub-tab,.pm-list-tab{height:var(--pm-control-height-compact);padding:0 14px;background:transparent;border:none;border-radius:var(--pm-control-radius-compact);color:var(--pm-ink-3);font-size:var(--pm-font-sm);font-weight:var(--pm-weight-strong);white-space:nowrap;flex-shrink:0;transition:background var(--pm-transition),color var(--pm-transition),box-shadow var(--pm-transition)} .pm-sub-tab:hover,.sub-tab:hover,.pm-list-tab:hover{color:var(--pm-ink-2)} .pm-sub-tab.is-active,.pm-sub-tab.active,.sub-tab.active,.pm-list-tab.active{background:var(--pm-white);color:var(--pm-ink-1);box-shadow:var(--pm-shadow-card)}
/* Categories, filters, product cards */
.pm-category-tree,.cat-tree,.main-pos-category-tree,.main-pos-categories,.shop-category-tree{background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);overflow:hidden} .pm-category-tree__head,.cat-tree-head,.main-pos-category-title,.shop-category-title{padding:10px 14px;font-size:var(--pm-font-xs);font-weight:var(--pm-weight-strong);color:var(--pm-ink-3);text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid var(--pm-border);background:var(--pm-surface-2)} .pm-category-item,.cat-item,.main-pos-category-item,.main-pos-crumb,.shop-category-item{position:relative;display:flex;align-items:center;gap:var(--pm-space-2);padding:9px 14px;min-height:36px;font-size:var(--pm-font-sm);font-weight:var(--pm-weight-normal);color:var(--pm-ink-2);background:var(--pm-white);border:none;border-bottom:1px solid var(--pm-border);cursor:pointer;transition:background var(--pm-transition),color var(--pm-transition)} .pm-category-item:last-child,.cat-item:last-child,.main-pos-category-item:last-child,.main-pos-crumb:last-child,.shop-category-item:last-child{border-bottom:none} .pm-category-item:hover,.cat-item:hover,.main-pos-category-item:hover,.main-pos-crumb:hover,.shop-category-item:hover{background:var(--pm-surface-2);color:var(--pm-ink-1)} .pm-category-item.is-active,.pm-category-item.active,.cat-item.active,.main-pos-category-item.active,.main-pos-crumb.active,.shop-category-item.active{background:var(--pm-surface-2);color:var(--pm-ink-1);font-weight:var(--pm-weight-strong)} .pm-category-item.is-active::before,.pm-category-item.active::before,.cat-item.active::before,.main-pos-category-item.active::before,.main-pos-crumb.active::before,.shop-category-item.active::before{content:"";width:2px;height:16px;border-radius:1px;background:var(--pm-ink-1);flex-shrink:0;margin-left:-6px;margin-right:-4px} .pm-category-count,.cat-count{margin-left:auto;font-size:var(--pm-font-xs);color:var(--pm-ink-4)} .pm-category-item .dot,.cat-item .dot,.main-pos-category-item .dot,.main-pos-crumb .dot{display:none}
.pm-filter-chip,.chip,.pm-list-filter-chip,.shop-filter-chip{min-height:var(--pm-control-height-compact);padding:0 12px;border-radius:999px;border:1px solid transparent;background:var(--pm-surface-2);color:var(--pm-ink-2);font-size:var(--pm-font-sm);font-weight:var(--pm-weight-strong);display:inline-flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap;transition:background var(--pm-transition),color var(--pm-transition),border-color var(--pm-transition)} .pm-filter-chip:hover,.chip:hover,.pm-list-filter-chip:hover,.shop-filter-chip:hover{background:var(--pm-surface-3);color:var(--pm-ink-1)} .pm-filter-chip.is-active,.pm-filter-chip.active,.chip.active,.pm-list-filter-chip.active,.shop-filter-chip.active{background:var(--pm-ink-1);color:var(--pm-white);border-color:var(--pm-ink-1)} .pm-filter-chip.is-outline-active,.chip.active-outline{background:var(--pm-white);color:var(--pm-ink-1);border-color:var(--pm-ink-1)}
.pm-product-card,.product-card,.main-pos-card,.main-pos-product-card,.shop-product-card{background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);overflow:hidden;transition:box-shadow var(--pm-transition),border-color var(--pm-transition)} .pm-product-card:hover,.product-card:hover,.main-pos-card:hover,.main-pos-product-card:hover,.shop-product-card:hover{box-shadow:var(--pm-shadow-soft);border-color:var(--pm-border-strong)} .pm-product-img,.product-img,.main-pos-product-image,.shop-product-image{background:var(--pm-surface-2);color:var(--pm-ink-4);position:relative} .pm-product-oos,.product-oos,.main-pos-oos-badge,.shop-oos-badge{background:rgba(17,17,17,.76);color:var(--pm-white);border-radius:4px;padding:2px 7px;font-size:var(--pm-font-xs);font-weight:var(--pm-weight-normal)} .pm-variant-chip,.variant-chip,.pm-option-btn,.main-pos-card-chip,.main-pos-options-chip{min-height:24px;padding:0 9px;border-radius:4px;border:1px solid var(--pm-border);background:var(--pm-surface-2);color:var(--pm-ink-2);font-size:var(--pm-font-xs);font-weight:var(--pm-weight-strong);display:inline-flex;align-items:center;gap:4px;transition:background var(--pm-transition),color var(--pm-transition),border-color var(--pm-transition)} .pm-variant-chip:hover,.variant-chip:hover,.pm-option-btn:hover,.main-pos-card-chip:hover,.main-pos-options-chip:hover{background:var(--pm-surface-3)} .pm-variant-chip.is-active,.pm-variant-chip.active,.variant-chip.active,.pm-option-btn.active,.main-pos-card-chip.active,.main-pos-options-chip.active{background:var(--pm-ink-1);color:var(--pm-white);border-color:var(--pm-ink-1)}
/* Buttons */
.pm-btn,.btn,.pm-action-btn,.pm-list-btn,.shop-btn{min-height:var(--pm-control-height);padding:0 16px;border-radius:var(--pm-control-radius);border:1px solid var(--pm-border);background:var(--pm-white);color:var(--pm-ink-1);font-size:var(--pm-font-base);font-weight:var(--pm-weight-strong);line-height:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;transition:background var(--pm-transition),color var(--pm-transition),border-color var(--pm-transition),opacity var(--pm-transition)} .pm-btn svg,.btn svg,.pm-action-btn svg,.pm-list-btn svg,.shop-btn svg{width:17px;height:17px;flex-shrink:0} .pm-btn:hover,.btn:hover,.pm-action-btn:hover,.pm-list-btn:hover,.shop-btn:hover{background:var(--pm-surface-2);border-color:var(--pm-border-strong)} .pm-btn:focus-visible,.btn:focus-visible,.pm-action-btn:focus-visible,.pm-list-btn:focus-visible,.shop-btn:focus-visible{outline:none;box-shadow:var(--pm-focus-ring)} .pm-btn:disabled,.btn:disabled,.pm-action-btn:disabled,.pm-list-btn:disabled,.shop-btn:disabled{opacity:.4;pointer-events:none} .pm-btn--sm,.btn-sm,.pm-list-btn-sm{min-height:var(--pm-control-height-compact);padding:0 10px;border-radius:var(--pm-control-radius-compact);font-size:var(--pm-font-sm)} .pm-btn--full,.btn-fw{width:100%}
.pm-btn--green,.btn-green,.pm-list-btn-primary,.pm-retail-action-addProduct,.shop-add-cart,.shop-checkout-primary{background:var(--pm-green);border-color:var(--pm-green);color:var(--pm-white)} .pm-btn--green:hover,.btn-green:hover,.pm-list-btn-primary:hover,.pm-retail-action-addProduct:hover,.shop-add-cart:hover,.shop-checkout-primary:hover{background:var(--pm-green-hover);border-color:var(--pm-green-hover)} .pm-btn--secondary,.btn-sec,.pm-btn--neutral,.pm-retail-action-backup,.pm-retail-action-importJson,.pm-retail-action-exportCsv,.pm-retail-action-importCsv{background:var(--pm-white);color:var(--pm-ink-1);border-color:var(--pm-border)} .pm-btn--secondary:hover,.btn-sec:hover,.pm-btn--neutral:hover{background:var(--pm-surface-2);border-color:var(--pm-border-strong)} .pm-btn--ghost,.btn-ghost{background:transparent;border-color:transparent;color:var(--pm-ink-2)} .pm-btn--ghost:hover,.btn-ghost:hover{background:var(--pm-surface-2);color:var(--pm-ink-1)} .pm-btn--blue,.btn-blue,.pm-list-btn-detail,.pm-uds-row-action{background:var(--pm-white);color:var(--pm-blue);border-color:var(--pm-border)} .pm-btn--blue:hover,.btn-blue:hover,.pm-list-btn-detail:hover,.pm-uds-row-action:hover{background:var(--pm-blue-tint);border-color:var(--pm-blue)} .pm-btn--teal,.btn-teal,.pm-finance-action{background:var(--pm-white);color:var(--pm-teal);border-color:var(--pm-border)} .pm-btn--teal:hover,.btn-teal:hover,.pm-finance-action:hover{background:var(--pm-teal-tint);border-color:var(--pm-teal)} .pm-btn--purple,.btn-purple,.pm-ai-action{background:var(--pm-white);color:var(--pm-purple);border-color:var(--pm-border)} .pm-btn--purple:hover,.btn-purple:hover,.pm-ai-action:hover{background:var(--pm-purple-tint);border-color:var(--pm-purple)} .pm-btn--purple.is-processing,.btn-purple.processing{background:var(--pm-purple-tint);color:var(--pm-purple);border-color:var(--pm-purple);opacity:.82;pointer-events:none} .pm-btn--orange,.btn-orange,.pm-authority-action{background:var(--pm-white);color:var(--pm-orange);border-color:var(--pm-border)} .pm-btn--orange:hover,.btn-orange:hover,.pm-authority-action:hover{background:var(--pm-orange-tint);border-color:var(--pm-orange)} .pm-btn--red,.btn-red,.pm-list-btn-danger,.pm-retail-action-logWastage,.main-pos-void-btn{background:var(--pm-white);color:var(--pm-red);border-color:var(--pm-border)} .pm-btn--red:hover,.btn-red:hover,.pm-list-btn-danger:hover,.pm-retail-action-logWastage:hover,.main-pos-void-btn:hover{background:var(--pm-red-tint);border-color:var(--pm-red)} .pm-btn--red-solid,.btn-red.solid{background:var(--pm-red);color:var(--pm-white);border-color:var(--pm-red)} .pm-btn--red-solid:hover,.btn-red.solid:hover{background:var(--pm-red-hover);border-color:var(--pm-red-hover)} .pm-btn--gold,.btn-gold,.pm-vip-action{background:var(--pm-white);color:var(--pm-gold);border-color:var(--pm-border)} .pm-btn--gold:hover,.btn-gold:hover,.pm-vip-action:hover{background:var(--pm-gold-tint);border-color:var(--pm-gold)}
.pm-icon-btn,.btn-icon,.pm-list-icon-btn,.main-pos-mobile-only{width:var(--pm-control-height);height:var(--pm-control-height);padding:0;border:none;border-radius:var(--pm-control-radius);background:transparent;color:var(--pm-ink-2);display:inline-flex;align-items:center;justify-content:center;transition:background var(--pm-transition),color var(--pm-transition)} .pm-icon-btn:hover,.btn-icon:hover,.pm-list-icon-btn:hover,.main-pos-mobile-only:hover{background:var(--pm-surface-2);color:var(--pm-ink-1)} .pm-icon-btn svg,.btn-icon svg,.pm-list-icon-btn svg{width:19px;height:19px} .pm-icon-btn--sm,.btn-icon.sm{width:var(--pm-control-height-compact);height:var(--pm-control-height-compact);border-radius:var(--pm-control-radius-compact)} .pm-icon-btn--green,.btn-icon-green{color:var(--pm-green)} .pm-icon-btn--green:hover,.btn-icon-green:hover{background:var(--pm-green-tint)} .pm-icon-btn--red,.btn-icon-red{color:var(--pm-red)} .pm-icon-btn--red:hover,.btn-icon-red:hover{background:var(--pm-red-tint)}
/* Cart, toolbar, tables, forms */
.pm-cart-panel,.cart-panel,.main-pos-cart-panel,.current-order,.shop-cart-panel{background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);overflow:hidden} .pm-cart-head,.cart-head{padding:12px 16px;border-bottom:1px solid var(--pm-border);display:flex;align-items:center;justify-content:space-between;gap:var(--pm-space-2)} .pm-cart-title,.cart-title{font-size:var(--pm-font-base);font-weight:var(--pm-weight-strong);color:var(--pm-ink-1)} .pm-cart-body,.cart-body{padding:12px 16px;display:flex;flex-direction:column;gap:10px} .pm-cart-foot,.cart-foot{padding:12px 16px;background:var(--pm-surface-2);border-top:1px solid var(--pm-border);display:flex;flex-direction:column;gap:var(--pm-space-2)} .pm-toolbar,.toolbar,.pm-list-toolbar,.retail-toolbar{display:flex;align-items:center;gap:6px;background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);padding:10px 14px;flex-wrap:wrap} .pm-toolbar-divider,.toolbar-div{width:1px;height:20px;background:var(--pm-border);margin:0 2px;flex-shrink:0} .pm-toolbar-spacer,.header-spacer{flex:1}
.pm-data-table,.data-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);overflow:hidden;font-size:var(--pm-font-sm)} .pm-data-table th,.data-table th{text-align:left;font-size:var(--pm-font-xs);font-weight:var(--pm-weight-strong);color:var(--pm-ink-3);text-transform:uppercase;letter-spacing:.07em;padding:9px 14px;background:var(--pm-surface-2);border-bottom:1px solid var(--pm-border)} .pm-data-table td,.data-table td{padding:11px 14px;border-bottom:1px solid var(--pm-border);color:var(--pm-ink-1);font-weight:var(--pm-weight-normal);vertical-align:middle} .pm-data-table tr:last-child td,.data-table tr:last-child td{border-bottom:none} .pm-data-table tr:hover td,.data-table tr:hover td{background:var(--pm-surface-2)} .pm-row-actions,.row-actions{display:flex;align-items:center;gap:2px;justify-content:flex-end} .pm-toggle-pill,.toggle-pill,.pm-list-status-toggle,.pm-list-online-toggle{min-height:22px;padding:0 9px;border-radius:999px;border:none;font-size:var(--pm-font-xs);font-weight:var(--pm-weight-strong);display:inline-flex;align-items:center;gap:4px} .pm-toggle-pill.is-online,.toggle-pill.online,.pm-list-online-toggle.online{background:var(--pm-green-tint);color:var(--pm-green)} .pm-toggle-pill.is-offline,.toggle-pill.offline,.pm-list-online-toggle.offline{background:var(--pm-surface-3);color:var(--pm-ink-3)} .pm-toggle-dot,.toggle-dot{width:5px;height:5px;border-radius:999px;background:currentColor}
.pm-modal,.modal{background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);overflow:hidden;max-width:520px} .pm-modal-head,.modal-head{padding:14px 20px;border-bottom:1px solid var(--pm-border);display:flex;align-items:center;justify-content:space-between} .pm-modal-title,.modal-title{font-size:var(--pm-font-md);font-weight:var(--pm-weight-strong);color:var(--pm-ink-1)} .pm-modal-body,.modal-body{padding:20px;display:flex;flex-direction:column;gap:14px} .pm-modal-foot,.modal-foot{padding:12px 20px;border-top:1px solid var(--pm-border);background:var(--pm-surface-2);display:flex;justify-content:flex-end;gap:8px} .pm-field,.field{display:flex;flex-direction:column;gap:6px} .pm-field-label,.field-label{font-size:var(--pm-font-sm);color:var(--pm-ink-2);font-weight:var(--pm-weight-normal)} .pm-field-hint,.field-hint{font-size:var(--pm-font-xs);color:var(--pm-ink-3)} .pm-field-error,.field-err{font-size:var(--pm-font-xs);color:var(--pm-red)} .pm-input-wrap,.input-wrap{position:relative;display:flex;align-items:center} .pm-input,.input,input.pm-input,select.pm-input,textarea.pm-input{width:100%;min-height:var(--pm-control-height);padding:0 12px;border:1px solid var(--pm-border);border-radius:var(--pm-control-radius);background:var(--pm-white);color:var(--pm-ink-1);font-size:var(--pm-font-base);font-weight:var(--pm-weight-normal);outline:none;transition:border-color var(--pm-transition),box-shadow var(--pm-transition),background var(--pm-transition)} .pm-input::placeholder,.input::placeholder{color:var(--pm-ink-4)} .pm-input:hover,.input:hover{border-color:var(--pm-ink-4)} .pm-input:focus,.input:focus{border-color:var(--pm-green);box-shadow:var(--pm-focus-ring)} .pm-input.is-error,.pm-input.error,.input.error{border-color:var(--pm-red)} .pm-input:disabled,.input:disabled{background:var(--pm-surface-2);color:var(--pm-ink-3)} .pm-search-pill,.input-pill{background:var(--pm-surface-2);border-color:transparent;border-radius:999px}
/* Badges, admin, mobile */
.pm-badge,.badge{display:inline-flex;align-items:center;gap:4px;min-height:20px;padding:0 8px;border-radius:999px;font-size:var(--pm-font-xs);font-weight:var(--pm-weight-strong);white-space:nowrap} .pm-badge-dot,.badge-dot{width:5px;height:5px;border-radius:999px;background:currentColor} .pm-badge--green,.bg-green{background:var(--pm-green-tint);color:var(--pm-green)} .pm-badge--red,.bg-red{background:var(--pm-red-tint);color:var(--pm-red)} .pm-badge--orange,.bg-orange{background:var(--pm-orange-tint);color:var(--pm-orange)} .pm-badge--neutral,.bg-neutral{background:var(--pm-surface-3);color:var(--pm-ink-2)} .pm-badge--dark,.bg-dark{background:var(--pm-ink-1);color:var(--pm-white)} .pm-badge--gold,.bg-gold{background:var(--pm-gold-tint);color:var(--pm-gold)} .pm-admin-card,.admin-card{background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);overflow:hidden} .pm-admin-head,.admin-head{padding:12px 18px;background:var(--pm-orange-tint);border-bottom:1px solid #F5DEC8;display:flex;align-items:center;gap:10px} .pm-admin-head-text,.admin-head-text{font-size:var(--pm-font-sm);color:var(--pm-orange);font-weight:var(--pm-weight-strong)} .pm-two-man-strip,.two-man-strip{display:flex;align-items:center;gap:8px;padding:9px 12px;background:var(--pm-surface-2);border:1px solid var(--pm-border);border-radius:var(--pm-control-radius);font-size:var(--pm-font-sm);color:var(--pm-ink-2)} .pm-mobile-header,.mobile-header{min-height:48px;background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);padding:0 12px;display:flex;align-items:center;gap:6px} .pm-mobile-icon,.m-icon{width:var(--pm-icon-button-mobile);height:var(--pm-icon-button-mobile);border:none;border-radius:var(--pm-control-radius-compact);background:transparent;color:var(--pm-ink-3);display:inline-flex;align-items:center;justify-content:center;position:relative;transition:background var(--pm-transition),color var(--pm-transition)} .pm-mobile-icon:hover,.m-icon:hover{background:var(--pm-surface-2);color:var(--pm-ink-1)} .pm-mobile-icon svg,.m-icon svg{width:18px;height:18px}
/* Receipts */
.pm-receipt{width:100%;max-width:360px;background:var(--pm-white);color:var(--pm-black);font-family:var(--pm-font-family);font-size:12px;font-weight:var(--pm-weight-normal);line-height:1.45} .pm-receipt-header{display:flex;align-items:center;justify-content:center;gap:8px;padding-bottom:10px;border-bottom:1px dashed var(--pm-border-strong);margin-bottom:10px} .pm-receipt-logo{width:30px;height:30px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;color:var(--pm-black)} .pm-receipt-brand{font-size:15px;font-weight:var(--pm-weight-strong);letter-spacing:.08em;text-transform:uppercase} .pm-receipt-store,.pm-receipt-meta,.pm-receipt-footer{text-align:center;color:var(--pm-ink-2);font-size:11px} .pm-receipt-section{padding:8px 0;border-bottom:1px dashed var(--pm-border-strong)} .pm-receipt-section-title{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--pm-ink-3);margin-bottom:6px} .pm-receipt-row{display:flex;justify-content:space-between;gap:12px;padding:2px 0} .pm-receipt-row--muted{color:var(--pm-ink-3)} .pm-receipt-row--discount .pm-receipt-value,.pm-receipt-row--discount span:last-child{color:var(--pm-red)} .pm-receipt-total{font-size:14px;font-weight:var(--pm-weight-strong)} @media print{.pm-receipt{max-width:none;color:#000;background:#fff} .pm-receipt *{color:#000!important;box-shadow:none!important}}
/* Online shop shared */
.pm-shop-shell{background:var(--pm-off-white);color:var(--pm-ink-1)} .pm-shop-header{background:var(--pm-white);border-bottom:1px solid var(--pm-border)} .pm-shop-hero{background:var(--pm-white);border:1px solid var(--pm-border);border-radius:var(--pm-card-radius);padding:32px} .pm-shop-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px} .pm-shop-cart-drawer{background:var(--pm-white);border-left:1px solid var(--pm-border);box-shadow:-2px 0 12px rgba(0,0,0,.08)}
@media(max-width:768px){.pm-shell-header,.header-shell{min-height:48px;border-radius:var(--pm-card-radius);padding:0 12px} .pm-main-tab-bar,.main-tab-bar{overflow-x:auto;padding:0 6px} .pm-main-tab,.main-tab,.tab{height:42px;padding:0 12px} .pm-btn,.btn,.pm-action-btn,.pm-list-btn,.shop-btn{min-height:40px;padding:0 14px} .pm-auth-card{width:min(100%,340px);padding:22px} .pm-auth-key{height:50px}}

/* ═══════════════════════════════════════════════
   CDBT18 2c9a — Token Cascade Lock
   Reason: legacy styles.css / peppermall-universal.css carried old tokens:
   old in-between weight and old green/red palette values.
   This block intentionally locks the source-led design-system tokens.
   It is still CSS-only and source-led: no runtime finalizer, no JS, no inline DOM styling.
═══════════════════════════════════════════════ */
:root,
html:root {
  --pm-design-system-version: "2.1-p2.11.7n7_2c9d" !important;
  --pm-design-system-mode: "source-led-component-system-token-locked-no-finalizer" !important;

  --pm-weight-normal: 300 !important;
  --pm-weight-strong: 400 !important;

  --pm-green: #3B6D11 !important;
  --pm-green-hover: #4A7F1B !important;
  --pm-green-tint: #EAF3DE !important;

  --pm-yellow: #B38A00 !important;
  --pm-yellow-hover: #C99D06 !important;
  --pm-yellow-tint: #FFFBE6 !important;

  --pm-orange: #B55A10 !important;
  --pm-orange-hover: #C96A1E !important;
  --pm-orange-tint: #FFF0E6 !important;

  --pm-red: #A32D2D !important;
  --pm-red-hover: #B83A3A !important;
  --pm-red-tint: #FCEBEB !important;

  --pm-purple: #534AB7 !important;
  --pm-purple-hover: #6258CB !important;
  --pm-purple-tint: #EEEDFE !important;

  --pm-blue: #185FA5 !important;
  --pm-blue-hover: #2471BD !important;
  --pm-blue-tint: #E6F1FB !important;

  --pm-teal: #0F6E56 !important;
  --pm-teal-hover: #168565 !important;
  --pm-teal-tint: #E1F5EE !important;

  --pm-gold: #B8860B !important;
  --pm-gold-hover: #C99518 !important;
  --pm-gold-tint: #FDF6E3 !important;

  --pm-neutral: #444441 !important;
  --pm-neutral-hover: #565651 !important;
  --pm-neutral-tint: #F4F4F4 !important;
}

/* Production weight lock: only 300 and 400 are allowed in the source-led system. */
html,
body,
.pm-field-label,
.pm-field-hint,
.pm-field-error,
.pm-helper,
.pm-caption,
.pm-meta,
.pm-receipt,
.pm-receipt-store,
.pm-receipt-meta,
.pm-receipt-footer,
.pm-category-item,
.cat-item,
.main-pos-category-item,
.main-pos-crumb,
.shop-category-item,
.pm-data-table td,
.data-table td,
.pm-input,
.input,
input,
select,
textarea {
  font-weight: 300 !important;
}

button,
.pm-btn,
.btn,
.pm-action-btn,
.pm-list-btn,
.shop-btn,
.pm-main-tab,
.main-tab,
.tab,
.pm-sub-tab,
.sub-tab,
.pm-list-tab,
.pm-filter-chip,
.chip,
.pm-list-filter-chip,
.shop-filter-chip,
.pm-variant-chip,
.variant-chip,
.pm-option-btn,
.main-pos-card-chip,
.main-pos-options-chip,
.pm-auth-key,
.pm-auth-btn,
.pm-header-logout,
.mobile-logout-btn,
.h-logout,
.pm-brand-name,
.pm-receipt-brand,
.pm-receipt-total,
.pm-page-title,
.pm-section-title,
.pm-card-title,
.pm-modal-title,
.pm-data-table th,
.data-table th,
.pm-badge,
.badge {
  font-weight: 400 !important;
}

/* Legacy direct colour repair for known pre-2c9 selectors. */
.main-pos-crumb.active,
.main-pos-category-item.active,
.pm-category-item.active,
.cat-item.active {
  color: var(--pm-ink-1) !important;
  border-bottom-color: transparent !important;
}

.pm-list-btn-primary,
.pm-retail-action-addProduct,
.pm-btn--green,
.btn-green,
.shop-add-cart,
.shop-checkout-primary {
  background: var(--pm-green) !important;
  border-color: var(--pm-green) !important;
  color: var(--pm-white) !important;
}

.pm-list-btn-danger,
.pm-retail-action-logWastage,
.main-pos-void-btn,
.pm-btn--red,
.btn-red {
  color: var(--pm-red) !important;
  border-color: var(--pm-border) !important;
}

.pm-btn--teal,
.btn-teal,
.pm-finance-action {
  color: var(--pm-teal) !important;
}

.pm-btn--purple,
.btn-purple,
.pm-ai-action {
  color: var(--pm-purple) !important;
}



/* ═══════════════════════════════════════════════
   CDBT18 2c9c — Source-Led Component Hook Implementation
   This is not a global finalizer. These are static component hooks for live source classes.
   Scope: auth, header utilities, main POS payment/cart, retail modals/toolbars,
   accounting/admin/staff/task portal modules, receipts and shared list renderer.
═══════════════════════════════════════════════ */
:root,
html:root {
  --pm-design-system-version: "2.1-p2.11.7n7_2c9d" !important;
  --pm-design-system-mode: "source-led-component-hooks-no-finalizer" !important;
  --primary: var(--pm-green) !important;
  --success: var(--pm-green) !important;
  --danger: var(--pm-red) !important;
  --warning: var(--pm-orange) !important;
  --text: var(--pm-ink-1) !important;
  --text-muted: var(--pm-ink-3) !important;
  --tab-bg: var(--pm-surface-2) !important;
  --surface: var(--pm-white) !important;
  --bg: var(--pm-off-white) !important;
}

/* Auth source hooks */
#loginScreen.pm-auth-shell,
#loginScreen {
  min-height:100vh !important;
  background:var(--pm-off-white) !important;
  display:flex;
  align-items:center !important;
  justify-content:center !important;
  padding:24px !important;
}

/* 2c9d auth visibility gate:
   Do not let source-led auth visual CSS override app-auth/core login state.
   bootWorkspace() hides #loginScreen with inline display:none after successful login/2FA.
   This rule guarantees the hidden state wins while keeping the lock screen visible on logout/startup. */
#loginScreen[style*="display: none"],
#loginScreen[style*="display:none"] {
  display:none !important;
}
.login-box.pm-auth-card,
#loginScreen .login-box {
  width:min(100%,440px) !important;
  background:var(--pm-white) !important;
  border:1px solid var(--pm-border) !important;
  border-radius:18px !important;
  box-shadow:0 18px 55px rgba(17,24,39,.10) !important;
  padding:34px !important;
}
.pm-auth-brand--logo-left { justify-content:flex-start !important; margin-bottom:24px !important; }
#loginScreen .pm-brand-logo { width:38px !important; height:38px !important; background:transparent !important; border-radius:8px !important; }
#loginScreen .pm-brand-name { font-size:18px !important; letter-spacing:.09em !important; font-weight:400 !important; }
#loginScreen .pm-brand-context { font-size:12px !important; letter-spacing:.14em !important; color:var(--pm-ink-3) !important; }
#loginScreen .auth-input,
#loginScreen .pm-input {
  width:100% !important;
  min-height:48px !important;
  border:1px solid var(--pm-border) !important;
  background:var(--pm-surface-2) !important;
  border-radius:8px !important;
  color:var(--pm-ink-1) !important;
  font-size:16px !important;
  font-weight:300 !important;
  padding:0 14px !important;
  margin-bottom:12px !important;
}
#loginScreen .auth-input:focus { border-color:var(--pm-green) !important; box-shadow:var(--pm-focus-ring) !important; background:var(--pm-white) !important; }
#loginScreen .pm-auth-btn,
#loginScreen .btn-auth {
  width:100% !important;
  min-height:48px !important;
  border-radius:8px !important;
  border:1px solid var(--pm-border) !important;
  font-size:16px !important;
  font-weight:400 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
}
#loginScreen .pm-auth-btn--next { background:var(--pm-green) !important; color:var(--pm-white) !important; border-color:var(--pm-green) !important; }
#loginScreen .pm-auth-btn--fob { background:var(--pm-surface-2) !important; color:var(--pm-ink-1) !important; border-color:transparent !important; }
#loginScreen .pm-auth-btn--back { background:transparent !important; color:var(--pm-ink-2) !important; border-color:transparent !important; }
#loginScreen .numpad.pm-auth-keypad,
#loginScreen .numpad { display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:10px !important; margin:14px 0 !important; }
#loginScreen .numpad-btn,
#loginScreen .pm-auth-key {
  min-height:54px !important;
  border-radius:8px !important;
  border:1px solid var(--pm-border) !important;
  background:var(--pm-surface-2) !important;
  color:var(--pm-ink-1) !important;
  font-size:18px !important;
  font-weight:400 !important;
}
#loginScreen .pm-auth-key--delete { color:var(--pm-red) !important; }
#loginScreen .pm-auth-key--tick { background:var(--pm-green) !important; color:var(--pm-white) !important; border-color:var(--pm-green) !important; }


/* CDBT19 2c9f auth brand center + logo visibility + button gap fix.
   Corrects 2c9e target after browser HOLD/user visual confirmation:
   the brand group must be centered in the auth card, while the logo remains left of PEPPERMALL POS.
   CSS-only/root-only refinement from 2c9e/2c9d.
   Keeps the 2c9d hidden-state auth gate above; no app-auth logic, no finalizer, no global scanner. */
#loginScreen .login-box.pm-auth-card,
#loginScreen .login-box {
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
}
#loginScreen .pm-auth-brand.pm-auth-brand--logo-left {
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  align-self:center !important;
  width:max-content !important;
  max-width:100% !important;
  gap:12px !important;
  margin:0 auto 28px auto !important;
  text-align:left !important;
}
#loginScreen .pm-auth-brand.pm-auth-brand--logo-left .pm-brand-logo {
  order:0 !important;
  flex:0 0 38px !important;
  width:38px !important;
  min-width:38px !important;
  max-width:38px !important;
  height:38px !important;
  min-height:38px !important;
  max-height:38px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  background:transparent !important;
  border-radius:8px !important;
}
#loginScreen .pm-auth-brand.pm-auth-brand--logo-left .pm-brand-logo img {
  display:block !important;
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  min-height:38px !important;
  object-fit:contain !important;
  opacity:1 !important;
  visibility:visible !important;
}
#loginScreen .pm-auth-brand.pm-auth-brand--logo-left .pm-brand-copy {
  order:1 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
  text-align:left !important;
  min-width:0 !important;
  line-height:1.05 !important;
}
#loginScreen .pm-auth-brand.pm-auth-brand--logo-left .pm-brand-name {
  display:block !important;
  white-space:nowrap !important;
  text-align:left !important;
}
#loginScreen .pm-auth-brand.pm-auth-brand--logo-left .pm-brand-context {
  display:block !important;
  align-self:flex-end !important;
  width:auto !important;
  text-align:right !important;
  margin-top:3px !important;
  line-height:1 !important;
}
#loginScreen #authStep1 {
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  width:100% !important;
}
#loginScreen #authStep1 form {
  display:flex !important;
  flex-direction:column !important;
  gap:0 !important;
  margin:0 !important;
  width:100% !important;
}
#loginScreen #authStep1 .pm-auth-btn--next {
  margin:0 !important;
}
#loginScreen #authStep1 .pm-auth-btn--fob {
  margin:0 !important;
}
@media(max-width:420px) {
  #loginScreen .pm-auth-brand.pm-auth-brand--logo-left {
    gap:10px !important;
    margin-bottom:24px !important;
  }
  #loginScreen .pm-auth-brand.pm-auth-brand--logo-left .pm-brand-name {
    font-size:16px !important;
    letter-spacing:.075em !important;
  }
  #loginScreen .pm-auth-brand.pm-auth-brand--logo-left .pm-brand-context {
    font-size:11px !important;
  }
}

/* Header + shell utilities */
header { background:var(--pm-white) !important; border-bottom:1px solid var(--pm-border) !important; }
.header-left { display:flex !important; align-items:center !important; gap:10px !important; }
.brand-text { font-weight:400 !important; letter-spacing:.09em !important; }
.pm-header-task-btn { width:var(--pm-icon-button) !important; height:var(--pm-icon-button) !important; border:0 !important; background:transparent !important; border-radius:7px !important; color:var(--pm-ink-3) !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; }
.pm-header-task-btn:hover { background:var(--pm-surface-2) !important; color:var(--pm-ink-1) !important; }
.pm-header-search-input { background:var(--pm-surface-2) !important; border:1px solid transparent !important; border-radius:8px !important; min-height:36px !important; font-weight:300 !important; }

/* Standard button aliases for current source classes */
.pm-btn.primary,
.pm-btn.success,
.pm-btn.pm-btn--green,
.pm-list-btn-success,
.pm-list-btn-primary,
button.pm-action-positive,
.pm-pos-payment-btn,
.pm-main-positive,
.pm-modal-save,
.pm-task-primary { background:var(--pm-green) !important; border-color:var(--pm-green) !important; color:var(--pm-white) !important; }
.pm-btn.primary:hover,.pm-btn.success:hover,.pm-btn.pm-btn--green:hover,.pm-list-btn-success:hover,.pm-list-btn-primary:hover,.pm-pos-payment-btn:hover,.pm-main-positive:hover,.pm-modal-save:hover,.pm-task-primary:hover { background:var(--pm-green-hover) !important; border-color:var(--pm-green-hover) !important; }
.pm-btn.secondary,
.pm-btn.pm-btn--neutral,
.pm-list-btn-light,
.pm-list-btn-secondary,
.pm-modal-cancel,
.pm-task-neutral { background:var(--pm-white) !important; color:var(--pm-ink-1) !important; border-color:var(--pm-border) !important; }
.pm-btn.secondary:hover,.pm-list-btn-light:hover,.pm-list-btn-secondary:hover,.pm-modal-cancel:hover,.pm-task-neutral:hover { background:var(--pm-surface-2) !important; border-color:var(--pm-border-strong) !important; }
.pm-btn.ghost,
.pm-btn.pm-btn--ghost { background:transparent !important; color:var(--pm-ink-2) !important; border-color:transparent !important; }
.pm-btn.danger,
.pm-btn.pm-btn--red,
.pm-list-btn-danger,
.pm-retail-delete-x-btn,
.pm-action-danger { background:var(--pm-white) !important; color:var(--pm-red) !important; border-color:var(--pm-border) !important; }
.pm-btn.danger:hover,.pm-list-btn-danger:hover,.pm-retail-delete-x-btn:hover,.pm-action-danger:hover { background:var(--pm-red-tint) !important; border-color:var(--pm-red) !important; }
.pm-btn--red-solid,
.pm-action-danger-solid,
.main-pos-void-btn,
.pm-wastage-final-btn { background:var(--pm-red) !important; color:var(--pm-white) !important; border-color:var(--pm-red) !important; }
.pm-btn--teal,
.pm-finance-action,
.main-pos-promo-apply { background:var(--pm-white) !important; color:var(--pm-teal) !important; border-color:var(--pm-border) !important; }
.pm-btn--teal:hover,.pm-finance-action:hover,.main-pos-promo-apply:hover { background:var(--pm-teal-tint) !important; border-color:var(--pm-teal) !important; }
.pm-btn--blue,.pm-integration-action { background:var(--pm-blue) !important; color:var(--pm-white) !important; border-color:var(--pm-blue) !important; }
.pm-btn--purple,.pm-ai-action { background:var(--pm-purple) !important; color:var(--pm-white) !important; border-color:var(--pm-purple) !important; }
.pm-btn--orange,.pm-authority-action { background:var(--pm-orange) !important; color:var(--pm-white) !important; border-color:var(--pm-orange) !important; }

/* Main POS */
.main-pos-payment-grid { display:grid !important; grid-template-columns:1fr 1fr !important; gap:10px !important; }
.main-pos-payment-grid .pm-pos-payment-btn { min-height:44px !important; }
.main-pos-promo-row .main-pos-promo-apply { min-height:40px !important; }
.main-pos-void-btn { width:100% !important; min-height:44px !important; margin-top:8px !important; }
.main-pos-card-chip.main-pos-options-chip { min-height:30px !important; height:30px !important; background:var(--pm-white) !important; color:var(--pm-ink-1) !important; border-color:var(--pm-border) !important; box-shadow:var(--pm-shadow-card) !important; }
.main-pos-variant-submit { width:100% !important; }
.main-pos-variant-stepper button { width:40px !important; height:40px !important; border-radius:8px !important; border:1px solid var(--pm-border) !important; background:var(--pm-white) !important; }
.main-pos-variant-stepper input { min-height:40px !important; border:1px solid var(--pm-border) !important; border-radius:8px !important; background:var(--pm-surface-2) !important; text-align:center !important; }

/* Segmented tabs and module panels */
.seg-container,.pm-module-tabs,.pm-admin-tabs,.pm-accounting-tabs,.pm-staff-tabs { display:flex !important; gap:2px !important; background:var(--pm-surface-2) !important; border-radius:8px !important; padding:4px !important; }
.seg-btn,.pm-module-tab { min-height:40px !important; background:transparent !important; border:0 !important; border-radius:6px !important; color:var(--pm-ink-2) !important; font-weight:300 !important; }
.seg-btn.active,.pm-module-tab.active { background:var(--pm-green) !important; color:var(--pm-white) !important; font-weight:400 !important; }
.card,.pm-card { background:var(--pm-white) !important; border:1px solid var(--pm-border) !important; border-radius:10px !important; box-shadow:var(--pm-shadow-card) !important; }
.pm-dashboard-kpi,.pm-kpi-card { background:var(--pm-white) !important; border:1px solid var(--pm-border) !important; border-radius:10px !important; padding:16px !important; }
.pm-kpi-card--dark { background:var(--pm-ink-1) !important; color:var(--pm-white) !important; }
.pm-page-shell { padding:16px !important; }

/* Accounting/admin/staff settings hooks */
.pm-accounting-action-bar,.pm-admin-action-bar,.pm-settings-action-bar { display:flex !important; gap:8px !important; align-items:center !important; flex-wrap:wrap !important; }
button[onclick*="printBatchPayslips"],button[onclick*="showYearEndSummary"],button[onclick*="saveExpense"],button[onclick*="submitZRead"],button[onclick*="updateStaffRevenueSettings"] { min-height:40px !important; border-radius:8px !important; border:1px solid var(--pm-border) !important; font-weight:400 !important; }
button[onclick*="runBulkPayroll"],button[onclick*="saveCampaign"],button[onclick*="Save Customer"],button[onclick*="saveCustomer"],button[onclick*="saveExpense"],button[onclick*="submitZRead"] { background:var(--pm-green) !important; color:var(--pm-white) !important; border-color:var(--pm-green) !important; }
button[onclick*="saveStripeKey"],button[onclick*="connectAndRefresh"],button[onclick*="testPrintReceipt"],button[onclick*="saveGoogleKey"],button[onclick*="peppermall_google_api_key"],button[onclick*="saveAISettings"],button[onclick*="peppermall_vapid_public_key"],button[onclick*="Save VAPID"] { min-height:40px !important; border-radius:8px !important; font-weight:400 !important; background:var(--pm-blue) !important; color:var(--pm-white) !important; border:1px solid var(--pm-blue) !important; }
button[onclick*="saveAISettings"] { background:var(--pm-purple) !important; border-color:var(--pm-purple) !important; }
button[onclick*="Save Board Code"],button[onclick*="peppermall_board_auth_code"],button[onclick*="removeStripeKey"],button[onclick*="disconnectThermalPrinter"] { min-height:40px !important; border-radius:8px !important; font-weight:400 !important; color:var(--pm-red) !important; background:var(--pm-white) !important; border:1px solid var(--pm-red) !important; }

/* Retail source hooks */
.retail-row-actions,.pmr-row-actions,.pm-row-actions { display:flex !important; align-items:center !important; gap:6px !important; }
.pm-retail-action-addProduct,.retail-op-btn-success,.retail-op-btn-primary { background:var(--pm-green) !important; color:var(--pm-white) !important; border-color:var(--pm-green) !important; }
.pm-retail-action-logWastage,.pm-wastage-add-btn,.pm-wastage-final-btn { background:var(--pm-red) !important; color:var(--pm-white) !important; border-color:var(--pm-red) !important; }
.pm-retail-action-stockTake,.pm-retail-action-purchaseOrders,.pm-retail-action-recallHold,.pm-retail-action-backup,.pm-retail-action-importJson,.pm-retail-action-exportCsv,.pm-retail-action-importCsv { background:var(--pm-white) !important; color:var(--pm-ink-1) !important; border-color:var(--pm-border) !important; }
.pm-list-table-wrap,.pm-table-wrap { border:1px solid var(--pm-border) !important; border-radius:10px !important; overflow:hidden !important; background:var(--pm-white) !important; }
.pm-list-table,.pm-table,.pm-data-table { border-collapse:separate !important; border-spacing:0 !important; }
.pm-list-table th,.pm-table th,.pm-data-table th { background:var(--pm-surface-2) !important; color:var(--pm-ink-2) !important; font-weight:400 !important; }
.pm-list-table td,.pm-table td,.pm-data-table td { font-weight:300 !important; border-bottom:1px solid var(--pm-border) !important; }
.pm-list-filter-rail,.pm-filter-rail { background:var(--pm-white) !important; border:1px solid var(--pm-border) !important; border-radius:10px !important; }
.pm-list-filter-chip.active,.pm-filter-chip.active { background:var(--pm-green-tint) !important; color:var(--pm-green) !important; }

/* Task / key / shared utility modals */
.pm-key-modal-card,.pm-task-modal-card { background:var(--pm-white) !important; border:1px solid var(--pm-border) !important; border-radius:18px !important; box-shadow:0 18px 60px rgba(17,24,39,.18) !important; }
.pm-key-id-card { background:var(--pm-surface-2) !important; border:1px solid var(--pm-border) !important; border-radius:10px !important; min-height:180px !important; display:flex !important; align-items:center !important; justify-content:center !important; }
.pm-task-pending-card { border:1px solid var(--pm-red) !important; border-radius:10px !important; background:var(--pm-white) !important; }
.pm-task-done-btn { background:var(--pm-green) !important; color:var(--pm-white) !important; }
.pm-task-close-btn { background:var(--pm-surface-2) !important; color:var(--pm-ink-1) !important; }

/* Modal/layout normalization */
.pm-modal-card,.pm-universal-modal,.main-pos-variant-modal,.retail-modal,.retail-modal-card { background:var(--pm-white) !important; border:1px solid var(--pm-border) !important; border-radius:14px !important; box-shadow:0 20px 70px rgba(17,24,39,.18) !important; }
.pm-modal-card input,.pm-modal-card select,.pm-modal-card textarea,.retail-modal input,.retail-modal select,.retail-modal textarea,.pm-universal-modal input,.pm-universal-modal select,.pm-universal-modal textarea { border:1px solid var(--pm-border) !important; background:var(--pm-surface-2) !important; border-radius:8px !important; min-height:40px !important; font-weight:300 !important; }
.pm-modal-card .pm-btn,.retail-modal .pm-btn,.pm-universal-modal .pm-btn { min-height:40px !important; border-radius:8px !important; font-weight:400 !important; }

/* Receipt refinements */
.receipt-modal .receipt-paper,.receipt-paper,.pm-receipt { border-radius:8px !important; }
.pm-receipt-brand,.receipt-paper h1,.receipt-paper h2 { letter-spacing:.12em !important; font-weight:400 !important; }
.receipt-print-primary,.receipt-print-btn { background:var(--pm-green) !important; color:var(--pm-white) !important; border-color:var(--pm-green) !important; }

@media(max-width:768px) {
  #loginScreen .login-box { width:min(100%,360px) !important; padding:24px !important; }
  .main-pos-payment-grid { grid-template-columns:1fr 1fr !important; }
  .seg-container,.pm-module-tabs { overflow-x:auto !important; }
}


/* CDBT19 2C9I — Cross-cutting foundation fixes: central list hygiene only. */
:root { --pm-design-system-version: "2.1-p2.11.7n7_2c9i" !important; }
.pm-list-selection-empty { display:none !important; }
.pm-list-btn:empty, .pm-list-toolbar-actions button:empty { display:none !important; }
.pm-list-icon-only-detail { min-width:40px; width:40px; padding:0 !important; }
.pm-list-icon-only-detail .pm-list-btn-text { display:none !important; }
.pm-list-tabs .pm-list-tab.active,
.pm-list-tab.active,
.pm-sub-tab.active,
.sub-tab.active {
    color:var(--pm-green) !important;
    box-shadow:inset 0 -3px 0 var(--pm-green), var(--pm-shadow-card) !important;
}
.pm-list-chip { border:1px solid transparent !important; }
.pm-list-chip.success,
.pm-list-chip.green,
.pm-list-chip[data-pm-status="restocked"],
.pm-list-chip[data-pm-status="received"],
.pm-list-chip[data-pm-status="resolved"] { background:var(--pm-green-tint) !important; color:var(--pm-green) !important; border-color:rgba(59,109,17,.22) !important; }
.pm-list-chip.warning,
.pm-list-chip.amber,
.pm-list-chip[data-pm-status="wastage"],
.pm-list-chip[data-pm-status="medium"],
.pm-list-chip[data-pm-status="hold"],
.pm-list-chip[data-pm-status="scheduled"],
.pm-list-chip[data-pm-status="draft"] { background:var(--pm-orange-tint) !important; color:var(--pm-orange) !important; border-color:rgba(181,90,16,.22) !important; }
.pm-list-chip.danger,
.pm-list-chip.red,
.pm-list-chip[data-pm-status="critical"],
.pm-list-chip[data-pm-status="cancelled"],
.pm-list-chip[data-pm-status="canceled"],
.pm-list-chip[data-pm-status="removed"] { background:var(--pm-red-tint) !important; color:var(--pm-red) !important; border-color:rgba(163,45,45,.22) !important; }
.pm-list-chip.info,
.pm-list-chip.blue,
.pm-list-chip[data-pm-status="ordered"],
.pm-list-chip[data-pm-status="under_review"],
.pm-list-chip[data-pm-status="pending_inspection"] { background:var(--pm-blue-tint) !important; color:var(--pm-blue) !important; border-color:rgba(24,95,165,.22) !important; }
.pm-list-chip.neutral,
.pm-list-chip.grey,
.pm-list-chip[data-pm-status="unknown"] { background:var(--pm-surface-2) !important; color:var(--pm-ink-2) !important; border-color:var(--pm-border) !important; }
.pm-retail-action-logWastage.pm-list-btn-danger,
.pm-retail-action-logWastage { background:var(--pm-white) !important; color:var(--pm-ink-1) !important; border-color:var(--pm-border) !important; }
.pm-retail-action-logWastage:hover { background:var(--pm-surface-2) !important; border-color:var(--pm-border-strong) !important; }


/* CDBT19 2C9I-A — Header brand lock + Retail Wastage toolbar label repair.
   Narrow source-led CSS only. Does not touch auth brand, DB, storage, RLS, or enforcement. */
:root { --pm-design-system-version: "2.1-p2.11.7n7_2c9i_a" !important; }

/* Lock the main app header brand so later component styling cannot alter typeface/colour. */
.pm-shell-header .header-left.pm-brand .brand-text,
header .header-left.pm-brand .brand-text,
#mainAppWrapper .header-left.pm-brand .brand-text {
  color: var(--pm-ink-1) !important;
  font-family: var(--pm-font-family) !important;
  font-size: 20px !important;
  font-weight: var(--pm-weight-strong) !important;
  letter-spacing: .09em !important;
  line-height: 1.05 !important;
  text-transform: uppercase !important;
}

/* Keep the sub-brand/strapline green and separate from the locked brand name. */
.pm-shell-header .header-left.pm-brand .brand-text + span,
header .header-left.pm-brand .brand-text + span,
#mainAppWrapper .header-left.pm-brand .brand-text + span {
  color: var(--pm-green) !important;
  font-family: var(--pm-font-family) !important;
}

/* Wastage is a navigation/stock-management entry point here, not an irreversible destructive button. */
.pm-retail-action-logWastage,
.pm-retail-action-logWastage.pm-list-btn,
.pm-retail-action-logWastage.pm-list-btn-danger {
  min-width: 112px !important;
  background: var(--pm-white) !important;
  color: var(--pm-ink-1) !important;
  border-color: var(--pm-border) !important;
}
.pm-retail-action-logWastage .pm-list-btn-text,
.pm-retail-action-logWastage .pm-retail-wastage-label-lock {
  display: inline-flex !important;
  align-items: center !important;
  color: var(--pm-ink-1) !important;
  opacity: 1 !important;
  visibility: visible !important;
  max-width: none !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  white-space: nowrap !important;
}
.pm-retail-action-logWastage svg,
.pm-retail-action-logWastage .pm-list-icon {
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: var(--pm-ink-1) !important;
}
.pm-retail-action-logWastage:hover {
  background: var(--pm-surface-2) !important;
  border-color: var(--pm-border-strong) !important;
  color: var(--pm-ink-1) !important;
}


/* CDBT19 2C9J — Retail Inventory completion, source-led and read-only. */
:root { --pm-design-system-version: "2.1-p2.11.7n7_2c9o_b_a_a" !important; }
.pm-retail-inventory-summary {
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  margin:10px 0 8px; padding:10px 12px; border:1px solid var(--pm-border);
  border-radius:10px; background:var(--pm-white); color:var(--pm-ink-2); font-size:12px; font-weight:300;
}
.pm-retail-inventory-summary strong { color:var(--pm-ink-1); font-weight:400; }
.pm-retail-inventory-summary .pm-retail-summary-metric { display:inline-flex; align-items:center; gap:4px; margin-right:12px; white-space:nowrap; }
.pm-retail-active-filter-chips { display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin:0 0 10px; }
.pm-retail-inventory-filter-chip {
  display:inline-flex; align-items:center; gap:6px; min-height:26px; padding:0 8px; border:1px solid var(--pm-border);
  border-radius:999px; background:var(--pm-surface-2); color:var(--pm-ink-1); font-size:12px; font-weight:300; text-decoration:none;
}
.pm-retail-inventory-filter-chip button { border:0; background:transparent; color:var(--pm-ink-3); cursor:pointer; padding:0 2px; font:inherit; }
.pm-retail-clear-filters { color:var(--pm-green); font-size:12px; text-decoration:none; border:0; background:transparent; cursor:pointer; padding:0 4px; }
.pm-retail-supplier-guidance { padding:8px 10px; border:1px dashed var(--pm-border); border-radius:8px; color:var(--pm-ink-3); font-size:12px; line-height:1.35; background:var(--pm-surface-2); }
.pm-retail-category-compact { display:inline-block; max-width:170px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; }
.pm-retail-product-sku { color:var(--pm-ink-3); font-size:11px; margin-top:2px; }
.pm-retail-price-cost { color:var(--pm-ink-3); font-size:11px; margin-top:2px; }
.pm-retail-stock-health { display:inline-flex; align-items:center; gap:5px; font-weight:400; }
.pm-retail-stock-health.zero { color:var(--pm-red); }
.pm-retail-stock-health.low { color:var(--pm-orange); }
.pm-retail-stock-health.healthy { color:var(--pm-ink-1); }
.pm-retail-stock-health .ui-icon { width:14px; height:14px; }
.pm-retail-online-action.pm-list-btn { min-width:56px; width:auto; padding:0 8px !important; }
.pm-retail-online-action.online { color:var(--pm-green) !important; background:var(--pm-green-tint) !important; border-color:rgba(59,109,17,.24) !important; }
.pm-retail-online-action.offline { color:var(--pm-ink-3) !important; background:var(--pm-surface-2) !important; border-color:var(--pm-border) !important; }
.pm-retail-image-missing .pm-list-thumb { outline:1px dashed var(--pm-border-strong); background:var(--pm-surface-2); }
.pm-list-table th.pm-retail-col-category, .pm-list-table td.pm-retail-col-category { max-width:190px; width:160px; }
.pm-list-table th.pm-retail-col-actions, .pm-list-table td.pm-retail-col-actions { min-width:132px; width:132px; }
.pm-list-table th.pm-retail-col-barcode, .pm-list-table td.pm-retail-col-barcode { min-width:116px; }
@media(max-width:900px){
  .pm-retail-inventory-summary { align-items:flex-start; flex-direction:column; }
  .pm-retail-category-compact { max-width:140px; }
}


/* CDBT19 2C9J-A — Retail Inventory row action visibility repair.
   Keeps Edit + online/offline + More visible and prevents missing sprite icons
   from rendering blank action controls. */
.retail-inventory-2c9j .pm-list-table th.pm-retail-col-actions,
.retail-inventory-2c9j .pm-list-table td.pm-retail-col-actions,
.pm-list-table th.pm-retail-col-actions,
.pm-list-table td.pm-retail-col-actions {
  min-width: 168px !important;
  width: 168px !important;
  overflow: visible !important;
}
.retail-inventory-2c9j .pm-list-row-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  flex-wrap: nowrap !important;
  min-width: 150px !important;
  overflow: visible !important;
}
.retail-inventory-2c9j .pm-list-row-actions .pm-list-btn {
  flex: 0 0 auto !important;
}
.pm-retail-online-action.pm-list-btn {
  min-width: 58px !important;
  width: auto !important;
  padding: 0 8px !important;
  gap: 5px !important;
  color: var(--pm-ink-1) !important;
}
.pm-retail-online-action .pm-inline-toggle-icon,
.pm-retail-more-menu .pm-inline-toggle-icon {
  width: 19px !important;
  height: 19px !important;
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
  flex: 0 0 auto !important;
}
.pm-retail-online-action .pm-retail-online-action-text {
  display: inline-flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  max-width: none !important;
  overflow: visible !important;
}
.pm-retail-more-options-action.pm-list-btn {
  min-width: 36px !important;
  width: 36px !important;
  padding: 0 !important;
  background: var(--pm-white) !important;
  color: var(--pm-ink-1) !important;
  border-color: var(--pm-border) !important;
}
.pm-retail-more-options-action:hover {
  background: var(--pm-surface-2) !important;
  border-color: var(--pm-border-strong) !important;
}
.pm-retail-more-options-action .pm-inline-more-options-icon {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: currentColor !important;
}
.pm-retail-more-menu {
  position: fixed !important;
  z-index: 9999 !important;
  min-width: 220px !important;
  padding: 8px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 10px !important;
  background: var(--pm-white) !important;
  box-shadow: var(--pm-shadow-md) !important;
}
.pm-retail-more-menu button {
  width: 100% !important;
  min-height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 9px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: var(--pm-ink-1) !important;
  font: inherit !important;
  cursor: pointer !important;
}
.pm-retail-more-menu button:hover {
  background: var(--pm-surface-2) !important;
}
.pm-retail-more-menu button svg,
.pm-retail-more-menu button .ui-icon {
  width: 17px !important;
  height: 17px !important;
  display: inline-block !important;
  flex: 0 0 auto !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.pm-retail-more-menu button.danger {
  color: var(--pm-red) !important;
}
.pm-retail-more-menu button[data-retail-menu-action="wastage"] {
  background: var(--pm-red) !important;
  color: var(--pm-white) !important;
}
.pm-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
@media(max-width:900px){
  .retail-inventory-2c9j .pm-list-table th.pm-retail-col-actions,
  .retail-inventory-2c9j .pm-list-table td.pm-retail-col-actions,
  .pm-list-table th.pm-retail-col-actions,
  .pm-list-table td.pm-retail-col-actions {
    min-width: 158px !important;
    width: 158px !important;
  }
  .retail-inventory-2c9j .pm-list-row-actions {
    min-width: 142px !important;
    gap: 5px !important;
  }
}


/* CDBT19 2C9K — Returned Items completion.
   Source-led Returned Items list/dashboard details; no global finalizer. */
.pm-returned-2c9k-summary {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 10px !important;
  margin: 0 0 10px !important;
}
.pm-returned-2c9k-card {
  display: block !important;
  padding: 12px 14px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 12px !important;
  background: var(--pm-white) !important;
  box-shadow: var(--pm-shadow-sm) !important;
  text-decoration: none !important;
  color: var(--pm-ink-1) !important;
}
.pm-returned-2c9k-card strong {
  display: block !important;
  font-size: 18px !important;
  font-weight: 450 !important;
  line-height: 1.1 !important;
}
.pm-returned-2c9k-card span {
  display: block !important;
  margin-top: 3px !important;
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
}
.pm-returned-2c9k-card small {
  display: block !important;
  margin-top: 4px !important;
  color: var(--pm-ink-4) !important;
  font-size: 11px !important;
}
.pm-returned-2c9k-card[data-tone="danger"] strong { color: var(--pm-red) !important; }
.pm-returned-2c9k-card[data-tone="warning"] strong { color: var(--pm-amber) !important; }
.pm-returned-2c9k-card[data-tone="success"] strong { color: var(--pm-green) !important; }
.pm-returned-2c9k-card[data-tone="info"] strong { color: var(--pm-blue) !important; }
.pm-returned-2c9k-card:hover {
  border-color: var(--pm-green) !important;
  box-shadow: var(--pm-shadow-md) !important;
}
.pm-returned-2c9k-toolbar-fields {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
.pm-returned-2c9k-field {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 38px !important;
  padding: 0 8px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 9px !important;
  background: var(--pm-white) !important;
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
}
.pm-returned-2c9k-field input {
  min-width: 126px !important;
  height: 30px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--pm-ink-1) !important;
  font: inherit !important;
}
.pm-returned-2c9k-active-filters {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin: 0 0 10px !important;
}
.pm-returned-2c9k-filter-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 30px !important;
  padding: 0 9px !important;
  border: 1px solid var(--pm-green-soft-border, #b8ddb0) !important;
  border-radius: 999px !important;
  background: var(--pm-green-soft, #eef7e9) !important;
  color: var(--pm-green-dark, #2f6b12) !important;
  font-size: 12px !important;
}
.pm-returned-2c9k-filter-chip button {
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  cursor: pointer !important;
  font: inherit !important;
  padding: 0 !important;
}
.pm-returned-2c9k-count-line {
  margin: 0 0 10px !important;
  padding: 9px 12px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 10px !important;
  background: var(--pm-surface-1) !important;
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
}
.pm-returned-2c9k-product-cell strong {
  font-weight: 450 !important;
}
.pm-returned-2c9k-sub {
  color: var(--pm-ink-4) !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
  margin-top: 3px !important;
}
.pm-returned-2c9k-money {
  font-weight: 450 !important;
  color: var(--pm-ink-1) !important;
}
.pm-returned-2c9k-date {
  white-space: nowrap !important;
}
.pm-returned-2c9k-table .pm-list-table th,
.pm-returned-2c9k-table .pm-list-table td {
  vertical-align: top !important;
}
.pm-returned-2c9k-table .pm-list-row-actions {
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
}
@media(max-width:900px){
  .pm-returned-2c9k-toolbar-fields {
    width: 100% !important;
  }
  .pm-returned-2c9k-field {
    flex: 1 1 140px !important;
  }
}


/* CDBT19 2C9L — Remaining Retail sub-tabs completion.
   Source-led Retail sub-tab completion; no global finalizer. */
.pm-retail-remaining-2c9l .pm-list-table th,
.pm-retail-remaining-2c9l .pm-list-table td {
  vertical-align: top !important;
}
.pm-2c9l-summary {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 10px !important;
  margin: 0 0 10px !important;
}
.pm-2c9l-card {
  display: block !important;
  min-height: 84px !important;
  padding: 12px 14px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 12px !important;
  background: var(--pm-white) !important;
  color: var(--pm-ink-1) !important;
  text-decoration: none !important;
  box-shadow: var(--pm-shadow-sm) !important;
}
.pm-2c9l-card:hover {
  border-color: var(--pm-green) !important;
  box-shadow: var(--pm-shadow-md) !important;
}
.pm-2c9l-card strong {
  display: block !important;
  font-size: 18px !important;
  font-weight: 450 !important;
  line-height: 1.15 !important;
}
.pm-2c9l-card span {
  display: block !important;
  margin-top: 4px !important;
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
}
.pm-2c9l-card small {
  display: block !important;
  margin-top: 4px !important;
  color: var(--pm-ink-4) !important;
  font-size: 11px !important;
}
.pm-2c9l-card[data-tone="success"] strong { color: var(--pm-green) !important; }
.pm-2c9l-card[data-tone="warning"] strong { color: var(--pm-amber) !important; }
.pm-2c9l-card[data-tone="danger"] strong { color: var(--pm-red) !important; }
.pm-2c9l-card[data-tone="info"] strong { color: var(--pm-blue) !important; }
.pm-2c9l-count-line {
  margin: 0 0 10px !important;
  padding: 9px 12px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 10px !important;
  background: var(--pm-surface-1) !important;
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
}
.pm-2c9l-active-filters {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin: 0 0 10px !important;
}
.pm-2c9l-filter-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 30px !important;
  padding: 0 9px !important;
  border: 1px solid var(--pm-green-soft-border, #b8ddb0) !important;
  border-radius: 999px !important;
  background: var(--pm-green-soft, #eef7e9) !important;
  color: var(--pm-green-dark, #2f6b12) !important;
  font-size: 12px !important;
}
.pm-2c9l-filter-chip button {
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  cursor: pointer !important;
  font: inherit !important;
  padding: 0 !important;
}
.pm-2c9l-sub {
  color: var(--pm-ink-4) !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
  margin-top: 3px !important;
}
.pm-2c9l-money {
  font-weight: 450 !important;
  color: var(--pm-ink-1) !important;
}
.pm-2c9l-date {
  white-space: nowrap !important;
}
.pm-2c9l-empty-note {
  color: var(--pm-ink-4) !important;
  font-size: 12px !important;
}
.pm-retail-remaining-2c9l .pm-list-row-actions {
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
}
@media(max-width:900px){
  .pm-2c9l-summary {
    grid-template-columns: 1fr 1fr !important;
  }
}
@media(max-width:560px){
  .pm-2c9l-summary {
    grid-template-columns: 1fr !important;
  }
}


/* CDBT19 2C9L-A — Retail remaining sub-tab Actions uniformity.
   Standardises the row Actions column as View + More across remaining Retail tabs. */
.pm-retail-remaining-2c9l th.pm-2c9l-actions-col,
.pm-retail-remaining-2c9l td.pm-2c9l-actions-col {
  min-width: 106px !important;
  width: 106px !important;
  overflow: visible !important;
}
.pm-2c9l-row-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  flex-wrap: nowrap !important;
  min-width: 92px !important;
  overflow: visible !important;
}
.pm-2c9l-row-actions .pm-list-btn,
.pm-2c9l-row-actions button {
  flex: 0 0 auto !important;
}
.pm-2c9l-primary-action.pm-list-btn,
.pm-2c9l-more-action.pm-list-btn {
  min-width: 36px !important;
  width: 36px !important;
  height: 34px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--pm-white) !important;
  border: 1px solid var(--pm-border) !important;
  color: var(--pm-ink-1) !important;
  border-radius: 8px !important;
}
.pm-2c9l-primary-action.pm-list-btn:hover,
.pm-2c9l-more-action.pm-list-btn:hover {
  background: var(--pm-surface-2) !important;
  border-color: var(--pm-border-strong) !important;
}
.pm-2c9l-primary-action svg,
.pm-2c9l-primary-action .ui-icon,
.pm-2c9l-more-action svg,
.pm-2c9l-more-action .ui-icon {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.pm-2c9l-action-menu {
  position: fixed !important;
  z-index: 10000 !important;
  min-width: 230px !important;
  padding: 8px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 10px !important;
  background: var(--pm-white) !important;
  box-shadow: var(--pm-shadow-md) !important;
}
.pm-2c9l-action-menu button {
  width: 100% !important;
  min-height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 9px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: var(--pm-ink-1) !important;
  font: inherit !important;
  cursor: pointer !important;
}
.pm-2c9l-action-menu button:hover {
  background: var(--pm-surface-2) !important;
}
.pm-2c9l-action-menu button svg,
.pm-2c9l-action-menu button .ui-icon {
  width: 17px !important;
  height: 17px !important;
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
  flex: 0 0 auto !important;
}
.pm-2c9l-action-menu button.danger {
  color: var(--pm-red) !important;
}
.pm-2c9l-action-menu button.primary {
  color: var(--pm-green) !important;
}
.pm-2c9l-action-menu .pm-2c9l-menu-note {
  padding: 6px 10px 3px !important;
  font-size: 11px !important;
  color: var(--pm-ink-4) !important;
}


/* CDBT19 2C9L-B — Empty-view retail actions reconciliation.
   Gives zero-row remaining Retail sub-tabs a uniform non-write action bar
   so the Actions model is consistent even when there are no records. */
.pm-2c9l-empty-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 10px 0 0 !important;
  padding: 12px 14px !important;
  border: 1px dashed var(--pm-border-strong) !important;
  border-radius: 12px !important;
  background: var(--pm-surface-1) !important;
}
.pm-2c9l-empty-actions__text {
  min-width: 0 !important;
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
.pm-2c9l-empty-actions__text strong {
  display: block !important;
  color: var(--pm-ink-1) !important;
  font-size: 13px !important;
  font-weight: 450 !important;
}
.pm-2c9l-empty-actions .pm-2c9l-row-actions {
  flex: 0 0 auto !important;
}
@media(max-width:720px){
  .pm-2c9l-empty-actions {
    align-items: flex-start !important;
    flex-direction: column !important;
  }
}


/* CDBT19 2C9L-C — Remaining Retail route/action reconciliation.
   Stabilises Discount/Sales and Permanently Removed route rendering and
   keeps row/empty-view actions visible in all six remaining Retail tabs. */
.pm-2c9l-action-surface-reconciled {
  outline: none !important;
}
.pm-2c9l-row-actions,
.pm-2c9l-empty-actions .pm-2c9l-row-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  flex-wrap: nowrap !important;
  overflow: visible !important;
}
.pm-2c9l-row-actions .pm-list-btn {
  flex: 0 0 auto !important;
  min-width: 36px !important;
  height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.pm-2c9l-row-actions .pm-list-btn svg,
.pm-2c9l-row-actions .pm-list-btn .ui-icon {
  width: 17px !important;
  height: 17px !important;
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.pm-2c9l-action-menu {
  position: fixed !important;
  z-index: 10000 !important;
  min-width: 220px !important;
  padding: 8px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 10px !important;
  background: var(--pm-white) !important;
  box-shadow: var(--pm-shadow-md) !important;
}
.pm-2c9l-action-menu button,
.pm-2c9l-action-menu .pm-2c9l-menu-note {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}


/* CDBT19 2C9L-D — Discount/Sales + Removed direct renderer reconciliation.
   Finalises the two stubborn remaining Retail views without DB/storage writes. */
.pm-2c9l-d-direct-view .pm-list-table-wrap,
.pm-2c9l-d-direct-view .pm-list-table {
  overflow: visible !important;
}
.pm-2c9l-d-direct-view .pm-2c9l-row-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  min-width: 86px !important;
  overflow: visible !important;
}
.pm-2c9l-d-direct-view .pm-2c9l-row-actions .pm-list-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 36px !important;
  height: 34px !important;
}
.pm-2c9l-d-direct-view .pm-2c9l-row-actions svg,
.pm-2c9l-d-direct-view .pm-2c9l-row-actions .ui-icon {
  display: inline-block !important;
  width: 17px !important;
  height: 17px !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.pm-2c9l-d-direct-empty {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-top: 10px !important;
  padding: 12px 14px !important;
  border: 1px dashed var(--pm-border-strong) !important;
  border-radius: 12px !important;
  background: var(--pm-surface-1) !important;
}
.pm-2c9l-d-direct-empty strong {
  display: block !important;
  color: var(--pm-ink-1) !important;
  font-size: 13px !important;
  font-weight: 450 !important;
}
.pm-2c9l-d-direct-empty span {
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
}


/* CDBT19 2C9O — Write-capable gates foundation.
   Visual status/hold components only; no write activation. */
.pm-write-gate-notice {
  position: fixed !important;
  right: 18px !important;
  bottom: 18px !important;
  z-index: 11000 !important;
  max-width: min(420px, calc(100vw - 36px)) !important;
}
.pm-write-gate-notice__card {
  display: grid !important;
  gap: 6px !important;
  padding: 14px 16px !important;
  border: 1px solid var(--pm-border-strong) !important;
  border-left: 4px solid var(--pm-amber) !important;
  border-radius: 12px !important;
  background: var(--pm-white) !important;
  box-shadow: var(--pm-shadow-md) !important;
  color: var(--pm-ink-1) !important;
}
.pm-write-gate-notice__card strong {
  font-size: 14px !important;
  font-weight: 450 !important;
}
.pm-write-gate-notice__card span,
.pm-write-gate-notice__card small {
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}
.pm-write-gate-notice__card button {
  justify-self: end !important;
  min-height: 32px !important;
  padding: 0 12px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 8px !important;
  background: var(--pm-white) !important;
  color: var(--pm-ink-1) !important;
  cursor: pointer !important;
}
.pm-write-gate-card {
  display: grid !important;
  gap: 12px !important;
  padding: 14px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 14px !important;
  background: var(--pm-white) !important;
  box-shadow: var(--pm-shadow-sm) !important;
}
.pm-write-gate-card header,
.pm-write-gate-card footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
}
.pm-write-gate-card header strong {
  color: var(--pm-ink-1) !important;
  font-size: 15px !important;
  font-weight: 450 !important;
}
.pm-write-gate-card__grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 10px !important;
}
.pm-write-gate-card__grid article {
  display: grid !important;
  gap: 4px !important;
  min-height: 86px !important;
  padding: 12px !important;
  border: 1px dashed var(--pm-border-strong) !important;
  border-radius: 12px !important;
  background: var(--pm-surface-1) !important;
}
.pm-write-gate-card__grid article strong {
  color: var(--pm-ink-1) !important;
  font-size: 13px !important;
  font-weight: 450 !important;
}
.pm-write-gate-card__grid article span,
.pm-write-gate-card__grid article small {
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}


/* CDBT19 2C9O-A — Promo Campaign Lifecycle.
   Source-led Marketing campaign/product targeting UI. Write path remains
   behind the 2C9O promo_campaign_lifecycle gate until backend activation. */
.pm-mkt-2c9oa {
  display: grid !important;
  gap: 14px !important;
}
.pm-mkt-2c9oa-grid {
  display: grid !important;
  grid-template-columns: minmax(360px, 1fr) minmax(420px, 1fr) !important;
  gap: 14px !important;
  align-items: start !important;
}
.pm-mkt-2c9oa-card {
  padding: 14px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 14px !important;
  background: var(--pm-white) !important;
  box-shadow: var(--pm-shadow-sm) !important;
}
.pm-mkt-2c9oa-card h3 {
  margin: 0 0 12px !important;
  font-size: 16px !important;
  font-weight: 450 !important;
  color: var(--pm-ink-1) !important;
}
.pm-mkt-2c9oa-kpis {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
.pm-mkt-2c9oa-kpi {
  padding: 12px 14px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 12px !important;
  background: var(--pm-white) !important;
  box-shadow: var(--pm-shadow-sm) !important;
  text-align: center !important;
}
.pm-mkt-2c9oa-kpi span {
  display: block !important;
  color: var(--pm-ink-3) !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}
.pm-mkt-2c9oa-kpi strong {
  display: block !important;
  margin-top: 4px !important;
  color: var(--pm-ink-1) !important;
  font-size: 18px !important;
  font-weight: 450 !important;
}
.pm-mkt-2c9oa-form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
.pm-mkt-2c9oa-field {
  display: grid !important;
  gap: 5px !important;
}
.pm-mkt-2c9oa-field label {
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
  font-weight: 350 !important;
}
.pm-mkt-2c9oa-field input,
.pm-mkt-2c9oa-field select {
  width: 100% !important;
  min-height: 38px !important;
  padding: 8px 10px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 9px !important;
  background: var(--pm-surface-1) !important;
  color: var(--pm-ink-1) !important;
  font-size: 13px !important;
}
.pm-mkt-2c9oa-target-box {
  margin-top: 12px !important;
  padding: 12px !important;
  border: 1px dashed var(--pm-border-strong) !important;
  border-radius: 12px !important;
  background: var(--pm-surface-1) !important;
}
.pm-mkt-2c9oa-target-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-bottom: 8px !important;
}
.pm-mkt-2c9oa-target-head strong {
  color: var(--pm-ink-1) !important;
  font-size: 13px !important;
  font-weight: 450 !important;
}
.pm-mkt-2c9oa-target-head span {
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
}
.pm-mkt-2c9oa-chip-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  max-height: 150px !important;
  overflow: auto !important;
  padding-right: 3px !important;
}
.pm-mkt-2c9oa-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 30px !important;
  padding: 0 9px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 999px !important;
  background: var(--pm-white) !important;
  color: var(--pm-ink-2) !important;
  font-size: 12px !important;
  cursor: pointer !important;
}
.pm-mkt-2c9oa-chip input {
  width: 13px !important;
  height: 13px !important;
  min-height: 13px !important;
  padding: 0 !important;
}
.pm-mkt-2c9oa-product-chip {
  border-radius: 10px !important;
  min-height: 38px !important;
}
.pm-mkt-2c9oa-product-chip small {
  color: var(--pm-ink-4) !important;
  font-size: 10px !important;
}
.pm-mkt-2c9oa-actions {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-top: 12px !important;
}
.pm-mkt-2c9oa-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 12px !important;
}
.pm-mkt-2c9oa-table th {
  background: var(--pm-surface-1) !important;
  color: var(--pm-ink-3) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  text-align: left !important;
  padding: 9px !important;
}
.pm-mkt-2c9oa-table td {
  padding: 10px 9px !important;
  border-top: 1px solid var(--pm-border) !important;
  vertical-align: top !important;
}
.pm-mkt-2c9oa-status {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  padding: 0 8px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  border: 1px solid var(--pm-border) !important;
  background: var(--pm-surface-1) !important;
}
.pm-mkt-2c9oa-status[data-status="active"] {
  color: var(--pm-green) !important;
  background: var(--pm-green-soft, #eef7e9) !important;
  border-color: var(--pm-green-soft-border, #b8ddb0) !important;
}
.pm-mkt-2c9oa-status[data-status="draft"],
.pm-mkt-2c9oa-status[data-status="scheduled"] {
  color: var(--pm-amber) !important;
}
.pm-mkt-2c9oa-status[data-status="paused"],
.pm-mkt-2c9oa-status[data-status="expired"] {
  color: var(--pm-red) !important;
}
.pm-mkt-2c9oa-note {
  color: var(--pm-ink-4) !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
}
.pm-mkt-2c9oa-gate {
  margin-top: 10px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--pm-amber-soft-border, #f4d28c) !important;
  border-radius: 10px !important;
  background: var(--pm-amber-soft, #fff7e3) !important;
  color: var(--pm-ink-2) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}
@media(max-width:1100px){
  .pm-mkt-2c9oa-grid { grid-template-columns: 1fr !important; }
  .pm-mkt-2c9oa-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media(max-width:620px){
  .pm-mkt-2c9oa-form-grid,
  .pm-mkt-2c9oa-kpis { grid-template-columns: 1fr !important; }
}


/* CDBT19 2C9O-B — Permanent Remove / Restore Lifecycle.
   Controlled inventory removal/restore UI; writes stay behind the
   permanent_remove_restore_lifecycle gate until schema/RLS/audit activation. */
.pm-2c9ob-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 12000 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 22px !important;
  background: rgba(15, 23, 42, .38) !important;
}
.pm-2c9ob-modal__card {
  width: min(760px, calc(100vw - 34px)) !important;
  max-height: calc(100vh - 44px) !important;
  overflow: auto !important;
  border-radius: 16px !important;
  border: 1px solid var(--pm-border) !important;
  background: var(--pm-white) !important;
  box-shadow: var(--pm-shadow-md) !important;
}
.pm-2c9ob-modal__head,
.pm-2c9ob-modal__foot {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 14px 16px !important;
  border-bottom: 1px solid var(--pm-border) !important;
}
.pm-2c9ob-modal__foot {
  border-top: 1px solid var(--pm-border) !important;
  border-bottom: 0 !important;
  justify-content: flex-end !important;
}
.pm-2c9ob-modal__head strong {
  font-size: 16px !important;
  font-weight: 450 !important;
  color: var(--pm-ink-1) !important;
}
.pm-2c9ob-modal__body {
  display: grid !important;
  gap: 12px !important;
  padding: 16px !important;
}
.pm-2c9ob-impact {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 10px !important;
}
.pm-2c9ob-impact article {
  padding: 11px 12px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 12px !important;
  background: var(--pm-surface-1) !important;
}
.pm-2c9ob-impact span {
  display: block !important;
  color: var(--pm-ink-4) !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}
.pm-2c9ob-impact strong {
  display: block !important;
  margin-top: 4px !important;
  color: var(--pm-ink-1) !important;
  font-size: 15px !important;
  font-weight: 450 !important;
}
.pm-2c9ob-form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
.pm-2c9ob-field {
  display: grid !important;
  gap: 5px !important;
}
.pm-2c9ob-field label {
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
  font-weight: 350 !important;
}
.pm-2c9ob-field input,
.pm-2c9ob-field select,
.pm-2c9ob-field textarea {
  width: 100% !important;
  min-height: 38px !important;
  border: 1px solid var(--pm-border) !important;
  border-radius: 9px !important;
  background: var(--pm-surface-1) !important;
  color: var(--pm-ink-1) !important;
  padding: 8px 10px !important;
  font-size: 13px !important;
}
.pm-2c9ob-field textarea {
  min-height: 82px !important;
  resize: vertical !important;
}
.pm-2c9ob-warning {
  padding: 11px 12px !important;
  border: 1px solid var(--pm-amber-soft-border, #f4d28c) !important;
  border-radius: 10px !important;
  background: var(--pm-amber-soft, #fff7e3) !important;
  color: var(--pm-ink-2) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}
.pm-2c9ob-danger {
  border-color: var(--pm-red-soft-border, #f2b8b5) !important;
  background: var(--pm-red-soft, #fff1f0) !important;
}
.pm-2c9ob-row-action {
  white-space: nowrap !important;
}
.pm-2c9ob-row-action svg,
.pm-2c9ob-row-action .ui-icon {
  display: inline-block !important;
  width: 16px !important;
  height: 16px !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.pm-2c9ob-removed-panel {
  margin: 10px 0 !important;
  padding: 12px !important;
  border: 1px dashed var(--pm-border-strong) !important;
  border-radius: 12px !important;
  background: var(--pm-surface-1) !important;
  color: var(--pm-ink-3) !important;
  font-size: 12px !important;
}
.pm-2c9ob-removed-panel strong {
  color: var(--pm-ink-1) !important;
  font-size: 13px !important;
  font-weight: 450 !important;
}
@media(max-width:720px){
  .pm-2c9ob-form-grid { grid-template-columns: 1fr !important; }
}

/* CDBT19 2C9O-B-A — legacy delete/restore binding reconciliation. No DB/storage/RLS/schema/activation. */

/* CDBT19 2C9O-C — controlled activation preflight card, planning-only. */
.pm-write-activation-card {
    border: 1px solid rgba(27, 128, 69, 0.18);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(17, 24, 39, 0.08);
    padding: 18px;
    display: grid;
    gap: 14px;
}
.pm-write-activation-card header,
.pm-write-activation-card footer {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
}
.pm-write-activation-card__warning {
    border-radius: 12px;
    padding: 10px 12px;
    background: rgba(245, 158, 11, 0.12);
    color: #7c4a03;
    font-weight: 700;
}
.pm-write-activation-card__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}
.pm-write-activation-card__grid article {
    border: 1px solid rgba(17, 24, 39, 0.1);
    border-radius: 14px;
    padding: 12px;
    display: grid;
    gap: 6px;
}
.pm-write-activation-card__grid small {
    color: #6b7280;
}


/* CDBT19_2C9O_F — staging dry-run card. No behavioural effect. */
.pm-2c9of-card {
    border: 1px solid rgba(20, 83, 45, .18);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(240,253,244,.95), rgba(255,255,255,.98));
    padding: 16px;
    margin: 12px 0;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .06);
}
.pm-2c9of-card header {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
    font-weight: 700;
}
.pm-2c9of-card__warning {
    margin: 10px 0;
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(254, 249, 195, .75);
    color: #854d0e;
    font-size: 13px;
}
.pm-2c9of-card__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 10px;
}
.pm-2c9of-card__grid article {
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 14px;
    padding: 10px;
    background: rgba(255,255,255,.8);
}
.pm-2c9of-card__grid span {
    display: block;
    color: var(--pm-ink-4, #64748b);
    font-size: 12px;
    margin-top: 4px;
}


/* CDBT19_2C9O_J — controlled live activation status card. */
.pm-2c9oj-activation-card {
    border: 1px solid rgba(22, 101, 52, .28);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(236, 253, 245, .98), rgba(255,255,255,.98));
    box-shadow: 0 14px 28px rgba(15, 23, 42, .08);
    padding: 16px;
    margin: 12px 0;
}
.pm-2c9oj-activation-card strong { color: #14532d; }
.pm-2c9oj-activation-card code { font-size: 12px; }


/* CDBT19_2C9O_J_A — controlled live QA marker only. */
.pm-2c9oja-live-qa-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    padding: 6px 10px;
    background: rgba(219, 234, 254, .8);
    color: #1e3a8a;
    font-size: 12px;
    font-weight: 700;
}


/* CDBT19_2C9O_J_A_C — metadata normalization repair marker only. */
.pm-2c9ojac-repair-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 6px 10px;
    background: rgba(220, 252, 231, .85);
    color: #14532d;
    font-size: 12px;
    font-weight: 700;
}


/* CDBT19_2C9O_J_A_D — strict write repair marker only. */
.pm-2c9ojad-strict-write-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 6px 10px;
    background: rgba(254, 249, 195, .85);
    color: #713f12;
    font-size: 12px;
    font-weight: 700;
}


/* CDBT19_2C9O_J_A_E — strict REST writer marker only. */
.pm-2c9ojae-strict-rest-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 6px 10px;
    background: rgba(224, 242, 254, .85);
    color: #0c4a6e;
    font-size: 12px;
    font-weight: 700;
}
