
/* \u2550\u2550\u2550 D-MART TABLE \u2014 fit-to-viewport, filters, multi-select \u2550\u2550\u2550 */
.dm-th{position:relative;user-select:none;white-space:nowrap;font-size:0.6rem;color:var(--bl);}
#dmart-tbl td.num{color:var(--ac);font-family:DM Mono,monospace;text-align:right;font-variant-numeric:tabular-nums;}
#dmart-tbl td{color:var(--tx);}
/* description / brand text \u2014 always bright */
#dmart-tbl td:not(.num){color:var(--tx);}
.dm-sortable{cursor:pointer;}
.dm-sortable:hover{background:rgba(255,255,255,0.06);}
.dm-sort-icon{font-size:0.55rem;color:var(--ac);margin-left:2px;}

/* Filter inputs under each header */
.dm-fi{width:100%;background:var(--bg);border:1px solid var(--bd);border-radius:4px;
  color:var(--tx);font-size:0.6rem;padding:2px 4px;outline:none;box-sizing:border-box;min-width:0;}
.dm-fi:focus{border-color:var(--bl);}
#dmart-hr2 td{padding:2px 3px;vertical-align:middle;}

/* Resize handle */
.dm-resize-handle{position:absolute;right:0;top:0;bottom:0;width:4px;cursor:col-resize;z-index:10;}
.dm-resize-handle:hover,.dm-resize-handle.active{background:var(--ac);opacity:0.5;}

/* \u2500\u2500 po-ctrl-row: shared across ALL buyer tables \u2500\u2500 */
.po-ctrl-row th{background:var(--sf);border-bottom:1px solid var(--bd);}
.po-ctrl-row .gsearch input{background:rgba(255,255,255,0.07)!important;border:2px solid rgba(255,255,255,0.15)!important;border-radius:50px!important;color:#fff!important;box-shadow:0 4px 18px rgba(0,0,0,0.25),inset 0 1px 0 rgba(255,255,255,0.08)!important;}
.po-ctrl-row .gsearch input::placeholder{color:rgba(255,255,255,0.45)!important;}
.po-ctrl-row .gsearch input:focus{border-color:rgba(139,92,246,0.65)!important;background:rgba(139,92,246,0.13)!important;box-shadow:0 4px 22px rgba(139,92,246,0.28)!important;}
.po-ctrl-row .gsearch input.has-val{border-color:#00ffe7!important;background:rgba(0,255,231,0.08)!important;box-shadow:0 0 0 2px rgba(0,255,231,0.35),0 0 16px rgba(0,255,231,0.25)!important;color:#00ffe7!important;}
/* Light themes: ctrl row search pill */
[data-theme="light"] .po-ctrl-row .gsearch input,[data-theme="silver"] .po-ctrl-row .gsearch input,[data-theme="skyblue"] .po-ctrl-row .gsearch input,
[data-theme="lightnavy"] .po-ctrl-row .gsearch input,[data-theme="cleanslate"] .po-ctrl-row .gsearch input,[data-theme="warmpaper"] .po-ctrl-row .gsearch input{background:rgba(0,0,0,0.06)!important;border-color:rgba(0,0,0,0.18)!important;color:var(--tx)!important;box-shadow:0 2px 10px rgba(0,0,0,0.08),inset 0 1px 0 rgba(255,255,255,0.6)!important;}
[data-theme="light"] .po-ctrl-row .gsearch input::placeholder,[data-theme="silver"] .po-ctrl-row .gsearch input::placeholder,[data-theme="skyblue"] .po-ctrl-row .gsearch input::placeholder,
[data-theme="lightnavy"] .po-ctrl-row .gsearch input::placeholder,[data-theme="cleanslate"] .po-ctrl-row .gsearch input::placeholder,[data-theme="warmpaper"] .po-ctrl-row .gsearch input::placeholder{color:rgba(0,0,0,0.4)!important;}
[data-theme="light"] .po-ctrl-row .gsearch::before,[data-theme="silver"] .po-ctrl-row .gsearch::before,[data-theme="skyblue"] .po-ctrl-row .gsearch::before,
[data-theme="lightnavy"] .po-ctrl-row .gsearch::before,[data-theme="cleanslate"] .po-ctrl-row .gsearch::before,[data-theme="warmpaper"] .po-ctrl-row .gsearch::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='rgba(0,0,0,0.4)'%3E%3Cpath fill-rule='evenodd' d='M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z' clip-rule='evenodd'/%3E%3C/svg%3E")!important;}
/* Freeze headers \u2014 sticky within scroll containers */
#dmart-tbl thead,
#blinkit-main-tbl thead,
#flipkart-main-tbl thead,
#vmart-main-tbl thead,
#apollo-tbl thead,
#vishal-main-tbl thead,
#tbl thead{position:sticky;top:0;z-index:25;}
#dmart-tbl thead{z-index:30;}
#dmart-tbl .po-ctrl-row th{position:sticky;top:0;z-index:32;background:var(--sf);border-bottom:1px solid var(--bd);}
#dmart-hr1 th{position:sticky;top:34px;z-index:31;background:var(--sf);border-bottom:1px solid var(--bd);}
#dmart-hr2{position:sticky;top:70px;z-index:30;background:var(--sf);}
#dmart-hr2 td{background:var(--sf);border-bottom:2px solid var(--bd);}
#dmart-hr3{position:sticky;top:106px;z-index:29;background:var(--s2);}
/* First data row must not be hidden behind sticky headers */
#dmart-tbody tr:first-child td{border-top:none;}

/* Table fits viewport \u2014 allow horizontal scroll on mobile */
#dmart-tbl-wrap{overflow-y:auto;overflow-x:auto;max-height:calc(100vh - 260px);width:100%;}
#dmart-tbl{width:100%!important;table-layout:fixed!important;border-collapse:separate;border-spacing:0;}

/* \u2500\u2500 D-MART MOBILE CARD VIEW (moved to consolidated mobile section) \u2500\u2500 */
/* D-Mart card */
.dmc-card{
  background:var(--sf);border:1px solid var(--bd);border-radius:12px;
  margin-bottom:8px;overflow:hidden;transition:border-color .15s;
}
.dmc-card:active{border-color:var(--ac);}
.dmc-top{
  display:flex;align-items:center;gap:8px;
  padding:9px 12px 6px;border-bottom:1px solid rgba(255,255,255,0.05);
}
.dmc-po{
  font-family:DM Mono,monospace;font-size:0.62rem;font-weight:700;
  color:var(--ac);background:rgba(74,222,128,0.08);
  border:1px solid rgba(74,222,128,0.2);border-radius:6px;
  padding:2px 8px;white-space:nowrap;flex-shrink:0;
}
.dmc-brand{
  font-size:0.62rem;font-weight:700;color:var(--or);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;
}
.dmc-ean{
  font-family:DM Mono,monospace;font-size:0.58rem;color:var(--mu);
  white-space:nowrap;flex-shrink:0;
}
.dmc-body{
  display:flex;align-items:flex-start;gap:10px;
  padding:8px 12px 8px;
}
.dmc-left{flex:1;min-width:0;}
.dmc-desc{
  font-size:0.9rem;font-weight:700;color:var(--tx);
  line-height:1.35;margin-bottom:5px;
}
.dmc-meta{
  display:flex;flex-wrap:wrap;gap:4px 10px;
  font-family:DM Mono,monospace;font-size:0.6rem;color:var(--mu);
}
.dmc-meta-item{display:flex;gap:3px;align-items:center;}
.dmc-meta-label{color:var(--bl);opacity:1;}
.dmc-meta-value{color:var(--ac);font-weight:600;}
.dmc-right{
  text-align:right;flex-shrink:0;min-width:80px;
}
.dmc-mrp{
  font-size:1.1rem;font-weight:800;font-family:DM Mono,monospace;
  color:var(--ac);line-height:1.1;
}
.dmc-mrp-label{font-size:0.52rem;color:var(--mu);font-family:DM Mono,monospace;margin-bottom:2px;}
.dmc-qty{
  font-size:0.72rem;font-weight:700;font-family:DM Mono,monospace;
  color:var(--or);margin-top:4px;
}
.dmc-footer{
  display:flex;align-items:center;justify-content:space-between;
  padding:6px 12px 8px;border-top:1px solid rgba(255,255,255,0.05);
  gap:8px;flex-wrap:wrap;
}
.dmc-footer-item{display:flex;flex-direction:column;align-items:center;gap:1px;}
.dmc-footer-label{font-size:0.5rem;color:var(--bl);font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:0.08em;}
.dmc-footer-value{font-size:0.74rem;font-weight:700;font-family:DM Mono,monospace;color:var(--ac);}
.dmc-margin-positive{color:var(--ac)!important;}
.dmc-margin-negative{color:#f87171!important;}
.dmc-total{font-size:0.82rem!important;color:var(--bl)!important;}
/* D-Mart card group header */
.dmc-group-hdr{
  display:flex;align-items:center;justify-content:space-between;
  padding:7px 12px;background:rgba(96,165,250,0.07);
  border-radius:8px;margin-bottom:4px;margin-top:6px;
  border:1px solid rgba(96,165,250,0.15);
}
.dmc-group-hdr:first-child{margin-top:0;}
.dmc-group-title{font-size:0.7rem;font-weight:700;color:var(--bl);}
.dmc-group-stats{font-size:0.62rem;color:var(--mu);font-family:DM Mono,monospace;}
/* Empty state */
#dmart-card-list .dm-empty{
  text-align:center;padding:40px 20px;color:var(--mu);font-size:0.82rem;
}

/* \u2500\u2500 BUYER MOBILE CARDS (V-Mart, Apollo) \u2500\u2500 */
.bmc-po-group{background:rgba(96,165,250,0.07);border:1px solid rgba(96,165,250,0.18);border-radius:10px;margin-bottom:4px;margin-top:8px;padding:8px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;}
.bmc-po-group:first-child{margin-top:0;}
.bmc-po-no{font-family:DM Mono,monospace;font-size:0.68rem;font-weight:700;color:var(--bl);}
.bmc-po-meta{font-size:0.6rem;color:var(--mu);font-family:DM Mono,monospace;display:flex;gap:8px;flex-wrap:wrap;}
.bmc-po-stats{font-size:0.62rem;color:var(--mu);font-family:DM Mono,monospace;white-space:nowrap;}
.bmc-card{background:var(--sf);border:1px solid var(--bd);border-radius:10px;margin-bottom:6px;overflow:hidden;transition:border-color .15s;}
.bmc-card:active{border-color:var(--ac);}
.bmc-top{display:flex;align-items:center;gap:7px;padding:7px 11px 5px;border-bottom:1px solid rgba(255,255,255,0.05);}
.bmc-brand{font-size:0.62rem;font-weight:700;color:var(--pill-txt-color,var(--or));padding:2px 8px;border-radius:20px;background:rgba(251,146,60,0.12);border:1px solid rgba(251,146,60,0.3);white-space:nowrap;flex-shrink:0;}
.bmc-ean{font-family:DM Mono,monospace;font-size:0.58rem;color:var(--bl);flex:1;text-align:right;}
.bmc-body{display:flex;align-items:flex-start;gap:10px;padding:7px 11px;}
.bmc-desc{font-size:0.88rem;font-weight:700;color:var(--tx);line-height:1.3;flex:1;min-width:0;}
.bmc-vals{flex-shrink:0;text-align:right;min-width:85px;}
.bmc-mrp{font-size:1rem;font-weight:800;font-family:DM Mono,monospace;color:var(--ac);}
.bmc-mrp-lbl{font-size:0.5rem;color:var(--mu);margin-bottom:2px;}
.bmc-qty{font-size:0.7rem;font-weight:700;color:var(--or);margin-top:3px;}
.bmc-footer{display:flex;align-items:center;justify-content:space-between;padding:5px 11px 7px;border-top:1px solid rgba(255,255,255,0.05);gap:6px;flex-wrap:wrap;}
.bmc-fi{display:flex;flex-direction:column;align-items:center;gap:1px;}
.bmc-fl{font-size:0.5rem;color:var(--bl);font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:.06em;}
.bmc-fv{font-size:0.72rem;font-weight:700;font-family:DM Mono,monospace;color:var(--ac);}
.bmc-fv.hi{color:var(--bl);}
.bmc-empty{text-align:center;padding:40px 20px;color:var(--mu);font-size:0.82rem;}
.bmc-total-row{background:var(--sf);border:1px solid rgba(96,165,250,0.25);box-shadow:0 -2px 10px rgba(0,0,0,0.25);border-radius:8px;padding:8px 12px;margin-top:6px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px;}
/* On mobile the card list's actual scrolling ancestor varies by buyer panel, so a plain
   sticky/last-child trick doesn't reliably keep this visible while scrolling (verified:
   position:sticky;bottom:0 on a block-level last child only engages near the very end of
   scroll, unlike a native <tfoot>). Pin it to the viewport instead, and pad the list so the
   last card isn't hidden behind it. */
@media (max-width:768px){
  .bmc-total-row{position:fixed;left:0;right:0;bottom:0;margin:0;border-radius:0;z-index:50;border-width:2px 0 0 0;border-color:var(--ac);background:var(--bg)!important;box-shadow:0 -4px 16px rgba(0,0,0,0.5);padding:10px 14px;}
  #card-list:has(.bmc-total-row),
  #vmart-card-list:has(.bmc-total-row),
  #apollo-card-list:has(.bmc-total-row),
  #flipkart-card-list:has(.bmc-total-row),
  #blinkit-card-list:has(.bmc-total-row),
  #suruchi-card-list:has(.bmc-total-row){padding-bottom:54px!important;}
}
.bmc-total-lbl{font-size:0.65rem;font-weight:700;color:var(--bl);}
.bmc-total-stats{font-size:0.62rem;font-family:DM Mono,monospace;color:var(--mu);}
/* \u2500\u2500 PO drill-in card styles \u2500\u2500 */
.bmc-po-card{background:var(--sf);border:1px solid var(--bd);border-radius:10px;margin-bottom:6px;padding:11px 13px;cursor:pointer;transition:border-color .15s,background .15s;-webkit-tap-highlight-color:transparent;}
.bmc-po-card:active{border-color:var(--bl);background:rgba(96,165,250,0.07);}
.bmc-po-card-sel{border-color:var(--ac)!important;background:rgba(74,222,128,0.07)!important;box-shadow:0 0 0 1.5px rgba(74,222,128,0.25);}
.bmc-poc-cb{accent-color:var(--ac);}
.bmc-poc-row{display:flex;align-items:center;gap:8px;margin-bottom:5px;}
.bmc-poc-no{font-family:DM Mono,monospace;font-size:0.75rem;font-weight:700;color:var(--bl);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.bmc-poc-badge{font-size:0.6rem;font-weight:700;background:rgba(96,165,250,0.15);color:var(--bl);border:1px solid rgba(96,165,250,0.3);padding:2px 8px;border-radius:20px;white-space:nowrap;flex-shrink:0;}
.bmc-poc-arr{font-size:1.1rem;color:var(--mu);flex-shrink:0;}
.bmc-poc-meta{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:4px;}
.bmc-poc-date{font-size:0.62rem;color:var(--or);font-family:DM Mono,monospace;}
.bmc-poc-qty{font-size:0.62rem;color:var(--mu);font-family:DM Mono,monospace;}
.bmc-poc-val{font-size:0.66rem;font-weight:700;color:var(--ac);font-family:DM Mono,monospace;}
.bmc-poc-brands{display:flex;flex-wrap:wrap;gap:4px;margin-top:2px;}
/* Back nav header */
.bmc-nav-header{display:flex;align-items:center;gap:10px;padding:8px 2px 10px;margin-bottom:2px;}
.bmc-back-btn{background:rgba(96,165,250,0.1);border:1.5px solid rgba(96,165,250,0.35);color:var(--bl);font-size:0.7rem;font-weight:700;padding:5px 12px;border-radius:20px;cursor:pointer;flex-shrink:0;}
.bmc-back-btn:active{background:rgba(96,165,250,0.22);}
.bmc-nav-po{font-family:DM Mono,monospace;font-size:0.72rem;font-weight:700;color:var(--tx);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.bmc-nav-count{font-size:0.6rem;color:var(--mu);white-space:nowrap;flex-shrink:0;}
/* view toggle button active state */
#vmart-view-toggle.active,#apollo-view-toggle.active,
#flipkart-view-toggle.active,#blinkit-view-toggle.active,
#reliance-view-toggle.active{background:rgba(96,165,250,0.15);border-color:rgba(96,165,250,0.5);color:var(--bl);}
/* hide col-picker on mobile (moved to consolidated mobile section) */

/* \u2500\u2500 D-MART MOBILE FILTER PANEL \u2500\u2500 */
#dm-mobile-filter-panel{
  display:none;
  background:var(--sf);
  border-bottom:2px solid var(--bd);
  padding:10px 12px 12px;
  flex-direction:column;
  gap:8px;
}
#dm-mobile-filter-panel.open{ display:flex; }
.dmf-panel-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.dmf-panel-field{
  display:flex;flex-direction:column;gap:3px;
}
.dmf-panel-label{
  font-size:0.52rem;font-family:DM Mono,monospace;
  text-transform:uppercase;letter-spacing:0.08em;color:var(--mu);
}
.dmf-panel-input{
  padding:7px 9px;border:1.5px solid var(--bd);border-radius:7px;
  background:var(--bg);color:var(--tx);font-size:0.8rem;
  font-family:DM Mono,monospace;outline:none;width:100%;box-sizing:border-box;
}
.dmf-panel-input:focus{ border-color:var(--bl); }
.dmf-panel-input.has-val{ border-color:var(--ac);background:rgba(74,222,128,0.05); }
/* multi-select inside filter panel */
.dmf-panel-field .dm-ms-wrap{ width:100%; }
.dmf-panel-field .dm-ms-btn{
  width:100%;padding:7px 22px 7px 9px;font-size:0.8rem;
  border-radius:7px;border:1.5px solid var(--bd);
}
.dmf-panel-actions{
  display:flex;gap:8px;margin-top:2px;
}
.dmf-panel-actions button{
  flex:1;padding:8px 0;font-size:0.8rem;border-radius:8px;
  border:1.5px solid var(--bd);background:var(--bg);color:var(--tx);cursor:pointer;
  font-family:DM Mono,monospace;font-weight:600;
}
.dmf-panel-actions button:hover{ background:var(--s2); }
.dmf-panel-actions .dmf-clear-btn{ border-color:var(--rd);color:var(--rd); }
.dmf-panel-actions .dmf-clear-btn:hover{ background:rgba(248,113,113,0.1); }
/* Filter button active indicator */
#dm-filter-btn.active{ border-color:var(--ac)!important;color:var(--ac)!important;background:rgba(74,222,128,0.08)!important; }
#dm-filter-btn .dmf-badge{
  display:none;background:var(--ac);color:#000;
  font-size:0.5rem;font-weight:800;border-radius:8px;
  padding:1px 5px;margin-left:3px;
}
#dm-filter-btn.active .dmf-badge{ display:inline; }
#dmart-tbl td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:4px 5px;}
#dmart-tbl td.po-num-cell{overflow:visible;text-overflow:clip;white-space:nowrap;min-width:120px;}
#dmart-tbl th{overflow:hidden;padding:3px 5px;white-space:nowrap;}
#dmart-tbl th[style*="white-space:normal"]{white-space:normal!important;word-break:keep-all;font-size:0.6rem;line-height:1.25;}
#dmart-tbl td.dm-desc{white-space:normal;word-break:break-word;font-size:0.68rem;line-height:1.3;}

/* PO subtotal group row */
.dm-group-row td{background:rgba(96,165,250,0.07);font-weight:700;font-size:0.68rem;
  color:var(--bl);border-top:1.5px solid var(--bd);border-bottom:1px solid var(--bd);}

/* Brand subtotal row \u2014 light purple on dark theme, deep purple on light theme */
.dm-brand-sub td{background:#2d1b69!important;font-weight:700;font-size:0.68rem;
  color:#e9d5ff;border-top:3px solid #7c3aed;border-bottom:2px solid #4c1d95;}
.dm-brand-sub td:first-child{border-left:4px solid #7c3aed!important;}
[data-theme="light"] .dm-brand-sub td{background:#ede9fe!important;
  color:#4c1d95;border-top:3px solid #7c3aed;border-bottom:2px solid #c4b5fd;}
[data-theme="light"] .dm-brand-sub td:first-child{border-left:4px solid #7c3aed!important;}
[data-theme="blue"] .dm-brand-sub td{background:#1e1b4b!important;
  color:#c7d2fe;border-top:3px solid #6366f1;border-bottom:2px solid #3730a3;}
[data-theme="blue"] .dm-brand-sub td:first-child{border-left:4px solid #6366f1!important;}

/* \u2500\u2500 Multi-select dropdown \u2500\u2500 */
.dm-ms-wrap{position:relative;width:100%;}
.dm-ms-btn{width:100%;background:var(--bg);border:1px solid var(--bd);border-radius:4px;
  color:var(--tx);font-size:0.6rem;padding:2px 18px 2px 4px;text-align:left;cursor:pointer;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;outline:none;box-sizing:border-box;
  position:relative;}
.dm-ms-btn::after{content:'\u25BE';position:absolute;right:4px;top:50%;transform:translateY(-50%);
  font-size:0.55rem;color:var(--mu);}
.dm-ms-btn.active{border-color:var(--bl);color:var(--bl);}
.dm-ms-drop{position:fixed;background:var(--bg);border:1.5px solid var(--bd);border-radius:8px;
  box-shadow:0 8px 32px rgba(0,0,0,.5);z-index:9999;min-width:160px;max-width:260px;
  max-height:260px;display:none;flex-direction:column;overflow:hidden;}
.dm-ms-drop.open{display:flex;}
.dm-ms-search{padding:6px 8px;border-bottom:1px solid var(--bd);flex-shrink:0;}
.dm-ms-search input{width:100%;background:var(--bg);border:1px solid var(--bd);border-radius:4px;
  color:var(--tx);font-size:0.68rem;padding:3px 6px;outline:none;box-sizing:border-box;}
.dm-ms-list{overflow-y:auto;flex:1;padding:4px 0;}
.dm-ms-item{display:flex;align-items:center;gap:6px;padding:5px 10px;cursor:pointer;
  font-size:0.68rem;color:var(--tx);}
.dm-ms-item:hover{background:var(--bd);}
.dm-ms-item input[type=checkbox]{accent-color:var(--bl);cursor:pointer;flex-shrink:0;}
.dm-ms-actions{display:flex;gap:6px;padding:5px 8px;border-top:1px solid var(--bd);flex-shrink:0;}
.dm-ms-actions button{flex:1;font-size:0.62rem;padding:3px 0;border-radius:4px;
  border:1px solid var(--bd);background:var(--bg);color:var(--tx);cursor:pointer;}
.dm-ms-actions button:hover{background:var(--bd);}

/* \u2500\u2500 Column Visibility Picker \u2500\u2500 */
#dm-col-picker-btn{position:relative;}
#dm-col-picker{position:fixed;background:var(--bg);border:1.5px solid var(--bd);border-radius:12px;
  box-shadow:0 8px 32px rgba(0,0,0,.55);z-index:9999;width:280px;display:none;flex-direction:column;overflow:hidden;}
#dm-col-picker.open{display:flex;}

/* \u2500\u2500 Reliance column picker \u2014 shares same panel style as D-Mart \u2500\u2500 */
#reliance-col-picker-btn{position:relative;}
#reliance-col-picker{position:fixed;background:var(--bg);border:1.5px solid var(--bd);border-radius:12px;
  box-shadow:0 8px 32px rgba(0,0,0,.55);z-index:9999;width:300px;display:none;flex-direction:column;overflow:hidden;}
#reliance-col-picker.open{display:flex;}
.rl-col-hidden{display:none!important;}
.dm-cp-head{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;
  border-bottom:1px solid var(--bd);font-size:0.7rem;font-weight:700;color:var(--tx);}
.dm-cp-head span{font-size:0.62rem;color:var(--mu);}
.dm-cp-actions{display:flex;gap:6px;padding:6px 10px;border-bottom:1px solid var(--bd);}
.dm-cp-actions button{flex:1;font-size:0.62rem;padding:3px 0;border-radius:4px;
  border:1px solid var(--bd);background:var(--bg);color:var(--tx);cursor:pointer;}
.dm-cp-actions button:hover{background:var(--bd);}
.dm-cp-list{display:grid;grid-template-columns:1fr 1fr;gap:0;overflow-y:auto;max-height:320px;padding:4px 0;}
.dm-cp-item{display:flex;align-items:center;gap:6px;padding:5px 12px;cursor:pointer;
  font-size:0.68rem;color:var(--tx);user-select:none;}
.dm-cp-item:hover{background:var(--bd);}
.dm-cp-item input[type=checkbox]{accent-color:var(--bl);cursor:pointer;flex-shrink:0;}
.dm-cp-item.locked{opacity:0.45;cursor:not-allowed;}
.dm-col-hidden{display:none!important;}
/* \u2500\u2500 Buyer table column visibility \u2500\u2500 */
.byr-col-hidden{display:none!important;}
.byr-col-picker{position:fixed;background:var(--bg);border:1.5px solid var(--bd);border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.55);z-index:9999;width:300px;display:none;flex-direction:column;overflow:hidden;}
.byr-col-picker.open{display:flex;}

/* \u2550\u2550\u2550 FILL RATE SECTION \u2550\u2550\u2550 */
.fr-upload-row{display:flex;gap:10px;flex-wrap:wrap;align-items:stretch}
.fr-upload-zone{flex:1;min-width:180px;border:1.5px dashed var(--bd);border-radius:10px;padding:10px 14px;cursor:pointer;transition:border-color .2s,background .2s;display:flex;flex-direction:column;gap:4px;background:var(--bg)}
.fr-upload-zone:hover{border-color:var(--ac);background:var(--s2)}
.fr-upload-zone.loaded{border-color:#22c55e;border-style:solid}
.fr-status-pill{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:12px;font-size:0.67rem;font-weight:700}
.fr-status-pill.ok{background:rgba(34,197,94,.13);color:#22c55e}
.fr-status-pill.wait{background:rgba(148,163,184,.13);color:var(--mu)}
.fr-status-pill.err{background:rgba(248,113,113,.13);color:var(--rd)}
.fr-subtotal td{background:rgba(99,102,241,.1)!important;font-weight:700;font-family:DM Mono,monospace;font-size:0.68rem}
.fr-grand-total td{background:#1e1b4b!important;font-weight:700;font-family:DM Mono,monospace;border-top:2px solid var(--ac);color:#e0e7ff}
/* \u2550\u2550\u2550 FONT SWITCHER FAB \u2550\u2550\u2550 */

#font-switcher-panel{position:fixed;right:12px;bottom:120px;z-index:601;width:260px;background:var(--bg);border:1.5px solid var(--bd);border-radius:16px;box-shadow:0 8px 32px rgba(0,0,0,.6);padding:14px;display:none;}
#font-switcher-panel.open{display:block;}
.fsp-title{font-size:0.68rem;font-weight:700;color:var(--mu);text-transform:uppercase;letter-spacing:0.1em;margin-bottom:10px;display:flex;align-items:center;justify-content:space-between;}
.fsp-close{cursor:pointer;color:var(--mu);font-size:1rem;line-height:1;}
.fsp-opt{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:10px;cursor:pointer;border:1.5px solid transparent;background:var(--bg);margin-bottom:5px;transition:all .15s;}
.fsp-opt:last-child{margin-bottom:0;}
.fsp-opt:hover{border-color:var(--bd);background:var(--s2);}
.fsp-opt.active{border-color:var(--ac);background:rgba(74,222,128,0.07);}
.fsp-body-name{font-size:0.78rem;font-weight:700;color:var(--tx);line-height:1.3;}
.fsp-mono-name{font-size:0.58rem;color:var(--mu);margin-top:1px;}
.fsp-vibe{font-size:0.52rem;padding:2px 7px;border-radius:8px;background:var(--s2);color:var(--mu);font-weight:600;flex-shrink:0;}
.fsp-tick{color:var(--ac);font-size:0.8rem;opacity:0;flex-shrink:0;transition:opacity .15s;}
.fsp-opt.active .fsp-tick{opacity:1;}

/* \u2550\u2550\u2550 MOBILE / PWA \u2014 NATIVE FEEL \u2550\u2550\u2550 */
*{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;}
input,select,textarea{font-size:16px;}
html,body{overscroll-behavior:none;}
.tblwrap,.modal,.logbox{-webkit-overflow-scrolling:touch;}
body{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);}
.topbar{top:env(safe-area-inset-top);padding-left:calc(18px + env(safe-area-inset-left));padding-right:calc(18px + env(safe-area-inset-right));}
.tab,.btn,.bsm,.bo,.topbar,.vtoolbar,.buyer-tabs-bar,.buyer-tab,#reliance-inner-tabs,#itab-po,#itab-amend,.amend-stab,.leg,.appt-pin-btn{user-select:none;-webkit-user-select:none;}
/* \u2500\u2500 Right filter sidebar: slides in over the table from the right \u2500\u2500 */
#mobile-filter-drawer{
  position:fixed;top:var(--qf-sidebar-top,57px);right:0;bottom:0;
  width:300px;z-index:1002;
  /* --sf is semi-transparent in dark themes; derive a solid bg from --bg instead */
  background:color-mix(in srgb, var(--bg) 82%, white 18%);
  border-left:1.5px solid var(--bd);
  box-shadow:-12px 0 40px rgba(0,0,0,0.6);
  display:flex;flex-direction:column;overflow:hidden;
  transform:translateX(105%);
  transition:transform 0.28s cubic-bezier(0.4,0,0.2,1);
}
#mobile-filter-drawer.qf-sidebar-open{transform:translateX(0);}
/* Dim backdrop behind sidebar */
#qf-sidebar-backdrop{
  position:fixed;top:var(--qf-sidebar-top,57px);left:0;right:0;bottom:0;
  background:rgba(0,0,0,0.38);
  z-index:1001;
  opacity:0;pointer-events:none;
  transition:opacity 0.28s;
}
#qf-sidebar-backdrop.open{opacity:1;pointer-events:all;}
/* Sidebar header bar */
.qf-sidebar-hd{
  display:flex;align-items:center;gap:8px;
  padding:11px 14px 11px 14px;
  border-bottom:1.5px solid var(--bd);
  flex-shrink:0;background:color-mix(in srgb, var(--bg) 75%, white 25%);
}
.qf-sidebar-hd-title{
  flex:1;font-size:0.72rem;font-weight:700;
  font-family:'Syne',sans-serif;
  color:var(--tx);text-transform:uppercase;letter-spacing:0.09em;
}
.qf-sidebar-close{
  background:none;border:1px solid var(--bd);color:var(--mu);cursor:pointer;
  font-size:0.9rem;line-height:1;padding:4px 8px;border-radius:6px;
  transition:color .15s,background .15s,border-color .15s;
}
.qf-sidebar-close:hover{color:var(--tx);background:rgba(255,255,255,0.06);border-color:var(--tx);}
/* Strip scrolls vertically inside sidebar */
#mobile-filter-drawer .qf-strip{
  flex:1;overflow-y:auto;padding:10px 12px;display:flex!important;
}
#mobile-filter-drawer .qf-row{flex-direction:column;flex-wrap:nowrap;gap:8px;width:100%;}
#mobile-filter-drawer .qf-section{min-width:0;flex:none;width:100%;max-width:100%;}
#mobile-filter-drawer .qf-section-title{font-size:0.68rem;}
#mobile-filter-drawer .qf-chips{max-height:none;flex-wrap:wrap;}
/* Appointment cards: full-width inside sidebar so PO chips wrap without truncation */
#mobile-filter-drawer #appt-box-body{flex-direction:column;gap:8px;}
#mobile-filter-drawer .appt-pin-group{width:100%;min-width:0;box-sizing:border-box;flex:none;}
#mobile-filter-drawer .appt-pin-pos{flex-wrap:wrap;overflow:visible;}
#mobile-filter-drawer .appt-pin-po{white-space:nowrap;}
/* Section header improvements inside sidebar */
#mobile-filter-drawer .qf-section-hd{
  padding:5px 8px 6px 8px;margin:-5px -8px 7px -8px;
  border-radius:6px 6px 0 0;border-bottom:1.5px solid var(--bd);
  background:rgba(255,255,255,0.025);
  transition:background .15s,border-bottom-color .15s;
}
#mobile-filter-drawer .qf-section-hd:hover{
  background:rgba(96,165,250,0.08);border-bottom-color:var(--bl);
}
#mobile-filter-drawer .qf-section-hd:hover .qf-section-title{color:var(--bl);}
#mobile-filter-drawer .qf-caret{font-size:0.8rem;color:var(--mu);transition:transform .22s,color .15s;}
#mobile-filter-drawer .qf-section-hd:hover .qf-caret{color:var(--bl);}

/* mobile blocks moved to consolidated mobile section at end of file */

/* \u2500\u2500 V-MART FROZEN HEADER + FILTER ROW \u2500\u2500 */
.vmart-tbl{border-collapse:separate!important;border-spacing:0!important;}
/* Row 1: column headers freeze at top:0 */
#vmart-main-tbl .vmart-col-header th{
  position:sticky!important;top:0!important;z-index:12!important;
  background:var(--bg)!important;
}
/* Row 2: filter dropdowns freeze just below row 1 \u2014 top set by JS */
#vmart-main-tbl .vmart-filter-row th{
  position:sticky!important;top:32px!important;/* JS will override */z-index:11!important;
  background:var(--s2)!important;
  border-bottom:2px solid var(--bd)!important;
  padding:3px 4px!important;
}
.vmf-sel{width:100%;min-width:60px;max-width:120px;padding:2px 4px;background:var(--bg);border:1px solid var(--bd);border-radius:4px;color:var(--tx);font-family:DM Mono,monospace;font-size:0.6rem;outline:none;cursor:pointer;}
.vmf-sel:focus{border-color:var(--bl);}
.vmf-sel.active{border-color:var(--ac);background:rgba(74,222,128,0.07);color:var(--ac);}
/* \u2500\u2500 PO TABLE COLUMN FILTER STRIP \u2500\u2500 */
.col-filter-strip{
  background:var(--tf);
  border-bottom:2px solid var(--bd);
  padding:6px 10px;
  display:flex;
  gap:5px;
  overflow-x:auto;
  scrollbar-width:none;
  flex-shrink:0;
  align-items:center;
}
.col-filter-strip::-webkit-scrollbar{display:none;}
.col-filter-strip.hidden{display:none;}
.cfi-wrap{display:flex;flex-direction:column;gap:2px;flex-shrink:0;}
.cfi-label{font-size:0.5rem;font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:1px;color:var(--mu);white-space:nowrap;}
.cfi-input{
  padding:4px 7px;
  border:1.5px solid var(--bd);
  border-radius:5px;
  background:var(--bg);
  color:var(--tx);
  font-family:DM Mono,monospace;
  font-size:0.65rem;
  outline:none;
  width:80px;
  transition:border-color .15s;
}
.cfi-input:focus{border-color:var(--bl);}
.cfi-input.has-val{border-color:var(--ac);background:rgba(74,222,128,0.05);}
.cfi-clear{
  padding:5px 10px;
  border:1px solid var(--rd);
  border-radius:5px;
  background:transparent;
  color:var(--rd);
  font-size:0.65rem;
  cursor:pointer;
  font-family:DM Mono,monospace;
  white-space:nowrap;
  flex-shrink:0;
  align-self:flex-end;
}
.cfi-clear:hover{background:rgba(248,113,113,0.1);}
/* \u2500\u2500 MOBILE CARD VIEW (moved to consolidated mobile section) \u2500\u2500 */
/* \u2500\u2500 MOBILE CARD \u2014 TEMPLATE A flat layout \u2500\u2500 */
.pca-top{
  display:flex;align-items:center;gap:7px;
  padding:9px 12px 8px;
}
.pca-dc{
  font-family:DM Mono,monospace;font-size:0.64rem;font-weight:700;
  color:var(--bl);background:rgba(96,165,250,0.1);
  border:1px solid rgba(96,165,250,0.25);border-radius:6px;
  padding:3px 8px;white-space:nowrap;flex-shrink:0;
}
.pca-dc.expired{color:var(--rd);background:rgba(248,113,113,0.08);border-color:rgba(248,113,113,0.25);}
.pca-date{
  margin-left:auto;font-family:DM Mono,monospace;font-size:0.6rem;
  color:var(--mu);white-space:nowrap;flex-shrink:0;
}
.pca-body{
  display:flex;align-items:flex-start;gap:10px;
  padding:4px 12px 10px;border-bottom:1px solid var(--bd);
}
.pca-left{flex:1;min-width:0;}
.pca-desc{
  font-size:0.92rem;font-weight:700;color:var(--tx);
  line-height:1.3;margin-bottom:5px;
}
.pca-desc.expired{text-decoration:line-through;color:var(--rd);}
.pca-meta{
  font-size:0.6rem;color:var(--mu);font-family:DM Mono,monospace;
  line-height:1.4;
}
.pca-right{
  text-align:right;flex-shrink:0;
}
.pca-mrp{
  font-size:1.15rem;font-weight:800;font-family:DM Mono,monospace;
  color:var(--ac);line-height:1.1;
}
.pca-packs{
  font-size:0.62rem;color:var(--or);font-family:DM Mono,monospace;
  font-weight:600;margin-top:2px;
}
.pca-footer{
  display:flex;align-items:center;justify-content:flex-end;
  padding:5px 12px 8px;
}
.pca-margin-val{}
.pca-margin-val .po-card-margin{font-size:0.8rem;font-weight:800;}


.po-card{
  width:calc(100% - 20px);box-sizing:border-box;
  background:var(--sf);
  border:1px solid var(--bd);
  border-radius:12px;
  margin:8px 10px;
  overflow:hidden;
  transition:border-color .15s;
}
.po-card:active{border-color:var(--ac);}
.po-card.po-expired{border-left:3px solid var(--rd);opacity:0.82;}

/* topbar row */
.po-card-topbar{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--th);border-bottom:1px solid var(--bd);}
.po-card-dc{font-family:DM Mono,monospace;font-size:0.65rem;font-weight:600;color:var(--bl);background:rgba(96,165,250,0.08);border:1px solid rgba(96,165,250,0.18);border-radius:5px;padding:2px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%;}
.po-card-dc.expired{color:var(--rd);background:rgba(248,113,113,0.06);border-color:rgba(248,113,113,0.22);}
.po-card-po{font-family:DM Mono,monospace;font-size:0.72rem;font-weight:700;color:var(--ac);margin-left:auto;white-space:nowrap;}
.po-card-po.expired{color:var(--rd);}
.po-card-brand{display:inline-block;font-size:0.58rem;font-weight:700;padding:2px 7px;border-radius:10px;background:rgba(251,146,60,0.1);color:var(--or);border:1px solid rgba(251,146,60,0.22);white-space:nowrap;}

/* item name */
.po-card-desc{padding:9px 12px 8px;font-size:0.86rem;font-weight:700;color:var(--tx);line-height:1.3;border-bottom:1px solid var(--bd);}

/* hero stat boxes */
.po-card-heroes{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--bd);}
.po-card-hero{padding:10px 14px;display:flex;flex-direction:column;gap:3px;background:var(--tf);}
.po-card-hero+.po-card-hero{border-left:1px solid var(--bd);}
.po-card-hero-lbl{font-size:0.46rem;font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:1.5px;color:var(--mu);}
.po-card-hero-val{font-size:1.3rem;font-weight:700;font-family:DM Mono,monospace;line-height:1.1;}
.po-card-hero-val.mrp{color:var(--ac);}
.po-card-hero-val.packs{color:var(--or);}

/* chips footer */
.po-card-footer{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;gap:8px;}
.po-card-chips{display:flex;gap:5px;flex-wrap:wrap;flex:1;}
.po-card-chip{background:var(--bg);border:1px solid var(--bd);border-radius:5px;padding:2px 7px;color:var(--mu);font-size:0.56rem;font-family:DM Mono,monospace;}
.po-card-right{text-align:right;flex-shrink:0;}
.po-card-margin{font-size:0.72rem;font-weight:700;font-family:DM Mono,monospace;}
.po-card-date{font-size:0.56rem;color:var(--mu);font-family:DM Mono,monospace;}

#mobile-card-norows{text-align:center;padding:48px 20px;color:var(--mu);font-size:0.82rem;}

/* \u2500\u2500 MOBILE BRAND BAR \u2500\u2500 */
/* \u2500\u2500 MOBILE SUMMARY BAR \u2500\u2500 */
#mobile-summary-bar{
  display:none;
  position:sticky;top:0;z-index:10;
  background:var(--tf);
  border-bottom:2px solid var(--bd);
}
#mobile-summary-bar.has-rows{display:flex;}
.msb-item{
  flex:1;display:flex;flex-direction:column;align-items:center;
  padding:6px 4px;gap:2px;
}
.msb-item+.msb-item{border-left:1px solid var(--bd);}
.msb-lbl{font-size:0.42rem;font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:1.5px;color:var(--mu);}
.msb-val{font-size:0.82rem;font-weight:700;font-family:DM Mono,monospace;color:var(--tx);}
.msb-val.ac{color:var(--ac);}
.msb-val.or{color:var(--or);}

/* #mobile-brand-bar removed (dead code) */
/* \u2550\u2550\u2550 END MOBILE \u2550\u2550\u2550 */

/* \u2550\u2550\u2550 FLASH ALERT BAR (inline inside #topnav) \u2014 hidden, replaced by tab badges \u2550\u2550\u2550 */
#flash-alert-bar{display:none!important}
@keyframes flashBgShift{
  0%{background-position:0% 50%;opacity:1}
  100%{background-position:100% 50%;opacity:.88}
}
/* \u2550\u2550\u2550 TAB APPOINTMENT BADGE \u2014 absolute strip at bottom of buyer tab \u2550\u2550\u2550 */
.buyer-tab.tab-has-appt{padding-bottom:20px}
.tab-appt-badge{
  --_br:139,92,246; /* violet \u2014 used for border/color only */
  position:absolute;bottom:3px;left:50%;transform:translateX(-50%);
  display:inline-flex;align-items:center;gap:4px;
  font-size:0.62rem;font-weight:700;letter-spacing:.3px;
  padding:2px 8px;white-space:nowrap;overflow:hidden;
  font-family:DM Mono,monospace;
  border-radius:20px;
  background:linear-gradient(90deg,rgba(124,58,237,.88),rgba(220,38,38,.85),rgba(3,105,161,.88));
  background-size:300% 100%;
  border:1.5px solid rgba(var(--_br),.62);
  color:#fff;
  animation:sfbGrad 8s ease-in-out infinite alternate, tabApptPulse 1.4s ease-in-out infinite alternate;
  z-index:2;
}
@keyframes tabApptPulse{
  from{opacity:.85;box-shadow:0 0 5px rgba(var(--_br),.25)}
  to{opacity:1;box-shadow:0 0 12px rgba(var(--_br),.65),0 0 22px rgba(var(--_br),.2)}
}
/* Light themes \u2014 deeper violet stays readable on pale backgrounds */
[data-theme="light"] .tab-appt-badge,
[data-theme="silver"] .tab-appt-badge,
[data-theme="skyblue"] .tab-appt-badge,
[data-theme="lightnavy"] .tab-appt-badge,
[data-theme="cleanslate"] .tab-appt-badge,
[data-theme="warmpaper"] .tab-appt-badge{--_br:109,40,217}
.tab-appt-dismiss{
  background:rgba(var(--_br),.18);border:none;color:inherit;
  width:13px;height:13px;border-radius:50%;cursor:pointer;
  font-size:8px;display:inline-flex;align-items:center;justify-content:center;
  flex-shrink:0;line-height:1;padding:0;transition:background .15s;
}
.tab-appt-dismiss:hover{background:rgba(var(--_br),.45)}
/* \u2500\u2500 PO Group Expand / Collapse + Selection \u2500\u2500 */
.po-sel-cb,.po-sel-all{accent-color:var(--ac);width:14px;height:14px;cursor:pointer;vertical-align:middle}
.po-exp-btn{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border:1.5px solid rgba(99,179,237,0.4);border-radius:6px;background:rgba(99,179,237,0.06);color:var(--ac);cursor:pointer;font-size:9px;font-weight:900;flex-shrink:0;transition:transform .2s ease,background .15s,border-color .15s;vertical-align:middle;margin-right:6px;padding:0;line-height:1}
.po-exp-btn:hover{background:rgba(99,179,237,0.18);border-color:var(--ac)}.po-exp-btn.xp{transform:rotate(90deg);background:rgba(99,179,237,0.22);border-color:var(--ac)}
.po-xall-btn{display:inline-flex;align-items:center;justify-content:center;gap:3px;font-size:9px;font-weight:700;background:rgba(99,179,237,0.08);border:1.5px solid rgba(99,179,237,0.35);border-radius:5px;color:var(--ac);cursor:pointer;padding:2px 5px;white-space:nowrap;transition:all .15s;line-height:1}
.po-xall-btn:hover{background:rgba(99,179,237,0.2);border-color:var(--ac)}
tr.po-item-row{display:none}
tr.po-sub-row{display:none}
tr.rl-dc-group-hdr td{font-weight:800;font-family:DM Mono,monospace;letter-spacing:.3px;}
tr.rl-dc-group-hdr+tr{border-top:none;}
/* \u2500\u2500 Global PO Selection Action Bar \u2500\u2500 */
#po-global-action-bar{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:8000;display:none;align-items:center;flex-wrap:wrap;gap:6px;background:var(--sf);border:1.5px solid var(--ac);border-radius:12px;padding:7px 14px;box-shadow:0 6px 28px rgba(0,0,0,.4);width:max-content;max-width:min(96vw,920px)}
#po-global-action-bar.active{display:flex}
.po-act-lbl{font-size:0.78rem;font-weight:700;color:var(--ac);flex:1;min-width:90px;font-family:DM Mono,monospace;white-space:nowrap}
.po-act-btn{padding:4px 9px;border-radius:7px;border:1.5px solid var(--bd);background:var(--sf);color:var(--tx);cursor:pointer;font-size:0.68rem;font-weight:600;transition:all .15s;white-space:nowrap}
.po-act-btn:hover{background:var(--ac);color:#fff;border-color:var(--ac)}
.po-act-btn.clr{border-color:rgba(248,113,113,.5);color:#f87171}.po-act-btn.clr:hover{background:#f87171;color:#fff}
.flash-chip-days{
  font-size:0.6rem;background:rgba(0,0,0,.25);
  border-radius:10px;padding:1px 5px;white-space:nowrap;
}
.flash-chip-dismiss{
  background:rgba(0,0,0,.2);border:none;color:#fff;
  width:14px;height:14px;border-radius:50%;cursor:pointer;
  font-size:9px;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;line-height:1;padding:0;transition:background .15s;
}
.flash-chip-dismiss:hover{background:rgba(0,0,0,.5)}

/* \u2550\u2550\u2550 THEME VARIABLES \u2550\u2550\u2550 */
:root{
  --bg:#0f1117;--sf:#181c27;--s2:#1e2435;--bd:#252d3d;--accent-glow:rgba(59,130,246,.12);
  --ac:#4ade80;--bl:#60a5fa;--or:#fb923c;--rd:#f87171;
  --tx:#e2e8f0;--mu:#8897a9;--th:#1a2235;--tf:#141929;
  --tH:52px;--tbH:56px;--sbW:220px;
  --dash-kpi-col:#ffffff;
}
[data-theme="light"]{
  --bg:#f0f4f8;--sf:#ffffff;--s2:#e8eef4;--bd:#cbd5e1;
  --ac:#16a34a;--bl:#2563eb;--or:#ea580c;--rd:#dc2626;
  --tx:#0f172a;--mu:#4a5d70;--th:#dde3ea;--tf:#e8eef4;
  --dash-kpi-col:#1e3a5f;
  --pill-txt-color:#111827;
}
[data-theme="blue"]{
  --bg:#0a0f1e;--sf:#0d1526;--s2:#111c36;--bd:#1e2d4d;
  --ac:#38bdf8;--bl:#818cf8;--or:#fb923c;--rd:#f87171;
  --tx:#e0eaff;--mu:#7a9dc8;--th:#0f1c38;--tf:#0a1428;
}
[data-theme="green"]{
  --bg:#071410;--sf:#0d1f19;--s2:#112a22;--bd:#1a3d2e;
  --ac:#34d399;--bl:#6ee7b7;--or:#fbbf24;--rd:#f87171;
  --tx:#d1fae5;--mu:#6aaa88;--th:#0d2018;--tf:#081510;
}
[data-theme="purple"]{
  --bg:#100c1e;--sf:#180f2e;--s2:#1f1340;--bd:#2d1b5e;
  --ac:#a78bfa;--bl:#c084fc;--or:#fb923c;--rd:#f87171;
  --tx:#ede9fe;--mu:#9d7fd0;--th:#1a1035;--tf:#120d28;
}
/* \u2500\u2500 NEW THEMES \u2500\u2500 */
[data-theme="navy"]{
  --bg:#080d18;--sf:#0a1220;--s2:#0d1830;--bd:#1a3060;
  --ac:#38bdf8;--bl:#7dd3fc;--or:#fbbf24;--rd:#f87171;
  --tx:#c8d8f0;--mu:#6080b0;--th:#060e1c;--tf:#060e1c;
}
[data-theme="warm"]{
  --bg:#100e0b;--sf:#140f0a;--s2:#1c1710;--bd:#2a1e10;
  --ac:#f59e0b;--bl:#fbbf24;--or:#fb923c;--rd:#f87171;
  --tx:#e8d8c0;--mu:#947860;--th:#0e0c09;--tf:#0a0806;
}
[data-theme="minimal"]{
  --bg:#050506;--sf:#0a0a0f;--s2:#0d0d12;--bd:#111116;
  --ac:#4ade80;--bl:#86efac;--or:#fb923c;--rd:#f87171;
  --tx:#e0e2ea;--mu:#787888;--th:#030304;--tf:#030304;
}
[data-theme="violet"]{
  --bg:#0d0d14;--sf:#0f0f1a;--s2:#12121e;--bd:#1e1e32;
  --ac:#a3e635;--bl:#a78bfa;--or:#fb923c;--rd:#f87171;
  --tx:#d0d4e8;--mu:#787898;--th:#0a0a12;--tf:#080810;
}
[data-theme="silver"]{
  --bg:#e8edf2;--sf:#f4f6f9;--s2:#dde3ea;--bd:#c4cdd6;
  --ac:#2563eb;--bl:#0ea5e9;--or:#d97706;--rd:#dc2626;
  --tx:#1e293b;--mu:#4a5d70;--th:#dae0e8;--tf:#e4e8ed;
  --dash-kpi-col:#1e3a5f;
  --pill-txt-color:#111827;
}
[data-theme="skyblue"]{
  --bg:#e8f4fd;--sf:#f0f9ff;--s2:#dbeefe;--bd:#b8dcf8;
  --ac:#0284c7;--bl:#2563eb;--or:#d97706;--rd:#dc2626;
  --tx:#0c2d48;--mu:#2d5f88;--th:#d8edfb;--tf:#e4f3fc;
  --dash-kpi-col:#1e3a5f;
  --pill-txt-color:#111827;
}
[data-theme="lightnavy"]{
  --bg:#dce8f5;--sf:#eaf2fc;--s2:#cddff0;--bd:#a8c8e8;
  --ac:#1d4ed8;--bl:#2563eb;--or:#ea580c;--rd:#dc2626;
  --tx:#0f2041;--mu:#1a508a;--th:#cfdeed;--tf:#d9e9f7;
  --dash-kpi-col:#1e3a5f;
  --pill-txt-color:#111827;
}
[data-theme="metallic"]{
  --bg:#1a1d22;--sf:#22262e;--s2:#2a2f38;--bd:#3a404c;
  --ac:#94a3b8;--bl:#7dd3fc;--or:#fbbf24;--rd:#f87171;
  --tx:#e2e8f0;--mu:#8b9298;--th:#1e222a;--tf:#181c24;
}
[data-theme="brown"]{
  --bg:#1a1008;--sf:#241608;--s2:#2c1c0c;--bd:#3d2a10;
  --ac:#c2823c;--bl:#d4a76a;--or:#f59e0b;--rd:#f87171;
  --tx:#f0dfc0;--mu:#b09070;--th:#1c1108;--tf:#160e06;
}
[data-theme="aurora"]{
  --bg:#0d1117;--sf:#161b22;--s2:#1c2333;--bd:#21262d;
  --ac:#3fb950;--bl:#58a6ff;--or:#f0883e;--rd:#f85149;
  --tx:#c9d1d9;--mu:#8b949e;--th:#161b22;--tf:#0d1117;
}
[data-theme="cleanslate"]{
  --bg:#f0f4f8;--sf:#ffffff;--s2:#e8eef4;--bd:#cbd5e1;
  --ac:#16a34a;--bl:#2563eb;--or:#ea580c;--rd:#dc2626;
  --tx:#0f172a;--mu:#4a5d70;--th:#dde3ea;--tf:#e8eef4;
  --dash-kpi-col:#1e3a5f;
}
[data-theme="neon"]{
  --bg:#050709;--sf:#0a0d12;--s2:#0f1320;--bd:#1a2030;
  --ac:#00ffa3;--bl:#0ea5e9;--or:#f59e0b;--rd:#f43f5e;
  --tx:#94a3b8;--mu:#7a8fa8;--th:#080b10;--tf:#050709;
}
[data-theme="warmpaper"]{
  --bg:#f5f0e8;--sf:#faf8f3;--s2:#f0ece3;--bd:#e2d9c9;
  --ac:#2a7a50;--bl:#5b7fa6;--or:#a0602a;--rd:#a03030;
  --tx:#2c2416;--mu:#6a5538;--th:#ede8df;--tf:#f0ece3;
  --dash-kpi-col:#1e3a5f;
}

*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--tx);height:100dvh;display:flex;flex-direction:column;transition:background .2s,color .2s;overflow:hidden}
/* \u2550\u2550\u2550 CUSTOM SCROLLBARS \u2550\u2550\u2550 */
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--bd);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--mu)}


/* \u2550\u2550\u2550 LOGIN \u2550\u2550\u2550 */
#login-screen{
  position:fixed;inset:0;z-index:9999;
  display:none;
  align-items:center;justify-content:center;
  /* Mesh gradient background \u2014 purple / red / blue blobs */
  background:
    radial-gradient(ellipse 60% 55% at 25% 15%, #5c1a6e 0%, transparent 65%),
    radial-gradient(ellipse 55% 50% at 75% 20%, #7b1a3a 0%, transparent 60%),
    radial-gradient(ellipse 65% 60% at 50% 85%, #1a2e7a 0%, transparent 65%),
    radial-gradient(ellipse 50% 45% at 80% 70%, #3b1a5c 0%, transparent 55%),
    #160a28;
  overflow:hidden;
}
#login-screen.ls-show{display:flex;}
/* subtle animated shimmer on background */
#login-screen::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 40% 40% at 60% 40%, rgba(200,80,160,0.18) 0%, transparent 60%),
    radial-gradient(ellipse 35% 35% at 30% 60%, rgba(80,100,220,0.15) 0%, transparent 60%);
  animation:lbgShimmer 8s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes lbgShimmer{
  0%{opacity:0.6;transform:scale(1);}
  100%{opacity:1;transform:scale(1.08);}
}

.l-right{
  width:100%;max-width:340px;
  padding:20px;
  position:relative;z-index:1;
}
.lbox{
  width:100%;
  background:rgba(255,255,255,0.1);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
  border:1px solid rgba(255,255,255,0.18);
  border-radius:26px;
  padding:44px 32px 32px;
  box-shadow:0 8px 40px rgba(0,0,0,0.45),inset 0 1px 0 rgba(255,255,255,0.15);
  display:flex;flex-direction:column;align-items:center;
}
/* Welcome text above icon */
.l-welcome{
  font-size:1.3rem;font-weight:800;color:#fff;
  letter-spacing:-0.3px;margin-bottom:3px;text-align:center;
}
.l-subtitle{
  font-size:0.65rem;color:rgba(255,255,255,0.5);
  text-align:center;letter-spacing:0.06em;
  text-transform:uppercase;margin-bottom:22px;
}

/* PO icon circle */
.l-avatar{
  width:72px;height:72px;border-radius:50%;
  background:rgba(255,255,255,0.12);
  border:1.5px solid rgba(255,255,255,0.22);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 28px;
  box-shadow:0 4px 20px rgba(0,0,0,0.3);
}

/* Underline-style input rows */
.lfield{
  width:100%;margin-bottom:22px;position:relative;
  display:flex;align-items:center;
  border-bottom:1.5px solid rgba(255,255,255,0.35);
  transition:border-color .2s;
}
.lfield:focus-within{border-bottom-color:rgba(255,255,255,0.85);}
.lfield-icon{
  color:rgba(255,255,255,0.55);
  margin-right:10px;flex-shrink:0;font-size:0.85rem;
  line-height:1;
}
.lfield input{
  width:100%;padding:9px 0;
  border:none;background:transparent!important;
  color:#fff!important;font-size:0.9rem;outline:none;
  caret-color:#fff;
  /* kill browser autofill white box */
  -webkit-text-fill-color:#fff!important;
}
/* override webkit autofill yellow/white background \u2014
   solid dark colour works even when login screen is shown dynamically (post-logout);
   transparent fails in Brave/Chrome when form is revealed via JS */
.lfield input:-webkit-autofill,
.lfield input:-webkit-autofill:hover,
.lfield input:-webkit-autofill:focus,
.lfield input:-webkit-autofill:active{
  -webkit-box-shadow:0 0 0 1000px #241540 inset!important;
  box-shadow:0 0 0 1000px #241540 inset!important;
  -webkit-text-fill-color:#fff!important;
  caret-color:#fff!important;
  transition:background-color 99999s ease-in-out 0s;
}
.lfield input::placeholder{color:rgba(255,255,255,0.45);}
.lfield input.err::placeholder{color:rgba(248,113,113,0.7);}

/* Remember me row */
.l-remember-row{
  display:flex;align-items:center;
  width:100%;margin-bottom:26px;font-size:0.74rem;color:rgba(255,255,255,0.65);
}
.l-remember-row label{display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none;}
.l-remember-row input[type=checkbox]{accent-color:#a78bfa;cursor:pointer;}

.lerr{
  width:100%;font-size:0.7rem;color:#fca5a5;
  margin-top:-10px;margin-bottom:10px;
  text-align:center;min-height:18px;
}
.lbtn{
  width:100%;padding:14px;border:none;border-radius:12px;
  background:linear-gradient(135deg,#4a2a9e 0%,#2d1d7a 100%);
  color:#fff;font-size:0.78rem;font-weight:800;cursor:pointer;
  letter-spacing:2.5px;text-transform:uppercase;
  transition:all .18s;
  box-shadow:0 4px 24px rgba(74,42,158,0.55);
}
.lbtn:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(74,42,158,0.75);}
.lbtn:active{transform:translateY(0);}
.lbtn:disabled{opacity:0.65;cursor:not-allowed;transform:none;}
.l-footer{margin-top:22px;text-align:center;font-size:0.6rem;color:rgba(255,255,255,0.35);letter-spacing:0.05em;}

/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550
   RIPPLE PULSE \u2014 Entry effect
   Triggers on login + page refresh
\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */
#ripple-entry{
  position:fixed;inset:0;z-index:9998;
  background:#0d1117;
  display:none;
  align-items:center;justify-content:center;
  pointer-events:none;
}
#ripple-entry.active{display:flex;}
#ripple-canvas{position:absolute;inset:0;width:100%;height:100%;}
#ripple-logo-el{
  position:relative;z-index:2;
  width:68px;height:68px;border-radius:18px;
  background:linear-gradient(135deg,var(--ac),#22d3ee);
  display:flex;align-items:center;justify-content:center;
  font-weight:900;font-size:22px;color:#000;
  box-shadow:0 0 0 10px rgba(74,222,128,0.08),0 0 48px rgba(74,222,128,0.5);
  opacity:0;transform:scale(0.4);
  transition:opacity 0.4s cubic-bezier(0.34,1.56,0.64,1),transform 0.4s cubic-bezier(0.34,1.56,0.64,1);
}
#ripple-logo-el.pop{opacity:1;transform:scale(1);}
#ripple-wordmark{
  position:absolute;z-index:2;
  font-size:1.1rem;font-weight:800;color:#fff;letter-spacing:-0.3px;
  margin-top:96px;
  opacity:0;transform:translateY(8px);
  transition:opacity 0.35s ease 0.25s,transform 0.35s ease 0.25s;
}
#ripple-wordmark em{color:var(--ac);font-style:normal;}
#ripple-wordmark.pop{opacity:1;transform:translateY(0);}

/* \u2550\u2550\u2550 TOPBAR (kept for legacy JS, hidden on desktop) \u2550\u2550\u2550 */
.topbar{display:none}
.tbrand em{color:var(--ac);font-style:normal}
.tbrand-by{font-size:9px;font-weight:500;color:var(--mu);letter-spacing:.4px;font-family:DM Mono,monospace;margin-left:2px;opacity:.65}
.tab{display:none}
.tab.active{display:none}
.tab.hidden{display:none}
.tbadge{background:var(--ac);color:#000;font-size:0.56rem;font-weight:700;padding:1px 5px;border-radius:9px;display:none}.tbadge.on{display:inline}
.t-right{display:none}
.uchip{display:none}
.rbadge{font-size:0.59rem;font-weight:700;padding:1px 5px;border-radius:8px}
.ra{background:#7c3aed;color:#fff}.ru{background:#0369a1;color:#fff}
.sdot{width:8px;height:8px;border-radius:50%;background:var(--mu);transition:background .3s;flex-shrink:0}
.sdot.ok{background:var(--ac)}.sdot.err{background:var(--rd)}
.slbl{font-size:0.59rem;color:var(--mu);font-family:DM Mono,monospace}
.logout-btn{display:none}
.theme-btn{width:22px;height:22px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:border-color .15s;flex-shrink:0}
.theme-btn:hover,.theme-btn.active{border-color:var(--tx)}

/* \u2550\u2550\u2550 SIDEBAR \u2550\u2550\u2550 */
#app-shell{display:none;flex:1;min-height:0;overflow:hidden}#app-shell.shell-visible{display:flex}
#main-col{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}

/* Sidebar \u2014 starts expanded */
#sidebar{
  width:var(--sbW);flex-shrink:0;
  background:var(--sf);border-right:1px solid var(--bd);
  display:none;flex-direction:column;height:100vh;overflow:hidden;
  transition:width .22s cubic-bezier(.4,0,.2,1);z-index:300;
}
#sidebar.sb-open{display:flex}

/* Collapsed icon-only state (desktop) */
#sidebar.sb-collapsed{ width:52px; overflow:hidden }

/* Hide all text/extra elements when collapsed */
#sidebar.sb-collapsed .sb-nav-text,
#sidebar.sb-collapsed .sb-nav-label,
#sidebar.sb-collapsed .sb-nav-badge,
#sidebar.sb-collapsed .sb-bottom-text,
#sidebar.sb-collapsed .sb-themes,
#sidebar.sb-collapsed .sb-srv,
#sidebar.sb-collapsed .sb-user-info,
#sidebar.sb-collapsed .sb-logout,
#sidebar.sb-collapsed #custom-theme-panel { display:none !important }

/* Nav section padding */
#sidebar.sb-collapsed .sb-nav { padding:6px 0; overflow:visible }

/* Each nav item: full-width, centered icon, no gap */
#sidebar.sb-collapsed .sb-ni {
  width:52px; padding:10px 0;
  justify-content:center; gap:0;
  border-color:transparent !important;
  border-radius:0;
}
#sidebar.sb-collapsed .sb-ni.active {
  background:rgba(74,222,128,0.1);
  border-left:2px solid var(--ac) !important;
}

/* Icon size */
#sidebar.sb-collapsed .sb-nav-icon { width:18px; height:18px; opacity:0.65; flex-shrink:0 }
#sidebar.sb-collapsed .sb-ni.active .sb-nav-icon { opacity:1 }

/* Logo: just the icon box centred */
/* sb-logo removed \u2014 brand text hidden in collapsed state via .sb-brand-text rule */

/* Bottom section */
#sidebar.sb-collapsed .sb-bottom { padding:8px 0; display:flex; flex-direction:column; align-items:center; gap:8px }
#sidebar.sb-collapsed .sb-user  { padding:6px 0; justify-content:center; width:52px }

/* Tooltip handled by JS (#sb-tip appended to body) */
#sidebar.sb-collapsed .sb-ni { position:relative }

/* Toggle row \u2014 pinned at very top of sidebar */
#sb-toggle-row{
  display:flex;align-items:center;justify-content:flex-end;
  padding:6px 10px;flex-shrink:0;border-bottom:1px solid var(--bd);
  height:38px;gap:6px;
}
#sidebar.sb-collapsed #sb-toggle-row{justify-content:center;padding:6px 0;gap:0}
#sidebar.sb-collapsed #sb-logout-top{display:none!important}
/* Toggle button */
#sb-toggle-btn{
  display:flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:6px;
  border:1px solid var(--bd);background:transparent;color:var(--mu);
  cursor:pointer;transition:all .15s;flex-shrink:0;
}
#sb-toggle-btn:hover{border-color:var(--tx);color:var(--tx);background:var(--s2)}
#sidebar.sb-collapsed #sb-toggle-btn svg{transform:rotate(180deg)}

/* sidebar mobile block moved to consolidated mobile section */

#main-content{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
/* sb-logo / sb-brand removed \u2014 branding is in .tbrand (topnav) only */
/* Logout button in sidebar \u2014 mobile only */
.sb-mob-logout{display:none}
@media(max-width:768px){
  .sb-mob-logout{
    display:block!important;width:100%;padding:12px;margin-top:8px;
    border:1.5px solid rgba(239,68,68,.35);border-radius:10px;
    background:rgba(239,68,68,.08);color:#f87171;
    font-size:0.78rem;font-weight:700;cursor:pointer;
    font-family:'DM Mono',monospace;letter-spacing:.03em;
    transition:background .15s,border-color .15s;
  }
  .sb-mob-logout:active{background:rgba(239,68,68,.2);border-color:#f87171}
}
.sb-logo-text em{color:var(--ac);font-style:normal}
.sb-nav{padding:14px 10px 6px;flex:1;overflow-y:auto;overflow-x:hidden}
.sb-nav::-webkit-scrollbar{width:3px}
.sb-nav::-webkit-scrollbar-thumb{background:var(--bd);border-radius:3px}
.sb-nav-label{font-size:9px;font-weight:600;letter-spacing:2px;color:var(--mu);text-transform:uppercase;padding:0 8px 5px;font-family:DM Mono,monospace;margin-top:6px}
.sb-ni{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:12.5px;font-weight:500;color:var(--mu);transition:all .15s;margin-bottom:1px;user-select:none;border:1px solid transparent}
.sb-ni:hover{background:var(--s2);color:var(--tx)}
.sb-ni.active{background:rgba(74,222,128,0.1);color:var(--ac);border-color:rgba(74,222,128,0.2)}
.sb-nav-icon{width:15px;height:15px;opacity:0.65;flex-shrink:0}
.sb-ni.active .sb-nav-icon{opacity:1}
.sb-nav-badge{margin-left:auto;font-size:9.5px;font-weight:700;padding:1px 5px;border-radius:8px;font-family:DM Mono,monospace;background:var(--ac);color:#000;display:none}
.sb-nav-badge.on{display:inline}
.sb-sub-item{display:flex;align-items:center;gap:7px;padding:6px 10px 6px 8px;border-radius:7px;cursor:pointer;font-size:11.5px;font-weight:500;color:var(--mu);transition:all .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-sub-item:hover{background:var(--s2);color:var(--tx)}
.sb-sub-item.active{color:var(--ac);background:rgba(74,222,128,0.07)}
/* Buyer sub-item icon \u2014 expanded state */
/* Vendor code chip beside buyer title */
.buyer-vcode{display:inline-block;font-size:0.78rem;font-weight:800;font-family:'DM Mono',monospace;color:#fff;background:rgba(74,222,128,0.22);border:1.5px solid #4ade80;border-radius:6px;padding:2px 10px;vertical-align:middle;letter-spacing:.06em;margin-left:8px;white-space:nowrap;text-shadow:0 0 8px rgba(74,222,128,0.6)}
.sb-sub-icon{width:18px;height:18px;border-radius:3px;object-fit:contain;flex-shrink:0}
.sb-sub-icon-txt{display:flex;align-items:center;justify-content:center;width:18px;height:18px;background:var(--s2);border-radius:3px;font-size:9px;font-weight:700;color:var(--tx);flex-shrink:0;border:1px solid var(--bd)}
/* Collapsed sidebar: buyer menu becomes icon strip (always visible) */
#sidebar.sb-collapsed #sb-buyer-menu{display:flex !important;flex-direction:column;gap:0;padding:0 !important;margin:0 !important}
#sidebar.sb-collapsed .sb-sub-item{width:52px;padding:8px 0;justify-content:center;gap:0;border-radius:0;position:relative}
#sidebar.sb-collapsed .sb-sub-text{display:none !important}
#sidebar.sb-collapsed .sb-sub-icon{width:20px;height:20px}
/* buyer sub-item tooltip handled by JS #sb-tip */
/* Fix tools icon alignment in collapsed state \u2014 hide \u2197 external-link arrow */
#sidebar.sb-collapsed .sb-extlink{display:none !important}
.sb-bottom{flex-shrink:0;border-top:1px solid var(--bd);padding:10px}
.sb-themes{display:flex;flex-wrap:wrap;gap:5px;padding:5px 6px 8px}
.sb-theme-btn{width:20px;height:20px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:border-color .15s;flex-shrink:0}
.sb-theme-btn:hover,.sb-theme-btn.active{border-color:var(--tx)}
.sb-srv{display:flex;align-items:center;gap:6px;padding:4px 8px 6px;font-size:10.5px;color:var(--mu);font-family:DM Mono,monospace}
.sb-user{display:flex;align-items:center;gap:8px;padding:8px;border-radius:8px;cursor:pointer;transition:background .15s}
.sb-user:hover{background:var(--s2)}
.sb-avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#8b5cf6);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0}
.sb-user-info{flex:1;min-width:0}
.sb-user-name{font-size:12px;font-weight:600;color:var(--tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-user-role{font-size:10px;color:var(--mu);font-family:DM Mono,monospace}
.sb-logout{font-size:10.5px;padding:3px 7px;border:1px solid var(--bd);border-radius:5px;background:transparent;color:var(--mu);cursor:pointer;transition:all .15s;white-space:nowrap;font-family:'DM Sans',sans-serif}
.sb-logout:hover{border-color:var(--rd);color:var(--rd)}


/* \u2550\u2550\u2550 PAGE HEADER \u2550\u2550\u2550 */
.page-header{
  background:var(--sf);border-bottom:1px solid var(--bd);
  padding:0 20px;height:48px;display:flex;align-items:center;gap:12px;
  flex-shrink:0;position:sticky;top:0;z-index:199;
}
.page-header-title{
  font-family:'Syne',sans-serif;font-weight:700;font-size:15px;
  letter-spacing:-0.3px;flex:1;
}
.page-header-title span{
  color:var(--mu);font-weight:400;font-size:12px;
  margin-left:8px;font-family:DM Mono,monospace;
}

.page-header-action{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 14px;background:var(--ac);color:#000;
  border:none;border-radius:7px;font-family:'Syne',sans-serif;
  font-size:12px;font-weight:700;cursor:pointer;transition:all .15s;
}
.page-header-action:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 3px 12px rgba(74,222,128,.25)}

.page-header-badge{
  background:var(--s2);border:1px solid var(--bd);
  border-radius:16px;padding:3px 10px;
  font-size:10px;font-family:DM Mono,monospace;color:var(--mu);
  display:inline-flex;align-items:center;gap:5px;
}
.page-header-dot{width:6px;height:6px;border-radius:50%;background:var(--ac)}


/* \u2550\u2550\u2550 DASHBOARD PAGE \u2550\u2550\u2550 */
#dash{display:none;flex-direction:column}#dash.active{display:flex!important;flex-direction:column;height:100%;overflow:hidden}
.dash-scroll{flex:1;overflow-y:auto;padding:24px 28px}
.dash-scroll::-webkit-scrollbar{width:5px}
.dash-scroll::-webkit-scrollbar-thumb{background:var(--bd);border-radius:3px}
.dash-header{margin-bottom:22px}
.dash-header-title{
  font-family:'Syne',sans-serif;font-size:22px;font-weight:800;
  letter-spacing:-0.5px;color:var(--tx);
}
.dash-header-title span{color:var(--mu);font-weight:400;font-size:13px;margin-left:8px;font-family:DM Mono,monospace}

/* Stat cards */
.dash-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}
.dash-stat{
  background:var(--sf);border:1px solid var(--bd);border-radius:12px;
  padding:18px 20px;position:relative;overflow:hidden;
  transition:all .2s;animation:fadeUp .4s ease both;
}
.dash-stat:hover{border-color:var(--bd);transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.3)}
.dash-stat::before{content:'';position:absolute;top:0;left:0;right:0;height:2px}
.dash-stat:nth-child(1)::before{background:linear-gradient(90deg,var(--bl),#6366f1)}
.dash-stat:nth-child(2)::before{background:linear-gradient(90deg,var(--ac),#34d399)}
.dash-stat:nth-child(3)::before{background:linear-gradient(90deg,var(--or),#fcd34d)}
.dash-stat:nth-child(4)::before{background:linear-gradient(90deg,var(--rd),#f87171)}
.dash-stat:nth-child(1){animation-delay:.05s}
.dash-stat:nth-child(2){animation-delay:.1s}
.dash-stat:nth-child(3){animation-delay:.15s}
.dash-stat:nth-child(4){animation-delay:.2s}
.dash-stat-label{
  font-size:10.5px;font-weight:600;color:var(--mu);
  letter-spacing:.5px;text-transform:uppercase;
  font-family:DM Mono,monospace;margin-bottom:10px;
}
.dash-stat-icon{
  position:absolute;right:16px;top:16px;width:32px;height:32px;
  border-radius:8px;background:var(--s2);display:flex;align-items:center;
  justify-content:center;font-size:16px;
}
.dash-stat-value{
  font-family:'Syne',sans-serif;font-size:26px;font-weight:800;
  letter-spacing:-1px;color:var(--tx);
}
.dash-stat-delta{
  font-size:11px;color:var(--mu);margin-top:5px;
  display:flex;align-items:center;gap:4px;
  font-family:DM Mono,monospace;
}
.dash-stat-delta.up{color:#34d399}
.dash-stat-delta.down{color:var(--rd)}

/* Grid layout */
.dash-grid-2{display:grid;grid-template-columns:1fr 340px;gap:16px;margin-bottom:16px}
.dash-grid-full{margin-bottom:16px}
.dash-card{
  background:var(--sf);border:1px solid var(--bd);border-radius:12px;
  overflow:hidden;animation:fadeUp .4s ease both;animation-delay:.25s;
}
.dash-card-hd{
  padding:16px 20px;border-bottom:1px solid var(--bd);
  display:flex;align-items:center;gap:10px;
}
.dash-card-title{font-family:'Syne',sans-serif;font-weight:700;font-size:13.5px;flex:1}
.dash-card-body{padding:18px 20px}
.dash-card-link{font-size:11px;color:var(--bl);font-family:DM Mono,monospace;font-weight:500;cursor:pointer;text-decoration:none;white-space:nowrap}
.dash-card-link:hover{color:var(--ac)}

/* Horizontal bar chart */
.dash-hbar-wrap{width:100%;margin-top:6px;display:flex;flex-direction:column;gap:4px}
.dash-hbar-row{display:flex;align-items:center;gap:8px}
.dash-hbar-name{width:150px;min-width:150px;font-size:12.5px;font-weight:600;color:var(--tx);font-family:DM Mono,monospace;text-align:right;flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-hbar-track{flex:1;background:var(--s2);border-radius:4px;height:24px;position:relative;overflow:hidden;border:1px solid var(--bd)}
.dash-hbar-fill{height:100%;border-radius:4px;display:flex;align-items:center;padding-left:8px;min-width:2px;transition:width .5s ease}
.dash-hbar-val{font-size:11px;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7);white-space:nowrap;position:relative;z-index:1}
.dash-chart-stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
  margin-top:16px;padding-top:14px;border-top:1px solid var(--bd);
}
.dash-cs-lbl{font-size:9.5px;color:var(--mu);font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:.5px;margin-bottom:3px}
.dash-cs-val{font-family:'Syne',sans-serif;font-weight:700;font-size:17px}

/* Quick actions */
.dash-qa-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dash-qa-btn{
  background:var(--s2);border:1px solid var(--bd);border-radius:9px;
  padding:12px 14px;cursor:pointer;transition:all .15s;text-align:left;
}
.dash-qa-btn:hover{border-color:var(--bl);background:rgba(96,165,250,.07);transform:translateY(-1px)}
.dash-qa-icon{font-size:18px;margin-bottom:6px}
.dash-qa-label{font-size:12px;font-weight:600;color:var(--tx)}
.dash-qa-desc{font-size:10.5px;color:var(--mu);margin-top:2px;font-family:DM Mono,monospace}

/* Recent POs table */
.dash-tbl{width:100%;border-collapse:collapse}
.dash-tbl th{
  text-align:left;font-size:10px;font-weight:600;color:var(--mu);
  letter-spacing:.8px;text-transform:uppercase;
  font-family:DM Mono,monospace;padding:7px 10px;
  border-bottom:1px solid var(--bd);
}
.dash-tbl td{padding:10px 10px;font-size:12.5px;border-bottom:1px solid var(--bd);transition:background .1s}
.dash-tbl tr:last-child td{border-bottom:none}
.dash-tbl tr:hover td{background:var(--s2)}
.dash-po-num{font-family:DM Mono,monospace;font-size:11.5px;color:var(--bl);font-weight:600;cursor:pointer}
.dash-po-num:hover{color:var(--ac)}
.dash-po-dc{font-size:12px;color:var(--tx);font-weight:500}
.dash-po-amt{font-family:DM Mono,monospace;font-size:12px;font-weight:600}

/* Status pills for dashboard */
.ds-pill{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:600;font-family:DM Mono,monospace}
.ds-pill-dot{width:5px;height:5px;border-radius:50%}
.ds-pill.active{background:rgba(74,222,128,.12);color:var(--ac)}
.ds-pill.active .ds-pill-dot{background:var(--ac)}
.ds-pill.expired{background:rgba(248,113,113,.12);color:var(--rd)}
.ds-pill.expired .ds-pill-dot{background:var(--rd)}
.ds-pill.pending{background:rgba(251,146,60,.12);color:var(--or)}
.ds-pill.pending .ds-pill-dot{background:var(--or)}

/* Activity feed */
.dash-activity{display:flex;flex-direction:column}
.dash-act-item{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--bd)}
.dash-act-item:last-child{border-bottom:none}
.dash-act-dot{width:7px;height:7px;border-radius:50%;margin-top:4px;flex-shrink:0;box-shadow:0 0 0 2px var(--sf)}
.dash-act-text{font-size:12px;line-height:1.5;color:var(--mu);flex:1}
.dash-act-text strong{color:var(--tx);font-weight:600}
.dash-act-time{font-size:10px;color:var(--mu);font-family:DM Mono,monospace;margin-top:2px;opacity:.7}

/* \u2550\u2550\u2550 PAGE \u2550\u2550\u2550 */
.page{display:none}.page.active{display:block;height:100%;overflow-y:auto}#p2.active{display:flex!important;flex-direction:column;height:100%;overflow:hidden;overflow-y:hidden}

/* \u2550\u2550\u2550 PAGE 1 \u2014 PROCESS \u2550\u2550\u2550 */
.pwrap{max-width:900px;margin:0 auto;padding:22px 20px}
.slabel{font-size:0.59rem;font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:2.5px;color:var(--mu);margin-bottom:11px}
.ugrid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-bottom:20px}
.uc{background:var(--sf);border:1.5px dashed var(--bd);border-radius:12px;padding:20px 16px;text-align:center;cursor:pointer;transition:all .2s;position:relative}
.uc:hover{border-color:var(--bl)}.uc.ok{border-style:solid;border-color:var(--ac)}
.uc.err{border-style:solid;border-color:#f87171;background:rgba(248,113,113,0.07)}
.del-po-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:0.72rem;font-family:DM Mono,monospace;background:var(--s2);border:1.5px solid var(--bd);color:var(--tx);cursor:pointer;transition:all .15s;user-select:none}
.del-po-chip.on{background:#7f1d1d;border-color:#f87171;color:#fca5a5}
/* \u2500\u2500 Column Filter Dropdown \u2500\u2500 */
.cflt-th{cursor:default;user-select:none}
.cflt-btn{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;margin-left:3px;border-radius:3px;font-size:0.6rem;opacity:0.45;cursor:pointer;vertical-align:middle;transition:opacity .15s,color .15s}
.cflt-btn:hover{opacity:1}.cflt-btn.active{opacity:1;color:var(--ac);background:rgba(99,179,237,0.15)}
.cflt-drop{position:fixed;z-index:9000;background:var(--sf);border:1.5px solid var(--bd);border-radius:9px;box-shadow:0 8px 28px rgba(0,0,0,0.45);padding:10px;min-width:190px;max-width:270px;display:none;flex-direction:column;gap:0}
.cflt-drop.open{display:flex}
.cflt-search{width:100%;padding:5px 9px;border:1px solid var(--bd);border-radius:5px;background:var(--bg);color:var(--tx);font-size:0.72rem;margin-bottom:7px;box-sizing:border-box;outline:none}
.cflt-sel-all{display:flex;align-items:center;gap:7px;padding:3px 2px 5px;border-bottom:1px solid var(--bd);margin-bottom:4px;font-size:0.72rem;font-weight:700;cursor:pointer;color:var(--mu)}
.cflt-list{max-height:170px;overflow-y:auto;display:flex;flex-direction:column;gap:1px}
.cflt-item{display:flex;align-items:center;gap:7px;padding:3px 4px;border-radius:4px;cursor:pointer;font-size:0.71rem;white-space:nowrap}
.cflt-item:hover{background:var(--s2)}.cflt-item input[type=checkbox]{margin:0;cursor:pointer;flex-shrink:0;accent-color:var(--ac)}
.cflt-actions{display:flex;gap:6px;margin-top:8px;padding-top:7px;border-top:1px solid var(--bd)}
.cflt-apply{flex:1;padding:5px;background:var(--ac);color:#000;border:none;border-radius:5px;font-size:0.72rem;font-weight:700;cursor:pointer}
.cflt-clear{padding:5px 10px;background:transparent;border:1px solid var(--bd);border-radius:5px;font-size:0.72rem;cursor:pointer;color:var(--tx)}
.audit-hdr{background:var(--s2);color:var(--mu);padding:6px 10px;text-align:left;font-size:0.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--bd);white-space:nowrap}
.audit-cell{padding:5px 10px;border-bottom:1px solid var(--bd);color:var(--tx);white-space:nowrap;vertical-align:top}
.audit-row:hover td{background:var(--s2)}
.audit-del-tag{display:inline-block;padding:1px 7px;border-radius:10px;font-size:0.65rem;background:#7f1d1d;color:#fca5a5;font-weight:700}
.uc input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.uc-ic{font-size:1.7rem;margin-bottom:7px}
.uc-tag{font-size:0.59rem;font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:2px;color:var(--bl);margin-bottom:3px}
.uc-t{font-weight:600;font-size:0.86rem;margin-bottom:3px}
.uc-d{font-size:0.7rem;color:var(--mu);line-height:1.4}
.uc-s{margin-top:7px;font-size:0.7rem;font-family:DM Mono,monospace;color:var(--ac);min-height:14px}
.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 20px;border-radius:7px;font-family:'DM Sans',sans-serif;font-size:0.81rem;font-weight:600;cursor:pointer;border:none;transition:all .15s}
.bg{background:var(--ac);color:#000;font-family:'Syne',sans-serif;letter-spacing:.2px}.bg:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 4px 16px rgba(74,222,128,.25)}.bg:disabled{opacity:.32;cursor:not-allowed;filter:grayscale(.4)}
.bb{background:var(--bl);color:#000}.bb:hover{filter:brightness(1.1)}
.bo{background:transparent;border:1.5px solid var(--bd);color:var(--mu);padding:6px 12px;font-size:0.72rem;border-radius:7px;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .15s;font-weight:500}
.bo:hover{border-color:var(--rd);color:var(--rd)}
.bsm{padding:5px 11px;font-size:11.5px;border-radius:7px;border:1px solid var(--bd);background:transparent;color:var(--mu);cursor:pointer;font-family:'Instrument Sans',sans-serif;font-weight:600;transition:all .15s;display:inline-flex;align-items:center;gap:4px}
.bsm-g{background:var(--bl);color:#fff;border-color:var(--bl)}.bsm-g:hover{background:#2563eb;transform:translateY(-1px);box-shadow:0 4px 16px rgba(59,130,246,.3);border-color:#2563eb}
.bsm-b{background:transparent;color:var(--mu);border:1px solid var(--bd)}.bsm-b:hover{background:var(--s2);color:var(--tx);border-color:var(--bd)}
.bsm-b:disabled,.bsm-g:disabled{opacity:.3;cursor:not-allowed}
.logbox{background:var(--bg);border:1px solid var(--bd);border-radius:10px;padding:14px;font-family:DM Mono,monospace;font-size:0.69rem;max-height:160px;overflow-y:auto;margin-bottom:15px;display:none;box-shadow:inset 0 1px 8px rgba(0,0,0,.3)}
.ll{padding:2px 0;line-height:1.7}.ll-ok{color:var(--ac)}.ll-i{color:var(--bl)}.ll-w{color:var(--or)}.ll-e{color:var(--rd)}
.sgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}
.sc{background:var(--sf);border:1px solid var(--bd);border-radius:10px;padding:14px 16px;text-align:center;transition:all .2s;animation:fadeUp .4s ease both;position:relative;overflow:hidden}.sc:hover{border-color:var(--bl);transform:translateY(-1px);box-shadow:0 4px 16px rgba(0,0,0,.3)}
.sc::before{content:'';display:block;height:2px;border-radius:2px 2px 0 0;margin:-12px -14px 10px;background:var(--bd)}
.sc:nth-child(1)::before{background:linear-gradient(90deg,var(--bl),var(--ac))}
.sc:nth-child(2)::before{background:linear-gradient(90deg,var(--ac),#34d399)}
.sc:nth-child(3)::before{background:linear-gradient(90deg,var(--or),#fcd34d)}
.sc:nth-child(4)::before{background:linear-gradient(90deg,var(--rd),#f87171)}

.sv{font-size:1.5rem;font-weight:800;color:var(--ac);font-family:'Syne',sans-serif}
.sl2{font-size:0.58rem;color:var(--mu);font-family:DM Mono,monospace;margin-top:2px;text-transform:uppercase;letter-spacing:1px}

/* \u2550\u2550\u2550 PAGE 2 \u2014 VIEWER \u2550\u2550\u2550 */
.ts-banner{padding:11px 18px;background:linear-gradient(90deg,var(--tf),var(--s2),var(--tf));border-bottom:1px solid var(--bd);display:none}
.ts-banner-inner{display:flex;align-items:center;gap:8px;}
.ts-banner-toggle{display:none;} /* hidden on desktop */
.ts-banner-expanded{display:block!important;} /* always visible on desktop */
.ts-main{font-family:DM Mono,monospace;font-weight:700;color:var(--tx);letter-spacing:.8px;line-height:1.2}
.ts-sub{font-size:0.67rem;color:var(--mu);font-family:DM Mono,monospace;margin-top:2px}
.vtoolbar{position:sticky;top:0;z-index:200;background:var(--sf);border-bottom:1px solid var(--bd);padding:6px 12px;display:flex;flex-wrap:wrap;align-items:center;gap:5px;min-height:var(--tbH);box-shadow:0 1px 8px rgba(0,0,0,.2);overflow:visible;}
.gsearch{position:relative;flex:0 0 210px}
.gsearch input{width:100%;padding:7px 16px 7px 36px;border:2px solid rgba(255,255,255,0.15);border-radius:50px;background:rgba(255,255,255,0.07);color:#fff;font-family:'DM Sans',sans-serif;font-size:0.74rem;outline:none;transition:all .22s;box-shadow:0 4px 18px rgba(0,0,0,0.25),inset 0 1px 0 rgba(255,255,255,0.08);box-sizing:border-box}
.gsearch input::placeholder{color:rgba(255,255,255,0.45)}
.gsearch input:focus{border-color:rgba(139,92,246,0.65);background:rgba(139,92,246,0.13);box-shadow:0 4px 22px rgba(139,92,246,0.28),inset 0 1px 0 rgba(255,255,255,0.1)}
.gsearch::before{content:"";position:absolute;left:12px;top:50%;transform:translateY(-50%);width:14px;height:14px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='rgba(255,255,255,0.5)'%3E%3Cpath fill-rule='evenodd' d='M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z' clip-rule='evenodd'/%3E%3C/svg%3E") center/contain no-repeat;pointer-events:none}
.legwrap{display:flex;flex-wrap:wrap;gap:4px;flex:1;min-width:0}
.leg{
  display:inline-flex;align-items:center;gap:5px;
  padding:5px 12px;border-radius:7px;
  font-size:11.5px;font-weight:600;cursor:pointer;
  font-family:'DM Mono',monospace;
  border:1.5px solid var(--bd2);
  background:var(--s2);
  color:var(--tx);
  transition:transform .12s,box-shadow .12s,border-color .12s,background .12s,color .12s;
  user-select:none;white-space:nowrap;
  box-shadow:0 1px 3px rgba(0,0,0,.18),0 1px 2px rgba(0,0,0,.12);
}
/* \u2500\u2500 Legend chip pill-style overrides \u2500\u2500 */
.leg.ls-glow   {border-radius:7px;border:1.5px solid var(--bd2)}
.leg.ls-pastel {border-radius:7px;border:1.5px solid var(--bd2)}
.leg.ls-solid  {border-radius:6px;border:1.5px solid var(--bd2);text-transform:uppercase;letter-spacing:.5px;font-size:10.5px}
.leg.ls-strip  {border-radius:6px;border:1.5px solid var(--bd2);border-left-width:3px;border-left-style:solid;padding-left:8px}
.leg.ls-dot    {border-radius:7px;border:1.5px solid var(--bd2)}
.leg.ls-outline{border-radius:7px;background:transparent;border-width:1.5px}
/* \u2500\u2500 Legend dance keyframes \u2500\u2500 */
@keyframes legDance1{
  0%,50%,100%{transform:translateY(0) rotate(0deg);}
  25%{transform:translateY(-8px) rotate(-2deg);}
  38%{transform:translateY(-4px) rotate(1.5deg);}
}
@keyframes legDance2{
  0%,55%,100%{transform:translateY(0) rotate(0deg);}
  28%{transform:translateY(-11px) rotate(2.5deg);}
  42%{transform:translateY(-5px) rotate(-1deg);}
}
@keyframes legDance3{
  0%,45%,100%{transform:translateY(0) rotate(0deg);}
  20%{transform:translateY(-7px) rotate(-1.5deg);}
  33%{transform:translateY(-3px) rotate(2deg);}
}
.leg:hover{
  animation-play-state:paused!important;
  transform:translateY(-3px)!important;
  box-shadow:0 5px 12px rgba(0,0,0,.28),0 2px 4px rgba(0,0,0,.14)!important;
  border-color:var(--ac);
  color:var(--ac);
}
.leg:active{animation-play-state:paused!important;transform:translateY(0)!important;box-shadow:0 1px 3px rgba(0,0,0,.18);}
.leg.leg-zero{opacity:0.28;cursor:not-allowed;pointer-events:none;transform:none!important;box-shadow:none!important;animation:none!important;}
.leg-appt{background:rgba(251,146,60,0.12);border-color:var(--or);color:var(--or);font-size:0.6rem;padding:3px 8px;border-radius:10px;border:1.5px solid var(--or);display:inline-flex;align-items:center;gap:4px;cursor:default;white-space:nowrap;animation:apptPop .3s ease}
.leg-cnt{font-size:0.58rem;font-weight:400;opacity:0.65;font-family:DM Mono,monospace;margin-left:2px}
.leg-appt .appt-x{cursor:pointer;font-size:0.65rem;opacity:0.7;margin-left:2px;transition:opacity .15s}.leg-appt .appt-x:hover{opacity:1}
@keyframes apptPop{from{transform:scale(0.8);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
/* \u2500\u2500 D-Mart Brand Cards \u2014 glass-card style \u2500\u2500 */
.dm-stamp-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:74px;min-height:86px;padding:22px 5px 8px;border-radius:10px;border:1px solid rgba(255,255,255,0.07);border-top:3px solid var(--tile-clr,#2563eb);background:linear-gradient(160deg,rgba(255,255,255,0.04) 0%,rgba(0,0,0,0.18) 100%);cursor:pointer;transition:transform .18s,box-shadow .18s,border-color .18s,background .18s;user-select:none;flex-shrink:0;overflow:hidden;gap:0;backdrop-filter:blur(6px)}
.dm-stamp-tile::before{content:"";position:absolute;inset:0;background:linear-gradient(140deg,var(--tile-clr,#2563eb) 0%,transparent 55%);opacity:.07;pointer-events:none;border-radius:11px;transition:opacity .18s}
.dm-stamp-tile:hover{transform:translateY(-4px) scale(1.03);box-shadow:0 10px 28px rgba(0,0,0,.4),0 0 0 1px var(--tile-clr,#2563eb);border-color:var(--tile-clr,#2563eb)}
.dm-stamp-tile:hover::before{opacity:.12}
.dm-stamp-tile.on{border-color:var(--tile-clr,#2563eb);border-top-width:3px;box-shadow:0 0 0 1.5px var(--tile-clr,#2563eb),0 6px 22px rgba(0,0,0,.35),0 0 18px -4px var(--tile-clr,#2563eb)}
.dm-stamp-tile.on::before{opacity:.18}
/* PO count badge \u2014 top of card */
.dm-stamp-poc{position:absolute;top:6px;left:50%;transform:translateX(-50%);font-size:8px;font-weight:800;font-family:"DM Mono",monospace;border-radius:20px;padding:2px 8px;line-height:1.4;letter-spacing:.3px;white-space:nowrap;z-index:2}
.dm-stamp-logo{width:38px;height:28px;object-fit:contain;flex-shrink:0;position:relative;z-index:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.4));margin-top:2px}
.dm-stamp-abbr{font-size:19px;font-weight:900;font-family:"DM Mono",monospace;line-height:1;letter-spacing:-1px;flex-shrink:0;position:relative;z-index:1;margin-top:2px}
.dm-stamp-name{font-size:9px;font-weight:700;color:var(--tx);text-transform:uppercase;letter-spacing:.6px;font-family:"DM Mono",monospace;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:66px;line-height:1.3;position:relative;z-index:1;margin-top:5px;opacity:.9}
.dm-stamp-count{font-size:9px;font-weight:700;color:#fff;font-family:"DM Mono",monospace;line-height:1;position:relative;z-index:1;margin-top:5px;background:rgba(0,0,0,.28);border-radius:20px;padding:3px 9px;border:1px solid rgba(255,255,255,0.12);white-space:nowrap}
/* Light themes: solid visible background */
[data-theme="light"] .dm-stamp-tile,
[data-theme="silver"] .dm-stamp-tile,
[data-theme="skyblue"] .dm-stamp-tile,
[data-theme="lightnavy"] .dm-stamp-tile,
[data-theme="cleanslate"] .dm-stamp-tile,
[data-theme="warmpaper"] .dm-stamp-tile{background:#fff!important;border:1px solid rgba(0,0,0,.12)!important;border-top:3px solid var(--tile-clr,#2563eb)!important;box-shadow:0 2px 8px rgba(0,0,0,.10)}
[data-theme="light"] .dm-stamp-tile::before,
[data-theme="silver"] .dm-stamp-tile::before,
[data-theme="skyblue"] .dm-stamp-tile::before,
[data-theme="lightnavy"] .dm-stamp-tile::before,
[data-theme="cleanslate"] .dm-stamp-tile::before,
[data-theme="warmpaper"] .dm-stamp-tile::before{opacity:.04!important}
[data-theme="light"] .dm-stamp-name,
[data-theme="silver"] .dm-stamp-name,
[data-theme="skyblue"] .dm-stamp-name,
[data-theme="lightnavy"] .dm-stamp-name,
[data-theme="cleanslate"] .dm-stamp-name,
[data-theme="warmpaper"] .dm-stamp-name{color:#222!important;opacity:1!important}
[data-theme="light"] .dm-stamp-poc,
[data-theme="silver"] .dm-stamp-poc,
[data-theme="skyblue"] .dm-stamp-poc,
[data-theme="lightnavy"] .dm-stamp-poc,
[data-theme="cleanslate"] .dm-stamp-poc,
[data-theme="warmpaper"] .dm-stamp-poc{color:#000!important;background:rgba(0,0,0,.10)!important;border:1px solid rgba(0,0,0,.18)!important}
[data-theme="light"] .dm-stamp-count,
[data-theme="silver"] .dm-stamp-count,
[data-theme="skyblue"] .dm-stamp-count,
[data-theme="lightnavy"] .dm-stamp-count,
[data-theme="cleanslate"] .dm-stamp-count,
[data-theme="warmpaper"] .dm-stamp-count{color:#000!important;background:rgba(0,0,0,.10)!important;border:1px solid rgba(0,0,0,.18)!important}
.has-brand-filter .dm-stamp-tile:not(.on){opacity:.22;filter:grayscale(.7);transform:scale(.93)}
.has-brand-filter .dm-stamp-tile:not(.on):hover{opacity:.55;filter:grayscale(.25);transform:scale(.97)}
.dm-bc-name{font-size:10px;font-weight:700;color:var(--tx);font-family:'DM Mono',monospace;text-transform:uppercase;letter-spacing:.4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-bc-items{font-size:8.5px;color:var(--mu);font-family:'DM Mono',monospace}
.dm-bc-row{display:flex;align-items:center;gap:4px}
.dm-bc-lbl{font-size:8.5px;color:var(--mu);font-family:'DM Mono',monospace}
.dm-bc-qty{font-size:10px;font-weight:700;color:var(--or);font-family:'DM Mono',monospace}
.dm-bc-val{font-size:10px;font-weight:700;color:var(--bl,#60a5fa);font-family:'DM Mono',monospace}
.sc:nth-child(1){animation-delay:.05s}
.sc:nth-child(2){animation-delay:.1s}
.sc:nth-child(3){animation-delay:.15s}
.sc:nth-child(4){animation-delay:.2s}

/* \u2500\u2500 APPOINTMENT GROUP BOX \u2500\u2500 */
.appt-box-body{padding:8px 12px;display:flex;flex-wrap:wrap;gap:6px}
.appt-box-body.collapsed{display:none}
.appt-pin-group{background:var(--bg);border:1.5px solid rgba(251,146,60,0.25);border-radius:10px;padding:8px 12px;display:flex;flex-direction:column;gap:5px;min-width:210px;flex:0 0 auto;transition:all .15s;box-shadow:0 2px 8px rgba(0,0,0,.2)}
.appt-pin-group:hover{border-color:rgba(251,146,60,0.6)}
.appt-pin-group.appt-active{border-color:var(--or);box-shadow:0 0 0 2px rgba(251,146,60,0.2)}
.appt-pin-dc{font-size:0.6rem;font-weight:700;color:var(--tx2);font-family:DM Mono,monospace;text-transform:uppercase}
.appt-pin-date{font-size:0.68rem;font-weight:700;color:var(--or)}
.appt-pin-pos{display:flex;flex-wrap:wrap;gap:3px}
.appt-pin-po{font-size:0.58rem;font-weight:600;padding:2px 6px;border-radius:6px;background:rgba(251,146,60,0.1);color:var(--or);border:1px solid rgba(251,146,60,0.3);white-space:nowrap}
.appt-pin-actions{display:flex;align-items:center;gap:4px;margin-top:2px;flex-wrap:wrap}
.appt-pin-btn{font-size:0.58rem;padding:2px 7px;border-radius:5px;border:1px solid var(--bd);background:transparent;color:var(--mu);cursor:pointer;font-weight:600;transition:all .15s;white-space:nowrap}
.appt-pin-btn:hover{border-color:var(--bl);color:var(--bl)}
.appt-pin-btn.filter-btn{border-color:var(--or);color:var(--or)}
.appt-pin-btn.filter-btn:hover,.appt-pin-group.appt-active .appt-pin-btn.filter-btn{background:var(--or);color:#000}
.appt-pin-btn.mail-btn{border-color:#34d399;color:#34d399}
.appt-pin-btn.mail-btn:hover{background:#34d399;color:#000}
.appt-pin-btn.mail-btn.sent{border-color:var(--mu);color:var(--mu);opacity:0.6}
.appt-pin-btn.del-btn:hover{border-color:var(--rd);color:var(--rd)}
/* \u2500\u2500 EMAIL MODAL \u2500\u2500 */
.email-modal-recipients{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.email-modal-recipients .fg{margin:0}
.email-tag-wrap{display:flex;flex-wrap:wrap;gap:4px;padding:5px 8px;border:1.5px solid var(--bd);border-radius:8px;background:var(--bg);min-height:34px;align-items:center;cursor:text}
.email-tag-wrap:focus-within{border-color:var(--bl)}
.email-tag{display:inline-flex;align-items:center;gap:3px;background:rgba(96,165,250,0.15);border:1px solid var(--bl);color:var(--bl);font-size:0.65rem;font-weight:600;padding:2px 7px;border-radius:10px}
.email-tag .tag-x{cursor:pointer;opacity:0.7;font-size:0.6rem;margin-left:1px}.email-tag .tag-x:hover{opacity:1}
.email-tag-input{border:none;outline:none;background:transparent;color:var(--tx);font-size:0.8rem;font-family:inherit;flex:1;min-width:100px;padding:2px 4px}
.email-preview-box{background:var(--bg);border:1.5px solid var(--bd);border-radius:8px;padding:10px 12px;max-height:220px;overflow-y:auto;font-size:0.72rem}
.smtp-status{font-size:0.7rem;padding:4px 10px;border-radius:6px;font-weight:600}
.smtp-status.ok{background:rgba(52,211,153,0.15);color:#34d399;border:1px solid #34d399}
.smtp-status.err{background:rgba(248,113,113,0.15);color:var(--rd);border:1px solid var(--rd)}
/* \u2500\u2500 SMTP SETTINGS PANEL \u2500\u2500 */
.smtp-cfg-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
/* \u2500\u2500 FLATPICKR THEME (adapts to current theme via CSS vars) \u2500\u2500 */
.flatpickr-calendar{background:var(--bg)!important;border:1.5px solid var(--bd)!important;border-radius:12px!important;box-shadow:0 8px 32px rgba(0,0,0,.35)!important;font-family:inherit!important;opacity:1!important}
.flatpickr-calendar.open{opacity:1!important}
/* Inner wrappers \u2014 flatpickr's default theme leaves these without an explicit
   opaque background, so on dark themes the page behind the popup shows
   through the day-grid area even though the outer .flatpickr-calendar bg is set. */
.flatpickr-innerContainer,.flatpickr-rContainer,.flatpickr-days,.dayContainer{background:var(--bg)!important}
.flatpickr-months,.flatpickr-month{background:var(--bg)!important;color:var(--tx)!important;fill:var(--tx)!important}
.flatpickr-current-month,.flatpickr-current-month input.cur-year{color:var(--tx)!important;font-weight:700!important;background:transparent!important}
.flatpickr-current-month .flatpickr-monthDropdown-months{background:var(--bg)!important;color:var(--tx)!important}
.flatpickr-current-month .flatpickr-monthDropdown-months option{background:var(--bg)!important;color:var(--tx)!important}
.numInputWrapper span.arrowUp,.numInputWrapper span.arrowDown{border-top-color:var(--tx)!important;border-bottom-color:var(--tx)!important}
.numInputWrapper:hover{background:transparent!important}
.flatpickr-prev-month,.flatpickr-next-month{fill:var(--tx)!important;color:var(--tx)!important}
.flatpickr-prev-month svg,.flatpickr-next-month svg{fill:var(--tx)!important}
.flatpickr-prev-month:hover svg,.flatpickr-next-month:hover svg{fill:#fb923c!important}
.flatpickr-weekdays,.flatpickr-weekday{background:var(--bg)!important;color:var(--mu)!important;font-size:0.72rem!important;font-weight:600!important}
span.flatpickr-day{color:var(--tx)!important;border-radius:6px!important;background:transparent!important}
span.flatpickr-day:hover{background:rgba(251,146,60,0.15)!important;border-color:transparent!important}
span.flatpickr-day.selected,span.flatpickr-day.selected:hover{background:#fb923c!important;border-color:#fb923c!important;color:#fff!important;font-weight:700!important}
span.flatpickr-day.today{border-color:#fb923c!important;color:#fb923c!important;font-weight:700!important}
span.flatpickr-day.today.selected{color:#fff!important}
span.flatpickr-day.flatpickr-disabled,span.flatpickr-day.prevMonthDay,span.flatpickr-day.nextMonthDay{opacity:.35!important}
.appt-po-chip{font-size:0.62rem;font-weight:700;padding:3px 9px;border-radius:12px;border:1.5px solid var(--bd);cursor:pointer;transition:all .15s;background:var(--bg);color:var(--mu);user-select:none}
.appt-po-chip.on{border-color:var(--or);background:rgba(251,146,60,0.12);color:var(--or);font-weight:700}
.qf-strip{width:100%;background:var(--tf);border-bottom:1px solid var(--bd);padding:6px 13px}
.qf-row{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start}
.qf-section{background:var(--s2);border:1px solid var(--bd);border-radius:8px;padding:6px 10px;min-width:0;flex:1;max-width:100%}
.qf-section-hd{display:flex;align-items:center;gap:5px;cursor:pointer;user-select:none;margin-bottom:5px}
.qf-section-icon{font-size:12px}
.qf-section-title{font-size:0.65rem;font-weight:700;color:var(--tx);text-transform:uppercase;letter-spacing:1px;font-family:DM Mono,monospace;flex:1}
.qf-sel-count{font-size:0.6rem;background:var(--ac);color:#000;padding:1px 5px;border-radius:8px;font-weight:700;display:none}
.qf-sel-count.show{display:inline}
.qf-caret{font-size:0.6rem;color:var(--mu);transition:transform .2s}
.qf-caret.closed{transform:rotate(-90deg)}
.qf-chips{display:flex;flex-wrap:wrap;gap:3px;overflow:hidden;max-height:200px;transition:max-height .25s}
.qf-chips.collapsed{max-height:0}
/* Appointments list: never clip the cards \u2014 show ALL of them and let the panel
   (#qf-strip) scroll. Without this, the .qf-chips 200px/overflow:hidden cap hid the
   3rd+ appointment on narrow/mobile widths. :not(.collapsed) keeps the collapse toggle. */
#appt-box-body:not(.collapsed){max-height:none !important;overflow:visible !important;}
.qf-chip{display:inline-flex;align-items:center;font-size:0.62rem;font-weight:600;padding:3px 9px;border-radius:12px;border:1.5px solid var(--bd);cursor:pointer;transition:all .15s;background:var(--bg);user-select:none;white-space:nowrap;color:var(--mu)}
.qf-chip:hover{border-color:var(--bl);color:var(--tx);background:rgba(96,165,250,0.06)}
.qf-chip.on{border-color:var(--ac);background:rgba(74,222,128,0.1);color:var(--ac);font-weight:700}
.qf-chip.disabled{opacity:0.3;pointer-events:none}
.qf-section-actions{display:flex;flex-direction:column;justify-content:center;gap:6px}
.qf-clear-btn{padding:5px 12px;background:transparent;border:1.5px solid var(--rd);color:var(--rd);border-radius:6px;font-size:0.71rem;font-weight:600;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .15s;white-space:nowrap}
.qf-clear-btn:hover{background:rgba(248,113,113,0.1)}
.ldot{width:7px;height:7px;border-radius:2px;flex-shrink:0}
.lcnt{font-size:0.55rem;color:var(--mu);margin-left:2px}
.vinfo{font-family:DM Mono,monospace;font-size:0.64rem;color:var(--mu);white-space:nowrap}
.vinfo strong{color:var(--bl)}

/* \u2550\u2550\u2550 TABLE \u2550\u2550\u2550 */
.tblwrap{overflow-x:auto;overflow-y:auto;flex:1;min-height:0;height:0;position:relative;}
table{border-collapse:separate;border-spacing:0;font-size:0.71rem;table-layout:fixed;width:100%;min-width:0}
/* column widths now driven by JS autofit; these are fallback minimums */
col.w-cb{width:26px}
col.w-dc,col.w-st,col.w-pon,col.w-dt,col.w-pl,col.w-ean,
col.w-pc,col.w-co,col.w-mrp,col.w-qpk,col.w-npk,
col.w-qty,col.w-cost,col.w-tax{width:54px}col.w-mgn{width:auto}
col.w-dsc{width:180px;min-width:180px}
/* \u2500\u2500 RESIZE HANDLES \u2500\u2500 */
th.resizable{position:relative;overflow:visible!important}
.col-resize-handle{position:absolute;right:-3px;top:0;width:6px;height:100%;cursor:col-resize;z-index:30;user-select:none}
.col-resize-handle:hover,.col-resize-handle.dragging{background:var(--ac);opacity:.6;border-radius:2px}
/* hide row checkboxes \u2013 selection now via dropdown */


tr.hr1 th{background:var(--sf);color:var(--mu);font-family:'DM Mono',monospace;font-size:10px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;padding:10px 12px 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom:1px solid var(--bd);position:sticky;top:0;z-index:20;cursor:pointer;user-select:none;isolation:isolate;}
tr.hr1 th:hover{color:var(--tx)}tr.hr1 th:last-child{border-right:none}
.sarr{font-size:.5rem;margin-left:2px;opacity:.25}
th.sa .sarr::after{content:"\u25B2";opacity:1;color:var(--ac)}th.sd .sarr::after{content:"\u25BC";opacity:1;color:var(--ac)}
tr.hr2 th{background:var(--s2);padding:4px 6px;border-bottom:2px solid var(--bd);position:sticky;top:32px;z-index:20}
tr.hr2 th:last-child{border-right:none}
/* \u2500\u2500 filter input row (hr3) \u2014 merged into thead, sticky below hr2 \u2500\u2500 */
tr.hr3{display:none;}
tr.hr3.visible{display:table-row;}
tr.hr3 th{background:var(--s2);padding:3px 3px 4px;border-right:1px solid var(--bd);border-bottom:2px solid var(--ac);position:sticky;top:58px;z-index:19;}
tr.hr3 th:last-child{border-right:none;}
tr.hr3 .cfi-input{width:100%;box-sizing:border-box;padding:3px 6px;border:1.5px solid var(--bd);border-radius:4px;background:var(--bg);color:var(--tx);font-family:DM Mono,monospace;font-size:0.6rem;outline:none;transition:border-color .15s;}
tr.hr3 .cfi-input:focus{border-color:var(--bl);}
tr.hr3 .cfi-input.has-val{border-color:var(--ac);background:rgba(74,222,128,0.05);}
/* \u2500\u2500 filter button in header row 2 \u2500\u2500 */
.dd-btn{width:100%;padding:3px 6px;border:1px solid var(--bd);border-radius:4px;background:rgba(255,255,255,.03);color:var(--tx);font-family:'DM Mono',monospace;font-size:10.5px;outline:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:3px;white-space:nowrap;overflow:hidden;transition:all .15s}
.dd-btn:hover{border-color:var(--bl);background:var(--accent-glow,rgba(59,130,246,.07))}
.dd-btn.af{border-color:var(--ac);background:rgba(74,222,128,.07);color:var(--ac)}
.dd-btn .dd-btn-lbl{overflow:hidden;text-overflow:ellipsis;flex:1;text-align:left}
.dd-btn .dd-arr{font-size:0.5rem;opacity:.5;flex-shrink:0}
/* \u2500\u2500 Excel-style filter panel \u2500\u2500 */
.fp-dropdown{position:fixed;z-index:9999;background:var(--bg);border:1.5px solid var(--bd);border-radius:6px;box-shadow:0 8px 32px rgba(0,0,0,.65);width:220px;display:none;flex-direction:column;overflow:hidden;font-family:DM Mono,monospace;font-size:0.72rem}
.fp-dropdown.open{display:flex}
.fpdp-head{padding:7px 8px 4px;border-bottom:1px solid var(--bd);background:var(--bg)}
.fpdp-search{width:100%;padding:4px 7px;border:1px solid var(--bd);border-radius:4px;background:var(--bg);color:var(--tx);font-family:DM Mono,monospace;font-size:0.7rem;outline:none;box-sizing:border-box}
.fpdp-search:focus{border-color:var(--bl)}
.fpdp-list{max-height:240px;overflow-y:auto;padding:4px 0;background:var(--bg)}
.fpdp-item{display:flex;align-items:center;gap:7px;padding:4px 10px;cursor:pointer;user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:var(--bg)}
.fpdp-item:hover{background:var(--bd)}
.fpdp-item input[type=checkbox]{width:13px;height:13px;accent-color:var(--ac);cursor:pointer;flex-shrink:0}
.fpdp-item span{overflow:hidden;text-overflow:ellipsis;color:var(--tx)}
.fpdp-selectall{font-weight:700;border-bottom:1px solid var(--bd);margin-bottom:2px}
.fpdp-foot{display:flex;gap:6px;padding:7px 8px;border-top:1px solid var(--bd);justify-content:flex-end;background:var(--bg)}
.fpdp-ok{padding:4px 14px;background:var(--ac);color:#000;border:none;border-radius:4px;font-size:0.7rem;font-weight:700;cursor:pointer;font-family:DM Mono,monospace}
.fpdp-ok:hover{filter:brightness(1.1)}
.fpdp-cancel{padding:4px 10px;background:var(--bg);color:var(--mu);border:1px solid var(--bd);border-radius:4px;font-size:0.7rem;cursor:pointer;font-family:DM Mono,monospace}
.fpdp-cancel:hover{color:var(--tx)}
tbody tr{cursor:pointer;transition:background .1s}
tbody tr:nth-child(even) td{background:rgba(255,255,255,.012)}
tbody tr:hover td{background:rgba(59,130,246,.04)!important;filter:none}
td{padding:10px 12px;border-bottom:1px solid var(--bd);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
td.td-desc-wrap{white-space:normal;overflow:visible;text-overflow:clip;vertical-align:top;padding-top:8px;padding-bottom:8px;}
#fr-table td.fr-desc{white-space:normal!important;text-overflow:clip!important;overflow:visible!important;word-break:break-word;}
td.td-desc-wrap .desc-inner{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4;font-size:0.72rem;word-break:break-word;}
td:last-child{border-right:none}
.tr{text-align:right;font-family:'DM Mono',monospace;font-size:11.5px;color:var(--mu)}
.td-mono{font-family:'DM Mono',monospace;font-size:11.5px;color:var(--mu)}
/* \u2500\u2500 Brand & DC pills \u2014 Style 4: Left-accent strip \u2500\u2500 */
.pill{display:inline-flex;align-items:center;padding:2px 8px 2px 6px;border-radius:4px;font-size:11px;font-weight:600;font-family:'DM Mono',monospace;white-space:nowrap;background:var(--s2);border:0.5px solid var(--bd);border-left-width:3px;border-left-style:solid;color:var(--tx)}
.pill-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0}
/* Brand accent colours \u2014 left border only */
.pill-green {border-left-color:#16a34a}
.pill-orange{border-left-color:#ea580c}
.pill-blue  {border-left-color:#2563eb}
.pill-purple{border-left-color:#7c3aed}
.pill-red   {border-left-color:#dc2626}
.pill-teal  {border-left-color:#0d9488}
.pill-yellow{border-left-color:#d97706}
.pill-pink  {border-left-color:#db2777}
.pill-gray  {border-left-color:#64748b}
.pill:not([class*="pill-"]){border-left-color:var(--mu)}
tfoot td{background:var(--bg)!important;color:var(--tx);font-weight:700;font-family:'DM Mono',monospace;font-size:11px;border-top:2px solid var(--or);padding:8px 12px;white-space:nowrap;overflow:visible;text-overflow:clip;}
mark{background:#fef08a;color:#111;border-radius:2px;padding:0 1px}

/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550
   RELIANCE TABLE \u2014 COLUMN GROUP COLOURING  (theme-aware)
   
   Strategy: define group accent variables per theme, then apply them
   uniformly. Dark themes: tinted header backgrounds over --sf/--s2.
   Light themes: pastel header tints + deep text.
   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */

/* \u2500\u2500 Per-theme group accent palette \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
   --cg-ord-h  : order header bg      --cg-ord-c  : order header text
   --cg-prd-h  : product header bg    --cg-prd-c  : product header text
   --cg-prc-h  : pricing header bg    --cg-prc-c  : pricing header text
   --cg-qty-h  : qty header bg        --cg-qty-c  : qty header text
   --cg-val-h  : value header bg      --cg-val-c  : value header text
   --cg-tax-h  : tax header bg        --cg-tax-c  : tax header text
   --cg-id-h   : identity header bg   --cg-id-c   : identity header text
   --cg-ord-t  : order td text        --cg-qty-t  : qty td text
   --cg-val-t  : value td text        --cg-tax-t  : tax td text
   --cg-prc-t  : pricing td text
   \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */

/* DEFAULT (dark) */
:root {
  --cg-id-h:#1a1f2e;   --cg-id-h2:#171c2a;  --cg-id-c:#94a3b8;  --cg-id-b:rgba(100,116,139,.5);
  --cg-ord-h:#131b2e;  --cg-ord-h2:#111829; --cg-ord-c:#93c5fd; --cg-ord-b:rgba(59,130,246,.5);
  --cg-prd-h:#1a1530;  --cg-prd-h2:#17122b; --cg-prd-c:#c4b5fd; --cg-prd-b:rgba(139,92,246,.5);
  --cg-prc-h:#1f1a0e;  --cg-prc-h2:#1b1709; --cg-prc-c:#fcd34d; --cg-prc-b:rgba(245,158,11,.5);
  --cg-qty-h:#201509;  --cg-qty-h2:#1c1208; --cg-qty-c:#fed7aa; --cg-qty-b:rgba(251,146,60,.6);
  --cg-val-h:#0f1f12;  --cg-val-h2:#0d1b10; --cg-val-c:#86efac; --cg-val-b:rgba(74,222,128,.55);
  --cg-tax-h:#200d10;  --cg-tax-h2:#1b0b0e; --cg-tax-c:#fda4af; --cg-tax-b:rgba(244,63,94,.5);
  --cg-ord-t:#93c5fd;  --cg-ord-t2:#60a5fa;
  --cg-prc-t:#fcd34d;  --cg-prc-t2:#fbbf24;
  --cg-qty-t:var(--or);
  --cg-val-t:#4ade80;
  --cg-tax-t:#fb7185;
  --cg-prd-ean:var(--mu); --cg-prd-art:#a78bfa;
}

/* BLUE theme */
[data-theme="blue"] {
  --cg-id-h:#0d1830;   --cg-id-h2:#0b1428;  --cg-id-c:#4d6a9a;  --cg-id-b:rgba(77,106,154,.5);
  --cg-ord-h:#0a1830;  --cg-ord-h2:#081428; --cg-ord-c:#7dd3fc; --cg-ord-b:rgba(56,189,248,.55);
  --cg-prd-h:#160d36;  --cg-prd-h2:#12092e; --cg-prd-c:#c084fc; --cg-prd-b:rgba(192,132,252,.5);
  --cg-prc-h:#1f1608;  --cg-prc-h2:#1a1206; --cg-prc-c:#fbbf24; --cg-prc-b:rgba(251,191,36,.5);
  --cg-qty-h:#1c1505;  --cg-qty-h2:#181204; --cg-qty-c:#fdba74; --cg-qty-b:rgba(251,146,60,.55);
  --cg-val-h:#091a0e;  --cg-val-h2:#07150b; --cg-val-c:#6ee7b7; --cg-val-b:rgba(52,211,153,.55);
  --cg-tax-h:#200d10;  --cg-tax-h2:#1b0b0e; --cg-tax-c:#fda4af; --cg-tax-b:rgba(244,63,94,.5);
  --cg-ord-t:#7dd3fc;  --cg-ord-t2:#38bdf8;
  --cg-prc-t:#fbbf24;  --cg-prc-t2:#f59e0b;
  --cg-qty-t:#fb923c;
  --cg-val-t:#34d399;
  --cg-tax-t:#f87171;
  --cg-prd-art:#c084fc;
}

/* GREEN theme */
[data-theme="green"] {
  --cg-id-h:#0d1f15;   --cg-id-h2:#0b1b12;  --cg-id-c:#3d7a5c;  --cg-id-b:rgba(52,211,153,.35);
  --cg-ord-h:#091a24;  --cg-ord-h2:#071520; --cg-ord-c:#6ee7b7; --cg-ord-b:rgba(110,231,183,.45);
  --cg-prd-h:#160d2a;  --cg-prd-h2:#120924; --cg-prd-c:#a78bfa; --cg-prd-b:rgba(167,139,250,.4);
  --cg-prc-h:#1e190a;  --cg-prc-h2:#1a1508; --cg-prc-c:#fbbf24; --cg-prc-b:rgba(251,191,36,.5);
  --cg-qty-h:#1a1408;  --cg-qty-h2:#161006; --cg-qty-c:#fde68a; --cg-qty-b:rgba(251,191,36,.55);
  --cg-val-h:#0b2410;  --cg-val-h2:#091e0d; --cg-val-c:#34d399; --cg-val-b:rgba(52,211,153,.6);
  --cg-tax-h:#1f0a0d;  --cg-tax-h2:#1a080b; --cg-tax-c:#fca5a5; --cg-tax-b:rgba(248,113,113,.45);
  --cg-ord-t:#6ee7b7;  --cg-ord-t2:#34d399;
  --cg-prc-t:#fbbf24;  --cg-prc-t2:#f59e0b;
  --cg-qty-t:#fbbf24;
  --cg-val-t:#34d399;
  --cg-tax-t:#f87171;
  --cg-prd-art:#a78bfa;
}

/* PURPLE theme */
[data-theme="purple"] {
  --cg-id-h:#1c1035;   --cg-id-h2:#18102e;  --cg-id-c:#6d4fa0;  --cg-id-b:rgba(167,139,250,.35);
  --cg-ord-h:#121040;  --cg-ord-h2:#0f0d38; --cg-ord-c:#c084fc; --cg-ord-b:rgba(192,132,252,.5);
  --cg-prd-h:#1a1045;  --cg-prd-h2:#160d3e; --cg-prd-c:#e9d5ff; --cg-prd-b:rgba(233,213,255,.4);
  --cg-prc-h:#221a06;  --cg-prc-h2:#1e1705; --cg-prc-c:#fcd34d; --cg-prc-b:rgba(252,211,77,.45);
  --cg-qty-h:#1e1406;  --cg-qty-h2:#1a1105; --cg-qty-c:#fdba74; --cg-qty-b:rgba(251,146,60,.55);
  --cg-val-h:#0f1e16;  --cg-val-h2:#0c1912; --cg-val-c:#86efac; --cg-val-b:rgba(134,239,172,.45);
  --cg-tax-h:#220c12;  --cg-tax-h2:#1e0a0f; --cg-tax-c:#fca5a5; --cg-tax-b:rgba(252,165,165,.4);
  --cg-ord-t:#c084fc;  --cg-ord-t2:#a78bfa;
  --cg-prc-t:#fcd34d;  --cg-prc-t2:#fbbf24;
  --cg-qty-t:#fb923c;
  --cg-val-t:#4ade80;
  --cg-tax-t:#f87171;
  --cg-prd-art:#e9d5ff;
}

/* NAVY theme */
[data-theme="navy"] {
  --cg-id-h:#06101e;   --cg-id-h2:#050e1a;  --cg-id-c:#2a4a7a;  --cg-id-b:rgba(42,74,122,.6);
  --cg-ord-h:#041428;  --cg-ord-h2:#031122; --cg-ord-c:#7dd3fc; --cg-ord-b:rgba(125,211,252,.45);
  --cg-prd-h:#0e0c2a;  --cg-prd-h2:#0b0924; --cg-prd-c:#a78bfa; --cg-prd-b:rgba(167,139,250,.4);
  --cg-prc-h:#1a1404;  --cg-prc-h2:#161003; --cg-prc-c:#fbbf24; --cg-prc-b:rgba(251,191,36,.5);
  --cg-qty-h:#181204;  --cg-qty-h2:#140f03; --cg-qty-c:#fdba74; --cg-qty-b:rgba(251,191,36,.5);
  --cg-val-h:#071a0c;  --cg-val-h2:#051509; --cg-val-c:#6ee7b7; --cg-val-b:rgba(110,231,183,.5);
  --cg-tax-h:#1c080c;  --cg-tax-h2:#18060a; --cg-tax-c:#fca5a5; --cg-tax-b:rgba(252,165,165,.4);
  --cg-ord-t:#7dd3fc;  --cg-ord-t2:#38bdf8;
  --cg-prc-t:#fbbf24;  --cg-prc-t2:#f59e0b;
  --cg-qty-t:#fbbf24;
  --cg-val-t:#6ee7b7;
  --cg-tax-t:#f87171;
  --cg-prd-art:#a78bfa;
}

/* WARM theme */
[data-theme="warm"] {
  --cg-id-h:#1a1208;   --cg-id-h2:#160f06;  --cg-id-c:#7a5c3a;  --cg-id-b:rgba(197,130,66,.35);
  --cg-ord-h:#0e1824;  --cg-ord-h2:#0b1420; --cg-ord-c:#fbbf24; --cg-ord-b:rgba(251,191,36,.45);
  --cg-prd-h:#200e28;  --cg-prd-h2:#1c0c24; --cg-prd-c:#e9a0fa; --cg-prd-b:rgba(233,160,250,.35);
  --cg-prc-h:#241806;  --cg-prc-h2:#201404; --cg-prc-c:#f59e0b; --cg-prc-b:rgba(245,158,11,.55);
  --cg-qty-h:#221406;  --cg-qty-h2:#1e1104; --cg-qty-c:#fb923c; --cg-qty-b:rgba(251,146,60,.6);
  --cg-val-h:#0e2010;  --cg-val-h2:#0b1c0e; --cg-val-c:#86d3a0; --cg-val-b:rgba(134,211,160,.45);
  --cg-tax-h:#220c0c;  --cg-tax-h2:#1e0909; --cg-tax-c:#fca5a5; --cg-tax-b:rgba(252,165,165,.4);
  --cg-ord-t:#fbbf24;  --cg-ord-t2:#f59e0b;
  --cg-prc-t:#f59e0b;  --cg-prc-t2:#d97706;
  --cg-qty-t:#fb923c;
  --cg-val-t:#86d3a0;
  --cg-tax-t:#fca5a5;
  --cg-prd-art:#e9a0fa;
}

/* MINIMAL theme */
[data-theme="minimal"] {
  --cg-id-h:#0a0a0f;   --cg-id-h2:#080808;  --cg-id-c:#2a2b38;  --cg-id-b:rgba(60,60,80,.5);
  --cg-ord-h:#080d18;  --cg-ord-h2:#060a12; --cg-ord-c:#86efac; --cg-ord-b:rgba(134,239,172,.35);
  --cg-prd-h:#100e1a;  --cg-prd-h2:#0d0b16; --cg-prd-c:#c084fc; --cg-prd-b:rgba(192,132,252,.35);
  --cg-prc-h:#181208;  --cg-prc-h2:#140f06; --cg-prc-c:#fb923c; --cg-prc-b:rgba(251,146,60,.45);
  --cg-qty-h:#160f06;  --cg-qty-h2:#120c04; --cg-qty-c:#fdba74; --cg-qty-b:rgba(251,146,60,.5);
  --cg-val-h:#08180e;  --cg-val-h2:#06140b; --cg-val-c:#4ade80; --cg-val-b:rgba(74,222,128,.45);
  --cg-tax-h:#180a0c;  --cg-tax-h2:#14080a; --cg-tax-c:#fda4af; --cg-tax-b:rgba(244,63,94,.4);
  --cg-ord-t:#86efac;  --cg-ord-t2:#4ade80;
  --cg-prc-t:#fb923c;  --cg-prc-t2:#ea580c;
  --cg-qty-t:#fb923c;
  --cg-val-t:#4ade80;
  --cg-tax-t:#fb7185;
  --cg-prd-art:#c084fc;
}

/* VIOLET theme */
[data-theme="violet"] {
  --cg-id-h:#0e0e1a;   --cg-id-h2:#0a0a14;  --cg-id-c:#2a2a42;  --cg-id-b:rgba(60,60,100,.5);
  --cg-ord-h:#0e0d20;  --cg-ord-h2:#0a0918; --cg-ord-c:#a78bfa; --cg-ord-b:rgba(167,139,250,.45);
  --cg-prd-h:#131022;  --cg-prd-h2:#0f0d1c; --cg-prd-c:#c4b5fd; --cg-prd-b:rgba(196,181,253,.4);
  --cg-prc-h:#1a1506;  --cg-prc-h2:#161204; --cg-prc-c:#a3e635; --cg-prc-b:rgba(163,230,53,.4);
  --cg-qty-h:#181208;  --cg-qty-h2:#141006; --cg-qty-c:#fb923c; --cg-qty-b:rgba(251,146,60,.5);
  --cg-val-h:#0e180c;  --cg-val-h2:#0c140a; --cg-val-c:#a3e635; --cg-val-b:rgba(163,230,53,.5);
  --cg-tax-h:#1e0c12;  --cg-tax-h2:#1a0a0f; --cg-tax-c:#fda4af; --cg-tax-b:rgba(244,63,94,.45);
  --cg-ord-t:#a78bfa;  --cg-ord-t2:#8b5cf6;
  --cg-prc-t:#a3e635;  --cg-prc-t2:#84cc16;
  --cg-qty-t:#fb923c;
  --cg-val-t:#a3e635;
  --cg-tax-t:#fb7185;
  --cg-prd-art:#c4b5fd;
}

/* METALLIC theme */
[data-theme="metallic"] {
  --cg-id-h:#1e2228;   --cg-id-h2:#1a1e24;  --cg-id-c:#6b7280;  --cg-id-b:rgba(107,114,128,.4);
  --cg-ord-h:#1a1e2a;  --cg-ord-h2:#161a24; --cg-ord-c:#7dd3fc; --cg-ord-b:rgba(125,211,252,.4);
  --cg-prd-h:#20202e;  --cg-prd-h2:#1c1c28; --cg-prd-c:#94a3b8; --cg-prd-b:rgba(148,163,184,.4);
  --cg-prc-h:#261e0c;  --cg-prc-h2:#221a08; --cg-prc-c:#fbbf24; --cg-prc-b:rgba(251,191,36,.45);
  --cg-qty-h:#241a08;  --cg-qty-h2:#201606; --cg-qty-c:#fdba74; --cg-qty-b:rgba(251,191,36,.5);
  --cg-val-h:#141e16;  --cg-val-h2:#101a12; --cg-val-c:#94a3b8; --cg-val-b:rgba(148,163,184,.5);
  --cg-tax-h:#260e10;  --cg-tax-h2:#220c0e; --cg-tax-c:#fca5a5; --cg-tax-b:rgba(252,165,165,.4);
  --cg-ord-t:#7dd3fc;  --cg-ord-t2:#38bdf8;
  --cg-prc-t:#fbbf24;  --cg-prc-t2:#f59e0b;
  --cg-qty-t:#fbbf24;
  --cg-val-t:#94a3b8;
  --cg-tax-t:#f87171;
  --cg-prd-art:#94a3b8;
}

/* BROWN theme */
[data-theme="brown"] {
  --cg-id-h:#221408;   --cg-id-h2:#1e1106;  --cg-id-c:#7a5c3a;  --cg-id-b:rgba(122,92,58,.5);
  --cg-ord-h:#141808;  --cg-ord-h2:#101406; --cg-ord-c:#d4a76a; --cg-ord-b:rgba(212,167,106,.4);
  --cg-prd-h:#200e20;  --cg-prd-h2:#1c0c1c; --cg-prd-c:#d4a76a; --cg-prd-b:rgba(212,167,106,.35);
  --cg-prc-h:#281808;  --cg-prc-h2:#241406; --cg-prc-c:#f59e0b; --cg-prc-b:rgba(245,158,11,.55);
  --cg-qty-h:#261408;  --cg-qty-h2:#221006; --cg-qty-c:#fb923c; --cg-qty-b:rgba(251,146,60,.6);
  --cg-val-h:#0e1e0c;  --cg-val-h2:#0b1a09; --cg-val-c:#c2823c; --cg-val-b:rgba(194,130,60,.5);
  --cg-tax-h:#260c0a;  --cg-tax-h2:#220a08; --cg-tax-c:#fca5a5; --cg-tax-b:rgba(252,165,165,.4);
  --cg-ord-t:#d4a76a;  --cg-ord-t2:#c2823c;
  --cg-prc-t:#f59e0b;  --cg-prc-t2:#d97706;
  --cg-qty-t:#fb923c;
  --cg-val-t:#c2823c;
  --cg-tax-t:#f87171;
  --cg-prd-art:#d4a76a;
}

/* AURORA theme (GitHub-style dark) */
[data-theme="aurora"] {
  --cg-id-h:#1c2130;   --cg-id-h2:#181d2a;  --cg-id-c:#8b949e;  --cg-id-b:rgba(139,148,158,.4);
  --cg-ord-h:#111d32;  --cg-ord-h2:#0e182a; --cg-ord-c:#79c0ff; --cg-ord-b:rgba(88,166,255,.5);
  --cg-prd-h:#1a1535;  --cg-prd-h2:#16122e; --cg-prd-c:#d2a8ff; --cg-prd-b:rgba(188,140,255,.45);
  --cg-prc-h:#201a08;  --cg-prc-h2:#1c1606; --cg-prc-c:#ffa657; --cg-prc-b:rgba(240,136,62,.5);
  --cg-qty-h:#1e1408;  --cg-qty-h2:#1a1106; --cg-qty-c:#ffb380; --cg-qty-b:rgba(240,136,62,.55);
  --cg-val-h:#0d2010;  --cg-val-h2:#0b1c0d; --cg-val-c:#56d364; --cg-val-b:rgba(63,185,80,.55);
  --cg-tax-h:#200d10;  --cg-tax-h2:#1b0b0e; --cg-tax-c:#ff7b72; --cg-tax-b:rgba(248,81,73,.45);
  --cg-ord-t:#79c0ff;  --cg-ord-t2:#58a6ff;
  --cg-prc-t:#ffa657;  --cg-prc-t2:#f0883e;
  --cg-qty-t:#f0883e;
  --cg-val-t:#3fb950;
  --cg-tax-t:#ff7b72;
  --cg-prd-ean:#8b949e; --cg-prd-art:#d2a8ff;
}

/* CLEAN SLATE theme (white, pastel bands) */
[data-theme="cleanslate"] {
  --cg-id-h:#f0f2f5;   --cg-id-h2:#e8eaed;  --cg-id-c:#475569;  --cg-id-b:rgba(100,116,139,.3);
  --cg-ord-h:#eff6ff;  --cg-ord-h2:#dbeafe; --cg-ord-c:#1d4ed8; --cg-ord-b:rgba(29,78,216,.3);
  --cg-prd-h:#f5f3ff;  --cg-prd-h2:#ede9fe; --cg-prd-c:#6d28d9; --cg-prd-b:rgba(109,40,217,.3);
  --cg-prc-h:#fffbeb;  --cg-prc-h2:#fef3c7; --cg-prc-c:#92400e; --cg-prc-b:rgba(146,64,14,.3);
  --cg-qty-h:#fff7ed;  --cg-qty-h2:#ffedd5; --cg-qty-c:#c2410c; --cg-qty-b:rgba(194,65,12,.35);
  --cg-val-h:#f0fdf4;  --cg-val-h2:#dcfce7; --cg-val-c:#15803d; --cg-val-b:rgba(21,128,61,.35);
  --cg-tax-h:#fff1f2;  --cg-tax-h2:#ffe4e6; --cg-tax-c:#be123c; --cg-tax-b:rgba(190,18,60,.3);
  --cg-ord-t:#1d4ed8;  --cg-ord-t2:#1e40af;
  --cg-prc-t:#b45309;  --cg-prc-t2:#92400e;
  --cg-qty-t:#c2410c;
  --cg-val-t:#15803d;
  --cg-tax-t:#be123c;
  --cg-prd-ean:#94a3b8; --cg-prd-art:#6d28d9;
}

/* NEON theme (terminal black, neon glow) */
[data-theme="neon"] {
  --cg-id-h:#080c12;   --cg-id-h2:#060a0f;  --cg-id-c:#1e3a5f;  --cg-id-b:rgba(30,58,95,.6);
  --cg-ord-h:#001020;  --cg-ord-h2:#000d1a; --cg-ord-c:#0ea5e9; --cg-ord-b:rgba(14,165,233,.45);
  --cg-prd-h:#0d0020;  --cg-prd-h2:#0a001a; --cg-prd-c:#a855f7; --cg-prd-b:rgba(168,85,247,.4);
  --cg-prc-h:#110a00;  --cg-prc-h2:#0d0800; --cg-prc-c:#f59e0b; --cg-prc-b:rgba(245,158,11,.45);
  --cg-qty-h:#0a1500;  --cg-qty-h2:#081000; --cg-qty-c:#84cc16; --cg-qty-b:rgba(132,204,22,.45);
  --cg-val-h:#001208;  --cg-val-h2:#000e06; --cg-val-c:#00ffa3; --cg-val-b:rgba(0,255,163,.5);
  --cg-tax-h:#120005;  --cg-tax-h2:#0e0004; --cg-tax-c:#f43f5e; --cg-tax-b:rgba(244,63,94,.4);
  --cg-ord-t:#0ea5e9;  --cg-ord-t2:#38bdf8;
  --cg-prc-t:#f59e0b;  --cg-prc-t2:#d97706;
  --cg-qty-t:#84cc16;
  --cg-val-t:#00ffa3;
  --cg-tax-t:#f43f5e;
  --cg-prd-ean:#334155; --cg-prd-art:#a855f7;
}

/* WARM PAPER theme (off-white parchment, earthy) */
[data-theme="warmpaper"] {
  --cg-id-h:#ede8df;   --cg-id-h2:#e5e0d7;  --cg-id-c:#8b7355;  --cg-id-b:rgba(139,115,85,.35);
  --cg-ord-h:#e4eff8;  --cg-ord-h2:#d8e8f2; --cg-ord-c:#3a5f86; --cg-ord-b:rgba(91,127,166,.3);
  --cg-prd-h:#ede5f8;  --cg-prd-h2:#e4d8f2; --cg-prd-c:#5a3a8a; --cg-prd-b:rgba(122,91,166,.3);
  --cg-prc-h:#fdf4e0;  --cg-prc-h2:#f8eccc; --cg-prc-c:#a0742a; --cg-prc-b:rgba(160,116,42,.35);
  --cg-qty-h:#fdf0e0;  --cg-qty-h2:#f8e8cc; --cg-qty-c:#a0602a; --cg-qty-b:rgba(160,96,42,.4);
  --cg-val-h:#e4f5ec;  --cg-val-h2:#d4eddc; --cg-val-c:#1a6e36; --cg-val-b:rgba(42,122,80,.35);
  --cg-tax-h:#fce8e8;  --cg-tax-h2:#f8d8d8; --cg-tax-c:#a03030; --cg-tax-b:rgba(160,48,48,.3);
  --cg-ord-t:#3a5f86;  --cg-ord-t2:#1a4f7a;
  --cg-prc-t:#a0742a;  --cg-prc-t2:#8a5000;
  --cg-qty-t:#a0602a;
  --cg-val-t:#2a7a50;
  --cg-tax-t:#a03030;
  --cg-prd-ean:#b4a090; --cg-prd-art:#5a3a8a;
}

/* \u2500\u2500 LIGHT THEMES (light, silver, skyblue, lightnavy, cleanslate, warmpaper) \u2014 pastel tints \u2500\u2500 */
[data-theme="light"],
[data-theme="silver"],
[data-theme="skyblue"],
[data-theme="lightnavy"],
[data-theme="cleanslate"],
[data-theme="warmpaper"] {
  --cg-id-h:#f0f2f5;   --cg-id-h2:#e8eaed;  --cg-id-c:#475569;  --cg-id-b:rgba(100,116,139,.35);
  --cg-ord-h:#eff6ff;  --cg-ord-h2:#dbeafe; --cg-ord-c:#1d4ed8; --cg-ord-b:rgba(29,78,216,.3);
  --cg-prd-h:#f5f3ff;  --cg-prd-h2:#ede9fe; --cg-prd-c:#6d28d9; --cg-prd-b:rgba(109,40,217,.3);
  --cg-prc-h:#fffbeb;  --cg-prc-h2:#fef3c7; --cg-prc-c:#92400e; --cg-prc-b:rgba(146,64,14,.3);
  --cg-qty-h:#fff7ed;  --cg-qty-h2:#ffedd5; --cg-qty-c:#c2410c; --cg-qty-b:rgba(194,65,12,.35);
  --cg-val-h:#f0fdf4;  --cg-val-h2:#dcfce7; --cg-val-c:#15803d; --cg-val-b:rgba(21,128,61,.35);
  --cg-tax-h:#fff1f2;  --cg-tax-h2:#ffe4e6; --cg-tax-c:#be123c; --cg-tax-b:rgba(190,18,60,.3);
  --cg-ord-t:#1d4ed8;  --cg-ord-t2:#1e40af;
  --cg-prc-t:#b45309;  --cg-prc-t2:#92400e;
  --cg-qty-t:#c2410c;
  --cg-val-t:#15803d;
  --cg-tax-t:#be123c;
  --cg-prd-ean:#94a3b8; --cg-prd-art:#6d28d9;
}

/* Silver: slightly cooler tint */
[data-theme="silver"] {
  --cg-ord-h:#eef4ff; --cg-prd-h:#f4f0ff;
  --cg-ord-c:#1e40af; --cg-prd-c:#5b21b6;
}

/* Sky blue: brighter blue tints */
[data-theme="skyblue"] {
  --cg-ord-h:#e0f2fe; --cg-ord-h2:#bae6fd; --cg-ord-c:#0369a1; --cg-ord-b:rgba(3,105,161,.3);
  --cg-val-h:#ecfdf5; --cg-val-h2:#d1fae5; --cg-val-c:#065f46; --cg-val-b:rgba(6,95,70,.3);
  --cg-ord-t:#0369a1; --cg-val-t:#065f46;
}

/* Light navy: deeper navy-blue tints */
[data-theme="lightnavy"] {
  --cg-ord-h:#dce8f8; --cg-ord-h2:#c8d8f0; --cg-ord-c:#1d4ed8; --cg-ord-b:rgba(29,78,216,.35);
  --cg-val-h:#e6f4ee; --cg-val-h2:#d0e8dc; --cg-val-c:#14532d; --cg-val-b:rgba(20,83,45,.35);
  --cg-qty-t:#ea580c; --cg-val-t:#14532d;
}

/* Cleanslate: same pastel palette as light, no overrides needed (inherits from shared block above) */

/* Warmpaper: warm amber/sepia tints */
[data-theme="warmpaper"] {
  --cg-id-h:#f5f0e8;   --cg-id-h2:#ede8df;  --cg-id-c:#5c4a32;  --cg-id-b:rgba(92,74,50,.3);
  --cg-ord-h:#eef4fb;  --cg-ord-h2:#dce8f5; --cg-ord-c:#2a5a8a; --cg-ord-b:rgba(42,90,138,.3);
  --cg-prd-h:#f3f0f8;  --cg-prd-h2:#e8e2f2; --cg-prd-c:#5b3a8a; --cg-prd-b:rgba(91,58,138,.3);
  --cg-prc-h:#fdf6e8;  --cg-prc-h2:#f8edd4; --cg-prc-c:#7a4a10; --cg-prc-b:rgba(122,74,16,.3);
  --cg-qty-h:#fef3e8;  --cg-qty-h2:#fce8d0; --cg-qty-c:#8a3010; --cg-qty-b:rgba(138,48,16,.3);
  --cg-val-h:#eef8f0;  --cg-val-h2:#daf0de; --cg-val-c:#1a5c30; --cg-val-b:rgba(26,92,48,.3);
  --cg-tax-h:#fef0f0;  --cg-tax-h2:#fde0e0; --cg-tax-c:#8a1a20; --cg-tax-b:rgba(138,26,32,.3);
  --cg-ord-t:#2a5a8a;  --cg-prc-t:#7a4a10;
  --cg-qty-t:#8a3010;  --cg-val-t:#1a5c30;  --cg-tax-t:#8a1a20;
  --cg-prd-ean:#8b7355; --cg-prd-art:#5b3a8a;
}

/* \u2500\u2500 Apply the variables to actual selectors \u2500\u2500 */

/* HR1 label row */
tr.hr1 th.cg-identity{background:var(--cg-id-h);border-bottom:2px solid var(--cg-id-b);color:var(--cg-id-c);isolation:isolate;}
tr.hr1 th.cg-order   {background:var(--cg-ord-h);border-bottom:2px solid var(--cg-ord-b);color:var(--cg-ord-c);isolation:isolate;}
tr.hr1 th.cg-product {background:var(--cg-prd-h);border-bottom:2px solid var(--cg-prd-b);color:var(--cg-prd-c);isolation:isolate;}
tr.hr1 th.cg-pricing {background:var(--cg-prc-h);border-bottom:2px solid var(--cg-prc-b);color:var(--cg-prc-c);isolation:isolate;}
tr.hr1 th.cg-qty     {background:var(--cg-qty-h);border-bottom:2px solid var(--cg-qty-b);color:var(--cg-qty-c);isolation:isolate;}
tr.hr1 th.cg-value   {background:var(--cg-val-h);border-bottom:2px solid var(--cg-val-b);color:var(--cg-val-c);isolation:isolate;}
tr.hr1 th.cg-tax     {background:var(--cg-tax-h);border-bottom:2px solid var(--cg-tax-b);color:var(--cg-tax-c);isolation:isolate;}

/* HR2 filter row */
tr.hr2 th.cg-identity{background:var(--cg-id-h2);}
tr.hr2 th.cg-order   {background:var(--cg-ord-h2);}
tr.hr2 th.cg-product {background:var(--cg-prd-h2);}
tr.hr2 th.cg-pricing {background:var(--cg-prc-h2);}
tr.hr2 th.cg-qty     {background:var(--cg-qty-h2);}
tr.hr2 th.cg-value   {background:var(--cg-val-h2);}
tr.hr2 th.cg-tax     {background:var(--cg-tax-h2);}

/* Data cells \u2014 !important so these beat any broad td color rules */
td.cg-identity{color:var(--mu)!important;font-family:'DM Mono',monospace;font-size:11px;}
td.cg-order{color:var(--cg-ord-t)!important;font-family:'DM Mono',monospace;font-size:11px;}
td.cg-order.cg-po{color:var(--cg-ord-t2)!important;font-weight:600;}
td.cg-product{font-size:11.5px;}
td.cg-product.cg-ean{color:var(--cg-prd-ean,var(--mu))!important;font-family:'DM Mono',monospace;font-size:10.5px;}
td.cg-product.cg-article{color:var(--cg-prd-art,#a78bfa)!important;font-family:'DM Mono',monospace;font-size:11px;}
td.cg-pricing{text-align:right;font-family:'DM Mono',monospace;font-size:11.5px;color:var(--cg-prc-t)!important;}
td.cg-pricing.cg-mrp{color:var(--cg-prc-t2)!important;font-weight:600;}
td.cg-qty{text-align:right;font-family:'DM Mono',monospace;font-size:11.5px;color:var(--cg-qty-t)!important;font-weight:600;}
td.cg-value{text-align:right;font-family:'DM Mono',monospace;font-size:11.5px;color:var(--cg-val-t)!important;font-weight:700;}
td.cg-tax{text-align:right;font-family:'DM Mono',monospace;font-size:11.5px;color:var(--cg-tax-t)!important;}

/* Group left-border dividers */
tr.hr1 th.cg-grp-start{border-left:2px solid rgba(128,128,128,.1);}
tr.hr2 th.cg-grp-start{border-left:2px solid rgba(128,128,128,.1);}

/* tfoot totals */
tfoot td.cg-qty    {color:var(--cg-qty-t)!important;  text-align:right!important;overflow:visible!important;white-space:nowrap!important;}
tfoot td.cg-value  {color:var(--cg-val-t)!important;  text-align:right!important;overflow:visible!important;white-space:nowrap!important;}
tfoot td.cg-pricing{color:var(--mu)!important;         text-align:right!important;overflow:visible!important;white-space:nowrap!important;}
tfoot td.cg-tax    {color:var(--mu)!important;         text-align:right!important;overflow:visible!important;white-space:nowrap!important;}
tfoot td.cg-identity,tfoot td.cg-order,tfoot td.cg-product{color:var(--mu)!important;overflow:visible!important;white-space:nowrap!important;}

.norows{text-align:center;padding:48px;color:var(--mu)}

.empty-st{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:340px;gap:14px;color:var(--mu);padding:40px}
.empty-st .ei{font-size:3rem;opacity:.22;filter:grayscale(1)}
.empty-st p{font-size:0.82rem;max-width:300px;text-align:center;line-height:1.7;color:var(--mu)}

/* \u2500\u2500 EXPIRED PO \u2500\u2500 */
tr.expired td{text-decoration:line-through;color:var(--rd)!important}
tr.expired .pill{opacity:.6}
/* \u2500\u2500 UNMAPPED BANNER \u2500\u2500 */
.unmapped-banner{background:linear-gradient(90deg,#3d1a00,#4a2200);border-bottom:2px solid var(--or);padding:8px 16px;flex-shrink:0;display:none}
.unmapped-banner .ub-title{font-size:11px;font-weight:700;color:var(--or);font-family:'DM Mono',monospace;letter-spacing:1px;text-transform:uppercase;margin-bottom:5px}
.unmapped-banner .ub-items{display:flex;flex-wrap:wrap;gap:5px}
.unmapped-banner .ub-tag{background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.3);border-radius:4px;padding:2px 7px;font-size:11px;font-family:'DM Mono',monospace;color:#fdba74}
/* \u2500\u2500 MULTI-SELECT CHECKBOXES \u2500\u2500 */
.ms-header{display:flex;align-items:center;gap:6px;padding:6px 14px;background:var(--s2);border-bottom:1px solid var(--bd);font-size:0.72rem;color:var(--mu);display:none}
.ms-header.show{display:flex}
.ms-count{font-family:DM Mono,monospace;color:var(--ac);font-weight:700}

tr.row-selected td{background:rgba(74,222,128,0.05)!important;outline:1px solid rgba(74,222,128,0.3);outline-offset:-1px}
/* \u2500\u2500 FORMAT PAINTER \u2500\u2500 */
.fp-panel{position:fixed;right:16px;bottom:60px;z-index:500;background:var(--sf);border:1px solid var(--bd);border-radius:10px;padding:14px 16px;width:230px;box-shadow:0 8px 32px rgba(0,0,0,.5);display:none}
.fp-panel.show{display:block}
.fp-title{font-size:0.68rem;font-weight:700;color:var(--mu);font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px}
.fp-grid{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.fp-group{display:flex;flex-direction:column;gap:4px}
.fp-group label{font-size:0.62rem;color:var(--mu);font-family:DM Mono,monospace}
.fp-group input[type=color]{width:38px;height:28px;border:1px solid var(--bd);border-radius:4px;padding:2px;cursor:pointer;background:var(--bg)}
.fp-group select{padding:4px 6px;border:1px solid var(--bd);border-radius:4px;background:var(--bg);color:var(--tx);font-family:DM Mono,monospace;font-size:0.68rem;outline:none}
.fp-swatch{width:38px;height:28px;border-radius:4px;border:1px solid var(--bd)}
/* \u2500\u2500 MARGIN COLUMN \u2500\u2500 */
col.w-margin{width:auto}
td.margin-cell{text-align:right;font-family:DM Mono,monospace;font-size:0.66rem}
/* \u2500\u2500 EXPIRED TOGGLE \u2500\u2500 */
.exp-toggle{display:flex;align-items:center;gap:5px;font-size:0.69rem;color:var(--mu);cursor:pointer;user-select:none;white-space:nowrap}
.exp-toggle input{accent-color:var(--ac);width:13px;height:13px}

/* \u2550\u2550\u2550 PRINT SETUP MODAL \u2550\u2550\u2550 */
.modal-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:600;align-items:flex-start;justify-content:center;padding-top:40px;overflow-y:auto}
.modal-bg.show{display:flex}
.modal{background-color:var(--bg)!important;background-image:linear-gradient(rgba(255,255,255,0.07),rgba(255,255,255,0.07))!important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--bd);border-radius:14px;padding:24px;width:700px;max-width:95vw;margin-bottom:40px;box-shadow:0 24px 80px rgba(0,0,0,.7)}
.modal h2{font-family:'Syne',sans-serif;font-size:0.95rem;font-weight:700;margin-bottom:4px;display:flex;align-items:center;gap:8px;letter-spacing:-0.2px}
.modal-sub{font-size:0.72rem;color:var(--mu);margin-bottom:18px;line-height:1.5}
.po-list{max-height:280px;overflow-y:auto;border:1px solid var(--bd);border-radius:7px;margin-bottom:14px}
.po-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid var(--bd);cursor:pointer;transition:background .1s}
.po-item:last-child{border-bottom:none}
.po-item:hover{background:var(--s2)}
.po-item.sel{background:rgba(74,222,128,.08);border-left:3px solid var(--ac)}
.po-cb{width:16px;height:16px;accent-color:var(--ac);cursor:pointer;flex-shrink:0}
.po-num{font-family:DM Mono,monospace;font-size:0.78rem;font-weight:700;color:var(--tx);min-width:110px}
.po-meta{font-size:0.7rem;color:var(--mu)}
.po-cnt{font-size:0.65rem;color:var(--ac);font-family:DM Mono,monospace;margin-left:auto}
.modal-btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.sel-all-row{display:flex;gap:8px;margin-bottom:8px;align-items:center}
.sel-all-row span{font-size:0.72rem;color:var(--mu)}

/* \u2550\u2550\u2550 ADMIN \u2550\u2550\u2550 */
.awrap{max-width:880px;margin:0 auto;padding:22px 20px}
.audit-wrap{padding:20px}
.asec{background:var(--sf);border:1px solid var(--bd);border-radius:12px;padding:20px;margin-bottom:16px;transition:border-color .2s}.asec:hover{border-color:var(--bd)}
.asec h2{font-family:'Syne',sans-serif;font-size:0.9rem;font-weight:700;margin-bottom:4px;display:flex;align-items:center;gap:8px;letter-spacing:-0.2px}
.asec p{font-size:0.71rem;color:var(--mu);margin-bottom:14px;line-height:1.5}
.frow{display:flex;gap:9px;flex-wrap:wrap;align-items:flex-end;margin-bottom:10px}
.fg{flex:1;min-width:130px}
.fg label{display:block;font-size:0.66rem;font-weight:600;color:var(--mu);text-transform:uppercase;letter-spacing:1px;margin-bottom:5px;font-family:DM Mono,monospace}
.fg input,.fg select,.fg textarea{width:100%;padding:7px 9px;border:1.5px solid var(--bd);border-radius:6px;background:var(--bg);color:var(--tx);font-family:'DM Sans',sans-serif;font-size:0.79rem;outline:none;transition:border-color .15s}
.fg input:focus,.fg select:focus{border-color:var(--bl);box-shadow:0 0 0 3px rgba(96,165,250,0.1)}
.fg textarea{resize:vertical;min-height:50px;font-family:DM Mono,monospace;font-size:0.73rem}
.ts-prev{background:linear-gradient(90deg,#0d1a30,#112240);border:1px solid var(--bd);border-radius:7px;padding:12px 16px;margin-top:9px}
.bi{display:flex;align-items:center;gap:7px;padding:6px 9px;border-radius:5px;border:1px solid var(--bd);margin-bottom:5px;background:var(--bg)}
.bi-code{font-family:DM Mono,monospace;font-size:0.68rem;color:var(--mu);width:95px;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bi-desc{font-size:0.7rem;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bi-save{padding:3px 9px;border:none;border-radius:4px;background:var(--ac);color:#000;font-size:0.68rem;font-weight:700;cursor:pointer;flex-shrink:0}
.bm-results{max-height:230px;overflow-y:auto}
.bm-no{text-align:center;padding:16px;color:var(--mu);font-size:0.74rem}
.pw-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cur-pw{font-family:DM Mono,monospace;font-size:0.76rem;color:var(--ac);background:var(--bg);border:1px solid var(--bd);border-radius:5px;padding:5px 9px;display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.cur-pw span{color:var(--mu);font-size:0.63rem}
/* \u2500\u2500 User Management table \u2500\u2500 */
.um-table{width:100%;border-collapse:collapse;font-size:0.74rem}
.um-table th{padding:7px 10px;background:var(--th);border-bottom:1.5px solid var(--bd);text-align:left;font-size:0.66rem;font-weight:700;color:var(--mu);text-transform:uppercase;letter-spacing:.8px;font-family:DM Mono,monospace;white-space:nowrap}
.um-table td{padding:7px 10px;border-bottom:1px solid var(--bd);vertical-align:middle}
.um-table tr:last-child td{border-bottom:none}
.um-table tr:hover td{background:rgba(255,255,255,0.025)}
.um-role-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:0.64rem;font-weight:700;font-family:DM Mono,monospace}
.um-role-admin{background:rgba(251,146,60,0.15);color:#fb923c;border:1px solid rgba(251,146,60,0.3)}
.um-role-user{background:rgba(96,165,250,0.12);color:#60a5fa;border:1px solid rgba(96,165,250,0.25)}
.um-role-einvoice{background:rgba(74,222,128,0.12);color:#4ade80;border:1px solid rgba(74,222,128,0.25)}
.um-role-user_einvoice{background:rgba(167,139,250,0.12);color:#a78bfa;border:1px solid rgba(167,139,250,0.25)}
.um-act-btn{padding:3px 9px;border-radius:5px;font-size:0.65rem;font-weight:600;cursor:pointer;transition:all .15s;font-family:'DM Sans',sans-serif}

/* \u2500\u2500 USER MGMT \u2014 2-panel split \u2500\u2500 */
.um-split{display:grid;grid-template-columns:1fr 310px;gap:14px;align-items:start}
@media(max-width:860px){.um-split{grid-template-columns:1fr}}
.um-edit-wrap{margin-bottom:14px;animation:fadeInDown .2s ease}
@keyframes fadeInDown{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.um-edit-card{background:var(--sf);border:1px solid var(--bd);border-radius:10px;overflow:hidden}
.um-edit-card-hd{display:flex;align-items:center;justify-content:space-between;padding:9px 14px;background:rgba(255,255,255,0.03);border-bottom:1px solid var(--bd);font-size:0.72rem;font-weight:700;color:var(--tx);font-family:'Syne',sans-serif}
.um-edit-card-body{padding:14px}

/* \u2500\u2500 PERMISSION TREE \u2500\u2500 */
.um-pbox{background:var(--sf);border:1px solid var(--bd);border-radius:10px;overflow:hidden}
.um-pbox-hd{background:#1a4c8a;color:#fff;padding:9px 14px;font-size:0.73rem;font-weight:700;letter-spacing:.3px;font-family:'Syne',sans-serif}
.um-pbox-body{max-height:360px;overflow-y:auto}
.up-node{display:flex;align-items:center;gap:7px;padding:6px 10px;font-size:0.71rem;color:var(--tx);cursor:default;border-bottom:1px solid rgba(255,255,255,0.035)}
.up-node:hover{background:rgba(255,255,255,0.04)}
.up-node.up-parent{font-weight:700;background:rgba(26,76,138,0.18);color:#93c5fd}
.up-node.up-child{padding-left:34px}
.up-node.up-child:hover{background:rgba(255,255,255,0.05)}
.up-node.up-subparent{font-weight:600;background:rgba(20,83,60,0.2);color:#6ee7b7;padding-left:22px}
.up-node.up-subparent:hover{background:rgba(20,83,60,0.3)}
.up-node.up-grandchild{padding-left:54px}
.up-node.up-grandchild:hover{background:rgba(255,255,255,0.05)}
.up-node.up-brand-group{font-weight:600;background:rgba(109,40,217,0.18);color:#c4b5fd;padding-left:38px}
.up-node.up-brand-group:hover{background:rgba(109,40,217,0.26)}
.up-node.up-brand-item{padding-left:66px;font-size:0.69rem;color:rgba(196,181,253,0.8)}
.up-node.up-brand-item:hover{background:rgba(109,40,217,0.1)}
/* \u2500\u2500 D-Mart MRP Amendment Modal \u2500\u2500 */
.dm-amend-panel{background:var(--bg);border:1px solid var(--bd);border-radius:14px;width:calc(100vw - 32px);max-width:calc(100vw - 32px);max-height:92vh;display:flex;flex-direction:column;box-shadow:0 24px 64px rgba(0,0,0,0.55);overflow:hidden}
.dm-amend-hd{padding:12px 16px;border-bottom:1px solid var(--bd);display:flex;align-items:center;gap:10px;flex-shrink:0;flex-wrap:wrap;background:var(--sf)}
.dm-amend-sel{padding:4px 8px;background:var(--bg);border:1px solid var(--bd);border-radius:6px;color:var(--tx);font-size:0.72rem;cursor:pointer}
/* amendment table cells */
.dma-th{padding:10px 11px;text-align:left;font-size:0.72rem;font-weight:700;color:var(--mu);text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid var(--bd);border-right:1px solid rgba(255,255,255,0.07);white-space:nowrap}
.dma-sticky-th{position:sticky;top:0;background:var(--sf);z-index:3}
.dma-th:last-child{border-right:none}
.dma-th.num{text-align:right}
.dma-td{padding:10px 11px;border-bottom:1px solid rgba(255,255,255,0.06);border-right:1px solid rgba(255,255,255,0.05);vertical-align:middle;font-size:0.76rem;color:var(--tx)}
.dma-td:last-child{border-right:none}
.dma-td.num{text-align:right;font-family:'DM Mono',monospace}
.dma-td.dma-desc-td{max-width:260px;white-space:normal;line-height:1.45;font-size:0.74rem}
.dma-remark{white-space:normal;line-height:1.4;min-width:140px}
.dma-in{width:100%;padding:7px 9px;background:var(--bg);border:1.5px solid var(--bd);border-radius:5px;color:var(--tx);font-size:0.76rem;text-align:right;font-family:'DM Mono',monospace;box-sizing:border-box;transition:border-color .15s}
.dma-in:focus{outline:none;border-color:var(--or)}
.dm-amend-row:hover{background:rgba(255,255,255,0.03)}
.dm-amend-chg{background:rgba(251,191,36,0.05)!important}
.dm-amend-chg:hover{background:rgba(251,191,36,0.09)!important}
@keyframes dma-pulse{0%,100%{box-shadow:0 0 5px rgba(167,139,250,0.4),0 0 10px rgba(167,139,250,0.2);transform:scale(1)}50%{box-shadow:0 0 12px rgba(167,139,250,0.8),0 0 22px rgba(167,139,250,0.4);transform:scale(1.06)}}
.dma-accept-btn{margin-left:6px;padding:3px 10px;font-size:0.7rem;border-radius:5px;background:rgba(167,139,250,0.28);color:#c4b5fd;border:1.5px solid #a78bfa;cursor:pointer;font-weight:700;animation:dma-pulse 1.6s ease-in-out infinite;transition:background .15s}
.dma-accept-btn:hover{background:rgba(167,139,250,0.6);animation:none;box-shadow:0 0 14px rgba(167,139,250,0.8);transform:scale(1.1)}
.dm-amend-po-hdr td{font-size:0.71rem}
/* \u2500\u2500 D-Mart expiry countdown badges \u2500\u2500 */
.dm-exp-label{display:block;font-size:0.58rem;font-weight:700;border-radius:3px;padding:1px 5px;margin-top:3px;line-height:1.4;white-space:nowrap;width:fit-content}
.dm-exp-today{background:rgba(251,191,36,0.22);color:#fbbf24;border:1px solid rgba(251,191,36,0.35)}
.dm-exp-soon{background:rgba(251,146,60,0.18);color:#fb923c;border:1px solid rgba(251,146,60,0.32)}
.dm-exp-expired{background:rgba(248,113,113,0.15);color:#f87171;border:1px solid rgba(248,113,113,0.3)}
.up-cb{width:15px;height:15px;cursor:pointer;accent-color:#4ade80;flex-shrink:0}
.up-expand{font-size:0.58rem;width:13px;color:var(--mu);cursor:pointer;user-select:none;transition:transform .18s;flex-shrink:0;text-align:center}
.up-lbl{cursor:pointer;flex:1;user-select:none}
.um-pbox-foot{padding:9px 12px;border-top:1px solid var(--bd);display:flex;gap:8px;align-items:center;background:rgba(255,255,255,0.02)}
.um-edit-btn{background:rgba(96,165,250,0.1);border:1px solid rgba(96,165,250,0.25);color:#60a5fa}
.um-edit-btn:hover{background:rgba(96,165,250,0.2)}
.um-del-btn{background:rgba(248,113,113,0.1);border:1px solid rgba(248,113,113,0.25);color:#f87171;margin-left:5px}
.um-del-btn:hover{background:rgba(248,113,113,0.2)}
.theme-grid{display:flex;gap:10px;flex-wrap:wrap}
.theme-card{padding:10px 16px;border-radius:8px;border:2px solid var(--bd);cursor:pointer;font-size:0.76rem;font-weight:600;transition:all .15s;user-select:none;background:var(--bg)}
.theme-card:hover{transform:translateY(-1px)}
.theme-card.active{border-color:var(--ac)!important;box-shadow:0 0 0 3px rgba(74,222,128,0.15)}

/* \u2500\u2500 CARD TEMPLATE PICKER \u2500\u2500 */
.ctpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-top:4px}
.ctpl-item{border:2px solid var(--bd);border-radius:10px;overflow:hidden;cursor:pointer;transition:all .18s;background:var(--bg)}
.ctpl-item:hover{border-color:var(--bl);transform:translateY(-2px)}
.ctpl-item.active{border-color:var(--ac);box-shadow:0 0 0 3px rgba(74,222,128,0.12)}
.ctpl-label{padding:8px 12px;font-size:0.66rem;font-weight:700;font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:1.5px;background:var(--s2);border-bottom:1px solid var(--bd);display:flex;align-items:center;justify-content:space-between;color:var(--mu)}
.ctpl-label span{background:var(--ac);color:#000;border-radius:8px;padding:1px 7px;font-size:0.55rem}
.ctpl-preview{padding:10px;pointer-events:none;transform:scale(0.92);transform-origin:top left;width:109%}
/* mini card previews */
.mp-card{background:var(--sf);border:1px solid var(--bd);border-radius:8px;overflow:hidden;font-size:0.7rem}
.mp-topbar{display:flex;align-items:center;gap:5px;padding:5px 8px;background:var(--th);border-bottom:1px solid var(--bd)}
.mp-dc{font-family:DM Mono,monospace;font-size:0.56rem;font-weight:600;color:var(--bl);background:rgba(96,165,250,0.08);border:1px solid rgba(96,165,250,0.15);border-radius:3px;padding:1px 5px}
.mp-po{font-family:DM Mono,monospace;font-size:0.6rem;font-weight:700;color:var(--ac);margin-left:auto}
.mp-brand{font-size:0.5rem;font-weight:700;padding:1px 5px;border-radius:6px;background:rgba(74,222,128,0.1);color:var(--ac);border:1px solid rgba(74,222,128,0.2)}
.mp-item{padding:5px 8px;font-size:0.68rem;font-weight:600;color:var(--tx);border-bottom:1px solid var(--bd);line-height:1.3}
.mp-heroes{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--bd)}
.mp-hero{padding:5px 8px;background:var(--tf)}.mp-hero+.mp-hero{border-left:1px solid var(--bd)}
.mp-hlbl{font-size:0.4rem;font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:1.5px;color:var(--mu)}
.mp-hval{font-size:0.88rem;font-weight:700;font-family:DM Mono,monospace}
.mp-hval.g{color:var(--ac)}.mp-hval.o{color:var(--or)}
.mp-footer{display:flex;align-items:center;padding:4px 8px;gap:4px;flex-wrap:wrap}
.mp-chip{background:var(--bg);border:1px solid var(--bd);border-radius:3px;padding:1px 5px;color:var(--mu);font-size:0.48rem;font-family:DM Mono,monospace}
.mp-margin{margin-left:auto;font-size:0.58rem;font-weight:700;font-family:DM Mono,monospace}
.mp-margin.g{color:var(--ac)}.mp-margin.o{color:var(--or)}
/* tpl B */
.mp-b-row{display:flex;align-items:center;gap:6px;padding:4px 8px;border-bottom:1px solid var(--bd)}
.mp-b-left{flex:1;min-width:0}.mp-b-item{font-size:0.64rem;font-weight:600;color:var(--tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mp-b-sub{font-size:0.5rem;color:var(--mu);font-family:DM Mono,monospace}
.mp-b-right{text-align:right;flex-shrink:0}
.mp-b-mrp{font-size:0.78rem;font-weight:700;font-family:DM Mono,monospace;color:var(--ac)}
.mp-b-packs{font-size:0.60rem;color:var(--or);font-family:DM Mono,monospace}
/* tpl C */
.mp-c-top{display:flex;gap:5px;padding:5px 8px;border-bottom:1px solid var(--bd);align-items:center}
.mp-c-dc{font-size:0.52rem;font-family:DM Mono,monospace;color:var(--bl);font-weight:600}
.mp-c-po{font-size:0.58rem;font-family:DM Mono,monospace;font-weight:700;color:var(--ac);margin-left:auto}
.mp-c-item{padding:4px 8px;font-size:0.65rem;font-weight:600;color:var(--tx);border-bottom:1px solid var(--bd)}
.mp-c-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-bottom:1px solid var(--bd)}
.mp-c-cell{padding:4px 7px;border-right:1px solid var(--bd)}.mp-c-cell:last-child{border-right:none}
.mp-c-lbl{font-size:0.38rem;font-family:DM Mono,monospace;text-transform:uppercase;letter-spacing:1px;color:var(--mu)}
.mp-c-val{font-size:0.66rem;font-weight:700;font-family:DM Mono,monospace;color:var(--tx)}
.mp-c-val.g{color:var(--ac)}.mp-c-val.o{color:var(--or)}
/* tpl D */
.mp-d-head{background:linear-gradient(90deg,var(--bl),var(--ac));padding:6px 8px}
.mp-d-po{font-family:DM Mono,monospace;font-size:0.7rem;font-weight:700;color:#000}
.mp-d-dc{font-size:0.5rem;color:rgba(0,0,0,0.6)}
.mp-d-body{padding:5px 8px}
.mp-d-item{font-size:0.65rem;font-weight:600;color:var(--tx);margin-bottom:4px;line-height:1.3}
.mp-d-row{display:flex;justify-content:space-between;margin-bottom:2px}
.mp-d-k{font-size:0.5rem;color:var(--mu);font-family:DM Mono,monospace}
.mp-d-v{font-size:0.5rem;font-weight:700;font-family:DM Mono,monospace;color:var(--tx)}

/* \u2550\u2550\u2550 TIMEOUT WARNING \u2550\u2550\u2550 */
.timeout-bar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:999;background:#b45309;color:#fff;padding:10px 20px;font-size:0.8rem;font-weight:600;display:none;align-items:center;justify-content:space-between}
.timeout-bar.show{display:flex}

/* \u2550\u2550\u2550 EXPIRED PO \u2550\u2550\u2550 */
tr.po-expired td{text-decoration:line-through;color:#f87171 !important}
tr.po-expired .pill{opacity:.55;text-decoration:line-through}

/* \u2550\u2550\u2550 UNMAPPED BRAND ALERT \u2550\u2550\u2550 */
.unmapped-banner{
  background:linear-gradient(90deg,rgba(61,26,0,0.95),rgba(74,34,0,0.95),rgba(61,26,0,0.95));
  border-bottom:2px solid rgba(251,146,60,0.6);
  padding:10px 18px;
  display:none;
  backdrop-filter:blur(4px);
}
.unmapped-banner .ub-title{
  font-size:0.72rem;font-weight:700;color:#fb923c;
  font-family:DM Mono,monospace;letter-spacing:1px;
  text-transform:uppercase;margin-bottom:6px;
}
.unmapped-items{display:flex;flex-wrap:wrap;gap:5px}
.unmapped-item{
  background:rgba(251,146,60,.12);border:1px solid rgba(251,146,60,.35);
  border-radius:4px;padding:2px 8px;
  font-size:0.65rem;font-family:DM Mono,monospace;color:#fdba74;
  cursor:pointer;transition:background .15s;
}
.unmapped-item:hover{background:rgba(251,146,60,.25)}

/* \u2550\u2550\u2550 MULTI-SELECT CHECKBOXES \u2550\u2550\u2550 */
.sel-toolbar{
  display:none;position:sticky;top:var(--tbH);z-index:190;
  background:#1e2d1e;border-bottom:1px solid var(--ac);
  padding:6px 14px;align-items:center;gap:10px;font-size:0.75rem;
}
.sel-toolbar.show{display:flex}
.sel-count{color:var(--ac);font-family:DM Mono,monospace;font-weight:700}
.sel-actions{display:flex;gap:7px}
.fp-row input[type=color]{width:36px;height:26px;border:1px solid var(--bd);border-radius:4px;padding:1px;cursor:pointer;background:var(--bg)}
.fp-row select{flex:1;padding:4px 6px;border:1px solid var(--bd);border-radius:4px;background:var(--bg);color:var(--tx);font-size:0.7rem;outline:none}
.fp-row input[type=range]{flex:1}

/* \u2550\u2550\u2550 MARGIN COLUMN \u2550\u2550\u2550 */
col.w-mgn{width:auto}
.margin-cell{font-family:DM Mono,monospace;font-size:0.64rem;text-align:right}

/* \u2550\u2550\u2550 PDF SETTINGS MODAL \u2550\u2550\u2550 */
.pdf-settings{max-height:70vh;overflow-y:auto}
.pdf-col-row{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid var(--bd)}
.pdf-col-row:last-child{border-bottom:none}
.pdf-col-vis{width:16px;height:16px;accent-color:var(--ac)}
.pdf-col-name{flex:1;font-size:0.74rem}
.pdf-col-w{width:60px;padding:3px 5px;border:1px solid var(--bd);border-radius:4px;background:var(--bg);color:var(--tx);font-size:0.7rem;outline:none;text-align:center}
.pdf-col-align select{padding:2px 4px;border:1px solid var(--bd);border-radius:3px;background:var(--bg);color:var(--tx);font-size:0.69rem;outline:none}

/* \u2550\u2550\u2550 MODAL TITLE (fix) \u2550\u2550\u2550 */
.modal-title{font-size:0.95rem;font-weight:700;margin-bottom:6px;display:flex;align-items:center;gap:8px;color:var(--tx)}

/* \u2550\u2550\u2550 EMAIL PREVIEW ENLARGED \u2550\u2550\u2550 */
.email-preview-box{background:#fff;border:1.5px solid var(--bd);border-radius:8px;overflow:hidden;min-height:340px;max-height:430px;padding:0!important}
.email-preview-box iframe{width:100%;height:420px;min-height:340px;border:none;display:block}



/* \u2550\u2550\u2550 TOP NAV BAR (preview-style) \u2550\u2550\u2550 */
#topnav{
  background:var(--bg);border-bottom:1px solid var(--bd);
  padding:0 16px;height:36px;display:flex;align-items:center;gap:6px;
  flex-shrink:0;position:relative;z-index:400;
  font-size:11px;font-family:DM Mono,monospace;
}
.topnav-item{
  display:flex;align-items:center;gap:5px;
  padding:4px 10px;border-radius:5px;cursor:pointer;
  color:var(--mu);transition:all .15s;font-weight:500;
  border:1px solid transparent;white-space:nowrap;
  text-decoration:none;
}
.topnav-item:hover{background:var(--s2);color:var(--tx)}
.topnav-item.active{
  background:var(--s2);color:var(--tx);
  border-color:var(--bd);
}
.topnav-item-icon{font-size:12px}
.topnav-sep{width:1px;height:16px;background:var(--bd);flex-shrink:0}
.topnav-right{margin-left:auto;display:flex;align-items:center;gap:6px}
.topnav-preview-badge{
  font-size:9px;font-weight:700;padding:1px 5px;
  border-radius:4px;background:rgba(74,222,128,.18);
  color:var(--ac);border:1px solid rgba(74,222,128,.3);
  text-transform:uppercase;letter-spacing:.5px;
}


/* \u2550\u2550\u2550 MOBILE TOP BAR \u2550\u2550\u2550 */
#mobile-topbar{
  display:none;background:var(--sf);border-bottom:1px solid var(--bd);
  padding:0 14px;height:46px;align-items:center;gap:10px;
  flex-shrink:0;z-index:400;width:100%;
}
.mob-brand{font-family:'Syne',sans-serif;font-size:15px;font-weight:800;letter-spacing:-0.3px}
.mob-brand em{color:var(--ac);font-style:normal}
.mob-ham{background:none;border:none;cursor:pointer;padding:4px;color:var(--tx);font-size:20px;line-height:1;flex-shrink:0}
.mob-badge{background:var(--ac);color:#000;font-size:9px;font-weight:800;padding:1px 6px;border-radius:8px;font-family:DM Mono,monospace;margin-left:4px}

/* \u2550\u2550\u2550 INNER TABS \u2550\u2550\u2550 */
.inner-tab-bar{display:flex;gap:0;background:var(--sf);border-bottom:2px solid var(--bd);padding:0 16px}
.inner-tab{padding:10px 22px;font-size:0.79rem;font-weight:600;cursor:pointer;border-bottom:2.5px solid transparent;color:var(--mu);margin-bottom:-2px;transition:all .15s;user-select:none;white-space:nowrap}
.inner-tab:hover{color:var(--tx)}
.inner-tab.active{color:var(--tx);border-bottom-color:var(--ac);font-weight:700}
/* \u2550\u2550\u2550 PO EXTENSION REQUEST \u2550\u2550\u2550 */
.ext-table{width:100%;border-collapse:collapse;font-size:0.72rem}
.ext-table th{background:var(--sf);padding:7px 10px;border-bottom:2px solid var(--bd);white-space:nowrap;font-family:DM Mono,monospace;font-size:0.6rem;text-transform:uppercase;letter-spacing:.5px;color:var(--mu);text-align:left;position:sticky;top:0;z-index:5}
.ext-table td{padding:6px 8px;border-bottom:1px solid var(--bd);vertical-align:middle}
.ext-table tr:hover td{background:rgba(59,130,246,.04)}
.ext-reason-sel{background:var(--bg);border:1.5px solid var(--bd);border-radius:6px;color:var(--tx);font-size:0.7rem;padding:3px 6px;outline:none;cursor:pointer;min-width:210px}
.ext-reason-sel:focus{border-color:var(--ac)}
.ext-expand-btn{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:3px;background:rgba(59,130,246,.12);color:var(--ac);font-size:0.75rem;font-weight:700;cursor:pointer;border:1px solid rgba(59,130,246,.3);line-height:1;flex-shrink:0;margin-right:5px;font-family:DM Mono,monospace;vertical-align:middle;user-select:none}
.ext-expand-btn:hover{background:rgba(59,130,246,.28)}
.ext-detail-row>td{background:var(--bg)!important;padding:6px 8px 10px 38px!important}
.ext-items-tbl{width:100%;border-collapse:collapse;font-size:0.67rem}
.ext-items-tbl th{padding:4px 9px;text-align:left;color:var(--mu);font-family:DM Mono,monospace;font-size:0.59rem;border-bottom:1px solid var(--bd);text-transform:uppercase;letter-spacing:.4px;white-space:nowrap}
.ext-items-tbl td{padding:4px 9px;border-bottom:1px solid var(--bd);color:var(--tx);font-family:DM Mono,monospace;font-size:0.67rem;white-space:nowrap}
.ext-items-tbl td.ext-desc{white-space:normal;max-width:340px;word-break:break-word}
.ext-date-in,.qext-date-input{background:var(--bg);border:1.5px solid var(--bd);border-radius:6px;color:var(--tx);font-size:0.7rem;padding:3px 7px;outline:none;width:130px;color-scheme:dark}
.ext-date-in:focus,.qext-date-input:focus{border-color:var(--ac)}
/* Light themes: date picker icon must be dark */
[data-theme="light"] .ext-date-in,[data-theme="light"] .qext-date-input,
[data-theme="silver"] .ext-date-in,[data-theme="silver"] .qext-date-input,
[data-theme="skyblue"] .ext-date-in,[data-theme="skyblue"] .qext-date-input,
[data-theme="lightnavy"] .ext-date-in,[data-theme="lightnavy"] .qext-date-input,
[data-theme="cleanslate"] .ext-date-in,[data-theme="cleanslate"] .qext-date-input,
[data-theme="warmpaper"] .ext-date-in,[data-theme="warmpaper"] .qext-date-input{color-scheme:light}
.ext-custom-in{background:var(--bg);border:1.5px solid var(--bd);border-radius:6px;color:var(--tx);font-size:0.7rem;padding:3px 7px;outline:none;width:180px;display:none}
.ext-cb{width:15px;height:15px;cursor:pointer;accent-color:var(--ac)}
/* Mail modal */
#ext-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:9000;align-items:center;justify-content:center}
#ext-modal.open{display:flex}
.ext-modal-box{background:var(--bg);border:1px solid var(--bd);border-radius:14px;width:min(820px,96vw);max-height:88vh;display:flex;flex-direction:column;overflow:hidden}
.ext-modal-head{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--bd);flex-shrink:0}
.ext-modal-body{overflow:auto;flex:1;padding:18px}
.ext-modal-foot{padding:12px 18px;border-top:1px solid var(--bd);display:flex;gap:9px;align-items:center;flex-shrink:0}
/* Mail HTML table preview */
.ext-mail-wrap table{border-collapse:collapse;font-family:Arial,sans-serif;font-size:12px;width:100%;color:#111}
.ext-mail-wrap th,.ext-mail-wrap td{border:1px solid #999;padding:5px 8px;text-align:center;vertical-align:middle;color:#111}
.ext-mail-wrap th{background:#C0C0C0;font-weight:normal;color:#111}
.amend-stab-bar{display:flex;gap:0;background:var(--sf);border-bottom:1px solid var(--bd);padding:0 12px;flex-shrink:0}
.amend-stab{padding:9px 18px;font-size:0.77rem;font-weight:600;cursor:pointer;border-bottom:2.5px solid transparent;color:var(--mu);margin-bottom:-1px;transition:all .15s;user-select:none;white-space:nowrap}
.amend-stab:hover{color:var(--tx)}
.amend-stab.active{color:var(--tx);border-bottom-color:var(--bl);font-weight:700}

/* \u2550\u2550\u2550 BUYER TABS \u2550\u2550\u2550 */
.buyer-tabs-bar{background:var(--sf);border-bottom:1px solid var(--bd);padding:0 16px;display:flex;align-items:center;gap:0;overflow-x:auto;scrollbar-width:none;flex-shrink:0;box-shadow:0 1px 0 var(--bd)}
.buyer-tabs-bar::-webkit-scrollbar{display:none}
.buyer-tab{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:2.5px solid transparent;cursor:pointer;white-space:nowrap;transition:all .15s;font-size:0.78rem;font-weight:600;color:var(--mu);position:relative;bottom:-2px;user-select:none;flex-shrink:0;letter-spacing:.1px}
.buyer-tab:hover{color:var(--tx);background:var(--s2)}.buyer-tab.active{color:var(--tx);border-bottom-color:var(--ac);background:rgba(74,222,128,0.04)}
.buyer-tab img{height:24px;width:auto;max-width:80px;object-fit:contain;border-radius:3px;opacity:0.75;transition:opacity .18s;flex-shrink:0}
.buyer-tab:hover img,.buyer-tab.active img{opacity:1}
.buyer-tab-soon{font-size:0.5rem;font-weight:700;letter-spacing:.5px;padding:1px 5px;border-radius:5px;background:rgba(251,146,60,0.18);color:var(--or);border:1px solid rgba(251,146,60,0.4);white-space:nowrap;text-transform:uppercase}
.buyer-panel{display:none;flex-direction:column;min-height:0}.buyer-panel.active{display:flex;flex:1;min-height:0;overflow:hidden;}
.buyer-coming-soon{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:64px 24px;text-align:center;background:var(--bg);min-height:55vh}
.buyer-cs-logo{width:150px;height:90px;object-fit:contain;border-radius:14px;opacity:0.7;filter:drop-shadow(0 6px 20px rgba(0,0,0,.5));transition:opacity .2s}
.buyer-cs-logo:hover{opacity:0.9}
.buyer-cs-title{font-family:'Syne',sans-serif;font-size:1.4rem;font-weight:800;color:var(--tx);letter-spacing:-0.5px}
.buyer-cs-sub{font-size:0.84rem;color:var(--mu);max-width:380px;line-height:1.65}
.buyer-cs-badge{display:inline-flex;align-items:center;gap:7px;padding:8px 20px;border-radius:20px;background:rgba(251,146,60,0.1);border:1.5px solid rgba(251,146,60,0.38);color:var(--or);font-size:0.79rem;font-weight:700;letter-spacing:.5px;font-family:DM Mono,monospace}

/* \u2500\u2500 PDF BUYER PANELS \u2500\u2500 */
.pdf-buyer-wrap{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;}
.pdf-topbar{background:var(--sf);border-bottom:1px solid var(--bd);padding:10px 16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex-shrink:0;}
.pdf-topbar-logo{height:28px;width:auto;object-fit:contain;opacity:.85;}
.pdf-topbar-title{font-size:0.82rem;font-weight:700;color:var(--tx);font-family:DM Mono,monospace;letter-spacing:.5px;}
.pdf-topbar-meta{font-size:0.68rem;color:var(--mu);font-family:DM Mono,monospace;}
.pdf-topbar-right{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.pdf-drop-zone{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:48px 24px;text-align:center;border:2px dashed var(--bd);border-radius:12px;margin:20px;cursor:pointer;transition:border-color .2s,background .2s;}
.pdf-drop-zone:hover,.pdf-drop-zone.drag-over{border-color:var(--ac);background:rgba(74,222,128,0.04);}
.pdf-drop-icon{font-size:2.4rem;opacity:.6;}
.pdf-drop-title{font-size:1rem;font-weight:700;color:var(--tx);}
.pdf-drop-sub{font-size:0.76rem;color:var(--mu);max-width:320px;line-height:1.6;}
.pdf-parsing{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 32px;}
.pdf-progress-wrap{width:100%;max-width:460px;display:flex;flex-direction:column;gap:10px;}
.pdf-progress-top{display:flex;justify-content:space-between;align-items:center;gap:8px;}
.pdf-progress-msg{font-size:0.8rem;color:var(--tx);font-family:'DM Mono',monospace;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pdf-progress-pct{font-size:0.85rem;color:var(--ac);font-family:'DM Mono',monospace;font-weight:700;min-width:42px;text-align:right;}
.pdf-progress-track{width:100%;height:7px;background:var(--bd);border-radius:4px;overflow:hidden;}
.pdf-progress-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--ac),#63b3ed);border-radius:4px;transition:width .3s ease;}
.pdf-progress-status{font-size:0.7rem;color:var(--mu);letter-spacing:.08em;text-transform:uppercase;font-family:'DM Mono',monospace;}
.pdf-error-box{margin:20px;padding:14px 18px;background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#f87171;font-size:0.78rem;font-family:DM Mono,monospace;white-space:pre-wrap;}
.pdf-review{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;}
.pdf-review-bar{position:sticky;top:0;z-index:200;background:var(--sf);border-bottom:1px solid var(--bd);padding:9px 16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;flex-shrink:0;}
.pdf-review-stats{display:flex;gap:16px;align-items:center;flex:1;flex-wrap:wrap;font-size:0.74rem;font-family:DM Mono,monospace;}
.pdf-review-stat{display:flex;gap:5px;align-items:center;}
.pdf-review-stat .lbl{color:var(--mu);}
.pdf-review-stat .val{color:var(--tx);font-weight:700;}
.pdf-review-stat .val.warn{color:#f97316;}
.rv-warn-bar{padding:6px 16px;display:flex;flex-direction:column;gap:4px;background:rgba(251,146,60,0.06);border-bottom:1px solid rgba(251,146,60,0.25);}
.rv-warn-pill{font-size:0.71rem;color:#f97316;font-weight:600;padding:3px 0;}
tr.rv-missing td{background:rgba(239,68,68,0.10)!important;}
tr.rv-missing td:first-child{border-left:3px solid #ef4444!important;}
.pdf-review-stat .val.warn{color:var(--or);}
.pdf-review-stat .val.ac{color:var(--ac);}
.pdf-review-acts{display:flex;gap:8px;margin-left:auto;}
.pdf-review-tbl-wrap{flex:1;overflow:auto;}
.pdf-review-tbl{width:100%;border-collapse:collapse;font-size:0.74rem;font-family:DM Mono,monospace;}
.pdf-review-tbl th{padding:7px 10px;background:var(--s2);border-bottom:2px solid var(--bd);color:var(--mu);text-align:left;font-size:0.63rem;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;}
.pdf-review-tbl td{padding:5px 8px;border-bottom:1px solid var(--bd);vertical-align:middle;color:var(--tx);}
.pdf-review-tbl td[contenteditable="true"]{cursor:text;}
.pdf-review-tbl td[contenteditable="true"]:focus{background:rgba(74,222,128,.07);outline:1px solid var(--ac);}
.pdf-review-tbl tr.rv-flag{background:rgba(251,146,60,.07);}
.pdf-review-tbl .num{text-align:right;}
.pdf-pending-banner{background:rgba(251,146,60,.1);border-bottom:1px solid rgba(251,146,60,.3);padding:7px 16px;display:flex;align-items:center;gap:10px;font-size:0.74rem;font-family:DM Mono,monospace;flex-shrink:0;}
.pdf-pending-banner .pmsg{color:var(--or);flex:1;}
/* \u2500\u2500 PDF buyer viewer: Reliance-style layout \u2500\u2500 */
.pdf-viewer{display:flex;flex-direction:column;flex:1;min-height:0;}
/* Toolbar row \u2014 mirrors .vtoolbar */
.dm-section-tabs{display:flex;gap:0;border-bottom:2px solid var(--bd);background:var(--sf);padding:0 12px;flex-shrink:0;position:sticky;top:0;z-index:201;}
.dm-stab{background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;padding:9px 18px;font-size:0.78rem;font-weight:600;color:var(--mu);cursor:pointer;white-space:nowrap;transition:color .15s,border-color .15s;font-family:'DM Sans',sans-serif;}
.dm-stab:hover{color:var(--tx);}
.dm-stab-active{color:var(--bl) !important;border-bottom-color:var(--bl) !important;}
.pdf-vtoolbar{position:sticky;top:0;z-index:200;background:var(--sf);border-bottom:1px solid var(--bd);padding:7px 13px;display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:var(--tbH);flex-shrink:0;}
.pdf-vtoolbar .gsearch{flex:1;min-width:140px;max-width:280px;}
.pdf-vtoolbar .gsearch input{width:100%;padding:7px 16px 7px 36px;background:rgba(255,255,255,0.07);border:2px solid rgba(255,255,255,0.15);border-radius:50px;color:#fff;font-size:0.74rem;font-family:'DM Sans',sans-serif;outline:none;box-shadow:0 4px 18px rgba(0,0,0,0.25),inset 0 1px 0 rgba(255,255,255,0.08);}
.pdf-vtoolbar .gsearch input::placeholder{color:rgba(255,255,255,0.45);}
.pdf-vtoolbar .gsearch input:focus{border-color:rgba(139,92,246,0.65);background:rgba(139,92,246,0.13);box-shadow:0 4px 22px rgba(139,92,246,0.28);}
.pdf-vinfo{font-size:0.7rem;color:var(--mu);white-space:nowrap;}
/* Summary bar \u2014 slim stat row */
.pdf-summary-bar{display:flex;align-items:center;gap:20px;padding:6px 16px;background:var(--s2);border-bottom:1px solid var(--bd);font-size:0.72rem;font-family:DM Mono,monospace;flex-wrap:wrap;flex-shrink:0;}
.pdf-sum-item{display:flex;flex-direction:column;gap:1px;}
.pdf-sum-lbl{color:var(--mu);font-size:0.6rem;text-transform:uppercase;letter-spacing:.5px;}
.pdf-sum-val{color:var(--tx);font-weight:700;}
.pdf-sum-val.ac{color:var(--ac);}
.pdf-sum-val.or{color:var(--or);}
.pdf-sum-val.bl{color:var(--bl);}
/* PO chips row */
.pdf-multi-po{padding:5px 14px;display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--bd);flex-shrink:0;}
.pdf-po-chip{padding:3px 10px;border-radius:12px;font-size:0.65rem;font-family:DM Mono,monospace;cursor:pointer;border:1px solid var(--bd);color:var(--mu);background:var(--bg);transition:all .15s;white-space:nowrap;}
.pdf-po-chip.active{background:rgba(74,222,128,.12);border-color:var(--ac);color:var(--ac);}
/* Table */
.pdf-tbl-wrap{flex:1;overflow:auto;min-height:0;min-width:0;}
.pdf-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:0.74rem;}
.pdf-tbl th{background:var(--sf);color:var(--bl);font-size:0.62rem;text-transform:uppercase;letter-spacing:.5px;padding:7px 10px;border-bottom:2px solid var(--bd);white-space:nowrap;position:sticky;top:0;z-index:2;font-family:DM Mono,monospace;cursor:default;}
.pdf-tbl th.num,.pdf-tbl td.num{text-align:right;font-variant-numeric:tabular-nums;}
.pdf-tbl td{padding:6px 10px;border-bottom:1px solid var(--bd);color:var(--tx);vertical-align:middle;white-space:nowrap;}
.pdf-tbl td.desc{white-space:normal;max-width:260px;font-size:0.73rem;}
.pdf-tbl tr:hover td{background:var(--s2);}
.pdf-tbl .mono{font-family:DM Mono,monospace;font-size:0.68rem;color:var(--tx);}
.pdf-tbl .mrp{color:var(--ac);font-weight:700;font-family:DM Mono,monospace;font-size:0.7rem;}
.pdf-tbl .rate{color:var(--bl);font-family:DM Mono,monospace;font-size:0.7rem;}
.pdf-tbl .qty{color:var(--or);font-weight:700;font-family:DM Mono,monospace;}
.pdf-tbl .amt{color:var(--ac);font-weight:700;font-family:DM Mono,monospace;font-size:0.7rem;}
.pdf-tbl .sku{color:var(--ac);font-family:DM Mono,monospace;font-size:0.68rem;font-weight:700;}
.pdf-tbl .rownum{color:var(--mu);font-size:0.65rem;font-family:DM Mono,monospace;}
.pdf-empty{padding:48px;text-align:center;color:var(--mu);font-size:0.78rem;}
@keyframes spin{to{transform:rotate(360deg);}}

/* \u2500\u2500 Vishal / Blinkit table enhancements \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
/* Store banner row */
.vmm-store-hdr td{
  padding:7px 14px;font-family:'Syne',sans-serif;font-weight:800;
  font-size:0.7rem;letter-spacing:.6px;text-transform:uppercase;
  border-top:2px solid var(--ac);border-bottom:1px solid var(--bd);
  background:linear-gradient(90deg,rgba(74,222,128,.09) 0%,transparent 60%);
  color:var(--ac);white-space:nowrap;
}
.vmm-store-hdr .vmm-sh-pill{
  display:inline-flex;align-items:center;gap:8px;
}
.vmm-store-hdr .vmm-sh-site{
  font-family:'DM Mono',monospace;font-weight:600;font-size:0.65rem;
  background:rgba(74,222,128,.15);color:var(--ac);border-radius:4px;
  padding:1px 6px;letter-spacing:.4px;
}
.vmm-store-hdr .vmm-sh-meta{
  font-family:'DM Mono',monospace;font-weight:400;font-size:0.62rem;
  color:var(--mu);margin-left:4px;text-transform:none;letter-spacing:0;
}
/* Alternating row stripes */
.vmm-row-odd td{background:var(--bg);}
.vmm-row-even td{background:var(--s2);}
.pdf-tbl tr.vmm-row-odd:hover td,.pdf-tbl tr.vmm-row-even:hover td{background:rgba(74,222,128,.07);}
/* PO subtotal row */
.vmm-po-sub td{
  background:rgba(59,130,246,.06);border-top:1px dashed var(--bd);
  border-bottom:1px dashed var(--bd);
}
/* Store total row */
.vmm-store-total td{
  background:rgba(74,222,128,.08);border-top:1.5px solid var(--bd);
  border-bottom:2px solid var(--ac);
}

/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550
   AUTHORITATIVE RULES \u2014 single source of truth for all features
   All duplicates above/below are superseded by this block.
\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */

/* \u2500\u2500 Layout: buyer-tab bar glow when a tab is selected \u2500\u2500 */
.buyer-tabs-bar.selection-mode {
  border-bottom: 2px solid rgba(74,222,128,0.6) !important;
  box-shadow: 0 2px 16px rgba(74,222,128,0.12) !important;
  transition: box-shadow .25s, border-bottom-color .25s;
}
.buyer-tabs-bar.selection-mode .buyer-tab.active img {
  opacity: 1 !important;
  filter: drop-shadow(0 0 5px rgba(74,222,128,0.5)) !important;
}
/* The selected buyer tab glows cyan */
.buyer-tab.glow-active {
  color: #00ffe7 !important;
  font-weight: 700 !important;
  background: rgba(0,255,231,0.07) !important;
  border-radius: 8px;
  box-shadow:
    0 0 0 2px rgba(0,255,231,0.45),
    0 0 14px rgba(0,255,231,0.35),
    0 0 28px rgba(0,255,231,0.15) !important;
  transition: box-shadow .25s, background .25s, color .25s;
}
.buyer-tab.glow-active img {
  opacity: 1 !important;
  filter: drop-shadow(0 0 6px rgba(0,255,231,0.7)) brightness(1.15) !important;
}

/* \u2500\u2500 Legend: default blue glow when ON \u2500\u2500 */
.leg.on {
  border-color: #60a5fa !important;
  background: rgba(96,165,250,0.18) !important;
  color: #bfdbfe !important;
  box-shadow: 0 0 0 2px rgba(96,165,250,0.5), 0 3px 10px rgba(96,165,250,0.25) !important;
  font-weight: 700 !important;
  transform: translateY(-1px) !important;
}
.leg.on::after{
  content:'\u2715';
  font-size:9px;
  opacity:.6;
  margin-left:3px;
  font-family:sans-serif;
  font-weight:400;
}

/* \u2500\u2500 Legend color schemes \u2500\u2500 */
.leg-scheme-neon .leg.on {
  border-color:#4ade80!important;background:rgba(74,222,128,0.18)!important;color:#86efac!important;
  box-shadow:0 0 0 2px rgba(74,222,128,0.55),0 3px 10px rgba(74,222,128,0.25)!important;
}
.leg-scheme-fire .leg.on {
  border-color:#fb923c!important;background:rgba(251,146,60,0.18)!important;color:#fdba74!important;
  box-shadow:0 0 0 2px rgba(251,146,60,0.55),0 3px 10px rgba(251,146,60,0.25)!important;
}
.leg-scheme-ice .leg.on {
  border-color:#22d3ee!important;background:rgba(34,211,238,0.16)!important;color:#67e8f9!important;
  box-shadow:0 0 0 2px rgba(34,211,238,0.55),0 3px 10px rgba(34,211,238,0.22)!important;
}
.leg-scheme-purple .leg.on {
  border-color:#a78bfa!important;background:rgba(167,139,250,0.18)!important;color:#c4b5fd!important;
  box-shadow:0 0 0 2px rgba(167,139,250,0.55),0 3px 10px rgba(167,139,250,0.22)!important;
}

/* \u2500\u2500 Light theme: .leg.on text is near-white on dark themes \u2014 override to dark readable colors \u2500\u2500 */
[data-theme="light"] .leg.on,
[data-theme="silver"] .leg.on,
[data-theme="skyblue"] .leg.on,
[data-theme="lightnavy"] .leg.on,
[data-theme="cleanslate"] .leg.on,
[data-theme="warmpaper"] .leg.on {
  color: #1d4ed8 !important;
  background: rgba(96,165,250,0.14) !important;
  border-color: #3b82f6 !important;
  box-shadow: 0 0 0 2px rgba(59,130,246,0.25) !important;
}
[data-theme="light"] .leg-scheme-neon .leg.on,
[data-theme="silver"] .leg-scheme-neon .leg.on,
[data-theme="skyblue"] .leg-scheme-neon .leg.on,
[data-theme="lightnavy"] .leg-scheme-neon .leg.on,
[data-theme="cleanslate"] .leg-scheme-neon .leg.on,
[data-theme="warmpaper"] .leg-scheme-neon .leg.on { color:#15803d!important; border-color:#22c55e!important; background:rgba(74,222,128,0.12)!important; }
[data-theme="light"] .leg-scheme-fire .leg.on,
[data-theme="silver"] .leg-scheme-fire .leg.on,
[data-theme="skyblue"] .leg-scheme-fire .leg.on,
[data-theme="lightnavy"] .leg-scheme-fire .leg.on,
[data-theme="cleanslate"] .leg-scheme-fire .leg.on,
[data-theme="warmpaper"] .leg-scheme-fire .leg.on { color:#c2410c!important; border-color:#fb923c!important; background:rgba(251,146,60,0.12)!important; }
[data-theme="light"] .leg-scheme-ice .leg.on,
[data-theme="silver"] .leg-scheme-ice .leg.on,
[data-theme="skyblue"] .leg-scheme-ice .leg.on,
[data-theme="lightnavy"] .leg-scheme-ice .leg.on,
[data-theme="cleanslate"] .leg-scheme-ice .leg.on,
[data-theme="warmpaper"] .leg-scheme-ice .leg.on { color:#0e7490!important; border-color:#22d3ee!important; background:rgba(34,211,238,0.12)!important; }
[data-theme="light"] .leg-scheme-purple .leg.on,
[data-theme="silver"] .leg-scheme-purple .leg.on,
[data-theme="skyblue"] .leg-scheme-purple .leg.on,
[data-theme="lightnavy"] .leg-scheme-purple .leg.on,
[data-theme="cleanslate"] .leg-scheme-purple .leg.on,
[data-theme="warmpaper"] .leg-scheme-purple .leg.on { color:#6d28d9!important; border-color:#a78bfa!important; background:rgba(167,139,250,0.12)!important; }


/* \u2500\u2500 qf-chip selected glow \u2500\u2500 */
.qf-chip.on {
  border-color: var(--ac) !important;
  background: rgba(74,222,128,0.13) !important;
  color: var(--ac) !important;
  box-shadow: 0 0 0 2px rgba(74,222,128,0.25), 0 0 8px rgba(74,222,128,0.14) !important;
  font-weight: 700 !important;
}

/* \u2500\u2500 Column filter button active glow \u2500\u2500 */
.dd-btn.af {
  border-color: var(--ac) !important;
  background: rgba(74,222,128,0.09) !important;
  color: var(--ac) !important;
  box-shadow: 0 0 0 2px rgba(74,222,128,0.18) !important;
}

/* \u2500\u2500 QF toggle button open glow \u2500\u2500 */
#btn-qf-toggle.qf-open {
  background: rgba(74,222,128,0.14) !important;
  border-color: var(--ac) !important;
  color: var(--ac) !important;
  box-shadow: 0 0 0 2px rgba(74,222,128,0.2) !important;
}

/* \u2500\u2500 Search input: glow when has value (cyan) \u2500\u2500 */
.gsearch input.has-val {
  border-color: #00ffe7 !important;
  background: rgba(0,255,231,0.08) !important;
  border-radius: 50px !important;
  box-shadow:
    0 0 0 2px rgba(0,255,231,0.35),
    0 0 16px rgba(0,255,231,0.25),
    0 0 28px rgba(0,255,231,0.10) !important;
  color: #00ffe7 !important;
  transition: box-shadow .2s, border-color .2s !important;
}

/* \u2500\u2500 Column text filter input: glow when active \u2500\u2500 */
.cfi-input.has-val {
  border-color: var(--ac) !important;
  background: rgba(74,222,128,0.05) !important;
  box-shadow: 0 0 0 2px rgba(74,222,128,0.18) !important;
}

/* \u2500\u2500 QF section box: glow when chips selected \u2500\u2500 */
.qf-section.has-sel {
  border-color: rgba(74,222,128,0.4) !important;
  box-shadow: 0 0 0 2px rgba(74,222,128,0.12) !important;
}

/* \u2500\u2500 QF strip: bottom glow when any filter active \u2500\u2500 */
#qf-strip.filters-active {
  box-shadow: inset 0 -2px 0 rgba(74,222,128,0.35) !important;
}

/* \u2500\u2500 tfoot: always sticky at bottom, never hidden \u2500\u2500 */
tfoot {
  display: table-footer-group !important;
  position: sticky !important;
  bottom: 0 !important;
  z-index: 10 !important;
}
tfoot td {
  z-index: 11 !important;
  background: var(--bg) !important;
  border-top: 2px solid var(--or) !important;
  font-weight: 700 !important;
  font-family: inherit !important;
  font-size: 11px !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  box-shadow: 0 -2px 8px rgba(0,0,0,0.3) !important;
}
/* vmart tfoot respects JS display:none */
#vmart-tfoot[style*="display: none"],
#vmart-tfoot[style*="display:none"] {
  display: none !important;
}

/* \u2500\u2500 tblwrap: flex fill remaining height so sticky tfoot works \u2500\u2500 */
.tblwrap {
  overflow-x: auto !important;
  overflow-y: auto !important;
  flex: 1 !important;
  min-height: 0 !important;
  position: relative !important;
}
@media(min-width:769px){
  .tblwrap { height: 0; }
}

/* \u2500\u2500 v-content: flex column so tblwrap fills height \u2500\u2500 */
#v-content {
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

/* \u2500\u2500 vtoolbar: wrap at any zoom \u2500\u2500 */
.vtoolbar {
  flex-wrap: wrap !important;
  overflow: visible !important;
  min-height: unset !important;
}
.vtoolbar > * { flex-shrink: 0; }

/* \u2500\u2500 legwrap: own full-width row so pills wrap properly and never stack in a column \u2500\u2500 */
.legwrap { flex-basis: 100% !important; flex-wrap: wrap !important; overflow-x: visible !important; }
/* \u2500\u2500 #vtoolbar (Reliance search+legend bar): keep search and legends on same row \u2500\u2500 */
#vtoolbar { flex-wrap: nowrap !important; }
#vtoolbar .legwrap { flex: 1 1 0 !important; flex-basis: auto !important; flex-wrap: nowrap !important; overflow-x: auto !important; scrollbar-width: none !important; min-width: 0; }
#vtoolbar .legwrap::-webkit-scrollbar { display: none; }
#vtoolbar .gsearch { flex: 0 0 195px; }
#vtoolbar .vinfo { flex-shrink: 0; }

/* \u2500\u2500 amend section: full width, scrollable inner \u2500\u2500 */
#amend-section { width: 100% !important; box-sizing: border-box !important; overflow: hidden !important; }
.amend-stab-bar { flex-wrap: wrap !important; overflow-x: auto !important; }
#amend-section .amend-stab-bar ~ div { overflow-x: auto !important; min-height: 0; }

/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550
   \u2463  GLASS MORPHISM \u2014 Complete UI Overhaul
   Deep blue ambient, frosted glass cards, neon accents
   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */

/* \u2500\u2500 App-wide deep bg + ambient glow (dark themes only) \u2500\u2500
   NOTE: data-theme is on <html>, not <body> */
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) body {
  background: #080c1a !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #main-content {
  position: relative;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #main-content::before {
  content: '';
  position: fixed;
  top: 0; left: 0; right: 0; height: 60vh;
  background:
    radial-gradient(ellipse at 20% 30%, rgba(89,52,255,0.18) 0%, transparent 55%),
    radial-gradient(ellipse at 78% 20%, rgba(0,212,255,0.13) 0%, transparent 55%),
    radial-gradient(ellipse at 50% 85%, rgba(0,255,148,0.07) 0%, transparent 55%);
  pointer-events: none;
  z-index: 0;
}

/* \u2500\u2500 Buyer panel base \u2500\u2500 */
.buyer-panel {
  position: relative;
  background: transparent;
  z-index: 1;
}

/* \u2500\u2500 Buyer Tabs Bar \u2500\u2500 */
.buyer-tabs-bar {
  background: rgba(8,12,26,0.92) !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.04) !important;
}
.buyer-tab {
  color: rgba(255,255,255,0.4) !important;
  border-bottom-color: transparent !important;
}
.buyer-tab:hover {
  color: rgba(255,255,255,0.75) !important;
  background: rgba(255,255,255,0.04) !important;
}
.buyer-tab.active {
  color: #00d4ff !important;
  border-bottom-color: #00d4ff !important;
  background: rgba(0,212,255,0.05) !important;
}

/* \u2500\u2500 Main app topbar \u2500\u2500 */
#topbar, .topbar {
  background: rgba(6,9,20,0.95) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
}

/* \u2500\u2500 Sidebar \u2500\u2500 */
#sidebar {
  background: rgba(6,9,20,0.97) !important;
  border-right: 1px solid rgba(255,255,255,0.05) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}

/* \u2500\u2500 PDF Topbar (V-Mart / Apollo / Vishal etc.) \u2500\u2500 */
.pdf-topbar {
  background: rgba(8,12,26,0.95) !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.04), 0 4px 24px rgba(0,0,0,0.3) !important;
  padding: 12px 20px !important;
}
.pdf-topbar-title {
  font-family: inherit !important;
  font-weight: 700 !important;
  font-size: 0.92rem !important;
  letter-spacing: -0.2px !important;
  background: linear-gradient(135deg, #00d4ff 0%, #5934ff 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.pdf-topbar-meta { color: rgba(255,255,255,0.3) !important; font-size: 0.7rem !important; }
.pdf-topbar-logo { opacity: 0.65; filter: brightness(1.2) saturate(0.9); }

/* \u2500\u2500 Toolbars \u2500\u2500 */
.pdf-vtoolbar, .vtoolbar {
  background: rgba(8,12,26,0.92) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  box-shadow: 0 2px 16px rgba(0,0,0,0.4) !important;
}
.pdf-vtoolbar .gsearch input, .vtoolbar .gsearch input {
  background: rgba(255,255,255,0.07) !important;
  border-color: rgba(255,255,255,0.15) !important;
  color: rgba(255,255,255,0.9) !important;
  border-radius: 50px !important;
}
.pdf-vtoolbar .gsearch input:focus, .vtoolbar .gsearch input:focus {
  border-color: rgba(139,92,246,0.65) !important;
  background: rgba(139,92,246,0.13) !important;
  box-shadow: 0 4px 22px rgba(139,92,246,0.28) !important;
  outline: none !important;
}
#vtoolbar { /* Reliance main vtoolbar */
  background: rgba(8,12,26,0.92) !important;
}

/* \u2500\u2500 Drop zone \u2500\u2500 */
.pdf-drop-zone {
  border: 2px dashed rgba(255,255,255,0.1) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,0.02) !important;
  margin: 20px !important;
  transition: all 0.25s !important;
}
.pdf-drop-zone:hover, .pdf-drop-zone.drag-over {
  border-color: rgba(0,212,255,0.5) !important;
  background: rgba(0,212,255,0.04) !important;
  box-shadow: 0 0 40px rgba(0,212,255,0.08), inset 0 0 40px rgba(0,212,255,0.03) !important;
}

/* \u2550\u2550\u2550 PO CARD LAYOUT \u2550\u2550\u2550
   Convert flat table rows to glass cards using border-spacing trick */

/* The table itself \u2014 separate borders + vertical gap between card rows */
.pdf-tbl,
#vmart-main-tbl,
#apollo-tbl {
  border-collapse: separate !important;
  border-spacing: 0 7px !important;
}

/* Sticky thead row (sits above cards \u2014 don't let border-spacing gap push it down) */
.pdf-tbl thead tr,
#vmart-main-tbl thead tr,
#apollo-tbl thead tr {
  background: rgba(8,12,26,0.98) !important;
}
.pdf-tbl th,
#vmart-main-tbl th,
#apollo-tbl th,
#dmart-tbl th,
#vishal-main-tbl th,
#tbl th {
  background: rgba(8,12,26,0.98) !important;
  color: rgba(255,255,255,0.25) !important;
  font-size: 0.65rem !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
  padding: 8px 10px !important;
}

/* Regular data rows */
.pdf-tbl td {
  border-top: none !important;
  border-bottom: 1px solid rgba(255,255,255,0.04) !important;
  color: rgba(255,255,255,0.68) !important;
  background: transparent !important;
  vertical-align: middle !important;
}
.pdf-tbl tr:not([data-po-hdr]):hover td {
  background: rgba(255,255,255,0.02) !important;
}

/* \u2500\u2500 PO GROUP HEADER \u2014 Glass card style (V-Mart, Apollo, Vishal, Blinkit, Flipkart) \u2500\u2500 */
tr[data-po-hdr] td {
  background: rgba(255,255,255,0.045) !important;
  border-top: 1px solid rgba(255,255,255,0.09) !important;
  border-bottom: 1px solid rgba(255,255,255,0.09) !important;
  padding: 15px 12px !important;
  transition: background 0.2s !important;
  white-space: nowrap !important;
}
tr[data-po-hdr] td:first-child {
  border-left: 1px solid rgba(255,255,255,0.09) !important;
  border-radius: 12px 0 0 12px !important;
  padding-left: 16px !important;
}
tr[data-po-hdr] td:last-child {
  border-right: 1px solid rgba(255,255,255,0.09) !important;
  border-radius: 0 12px 12px 0 !important;
  padding-right: 16px !important;
}
tr[data-po-hdr]:hover td {
  background: rgba(255,255,255,0.07) !important;
}
/* Expanded card */
tr[data-po-hdr].po-expanded td {
  background: rgba(0,212,255,0.06) !important;
  border-top-color: rgba(0,212,255,0.35) !important;
  border-bottom-color: rgba(0,212,255,0.1) !important;
}
tr[data-po-hdr].po-expanded td:first-child {
  border-left-color: rgba(0,212,255,0.35) !important;
  border-radius: 12px 0 0 0 !important;
  box-shadow: -2px 0 0 0 #00d4ff !important;
}
tr[data-po-hdr].po-expanded td:last-child {
  border-right-color: rgba(0,212,255,0.35) !important;
  border-radius: 0 12px 0 0 !important;
}

/* \u2500\u2500 D-Mart: glass card PO header rows (same padding/height as other buyers) \u2500\u2500 */
#dmart-tbl tr[data-po-hdr] td {
  padding: 15px 12px !important;
  background: rgba(255,255,255,0.045) !important;
  border-top: 1px solid rgba(255,255,255,0.09) !important;
  border-bottom: 1px solid rgba(255,255,255,0.09) !important;
  border-left: none !important;
  border-right: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#dmart-tbl tr[data-po-hdr] td:first-child {
  border-left: 1px solid rgba(255,255,255,0.09) !important;
  border-radius: 12px 0 0 12px !important;
  padding-left: 16px !important;
}
#dmart-tbl tr[data-po-hdr] td:last-child {
  border-right: 1px solid rgba(255,255,255,0.09) !important;
  border-radius: 0 12px 12px 0 !important;
  padding-right: 16px !important;
}
#dmart-tbl tr[data-po-hdr]:hover td { background: rgba(255,255,255,0.07) !important; }
#dmart-tbl tr[data-po-hdr].po-expanded td {
  background: rgba(0,212,255,0.06) !important;
  border-top-color: rgba(0,212,255,0.35) !important;
  border-bottom-color: rgba(0,212,255,0.1) !important;
}
#dmart-tbl tr[data-po-hdr].po-expanded td:first-child {
  border-left-color: rgba(0,212,255,0.35) !important;
  border-radius: 10px 0 0 0 !important;
  box-shadow: -2px 0 0 0 #00d4ff !important;
}
#dmart-tbl tr[data-po-hdr].po-expanded td:last-child {
  border-right-color: rgba(0,212,255,0.35) !important;
  border-radius: 0 10px 0 0 !important;
}

/* D-Mart item rows */
#dmart-tbl .po-item-row td {
  padding: 4px 5px !important;
  background: transparent !important;
  border-bottom: 1px solid rgba(255,255,255,0.04) !important;
}
#dmart-tbl .po-item-row td:first-child { border-left: none !important; }
#dmart-tbl .po-item-row:hover td { background: rgba(255,255,255,0.02) !important; }
/* D-Mart: restore compact th padding \u2014 hr1/hr2/hr3 sticky tops are calibrated for ~18px rows */
#dmart-tbl th {
  padding: 3px 5px !important;
  font-size: 0.6rem !important;
}

/* \u2500\u2500 Unified PO field classes \u2014 applied in JS for all buyers \u2500\u2500 */
/* PO Number \u2014 cyan */
tr[data-po-hdr] td.po-num-cell {
  color: #00d4ff !important;
  font-family: inherit !important;
  font-weight: 600 !important;
  font-size: 0.78rem !important;
  letter-spacing: 0 !important;
  -webkit-text-fill-color: #00d4ff !important;
}
/* \u2500\u2500 "NEW" PO badge \u2500\u2500 */
/* \u2500\u2500 "NEW" corner ribbon on PO rows (all buyers) \u2500\u2500 */
/* \u2500\u2500 "NEW" ribbon \u2014 sits in the very first <td> of the PO header row \u2500\u2500 */
td.po-new-first{position:relative!important;overflow:hidden!important;}
.po-new-ribbon{position:absolute!important;top:0!important;left:0!important;width:46px!important;height:46px!important;overflow:hidden!important;pointer-events:none;z-index:6;}
.po-new-ribbon::after{content:'NEW';position:absolute;top:9px;left:-13px;width:56px;padding:2px 0;background:linear-gradient(180deg,#e83232,#bb1a1a);color:#fff;font-size:0.44rem;font-weight:900;letter-spacing:.07em;text-align:center;transform:rotate(-45deg);transform-origin:center;box-shadow:0 2px 5px rgba(0,0,0,0.5);text-shadow:0 1px 1px rgba(0,0,0,0.4);}
/* Expiry Date \u2014 yellow */
tr[data-po-hdr] td.po-exp-cell {
  color: #ffd60a !important;
  font-weight: 600 !important;
  font-family: inherit !important;
  font-size: 0.75rem !important;
  -webkit-text-fill-color: #ffd60a !important;
}
/* Value / Amount \u2014 green */
tr[data-po-hdr] td.po-val-cell {
  color: #00ff94 !important;
  font-family: inherit !important;
  font-weight: 600 !important;
  font-size: 0.76rem !important;
  -webkit-text-fill-color: #00ff94 !important;
}
/* Qty \u2014 yellow */
tr[data-po-hdr] td.po-qty-cell {
  color: #ffd60a !important;
  font-family: DM Mono, monospace !important;
  font-weight: 600 !important;
  font-size: 0.76rem !important;
  -webkit-text-fill-color: #ffd60a !important;
  font-variant-numeric: tabular-nums;
}

/* Light theme overrides for the field classes */
[data-theme="light"] tr[data-po-hdr] td.po-num-cell,
[data-theme="silver"] tr[data-po-hdr] td.po-num-cell,
[data-theme="skyblue"] tr[data-po-hdr] td.po-num-cell,
[data-theme="lightnavy"] tr[data-po-hdr] td.po-num-cell,
[data-theme="cleanslate"] tr[data-po-hdr] td.po-num-cell,
[data-theme="warmpaper"] tr[data-po-hdr] td.po-num-cell { color: var(--bl) !important; -webkit-text-fill-color: var(--bl) !important; font-family: inherit !important; font-size: 0.75rem !important; }
[data-theme="light"] tr[data-po-hdr] td.po-exp-cell,
[data-theme="silver"] tr[data-po-hdr] td.po-exp-cell,
[data-theme="skyblue"] tr[data-po-hdr] td.po-exp-cell,
[data-theme="lightnavy"] tr[data-po-hdr] td.po-exp-cell,
[data-theme="cleanslate"] tr[data-po-hdr] td.po-exp-cell,
[data-theme="warmpaper"] tr[data-po-hdr] td.po-exp-cell { color: var(--or) !important; -webkit-text-fill-color: var(--or) !important; }
[data-theme="light"] tr[data-po-hdr] td.po-val-cell,
[data-theme="silver"] tr[data-po-hdr] td.po-val-cell,
[data-theme="skyblue"] tr[data-po-hdr] td.po-val-cell,
[data-theme="lightnavy"] tr[data-po-hdr] td.po-val-cell,
[data-theme="cleanslate"] tr[data-po-hdr] td.po-val-cell,
[data-theme="warmpaper"] tr[data-po-hdr] td.po-val-cell { color: var(--ac) !important; -webkit-text-fill-color: var(--ac) !important; font-family: inherit !important; }
[data-theme="light"] tr[data-po-hdr] td.po-qty-cell,
[data-theme="silver"] tr[data-po-hdr] td.po-qty-cell,
[data-theme="skyblue"] tr[data-po-hdr] td.po-qty-cell,
[data-theme="lightnavy"] tr[data-po-hdr] td.po-qty-cell,
[data-theme="cleanslate"] tr[data-po-hdr] td.po-qty-cell,
[data-theme="warmpaper"] tr[data-po-hdr] td.po-qty-cell { color: var(--or) !important; -webkit-text-fill-color: var(--or) !important; font-family: DM Mono, monospace !important; font-variant-numeric: tabular-nums; }

/* \u2500\u2500 EXPANDED ITEM ROWS \u2014 inner card content \u2500\u2500 */
.po-item-row td {
  background: rgba(0,0,0,0.18) !important;
  border-bottom: 1px solid rgba(255,255,255,0.03) !important;
  border-top: none !important;
}
.po-item-row td:first-child {
  border-left: 2px solid rgba(0,212,255,0.15) !important;
}
.po-item-row:hover td {
  background: rgba(255,255,255,0.025) !important;
}

/* \u2500\u2500 SUBTOTAL ROWS \u2014 close the card at bottom \u2500\u2500 */
tr.vmm-po-sub td, tr.po-sub-row td {
  background: rgba(0,212,255,0.035) !important;
  border-bottom: 1px solid rgba(0,212,255,0.12) !important;
}
tr.vmm-po-sub td:first-child, tr.po-sub-row td:first-child {
  border-left: 2px solid rgba(0,212,255,0.2) !important;
  border-radius: 0 0 0 10px !important;
}
tr.vmm-po-sub td:last-child, tr.po-sub-row td:last-child {
  border-right: 1px solid rgba(0,212,255,0.12) !important;
  border-radius: 0 0 10px 0 !important;
}

/* \u2500\u2500 SUMMARY BAR \u2014 KPI boxes like Style 4 \u2500\u2500 */
.pdf-summary-bar {
  display: flex !important;
  align-items: stretch !important;
  gap: 8px !important;
  padding: 10px 16px !important;
  background: rgba(8,12,26,0.9) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  flex-wrap: wrap !important;
}
.pdf-sum-item {
  padding: 8px 14px !important;
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.09) !important;
  border-radius: 10px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  min-width: 72px !important;
  backdrop-filter: blur(8px) !important;
}
.pdf-sum-lbl {
  font-size: 0.55rem !important;
  color: rgba(255,255,255,0.3) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
  font-family: inherit !important;
}
.pdf-sum-val {
  font-family: inherit !important;
  font-weight: 700 !important;
  font-size: 0.92rem !important;
  color: #fff !important;
  line-height: 1 !important;
}
.pdf-sum-val.ac {
  background: linear-gradient(135deg, #00ff94, #00d4ff) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.pdf-sum-val.or {
  background: linear-gradient(135deg, #ffd60a, #ff9500) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.pdf-sum-val.bl {
  background: linear-gradient(135deg, #00d4ff, #5934ff) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* \u2500\u2500 PO chips filter bar \u2500\u2500 */
.pdf-multi-po {
  background: rgba(8,12,26,0.8) !important;
  border-bottom: 1px solid rgba(255,255,255,0.05) !important;
  padding: 7px 14px !important;
}

/* \u2500\u2500 TFOOT / Grand Total \u2500\u2500 */
.pdf-tbl tfoot td, #vmart-tfoot td {
  background: rgba(0,212,255,0.05) !important;
  border-top: 1px solid rgba(0,212,255,0.2) !important;
  font-family: inherit !important;
  font-weight: 700 !important;
  color: rgba(255,255,255,0.8) !important;
}

/* \u2500\u2500 Value color classes \u2500\u2500 */
.pdf-tbl .mrp { color: #00ff94 !important; }
.pdf-tbl .qty { color: #ffd60a !important; font-family: inherit !important; font-weight: 600 !important; }
.pdf-tbl .rate { color: #00d4ff !important; }
.pdf-tbl .amt { color: #00ff94 !important; font-family: inherit !important; font-weight: 600 !important; }
.pdf-tbl .sku { color: #9c78ff !important; }
.pdf-tbl .rownum { color: rgba(255,255,255,0.18) !important; }
.pdf-tbl .mono { color: rgba(255,255,255,0.52) !important; }
.pdf-tbl .desc { color: rgba(255,255,255,0.82) !important; }

/* \u2500\u2500 Expand button (chevron) \u2500\u2500 */
.po-exp-btn {
  background: rgba(0,212,255,0.1) !important;
  border: 1px solid rgba(0,212,255,0.3) !important;
  color: #00d4ff !important;
  border-radius: 7px !important;
  transition: all 0.2s !important;
}
.po-exp-btn:hover {
  background: rgba(0,212,255,0.22) !important;
  box-shadow: 0 0 12px rgba(0,212,255,0.25) !important;
}
.po-exp-btn.xp {
  background: rgba(0,212,255,0.2) !important;
  box-shadow: 0 0 8px rgba(0,212,255,0.2) !important;
}

/* \u2500\u2500 Buttons in buyer panels \u2500\u2500 */
.buyer-panel .bsm, .buyer-panel .bo, .buyer-panel .btn {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(255,255,255,0.11) !important;
  color: rgba(255,255,255,0.6) !important;
  border-radius: 8px !important;
  transition: all 0.18s !important;
}
.buyer-panel .bsm:hover, .buyer-panel .bo:hover, .buyer-panel .btn:hover {
  background: rgba(0,212,255,0.1) !important;
  border-color: rgba(0,212,255,0.35) !important;
  color: #00d4ff !important;
}
.buyer-panel .bsm-b {
  background: rgba(0,212,255,0.08) !important;
  border-color: rgba(0,212,255,0.28) !important;
  color: #00d4ff !important;
}

/* \u2500\u2500 Column picker \u2500\u2500 */
.byr-col-picker {
  background: rgba(6,9,20,0.97) !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  border-radius: 14px !important;
  box-shadow: 0 12px 48px rgba(0,0,0,0.7), 0 0 0 1px rgba(255,255,255,0.05) !important;
}

/* \u2500\u2500 Brand legend / chips row \u2500\u2500 */
#dmart-brand-legend {
  background: rgba(8,12,26,0.88) !important;
  border-bottom: 1px solid rgba(255,255,255,0.05) !important;
  backdrop-filter: blur(12px) !important;
}
#vishal-brand-tabbar {
  background: rgba(8,12,26,0.88) !important;
  border-bottom: 1px solid rgba(255,255,255,0.05) !important;
}
#reliance-inner-tabs {
  background: rgba(8,12,26,0.88) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

/* \u2500\u2500 Info bar \u2500\u2500 */
.pdf-vinfo { color: rgba(255,255,255,0.3) !important; }
.pdf-vinfo strong { color: #00d4ff !important; }

/* \u2500\u2500 Checkbox accent \u2500\u2500 */
.po-sel-cb { accent-color: #00d4ff; }

/* \u2500\u2500 Global PO action bar \u2500\u2500 */
#po-global-action-bar {
  background: rgba(0,212,255,0.07) !important;
  border: 1px solid rgba(0,212,255,0.22) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  box-shadow: 0 0 28px rgba(0,212,255,0.08) !important;
}

/* \u2500\u2500 Reliance table \u2014 glass card rows matching V-Mart/Apollo/Vishal style \u2500\u2500 */
#tbl {
  border-collapse: separate !important;
  border-spacing: 0 7px !important;
}
/* Reliance data cells: match other buyers' font and colors */
#tbl td { font-family: inherit !important; }
/* Dark themes only \u2014 neon column colours; light themes use generic td.cg-* variable rules */
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #tbl td.cg-qty    { color: #ffd60a !important; font-weight: 600 !important; }
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #tbl td.cg-value  { color: #00ff94 !important; font-weight: 700 !important; }
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #tbl td.cg-pricing { color: #00d4ff !important; }
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #tbl td.cg-pricing.cg-mrp { color: #00ff94 !important; font-weight: 600 !important; }
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #tbl td.cg-tax    { color: #fb7185 !important; }
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #tbl td.cg-order  { color: rgba(255,255,255,0.75) !important; }
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #tbl td.cg-identity { color: rgba(255,255,255,0.45) !important; }
/* Light themes: tfoot grand-total row \u2014 solid black (spec 1,1,2 beats all cg-* rules at \u22640,1,2) */
[data-theme="light"] #tbl tfoot td,[data-theme="silver"] #tbl tfoot td,[data-theme="skyblue"] #tbl tfoot td,[data-theme="lightnavy"] #tbl tfoot td,[data-theme="cleanslate"] #tbl tfoot td,[data-theme="warmpaper"] #tbl tfoot td { color: #111 !important; }
/* Item row background: match other buyers (transparent, not dark) */
#tbl .po-item-row td { background: transparent !important; border-bottom: 1px solid rgba(255,255,255,0.04) !important; }
#tbl .po-item-row td:first-child { border-left: none !important; }
#tbl .po-item-row:hover td { background: rgba(255,255,255,0.02) !important; }
/* D-Mart: glass card row spacing (same as Reliance) */
#dmart-tbl {
  border-collapse: separate !important;
  border-spacing: 0 7px !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #tbl tbody tr:not([data-po-hdr]) td,
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #dmart-tbl tbody td {
  background: transparent !important;
  border-bottom: 1px solid rgba(255,255,255,0.035) !important;
  /* color removed \u2014 td.cg-* column-group rules handle per-column colors */
}
/* Reliance & D-Mart PO header cell colors \u2014 need tbl prefix to beat the broad td rule above */
#tbl tr[data-po-hdr] td.po-num-cell, #dmart-tbl tr[data-po-hdr] td.po-num-cell { color: #00d4ff !important; font-weight: 600 !important; }
#tbl tr[data-po-hdr] td.po-exp-cell, #dmart-tbl tr[data-po-hdr] td.po-exp-cell { color: #ffd60a !important; font-weight: 600 !important; }
#tbl tr[data-po-hdr] td.po-val-cell, #dmart-tbl tr[data-po-hdr] td.po-val-cell { color: #00ff94 !important; font-weight: 600 !important; }
#tbl tr[data-po-hdr] td.po-qty-cell, #dmart-tbl tr[data-po-hdr] td.po-qty-cell { color: #ffd60a !important; font-weight: 600 !important; }
#tbl th, #dmart-tbl th {
  background: rgba(8,12,26,0.98) !important;
  position: sticky; top: 0; z-index: 2;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #tbl tbody tr:hover td,
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #dmart-tbl tbody tr:hover td {
  background: rgba(255,255,255,0.025) !important;
}
/* Light theme \u2014 reliance/dmart tbody: transparent bg + border only; color from td.cg-* rules */
[data-theme="light"] #tbl tbody td,[data-theme="silver"] #tbl tbody td,[data-theme="skyblue"] #tbl tbody td,
[data-theme="lightnavy"] #tbl tbody td,[data-theme="cleanslate"] #tbl tbody td,[data-theme="warmpaper"] #tbl tbody td,
[data-theme="light"] #dmart-tbl tbody td,[data-theme="silver"] #dmart-tbl tbody td,[data-theme="skyblue"] #dmart-tbl tbody td,
[data-theme="lightnavy"] #dmart-tbl tbody td,[data-theme="cleanslate"] #dmart-tbl tbody td,[data-theme="warmpaper"] #dmart-tbl tbody td {
  background: transparent !important;
  border-bottom-color: var(--bd) !important;
}
/* Light theme \u2014 Reliance column group colours (mirrors dark-theme cg-* rules using theme vars) */
[data-theme="light"] #tbl td.cg-qty,[data-theme="silver"] #tbl td.cg-qty,[data-theme="skyblue"] #tbl td.cg-qty,
[data-theme="lightnavy"] #tbl td.cg-qty,[data-theme="cleanslate"] #tbl td.cg-qty,[data-theme="warmpaper"] #tbl td.cg-qty
  { color: var(--or) !important; font-weight: 600 !important; }
[data-theme="light"] #tbl td.cg-value,[data-theme="silver"] #tbl td.cg-value,[data-theme="skyblue"] #tbl td.cg-value,
[data-theme="lightnavy"] #tbl td.cg-value,[data-theme="cleanslate"] #tbl td.cg-value,[data-theme="warmpaper"] #tbl td.cg-value
  { color: var(--ac) !important; font-weight: 700 !important; }
[data-theme="light"] #tbl td.cg-pricing,[data-theme="silver"] #tbl td.cg-pricing,[data-theme="skyblue"] #tbl td.cg-pricing,
[data-theme="lightnavy"] #tbl td.cg-pricing,[data-theme="cleanslate"] #tbl td.cg-pricing,[data-theme="warmpaper"] #tbl td.cg-pricing
  { color: var(--bl) !important; }
[data-theme="light"] #tbl td.cg-pricing.cg-mrp,[data-theme="silver"] #tbl td.cg-pricing.cg-mrp,[data-theme="skyblue"] #tbl td.cg-pricing.cg-mrp,
[data-theme="lightnavy"] #tbl td.cg-pricing.cg-mrp,[data-theme="cleanslate"] #tbl td.cg-pricing.cg-mrp,[data-theme="warmpaper"] #tbl td.cg-pricing.cg-mrp
  { color: var(--ac) !important; font-weight: 600 !important; }
[data-theme="light"] #tbl td.cg-tax,[data-theme="silver"] #tbl td.cg-tax,[data-theme="skyblue"] #tbl td.cg-tax,
[data-theme="lightnavy"] #tbl td.cg-tax,[data-theme="cleanslate"] #tbl td.cg-tax,[data-theme="warmpaper"] #tbl td.cg-tax
  { color: #e11d48 !important; }
[data-theme="light"] #tbl td.cg-order,[data-theme="silver"] #tbl td.cg-order,[data-theme="skyblue"] #tbl td.cg-order,
[data-theme="lightnavy"] #tbl td.cg-order,[data-theme="cleanslate"] #tbl td.cg-order,[data-theme="warmpaper"] #tbl td.cg-order
  { color: var(--bl) !important; }
[data-theme="light"] #tbl td.cg-order.cg-po,[data-theme="silver"] #tbl td.cg-order.cg-po,[data-theme="skyblue"] #tbl td.cg-order.cg-po,
[data-theme="lightnavy"] #tbl td.cg-order.cg-po,[data-theme="cleanslate"] #tbl td.cg-order.cg-po,[data-theme="warmpaper"] #tbl td.cg-order.cg-po
  { color: var(--bl) !important; font-weight: 600 !important; }
[data-theme="light"] #tbl td.cg-identity,[data-theme="silver"] #tbl td.cg-identity,[data-theme="skyblue"] #tbl td.cg-identity,
[data-theme="lightnavy"] #tbl td.cg-identity,[data-theme="cleanslate"] #tbl td.cg-identity,[data-theme="warmpaper"] #tbl td.cg-identity
  { color: var(--mu) !important; }
/* Light theme: restore all table headers to theme surface color */
[data-theme="light"] .pdf-tbl th,[data-theme="silver"] .pdf-tbl th,[data-theme="skyblue"] .pdf-tbl th,
[data-theme="lightnavy"] .pdf-tbl th,[data-theme="cleanslate"] .pdf-tbl th,[data-theme="warmpaper"] .pdf-tbl th,
[data-theme="light"] #vmart-main-tbl th,[data-theme="silver"] #vmart-main-tbl th,[data-theme="skyblue"] #vmart-main-tbl th,
[data-theme="lightnavy"] #vmart-main-tbl th,[data-theme="cleanslate"] #vmart-main-tbl th,[data-theme="warmpaper"] #vmart-main-tbl th,
[data-theme="light"] #apollo-tbl th,[data-theme="silver"] #apollo-tbl th,[data-theme="skyblue"] #apollo-tbl th,
[data-theme="lightnavy"] #apollo-tbl th,[data-theme="cleanslate"] #apollo-tbl th,[data-theme="warmpaper"] #apollo-tbl th,
[data-theme="light"] #vishal-main-tbl th,[data-theme="silver"] #vishal-main-tbl th,[data-theme="skyblue"] #vishal-main-tbl th,
[data-theme="lightnavy"] #vishal-main-tbl th,[data-theme="cleanslate"] #vishal-main-tbl th,[data-theme="warmpaper"] #vishal-main-tbl th,
[data-theme="light"] #tbl th,[data-theme="silver"] #tbl th,[data-theme="skyblue"] #tbl th,
[data-theme="lightnavy"] #tbl th,[data-theme="cleanslate"] #tbl th,[data-theme="warmpaper"] #tbl th,
[data-theme="light"] #dmart-tbl th,[data-theme="silver"] #dmart-tbl th,[data-theme="skyblue"] #dmart-tbl th,
[data-theme="lightnavy"] #dmart-tbl th,[data-theme="cleanslate"] #dmart-tbl th,[data-theme="warmpaper"] #dmart-tbl th {
  background: var(--sf) !important; color: var(--mu) !important;
  border-bottom-color: var(--bd) !important;
}
/* Also fix vishal table on light */
[data-theme="light"] #vishal-main-tbl td,[data-theme="silver"] #vishal-main-tbl td,
[data-theme="skyblue"] #vishal-main-tbl td,[data-theme="lightnavy"] #vishal-main-tbl td,
[data-theme="cleanslate"] #vishal-main-tbl td,[data-theme="warmpaper"] #vishal-main-tbl td { color: var(--tx) !important; }
/* General table td color fix for light (catches all remaining tables) */
[data-theme="light"] td,[data-theme="silver"] td,[data-theme="skyblue"] td,
[data-theme="lightnavy"] td,[data-theme="cleanslate"] td,[data-theme="warmpaper"] td {
  color: var(--tx) !important;
}

/* \u2500\u2500 Light theme overrides \u2500\u2500 */
[data-theme="light"] body,[data-theme="silver"] body,[data-theme="skyblue"] body,
[data-theme="lightnavy"] body,[data-theme="cleanslate"] body,[data-theme="warmpaper"] body {
  background: var(--bg) !important;
  color: var(--tx) !important;
}
[data-theme="light"] #main-content::before,[data-theme="silver"] #main-content::before,
[data-theme="skyblue"] #main-content::before,[data-theme="lightnavy"] #main-content::before,
[data-theme="cleanslate"] #main-content::before,[data-theme="warmpaper"] #main-content::before { display: none !important; }
/* \u2500\u2500 Light-theme: keep colourful labels readable on pale backgrounds \u2500\u2500 */
[data-theme="light"] .dmc-meta-label,[data-theme="silver"] .dmc-meta-label,
[data-theme="skyblue"] .dmc-meta-label,[data-theme="lightnavy"] .dmc-meta-label,
[data-theme="cleanslate"] .dmc-meta-label,[data-theme="warmpaper"] .dmc-meta-label{color:var(--mu);}
[data-theme="light"] .bmc-po-stats,[data-theme="silver"] .bmc-po-stats,
[data-theme="skyblue"] .bmc-po-stats,[data-theme="lightnavy"] .bmc-po-stats,
[data-theme="cleanslate"] .bmc-po-stats,[data-theme="warmpaper"] .bmc-po-stats{color:var(--mu);}

/* Revert glass bg on all common elements for light themes */
[data-theme="light"] #topbar,[data-theme="silver"] #topbar,[data-theme="skyblue"] #topbar,
[data-theme="lightnavy"] #topbar,[data-theme="cleanslate"] #topbar,[data-theme="warmpaper"] #topbar,
[data-theme="light"] #sidebar,[data-theme="silver"] #sidebar,[data-theme="skyblue"] #sidebar,
[data-theme="lightnavy"] #sidebar,[data-theme="cleanslate"] #sidebar,[data-theme="warmpaper"] #sidebar {
  background: var(--sf) !important; backdrop-filter: none !important; border-color: var(--bd) !important;
}
[data-theme="light"] .buyer-tabs-bar,
[data-theme="silver"] .buyer-tabs-bar,
[data-theme="skyblue"] .buyer-tabs-bar,
[data-theme="lightnavy"] .buyer-tabs-bar,
[data-theme="cleanslate"] .buyer-tabs-bar,
[data-theme="warmpaper"] .buyer-tabs-bar { background: var(--sf) !important; border-bottom-color: var(--bd) !important; backdrop-filter: none !important; }
[data-theme="light"] .buyer-tab, [data-theme="silver"] .buyer-tab, [data-theme="skyblue"] .buyer-tab, [data-theme="lightnavy"] .buyer-tab, [data-theme="cleanslate"] .buyer-tab, [data-theme="warmpaper"] .buyer-tab { color: var(--mu) !important; }
[data-theme="light"] .buyer-tab.active, [data-theme="silver"] .buyer-tab.active, [data-theme="skyblue"] .buyer-tab.active, [data-theme="lightnavy"] .buyer-tab.active, [data-theme="cleanslate"] .buyer-tab.active, [data-theme="warmpaper"] .buyer-tab.active { color: var(--ac) !important; border-bottom-color: var(--ac) !important; background: rgba(74,222,128,0.04) !important; }
[data-theme="light"] #topbar, [data-theme="silver"] #topbar, [data-theme="skyblue"] #topbar, [data-theme="lightnavy"] #topbar, [data-theme="cleanslate"] #topbar, [data-theme="warmpaper"] #topbar { background: var(--sf) !important; backdrop-filter: none !important; }
[data-theme="light"] #sidebar, [data-theme="silver"] #sidebar, [data-theme="skyblue"] #sidebar, [data-theme="lightnavy"] #sidebar, [data-theme="cleanslate"] #sidebar, [data-theme="warmpaper"] #sidebar { background: var(--sf) !important; backdrop-filter: none !important; border-right-color: var(--bd) !important; }
[data-theme="light"] .pdf-topbar, [data-theme="silver"] .pdf-topbar, [data-theme="skyblue"] .pdf-topbar, [data-theme="lightnavy"] .pdf-topbar, [data-theme="cleanslate"] .pdf-topbar, [data-theme="warmpaper"] .pdf-topbar { background: var(--sf) !important; backdrop-filter: none !important; box-shadow: none !important; }
[data-theme="light"] .pdf-topbar-title, [data-theme="silver"] .pdf-topbar-title, [data-theme="skyblue"] .pdf-topbar-title, [data-theme="lightnavy"] .pdf-topbar-title, [data-theme="cleanslate"] .pdf-topbar-title, [data-theme="warmpaper"] .pdf-topbar-title { background: none !important; -webkit-text-fill-color: var(--tx) !important; color: var(--tx) !important; }
[data-theme="light"] .pdf-vtoolbar, [data-theme="silver"] .pdf-vtoolbar, [data-theme="skyblue"] .pdf-vtoolbar, [data-theme="lightnavy"] .pdf-vtoolbar, [data-theme="cleanslate"] .pdf-vtoolbar, [data-theme="warmpaper"] .pdf-vtoolbar,
[data-theme="light"] .vtoolbar, [data-theme="silver"] .vtoolbar, [data-theme="skyblue"] .vtoolbar, [data-theme="lightnavy"] .vtoolbar, [data-theme="cleanslate"] .vtoolbar, [data-theme="warmpaper"] .vtoolbar { background: var(--sf) !important; backdrop-filter: none !important; box-shadow: none !important; border-bottom-color: var(--bd) !important; }
/* #vtoolbar ID overrides (ID specificity beats class \u2014 must use ID selector for Reliance toolbar) */
[data-theme="light"] #vtoolbar, [data-theme="silver"] #vtoolbar, [data-theme="skyblue"] #vtoolbar,
[data-theme="lightnavy"] #vtoolbar, [data-theme="cleanslate"] #vtoolbar, [data-theme="warmpaper"] #vtoolbar { background: var(--sf) !important; backdrop-filter: none !important; box-shadow: none !important; border-bottom-color: var(--bd) !important; }
[data-theme="light"] tr[data-po-hdr] td, [data-theme="silver"] tr[data-po-hdr] td, [data-theme="skyblue"] tr[data-po-hdr] td, [data-theme="lightnavy"] tr[data-po-hdr] td, [data-theme="cleanslate"] tr[data-po-hdr] td, [data-theme="warmpaper"] tr[data-po-hdr] td { background: var(--s2) !important; border-color: var(--bd) !important; color: var(--tx) !important; -webkit-text-fill-color: var(--tx) !important; }
[data-theme="light"] tr[data-po-hdr] td:first-child, [data-theme="silver"] tr[data-po-hdr] td:first-child, [data-theme="skyblue"] tr[data-po-hdr] td:first-child, [data-theme="lightnavy"] tr[data-po-hdr] td:first-child, [data-theme="cleanslate"] tr[data-po-hdr] td:first-child, [data-theme="warmpaper"] tr[data-po-hdr] td:first-child { border-left: 3px solid var(--bl) !important; border-radius: 0 !important; }
[data-theme="light"] tr[data-po-hdr] td:last-child, [data-theme="silver"] tr[data-po-hdr] td:last-child, [data-theme="skyblue"] tr[data-po-hdr] td:last-child, [data-theme="lightnavy"] tr[data-po-hdr] td:last-child, [data-theme="cleanslate"] tr[data-po-hdr] td:last-child, [data-theme="warmpaper"] tr[data-po-hdr] td:last-child { border-radius: 0 !important; }
[data-theme="light"] tr[data-po-hdr] td:nth-child(2), [data-theme="silver"] tr[data-po-hdr] td:nth-child(2), [data-theme="skyblue"] tr[data-po-hdr] td:nth-child(2), [data-theme="lightnavy"] tr[data-po-hdr] td:nth-child(2), [data-theme="cleanslate"] tr[data-po-hdr] td:nth-child(2), [data-theme="warmpaper"] tr[data-po-hdr] td:nth-child(2) { color: var(--bl) !important; font-family: inherit !important; font-size: inherit !important; }
[data-theme="light"] .pdf-tbl, [data-theme="silver"] .pdf-tbl, [data-theme="skyblue"] .pdf-tbl, [data-theme="lightnavy"] .pdf-tbl, [data-theme="cleanslate"] .pdf-tbl, [data-theme="warmpaper"] .pdf-tbl { border-collapse: collapse !important; border-spacing: 0 !important; }
[data-theme="light"] .pdf-tbl td, [data-theme="silver"] .pdf-tbl td, [data-theme="skyblue"] .pdf-tbl td, [data-theme="lightnavy"] .pdf-tbl td, [data-theme="cleanslate"] .pdf-tbl td, [data-theme="warmpaper"] .pdf-tbl td { color: var(--tx) !important; border-bottom-color: var(--bd) !important; background: transparent !important; }
[data-theme="light"] .pdf-tbl tr:hover td, [data-theme="silver"] .pdf-tbl tr:hover td, [data-theme="skyblue"] .pdf-tbl tr:hover td, [data-theme="lightnavy"] .pdf-tbl tr:hover td, [data-theme="cleanslate"] .pdf-tbl tr:hover td, [data-theme="warmpaper"] .pdf-tbl tr:hover td { background: var(--s2) !important; }
[data-theme="light"] .pdf-tbl .mrp, [data-theme="silver"] .pdf-tbl .mrp, [data-theme="skyblue"] .pdf-tbl .mrp, [data-theme="lightnavy"] .pdf-tbl .mrp, [data-theme="cleanslate"] .pdf-tbl .mrp, [data-theme="warmpaper"] .pdf-tbl .mrp { color: var(--ac) !important; }
[data-theme="light"] .pdf-tbl .qty, [data-theme="silver"] .pdf-tbl .qty, [data-theme="skyblue"] .pdf-tbl .qty, [data-theme="lightnavy"] .pdf-tbl .qty, [data-theme="cleanslate"] .pdf-tbl .qty, [data-theme="warmpaper"] .pdf-tbl .qty { color: var(--or) !important; font-family: inherit !important; }
[data-theme="light"] .pdf-tbl .rate, [data-theme="silver"] .pdf-tbl .rate, [data-theme="skyblue"] .pdf-tbl .rate, [data-theme="lightnavy"] .pdf-tbl .rate, [data-theme="cleanslate"] .pdf-tbl .rate, [data-theme="warmpaper"] .pdf-tbl .rate { color: var(--bl) !important; }
[data-theme="light"] .pdf-tbl .amt, [data-theme="silver"] .pdf-tbl .amt, [data-theme="skyblue"] .pdf-tbl .amt, [data-theme="lightnavy"] .pdf-tbl .amt, [data-theme="cleanslate"] .pdf-tbl .amt, [data-theme="warmpaper"] .pdf-tbl .amt { color: var(--tx) !important; font-family: inherit !important; }
[data-theme="light"] .pdf-tbl .sku, [data-theme="silver"] .pdf-tbl .sku, [data-theme="skyblue"] .pdf-tbl .sku, [data-theme="lightnavy"] .pdf-tbl .sku, [data-theme="cleanslate"] .pdf-tbl .sku, [data-theme="warmpaper"] .pdf-tbl .sku { color: var(--ac) !important; }
[data-theme="light"] .pdf-tbl .mono, [data-theme="silver"] .pdf-tbl .mono, [data-theme="skyblue"] .pdf-tbl .mono, [data-theme="lightnavy"] .pdf-tbl .mono, [data-theme="cleanslate"] .pdf-tbl .mono, [data-theme="warmpaper"] .pdf-tbl .mono { color: var(--tx) !important; }
[data-theme="light"] .pdf-summary-bar,[data-theme="silver"] .pdf-summary-bar,[data-theme="skyblue"] .pdf-summary-bar,
[data-theme="lightnavy"] .pdf-summary-bar,[data-theme="cleanslate"] .pdf-summary-bar,[data-theme="warmpaper"] .pdf-summary-bar { background: var(--s2) !important; border-bottom-color: var(--bd) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
[data-theme="light"] .pdf-sum-lbl,[data-theme="silver"] .pdf-sum-lbl,[data-theme="skyblue"] .pdf-sum-lbl,
[data-theme="lightnavy"] .pdf-sum-lbl,[data-theme="cleanslate"] .pdf-sum-lbl,[data-theme="warmpaper"] .pdf-sum-lbl { color: var(--mu) !important; }
[data-theme="light"] .pdf-multi-po,[data-theme="silver"] .pdf-multi-po,[data-theme="skyblue"] .pdf-multi-po,
[data-theme="lightnavy"] .pdf-multi-po,[data-theme="cleanslate"] .pdf-multi-po,[data-theme="warmpaper"] .pdf-multi-po { background: var(--s2) !important; border-bottom-color: var(--bd) !important; backdrop-filter: none !important; }
[data-theme="light"] .pdf-sum-item, [data-theme="silver"] .pdf-sum-item, [data-theme="skyblue"] .pdf-sum-item, [data-theme="lightnavy"] .pdf-sum-item, [data-theme="cleanslate"] .pdf-sum-item, [data-theme="warmpaper"] .pdf-sum-item { background: var(--s2) !important; border-color: var(--bd) !important; backdrop-filter: none !important; }
[data-theme="light"] .pdf-sum-val, [data-theme="silver"] .pdf-sum-val, [data-theme="skyblue"] .pdf-sum-val, [data-theme="lightnavy"] .pdf-sum-val, [data-theme="cleanslate"] .pdf-sum-val, [data-theme="warmpaper"] .pdf-sum-val { font-family: inherit !important; font-size: 0.82rem !important; }
[data-theme="light"] .pdf-sum-val.ac, [data-theme="silver"] .pdf-sum-val.ac, [data-theme="skyblue"] .pdf-sum-val.ac, [data-theme="lightnavy"] .pdf-sum-val.ac, [data-theme="cleanslate"] .pdf-sum-val.ac, [data-theme="warmpaper"] .pdf-sum-val.ac { -webkit-text-fill-color: var(--ac) !important; background: none !important; color: var(--ac) !important; }
[data-theme="light"] .pdf-sum-val.or, [data-theme="silver"] .pdf-sum-val.or, [data-theme="skyblue"] .pdf-sum-val.or, [data-theme="lightnavy"] .pdf-sum-val.or, [data-theme="cleanslate"] .pdf-sum-val.or, [data-theme="warmpaper"] .pdf-sum-val.or { -webkit-text-fill-color: var(--or) !important; background: none !important; color: var(--or) !important; }
[data-theme="light"] .pdf-sum-val.bl, [data-theme="silver"] .pdf-sum-val.bl, [data-theme="skyblue"] .pdf-sum-val.bl, [data-theme="lightnavy"] .pdf-sum-val.bl, [data-theme="cleanslate"] .pdf-sum-val.bl, [data-theme="warmpaper"] .pdf-sum-val.bl { -webkit-text-fill-color: var(--bl) !important; background: none !important; color: var(--bl) !important; }
[data-theme="light"] .buyer-panel .bsm, [data-theme="silver"] .buyer-panel .bsm, [data-theme="skyblue"] .buyer-panel .bsm, [data-theme="lightnavy"] .buyer-panel .bsm, [data-theme="cleanslate"] .buyer-panel .bsm, [data-theme="warmpaper"] .buyer-panel .bsm,
[data-theme="light"] .buyer-panel .bo, [data-theme="silver"] .buyer-panel .bo,
[data-theme="skyblue"] .buyer-panel .bo,
[data-theme="lightnavy"] .buyer-panel .bo,
[data-theme="cleanslate"] .buyer-panel .bo,
[data-theme="warmpaper"] .buyer-panel .bo {
  background: var(--sf) !important;
  border-color: var(--bd) !important;
  color: var(--tx) !important;
}

/* \u2500\u2500 Tfoot: light theme override (all tables) \u2500\u2500 */
[data-theme="light"] tfoot td,[data-theme="silver"] tfoot td,[data-theme="skyblue"] tfoot td,
[data-theme="lightnavy"] tfoot td,[data-theme="cleanslate"] tfoot td,[data-theme="warmpaper"] tfoot td {
  background: var(--bg) !important;
  color: #111 !important;
  border-top-color: var(--bd) !important;
  box-shadow: none !important;
}
[data-theme="light"] .pdf-tbl tfoot td,[data-theme="silver"] .pdf-tbl tfoot td,[data-theme="skyblue"] .pdf-tbl tfoot td,
[data-theme="lightnavy"] .pdf-tbl tfoot td,[data-theme="cleanslate"] .pdf-tbl tfoot td,[data-theme="warmpaper"] .pdf-tbl tfoot td,
[data-theme="light"] #vmart-tfoot td,[data-theme="silver"] #vmart-tfoot td,[data-theme="skyblue"] #vmart-tfoot td,
[data-theme="lightnavy"] #vmart-tfoot td,[data-theme="cleanslate"] #vmart-tfoot td,[data-theme="warmpaper"] #vmart-tfoot td {
  background: var(--sf) !important;
  border-top-color: var(--bd) !important;
  color: var(--tx) !important;
}

/* \u2500\u2500 Tfoot: dark mode \u2014 solid opaque background using theme var(--bg) \u2500\u2500 */
/* color is intentionally omitted here so tfoot td.cg-* column-group rules take effect */
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #tbl tfoot td,
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #dmart-tbl tfoot td {
  background: var(--bg) !important;
  border-top: 2px solid var(--or) !important;
}

/* \u2500\u2500 Light theme: sub-tab bars, brand bars, search inputs, thead rows \u2500\u2500 */
[data-theme="light"] #reliance-inner-tabs,[data-theme="silver"] #reliance-inner-tabs,[data-theme="skyblue"] #reliance-inner-tabs,
[data-theme="lightnavy"] #reliance-inner-tabs,[data-theme="cleanslate"] #reliance-inner-tabs,[data-theme="warmpaper"] #reliance-inner-tabs,
[data-theme="light"] #vishal-brand-tabbar,[data-theme="silver"] #vishal-brand-tabbar,[data-theme="skyblue"] #vishal-brand-tabbar,
[data-theme="lightnavy"] #vishal-brand-tabbar,[data-theme="cleanslate"] #vishal-brand-tabbar,[data-theme="warmpaper"] #vishal-brand-tabbar,
[data-theme="light"] #dmart-brand-legend,[data-theme="silver"] #dmart-brand-legend,[data-theme="skyblue"] #dmart-brand-legend,
[data-theme="lightnavy"] #dmart-brand-legend,[data-theme="cleanslate"] #dmart-brand-legend,[data-theme="warmpaper"] #dmart-brand-legend {
  background: var(--sf) !important;
  border-bottom-color: var(--bd) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
/* Search input inside vtoolbar/pdf-vtoolbar \u2014 light themes */
[data-theme="light"] .pdf-vtoolbar .gsearch input,[data-theme="silver"] .pdf-vtoolbar .gsearch input,[data-theme="skyblue"] .pdf-vtoolbar .gsearch input,
[data-theme="lightnavy"] .pdf-vtoolbar .gsearch input,[data-theme="cleanslate"] .pdf-vtoolbar .gsearch input,[data-theme="warmpaper"] .pdf-vtoolbar .gsearch input,
[data-theme="light"] .vtoolbar .gsearch input,[data-theme="silver"] .vtoolbar .gsearch input,[data-theme="skyblue"] .vtoolbar .gsearch input,
[data-theme="lightnavy"] .vtoolbar .gsearch input,[data-theme="cleanslate"] .vtoolbar .gsearch input,[data-theme="warmpaper"] .vtoolbar .gsearch input {
  background: rgba(0,0,0,0.06) !important;
  color: var(--tx) !important;
  border-color: rgba(0,0,0,0.18) !important;
  border-radius: 50px !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,0.6) !important;
}
[data-theme="light"] .pdf-vtoolbar .gsearch input::placeholder,[data-theme="silver"] .pdf-vtoolbar .gsearch input::placeholder,[data-theme="skyblue"] .pdf-vtoolbar .gsearch input::placeholder,
[data-theme="lightnavy"] .pdf-vtoolbar .gsearch input::placeholder,[data-theme="cleanslate"] .pdf-vtoolbar .gsearch input::placeholder,[data-theme="warmpaper"] .pdf-vtoolbar .gsearch input::placeholder,
[data-theme="light"] .vtoolbar .gsearch input::placeholder,[data-theme="silver"] .vtoolbar .gsearch input::placeholder,[data-theme="skyblue"] .vtoolbar .gsearch input::placeholder,
[data-theme="lightnavy"] .vtoolbar .gsearch input::placeholder,[data-theme="cleanslate"] .vtoolbar .gsearch input::placeholder,[data-theme="warmpaper"] .vtoolbar .gsearch input::placeholder {
  color: rgba(0,0,0,0.4) !important;
}
[data-theme="light"] .gsearch::before,[data-theme="silver"] .gsearch::before,[data-theme="skyblue"] .gsearch::before,
[data-theme="lightnavy"] .gsearch::before,[data-theme="cleanslate"] .gsearch::before,[data-theme="warmpaper"] .gsearch::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='rgba(0,0,0,0.4)'%3E%3Cpath fill-rule='evenodd' d='M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z' clip-rule='evenodd'/%3E%3C/svg%3E") !important;
}
/* Thead rows for all tables */
[data-theme="light"] .pdf-tbl thead tr,[data-theme="silver"] .pdf-tbl thead tr,[data-theme="skyblue"] .pdf-tbl thead tr,
[data-theme="lightnavy"] .pdf-tbl thead tr,[data-theme="cleanslate"] .pdf-tbl thead tr,[data-theme="warmpaper"] .pdf-tbl thead tr,
[data-theme="light"] #vmart-main-tbl thead tr,[data-theme="silver"] #vmart-main-tbl thead tr,[data-theme="skyblue"] #vmart-main-tbl thead tr,
[data-theme="lightnavy"] #vmart-main-tbl thead tr,[data-theme="cleanslate"] #vmart-main-tbl thead tr,[data-theme="warmpaper"] #vmart-main-tbl thead tr,
[data-theme="light"] #apollo-tbl thead tr,[data-theme="silver"] #apollo-tbl thead tr,[data-theme="skyblue"] #apollo-tbl thead tr,
[data-theme="lightnavy"] #apollo-tbl thead tr,[data-theme="cleanslate"] #apollo-tbl thead tr,[data-theme="warmpaper"] #apollo-tbl thead tr,
[data-theme="light"] #dmart-tbl thead tr,[data-theme="silver"] #dmart-tbl thead tr,[data-theme="skyblue"] #dmart-tbl thead tr,
[data-theme="lightnavy"] #dmart-tbl thead tr,[data-theme="cleanslate"] #dmart-tbl thead tr,[data-theme="warmpaper"] #dmart-tbl thead tr,
[data-theme="light"] #tbl thead tr,[data-theme="silver"] #tbl thead tr,[data-theme="skyblue"] #tbl thead tr,
[data-theme="lightnavy"] #tbl thead tr,[data-theme="cleanslate"] #tbl thead tr,[data-theme="warmpaper"] #tbl thead tr,
[data-theme="light"] #vishal-main-tbl thead tr,[data-theme="silver"] #vishal-main-tbl thead tr,[data-theme="skyblue"] #vishal-main-tbl thead tr,
[data-theme="lightnavy"] #vishal-main-tbl thead tr,[data-theme="cleanslate"] #vishal-main-tbl thead tr,[data-theme="warmpaper"] #vishal-main-tbl thead tr {
  background: var(--sf) !important;
}
/* Inner tab items color for light */
[data-theme="light"] .inner-tab,[data-theme="silver"] .inner-tab,[data-theme="skyblue"] .inner-tab,
[data-theme="lightnavy"] .inner-tab,[data-theme="cleanslate"] .inner-tab,[data-theme="warmpaper"] .inner-tab {
  color: var(--mu) !important;
}
[data-theme="light"] .inner-tab.active,[data-theme="silver"] .inner-tab.active,[data-theme="skyblue"] .inner-tab.active,
[data-theme="lightnavy"] .inner-tab.active,[data-theme="cleanslate"] .inner-tab.active,[data-theme="warmpaper"] .inner-tab.active {
  color: var(--ac) !important;
  border-bottom-color: var(--ac) !important;
}
/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550
   \u2463b  GLASS CARDS + GLASS BUTTONS + MOBILE-FIRST GRID
   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */

/* \u2500\u2500 shorthand for dark-theme-only selector \u2500\u2500 */
/* (reuse the same :not chain as the rest of the glass section) */

/* \u2500\u2500 Mobile PO cards \u2014 glass surface \u2500\u2500 */
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .po-card {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.09) !important;
  box-shadow: 0 2px 14px rgba(0,0,0,0.3) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .po-card:active {
  border-color: rgba(0,212,255,0.45) !important;
  background: rgba(0,212,255,0.05) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .po-card-topbar {
  background: rgba(255,255,255,0.03) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .po-card-heroes {
  background: transparent !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .po-card-hero {
  background: rgba(255,255,255,0.02) !important;
}

/* \u2500\u2500 D-Mart / Blinkit / Flipkart mobile cards \u2014 glass \u2500\u2500 */
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .dmc-card,
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .bmc-card,
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .bmc-po-card {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.08) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.28) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .dmc-card:hover,
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .bmc-card:hover,
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .bmc-po-card:hover {
  border-color: rgba(0,212,255,0.28) !important;
  background: rgba(0,212,255,0.03) !important;
  box-shadow: 0 4px 22px rgba(0,0,0,0.35), 0 0 0 1px rgba(0,212,255,0.08) !important;
  transform: translateY(-1px);
}

/* \u2500\u2500 Dashboard stat cards \u2014 glass glow on dark \u2500\u2500 */
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .dash-stat {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.08) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.3) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .dash-stat:hover {
  background: rgba(255,255,255,0.06) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.4) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .dash-card {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.08) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .dash-card-hd {
  border-bottom-color: rgba(255,255,255,0.07) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .dash-qa-btn {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.08) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .dash-qa-btn:hover {
  background: rgba(0,212,255,0.08) !important;
  border-color: rgba(0,212,255,0.28) !important;
}

/* \u2500\u2500 Global buttons \u2014 glass on dark themes \u2500\u2500 */
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .bg {
  background: rgba(74,222,128,0.14) !important;
  border: 1.5px solid rgba(74,222,128,0.32) !important;
  color: #4ade80 !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  box-shadow: 0 0 18px rgba(74,222,128,0.1) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .bg:hover:not(:disabled) {
  background: rgba(74,222,128,0.24) !important;
  box-shadow: 0 0 28px rgba(74,222,128,0.2), 0 4px 16px rgba(0,0,0,0.3) !important;
  filter: none !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .bb {
  background: rgba(96,165,250,0.12) !important;
  border: 1.5px solid rgba(96,165,250,0.3) !important;
  color: var(--bl) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .bb:hover {
  background: rgba(96,165,250,0.22) !important;
  box-shadow: 0 0 18px rgba(96,165,250,0.15) !important;
  filter: none !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .bo {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.12) !important;
  color: rgba(255,255,255,0.55) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .bo:hover {
  background: rgba(0,212,255,0.08) !important;
  border-color: rgba(0,212,255,0.32) !important;
  color: #00d4ff !important;
}
/* page-header action button */
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .page-header-action {
  background: rgba(74,222,128,0.14) !important;
  border: 1.5px solid rgba(74,222,128,0.32) !important;
  color: #4ade80 !important;
  box-shadow: 0 0 14px rgba(74,222,128,0.1) !important;
}
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .page-header-action:hover {
  background: rgba(74,222,128,0.24) !important;
  box-shadow: 0 0 24px rgba(74,222,128,0.2) !important;
  transform: translateY(-1px);
}

/* \u2500\u2500 Page header \u2014 glass surface \u2500\u2500 */
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) .page-header {
  background: rgba(8,12,26,0.96) !important;
  border-bottom-color: rgba(255,255,255,0.06) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}

/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550
   MOBILE-FIRST FLEX / GRID RESPONSIVE SYSTEM
   Base = mobile, escalates via min-width breakpoints
   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */

/* \u2500\u2500 Fluid stat grid: auto-fill so it reflows at any size \u2500\u2500 */
.dash-stats {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
}
@media(min-width:900px) {
  .dash-stats { grid-template-columns: repeat(4,1fr) !important; }
}

/* \u2500\u2500 Touch-momentum scrolling for all scroll containers \u2500\u2500 */
.dash-scroll,
.pdf-tbl-wrap,
.po-table-wrap,
#reliance-wrap,
#v-content {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
}

/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550
   \u2464  SITE FLASH BAR + ALERT MANAGER
   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */

/* \u2500\u2500 Site Flash Bar (inline inside #topnav) \u2500\u2500 */
#site-flash-bar{
  display:none;flex:1;min-width:0;align-self:stretch;
  background:linear-gradient(90deg,rgba(124,58,237,.88),rgba(220,38,38,.85),rgba(3,105,161,.88));
  background-size:300% 100%;
  animation:sfbGrad 8s ease-in-out infinite alternate;
  overflow:hidden;position:relative;
  align-items:center;border-radius:6px;margin:4px 0;
}
#site-flash-bar.sfb-on{display:flex}
@keyframes sfbGrad{0%{background-position:0% 50%}100%{background-position:100% 50%}}
#sfb-ticker{flex:1;overflow:hidden;height:100%;display:flex;align-items:center;position:relative}
#sfb-inner{
  display:inline-flex;align-items:center;gap:18px;
  padding:0 20px;white-space:nowrap;
  /* JS sets animation duration dynamically */
}
#sfb-inner.sfb-scroll{animation:sfbTick var(--sfb-dur,20s) linear infinite}
@keyframes sfbTick{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.sfb-chip{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);
  border-radius:20px;padding:2px 10px;
  font-size:.66rem;font-weight:700;color:#fff;white-space:nowrap;flex-shrink:0;
  font-family:'DM Mono',monospace;
}
.sfb-chip.sfb-reminder{background:rgba(251,191,36,.14);border-color:rgba(251,191,36,.4);color:#fde68a}
.sfb-chip.sfb-ghost{opacity:.7;pointer-events:none;}
.sfb-chip-x{
  background:rgba(255,255,255,.15);border:none;color:#fff;width:14px;height:14px;
  border-radius:50%;cursor:pointer;font-size:7px;
  display:inline-flex;align-items:center;justify-content:center;
  flex-shrink:0;padding:0;line-height:1;transition:background .15s;
}
.sfb-chip-x:hover{background:rgba(255,255,255,.4)}
#sfb-add-btn{
  flex-shrink:0;width:36px;height:100%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.2);border-left:1px solid rgba(255,255,255,.12);
  cursor:pointer;font-size:.9rem;color:rgba(255,255,255,.8);
  transition:background .15s;user-select:none;
}
#sfb-add-btn:hover{background:rgba(255,255,255,.18);color:#fff}
#sfb-lbl{
  flex-shrink:0;padding:0 10px 0 12px;font-size:.6rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.8px;color:rgba(255,255,255,.6);
  border-right:1px solid rgba(255,255,255,.12);height:100%;
  display:flex;align-items:center;
}

/* \u2500\u2500 Alert Manager topnav button \u2500\u2500 */
#amgr-nav-btn{
  display:flex;align-items:center;gap:5px;
  padding:4px 10px;border-radius:7px;cursor:pointer;
  font-size:.72rem;font-weight:700;color:var(--mu);
  border:1px solid transparent;transition:all .18s;
  position:relative;white-space:nowrap;
}
#amgr-nav-btn:hover{background:var(--s2);border-color:var(--bd);color:var(--tx)}
#amgr-nav-btn.has-alerts{color:#a78bfa;border-color:rgba(167,139,250,.3);background:rgba(167,139,250,.08)}
#amgr-nav-btn.has-alerts:hover{background:rgba(167,139,250,.2);color:#c4b5fd}
#amgr-nav-dot{
  display:none;width:6px;height:6px;border-radius:50%;
  background:#f87171;position:absolute;top:3px;right:3px;
  box-shadow:0 0 6px rgba(248,113,113,.8);
}
#amgr-nav-btn.has-alerts #amgr-nav-dot{display:block}

/* \u2500\u2500 Alert Manager overlay + panel \u2500\u2500 */
#amgr-overlay{
  position:fixed;inset:0;z-index:8000;
  background:rgba(0,0,0,.5);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  display:none;opacity:0;transition:opacity .25s;
  justify-content:flex-end;
}
#amgr-overlay.amgr-open{display:flex}
#amgr-overlay.amgr-visible{opacity:1}
#amgr-panel{
  width:380px;max-width:100vw;height:100%;
  background:var(--sf);border-left:1px solid var(--bd);
  display:flex;flex-direction:column;overflow:hidden;
  transform:translateX(100%);
  transition:transform .28s cubic-bezier(.4,0,.2,1);
  box-shadow:-8px 0 40px rgba(0,0,0,.5);
}
#amgr-overlay.amgr-visible #amgr-panel{transform:translateX(0)}
#amgr-hdr{
  display:flex;align-items:center;justify-content:space-between;
  padding:15px 18px;border-bottom:1px solid var(--bd);flex-shrink:0;
}
.amgr-hdr-title{font-size:.88rem;font-weight:800;color:var(--tx);display:flex;align-items:center;gap:8px}
#amgr-close{
  width:27px;height:27px;border-radius:6px;background:var(--s2);
  border:1px solid var(--bd);color:var(--mu);font-size:.72rem;
  cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;
}
#amgr-close:hover{background:var(--rd);border-color:var(--rd);color:#fff}
#amgr-body{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:14px}
.amgr-sec{
  background:var(--s2);border:1px solid var(--bd);border-radius:12px;padding:14px;
  display:flex;flex-direction:column;gap:10px;
}
.amgr-sec-title{
  font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.8px;
  color:var(--bl);display:flex;align-items:center;gap:6px;
}
.amgr-buyers{display:flex;flex-wrap:wrap;gap:5px}
.amgr-byr{
  padding:3px 10px;border-radius:20px;font-size:.66rem;font-weight:700;
  background:var(--sf);border:1.5px solid var(--bd);color:var(--mu);
  cursor:pointer;transition:all .15s;white-space:nowrap;
}
.amgr-byr:hover{border-color:var(--bl);color:var(--bl)}
.amgr-byr.sel{background:rgba(96,165,250,.12);border-color:var(--bl);color:var(--bl)}
.amgr-inp{
  width:100%;padding:8px 11px;background:var(--sf);border:1px solid var(--bd);
  border-radius:8px;color:var(--tx);font-size:.78rem;font-family:inherit;
  outline:none;box-sizing:border-box;transition:border-color .15s;
}
.amgr-inp:focus{border-color:var(--bl);box-shadow:0 0 0 2px rgba(96,165,250,.12)}
textarea.amgr-inp{resize:vertical;min-height:60px;line-height:1.4}
.amgr-btn{
  padding:8px 14px;border-radius:8px;font-size:.76rem;font-weight:700;
  cursor:pointer;border:none;transition:all .15s;width:100%;
  font-family:inherit;
}
.amgr-btn-primary{background:var(--bl);color:#000}
.amgr-btn-primary:hover{filter:brightness(1.12)}
.amgr-btn-warn{background:linear-gradient(135deg,#f59e0b,#d97706);color:#000}
.amgr-btn-warn:hover{filter:brightness(1.1)}
.amgr-hint{font-size:.62rem;color:var(--mu);line-height:1.4}
/* Active list */
.amgr-item{
  display:flex;align-items:center;gap:8px;padding:8px 10px;
  background:var(--sf);border:1px solid var(--bd);border-radius:8px;font-size:.72rem;
}
.amgr-item-badge{
  padding:2px 8px;border-radius:20px;font-size:.58rem;font-weight:700;
  background:rgba(167,139,250,.12);color:#a78bfa;border:1px solid rgba(167,139,250,.3);
  white-space:nowrap;flex-shrink:0;
}
.amgr-item-badge.rem{background:rgba(251,191,36,.1);color:#f59e0b;border-color:rgba(251,191,36,.3)}
.amgr-item-label{flex:1;color:var(--tx);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.amgr-item-date{color:var(--mu);font-size:.6rem;white-space:nowrap;font-family:'DM Mono',monospace}
.amgr-item-x{
  width:20px;height:20px;background:rgba(248,113,113,.1);border:1px solid rgba(248,113,113,.3);
  border-radius:5px;color:#f87171;font-size:.6rem;cursor:pointer;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;
}
.amgr-item-x:hover{background:#f87171;color:#fff;border-color:#f87171}
.amgr-empty{text-align:center;color:var(--mu);font-size:.72rem;padding:16px 8px}

/* \u2550\u2550 Data Loading Overlay \u2550\u2550 */
#dla-overlay{position:fixed;inset:0;z-index:9998;background:rgba(0,0,0,.6);backdrop-filter:blur(5px);display:none;align-items:center;justify-content:center;opacity:1;transition:opacity .35s;}
#dla-overlay.dla-show{display:flex;}
#dla-overlay.dla-fade{opacity:0!important;pointer-events:none;}
#dla-card{background:var(--sf);border:1px solid var(--bd);border-radius:18px;padding:30px 38px;display:flex;flex-direction:column;align-items:center;gap:18px;min-width:240px;box-shadow:0 12px 40px rgba(0,0,0,.5);}
#dla-spinner{width:46px;height:46px;border-radius:50%;border:3.5px solid var(--bd);border-top-color:var(--bl,#60a5fa);animation:dlaSpin .75s linear infinite;flex-shrink:0;}
@keyframes dlaSpin{to{transform:rotate(360deg)}}
#dla-title{font-size:0.82rem;font-weight:700;color:var(--tx);font-family:'DM Sans',sans-serif;letter-spacing:.3px;}
#dla-status{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px 18px;width:100%;}
.dla-buyer{display:flex;align-items:center;gap:7px;font-size:0.72rem;color:var(--mu);font-family:'DM Sans',sans-serif;transition:color .25s;}
.dla-buyer.done{color:var(--tx);}
.dla-dot{width:8px;height:8px;border-radius:50%;background:var(--bd);flex-shrink:0;transition:background .25s,transform .2s;}
.dla-buyer.done .dla-dot{background:#4ade80;transform:scale(1.25);}

/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550
   \u2550\u2550  MOBILE \u2014 ALL RESPONSIVE RULES (max-width: 768px)  \u2550\u2550
   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */

/* \u2500\u2500 1. Shell & navigation \u2500\u2500 */
@media(max-width:768px){
  /* Topnav */
  #topnav{display:flex!important;padding:0 6px!important;height:44px!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;gap:2px!important;flex-shrink:0!important}
  #topnav::-webkit-scrollbar{display:none!important}
  #mobile-topbar{display:none!important}
  #sb-hamburger{display:flex!important;align-items:center!important;justify-content:center!important;width:36px!important;height:36px!important;flex-shrink:0!important}
  .topnav-item{padding:5px 10px!important;font-size:10.5px!important;flex-shrink:0!important;border-radius:6px!important}
  .topnav-item-icon{font-size:11px!important}
  .topnav-right{gap:4px!important}
  .topnav-right .sb-user{display:none!important}
  .topnav-right .sb-logout{display:none!important}
  .topnav-right .topnav-sep{display:none!important}
  #flash-alert-bar,#site-flash-bar{display:none!important}
  .topnav-sep{flex-shrink:0!important}
  #app-shell{flex-direction:column}
  #main-col{width:100vw;max-width:100vw}

  /* \u2550\u2550 MOBILE SIDEBAR \u2014 rebuilt as smooth slide-in drawer \u2550\u2550 */
  #sidebar{
    position:fixed;left:0;top:0;bottom:0;
    width:282px!important;
    display:flex!important;
    flex-direction:column;
    z-index:500;
    transform:translateX(-100%);
    transition:transform .28s cubic-bezier(.4,0,.2,1),box-shadow .28s;
    box-shadow:none;
    overflow:hidden!important;  /* sidebar itself clips; nav scrolls internally */
  }
  #sidebar.sb-open{transform:translateX(0)!important;box-shadow:6px 0 40px rgba(0,0,0,.65)!important}

  /* Force fully expanded layout on mobile \u2014 ignore collapsed icon-only state */
  #sidebar.sb-collapsed{width:282px!important}
  #sidebar.sb-collapsed .sb-nav-text,
  #sidebar.sb-collapsed .sb-nav-label,#sidebar.sb-collapsed .sb-nav-badge,
  #sidebar.sb-collapsed .sb-themes,#sidebar.sb-collapsed .sb-user-info,
  #sidebar.sb-collapsed .sb-logout,#sidebar.sb-collapsed .sb-bottom-text,
  #sidebar.sb-collapsed .sb-srv{display:revert!important}
  #sidebar.sb-collapsed .sb-sub-text{display:block!important}
  #sidebar.sb-collapsed .sb-extlink{display:inline!important}

  /* Header row: logo + close button */
  #sb-toggle-row{
    display:flex!important;align-items:center;justify-content:space-between;
    padding:0 14px!important;height:54px!important;
    border-bottom:1px solid var(--bd);flex-shrink:0;gap:0!important;
  }
  /* No ::before text \u2014 show the real .sb-logo instead */
  #sb-toggle-btn{
    display:flex!important;width:32px;height:32px;border-radius:8px;
    background:var(--s2);border:1px solid var(--bd);color:var(--mu);
    cursor:pointer;align-items:center;justify-content:center;
    font-size:1rem;line-height:1;flex-shrink:0;
  }
  #sb-toggle-btn:hover{background:var(--bd);color:var(--tx);}
  #sidebar.sb-collapsed #sb-toggle-btn svg{transform:none!important}
  /* No sidebar brand \u2014 branding shown in topnav .tbrand */

  /* Nav section \u2014 flex:1 so it fills space between header and bottom, scrolls internally */
  #sidebar .sb-nav{
    padding:8px 0!important;
    flex:1!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain;
    min-height:0!important;
  }
  #sidebar .sb-bottom{flex-shrink:0!important;}
  #sidebar .sb-nav-label{
    font-size:0.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;
    color:var(--mu);padding:14px 16px 5px!important;
  }
  #sidebar.sb-collapsed .sb-ni{
    padding:0 10px!important;justify-content:flex-start!important;
    gap:12px!important;width:auto!important;border-radius:10px!important;
    min-height:50px!important;margin:1px 8px;
  }
  #sidebar.sb-collapsed .sb-ni.active{
    background:rgba(74,222,128,.08)!important;
    border-left:3px solid var(--ac)!important;border-radius:10px!important;
  }
  #sidebar .sb-nav-text{font-size:0.88rem!important;font-weight:600!important;}
  #sidebar.sb-collapsed .sb-nav-icon{width:20px!important;height:20px!important;opacity:1!important;flex-shrink:0}
  #sidebar .sb-extlink{font-size:0.65rem;opacity:0.45;margin-left:auto;}

  /* \u2500\u2500 Buyer grid: 4 columns of icons \u2500\u2500 */
  /* NOTE: no !important on display so JS toggle (chevron) can override */
  #sidebar.sb-collapsed #sb-buyer-menu,
  #sidebar #sb-buyer-menu{
    grid-template-columns:repeat(4,1fr);
    gap:6px;padding:8px 10px!important;margin:0!important;
  }
  /* When visible (JS sets display:grid on mobile) use grid layout */
  #sidebar #sb-buyer-menu[style*="grid"],
  #sidebar #sb-buyer-menu[style*="flex"]{
    display:grid!important;
    grid-template-columns:repeat(4,1fr)!important;
  }
  #sidebar .sb-sub-item{
    flex-direction:column!important;align-items:center!important;
    padding:10px 3px 8px!important;gap:5px!important;
    border-radius:12px!important;background:var(--s2)!important;
    text-align:center!important;width:auto!important;
    white-space:normal!important;overflow:visible!important;
    text-overflow:clip!important;justify-content:center;min-height:auto!important;
  }
  #sidebar .sb-sub-item:hover{background:rgba(74,222,128,.1)!important}
  #sidebar .sb-sub-item.active{background:rgba(74,222,128,.13)!important;border:1px solid rgba(74,222,128,.4)!important}
  #sidebar .sb-sub-icon,#sidebar.sb-collapsed .sb-sub-icon{width:34px!important;height:34px!important;border-radius:8px!important}
  #sidebar .sb-sub-icon-txt,#sidebar.sb-collapsed .sb-sub-icon-txt{width:34px!important;height:34px!important;font-size:11px!important}
  #sidebar .sb-sub-text{
    display:block!important;font-size:0.56rem!important;font-weight:700!important;
    white-space:normal!important;text-align:center!important;
    line-height:1.2!important;color:var(--mu)!important;
  }

  /* Bottom section */
  #sidebar.sb-collapsed .sb-bottom{flex-direction:column!important;align-items:stretch!important;padding:12px!important}
  #sidebar.sb-collapsed .sb-themes{display:flex!important;flex-wrap:wrap!important;gap:6px!important;padding:6px 0 8px!important}
  #sidebar.sb-collapsed .sb-logout{display:revert!important}

  /* Overlay \u2014 always present, fades in/out */
  #sb-overlay{
    display:block!important;
    position:fixed;inset:0;background:rgba(0,0,0,.6);
    z-index:499;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
    pointer-events:none;opacity:0;
    transition:opacity .25s;
  }
  #sb-overlay.show{pointer-events:all!important;opacity:1!important;}
}

/* \u2500\u2500 2. Page layout \u2500\u2500 */
@media(max-width:768px){
  #p2.active{height:calc(100svh - 44px);overflow:hidden}
  .buyer-panel.active{flex:1;min-height:0;overflow:hidden}
  /* Reliance v-content */
  #v-content{flex-direction:column;flex:1;min-height:0;overflow:hidden;height:auto}
  .vtoolbar{position:relative!important;top:auto!important}
  #tbl-scroll-x{display:none!important}
  #mobile-card-list{display:none!important}
  #mobile-summary-bar.has-rows{display:flex}
}
@media(min-width:769px){
  #mobile-topbar{display:none!important}
  #mobile-card-list{display:none}
  #mobile-summary-bar{display:none!important}
}

/* \u2500\u2500 3. Buyer tabs bar \u2014 icon-only on mobile \u2500\u2500 */
@media(max-width:768px){
  .buyer-tabs-bar{padding:8px 10px;gap:8px;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none;background:var(--bg);border-bottom:1px solid var(--bd);-webkit-overflow-scrolling:touch}
  .buyer-tabs-bar::-webkit-scrollbar{display:none}
  /* Each tab becomes a square icon button \u2014 font-size:0 collapses the text node */
  .buyer-tab{
    width:48px!important;height:48px!important;
    padding:0!important;gap:0!important;
    font-size:0!important;line-height:0!important;
    border-radius:12px!important;border:1.5px solid var(--bd)!important;
    background:var(--bg)!important;flex-shrink:0!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
    transition:transform .15s,border-color .15s,background .15s;
    -webkit-tap-highlight-color:transparent;
  }
  .buyer-tab:active{transform:scale(0.94)}
  .buyer-tab.active{
    background:rgba(74,222,128,.13)!important;
    border-color:var(--ac)!important;
    box-shadow:0 0 0 1.5px rgba(74,222,128,.3);
  }
  /* Show the buyer logo */
  .buyer-tab img{
    display:block!important;
    width:32px!important;height:32px!important;max-width:32px!important;
    object-fit:contain!important;
    border-radius:6px!important;opacity:0.85!important;
    flex-shrink:0!important;
  }
  .buyer-tab.active img{opacity:1!important;}
  /* Suruchi text-pill icon (SB) \u2014 match size of img icons */
  .buyer-tab > span{
    font-size:11px!important;line-height:1!important;
    width:32px!important;height:32px!important;
    border-radius:6px!important;flex-shrink:0!important;
  }
  .buyer-tab-soon{display:none!important}
  /* Appointment badge on icon tabs \u2014 show as dot+date below the icon */
  .buyer-tab{position:relative!important;overflow:visible!important;}
  .tab-appt-badge{
    position:absolute!important;
    bottom:-8px!important;left:50%!important;transform:translateX(-50%)!important;
    font-size:0.48rem!important;padding:1px 5px!important;
    border-radius:8px!important;gap:2px!important;
    max-width:80px!important;
    box-shadow:0 2px 8px rgba(124,58,237,.5)!important;
  }
  .tab-appt-dismiss{width:10px!important;height:10px!important;font-size:6px!important}
}

/* \u2500\u2500 4. Table \u2192 cards switching \u2500\u2500 */
@media(max-width:768px){
  /* D-Mart */
  #dmart-tbl-wrap{display:none!important}
  #dmart-card-list{display:block;overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1;min-height:0;padding:6px 8px 12px}
  #dm-view-toggle{display:inline-flex!important}
  #dm-col-picker-btn{display:none!important}
  #dm-filter-btn{display:inline-flex!important}
  /* Other buyers */
  #vmart-tbl-wrap,#apollo-tbl-wrap,#flipkart-tbl-wrap,#blinkit-tbl-wrap{display:none!important}
  #vmart-card-list,#apollo-card-list,#flipkart-card-list,#blinkit-card-list,#card-list{display:block!important}
  #vmart-col-picker-btn,#apollo-col-picker-btn,#flipkart-col-picker-btn,#blinkit-col-picker-btn,#reliance-col-picker-btn{display:none!important}
  #reliance-view-toggle,#flipkart-view-toggle,#blinkit-view-toggle{display:inline-flex!important}
}
@media(min-width:769px){
  #dmart-card-list{display:none!important}
  #dm-view-toggle,#dm-filter-btn{display:none!important}
  #dm-mobile-filter-panel{display:none!important}
  #vmart-view-toggle,#apollo-view-toggle,#flipkart-view-toggle,#blinkit-view-toggle,#reliance-view-toggle{display:none!important}
  #flipkart-card-list,#blinkit-card-list,#card-list{display:none!important}
}

/* \u2500\u2500 5. Topbar / pdf-topbar \u2500\u2500 */
@media(max-width:768px){
  .topbar{padding:0 10px;gap:0;overflow-x:auto;scrollbar-width:none;border-bottom:2px solid var(--ac)}
  .topbar::-webkit-scrollbar{display:none}
  .tbrand{font-size:0.88rem;font-weight:800;margin-right:10px;flex-shrink:0;letter-spacing:-0.5px}
  .tab{padding:0 12px;font-size:0.75rem;font-weight:600;white-space:nowrap;flex-shrink:0;min-height:50px}
  .slbl,.sdot{display:none!important}
  .awrap{padding:14px 10px}
  .uchip{font-size:0.65rem;padding:4px 9px;border-radius:14px}
  .logout-btn{font-size:0.65rem;padding:5px 10px;border-radius:7px}
  .t-right{gap:6px}
  /* PDF buyer topbar */
  .pdf-topbar{padding:8px 12px!important;gap:6px!important;align-items:flex-start!important}
  .pdf-topbar-logo{display:none!important}
  .pdf-topbar-title{font-size:0.8rem!important}
  .pdf-topbar-meta{font-size:0.6rem!important}
  .pdf-topbar-right{width:100%!important;flex-wrap:wrap!important;gap:5px!important;margin-left:0!important}
  .pdf-topbar-right .bsm,.pdf-topbar-right .bo{font-size:0.65rem!important;padding:5px 9px!important}
  #dmart-buyer-wrap .pdf-topbar,#bpanel-dmart .pdf-topbar{padding:8px 10px!important}
  /* D-Mart vtoolbar: single scrollable row instead of wrapping 4 rows */
  #dmart-vtoolbar{flex-wrap:nowrap!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;align-items:center!important;padding-bottom:2px!important}
  #dmart-vtoolbar::-webkit-scrollbar{display:none!important}
  #dmart-search{width:88px!important;min-width:70px!important;flex-shrink:0!important}
}

/* \u2500\u2500 6. Vtoolbar / pdf-vtoolbar \u2500\u2500 */
@media(max-width:768px){
  .vtoolbar{padding:7px 10px;gap:6px;flex-wrap:wrap;min-height:unset;align-items:center;background:var(--sf)}
  .gsearch{flex:1 1 140px;min-width:120px;max-width:100%}
  .gsearch input{font-size:0.76rem;padding:6px 14px 6px 34px;border-radius:50px}
  .legwrap{flex:0 0 auto;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:4px}
  .legwrap::-webkit-scrollbar{display:none}
  .leg{flex-shrink:0;font-size:0.62rem;padding:5px 9px;white-space:nowrap;border-radius:7px}
  .vinfo{flex:1 0 auto;font-size:0.62rem;white-space:nowrap;text-align:right}
  .vtoolbar .bsm,.vtoolbar .bo{flex-shrink:0;white-space:nowrap;font-size:0.68rem;padding:6px 11px;border-radius:8px}
  #btn-pdf-cfg,#btn-upd-date{display:none!important}
  #btn-mobile-filter{display:inline-flex!important}
  /* pdf-vtoolbar (vmart, apollo, blinkit, flipkart etc.) */
  .pdf-vtoolbar{padding:6px 10px!important;gap:5px!important;min-height:unset!important;position:relative!important;top:auto!important}
  .pdf-vtoolbar .gsearch{flex:1 1 130px!important;min-width:110px!important;max-width:100%!important}
  .pdf-vtoolbar .gsearch input{font-size:0.74rem!important;padding:5px 9px!important}
  .pdf-vtoolbar .bsm,.pdf-vtoolbar .bo{font-size:0.65rem!important;padding:5px 9px!important}
  .pdf-vtoolbar select{font-size:0.68rem!important;padding:4px 6px!important;max-width:120px!important}
  .pdf-vinfo{font-size:0.6rem!important;white-space:nowrap!important}
  /* vtoolbar legwrap override */
  #vtoolbar{flex-wrap:wrap!important;height:auto!important;overflow:visible!important}
  #vtoolbar .gsearch{flex:1 1 150px!important;min-width:120px!important;max-width:100%!important}
  #vtoolbar .legwrap{flex:1 1 100%!important;flex-wrap:wrap!important;overflow-x:visible!important;gap:4px!important}
  #vtoolbar .vinfo{flex-basis:100%!important;text-align:left!important;font-size:0.62rem!important}
  #vtoolbar .legwrap .leg{font-size:0.6rem!important;padding:4px 8px!important}
}

/* \u2500\u2500 7. Reliance brand legend (legwrap with dm-stamp-tile cards) \u2500\u2500 */
@media(max-width:768px){
  #mobile-brand-bar{display:none!important}
  /* #vtoolbar #legwrap beats #vtoolbar .legwrap (2 IDs > 1 ID+1 class) */
  #vtoolbar #legwrap{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;flex:0 0 auto!important;width:100%!important}
  #vtoolbar #legwrap::-webkit-scrollbar{display:none!important}
}

/* \u2500\u2500 8. Brand legend chips (all buyers) \u2500\u2500 */
@media(max-width:768px){
  [id$="-brand-legend"]{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important}
  [id$="-brand-legend"]::-webkit-scrollbar{display:none!important}
  [id$="-brand-legend-chips"]{flex-wrap:nowrap!important}
  .dm-stamp-tile{width:66px!important;min-height:78px!important;padding:22px 4px 8px!important;flex-shrink:0!important}
  .dm-stamp-logo{width:28px!important;height:20px!important}
  .dm-stamp-abbr{font-size:14px!important}
  .dm-stamp-name{font-size:8px!important;max-width:58px!important}
  .dm-stamp-count{font-size:8px!important;padding:2px 6px!important;margin-top:3px!important}
  .dm-stamp-poc{font-size:7px!important;padding:1px 6px!important}
}

/* \u2500\u2500 9. Inner tab bars \u2500\u2500 */
@media(max-width:768px){
  .inner-tab-bar{overflow-x:auto!important;overflow-y:visible!important;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;padding:0 10px!important}
  .inner-tab-bar::-webkit-scrollbar{display:none!important}
  .inner-tab{flex-shrink:0!important;padding:10px 16px!important;font-size:0.75rem!important}
  /* Reliance inner tabs */
  #reliance-inner-tabs{padding:0}
  #reliance-inner-tabs>div{display:flex}
  #itab-po,#itab-amend{flex:1;text-align:center;padding:11px 4px;font-size:0.78rem;font-weight:600}
  /* Blinkit inner tabs (inline-styled div) */
  #bktab-po,#bktab-expired,#bktab-fulfilled,#bktab-appt,#bktab-mrp,#bktab-shelf{flex-shrink:0!important;white-space:nowrap!important;padding:9px 12px!important;font-size:0.7rem!important}
}

/* \u2500\u2500 10. Section tabs (D-Mart new/all, V-Mart, Flipkart) \u2500\u2500 */
@media(max-width:768px){
  .dm-section-tabs{overflow-x:auto!important;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important}
  .dm-section-tabs::-webkit-scrollbar{display:none!important}
  .dm-stab{flex-shrink:0!important;white-space:nowrap!important}
}

/* \u2500\u2500 11. Summary bar \u2500\u2500 */
@media(max-width:768px){
  .pdf-summary-bar{flex-wrap:nowrap!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;padding:7px 12px!important}
  .pdf-summary-bar::-webkit-scrollbar{display:none!important}
  .pdf-sum-item{flex-shrink:0!important;min-width:68px!important}
  /* V-Mart sumbar: stack Brand/Location rows vertically, each scrolls horizontally */
  #vmart-sumbar{flex-direction:column!important;overflow-x:visible!important;overflow-y:visible!important;padding:0!important;gap:0!important}
  #vmart-sumbar>div{flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;padding:6px 10px!important;margin-left:0!important;border-left:none!important;width:100%!important;box-sizing:border-box!important}
  #vmart-sumbar>div:not(:last-child){border-bottom:1px solid var(--bd)!important}
  #vmart-sumbar>div::-webkit-scrollbar{display:none!important}
}

/* \u2500\u2500 12. Touch targets \u2500\u2500 */
@media(max-width:768px){
  .buyer-tab,.inner-tab{min-height:40px!important}
  .sb-ni{min-height:44px!important}
  .bsm,.bo{min-height:38px!important}
  .po-exp-btn{width:36px!important;height:36px!important}
  .po-card,.dmc-card,.bmc-card,.bmc-po-card{-webkit-tap-highlight-color:transparent}
  .btn{padding:11px 18px;font-size:0.84rem;border-radius:9px}
  .bsm{padding:7px 12px;font-size:0.74rem}
}

/* \u2500\u2500 13. Dashboard \u2014 mobile responsive \u2500\u2500 */
@media(max-width:768px){
  /* Let dashboard scroll properly */
  #dash.active{overflow:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch}
  .dash-scroll{padding:14px 12px;overflow:visible!important;flex:none!important}
  /* Stack the 2-col grid */
  .dash-grid-2{grid-template-columns:1fr!important;gap:10px!important}
  /* Stat cards: 2 columns */
  .dash-stats{grid-template-columns:repeat(2,1fr)!important;gap:8px!important;margin-bottom:14px!important}
  .dash-stat{padding:14px 14px!important}
  .dash-stat-value{font-size:18px!important}
  .dash-stat-label{font-size:10px!important}
  /* Chart bars: compact brand names */
  .dash-hbar-name{width:80px!important;min-width:80px!important;font-size:10.5px!important}
  .dash-hbar-track{height:20px!important}
  .dash-hbar-val{font-size:9.5px!important}
  .dash-hbar-row{gap:5px!important}
  /* Card body tighter */
  .dash-card-body{padding:12px 14px!important}
  .dash-card-hd{padding:12px 14px!important}
  .dash-card-title{font-size:12px!important}
  /* Chart stats row */
  .dash-chart-stats{grid-template-columns:repeat(3,1fr)!important;gap:6px!important;margin-top:10px!important;padding-top:10px!important}
  .dash-cs-val{font-size:14px!important}
  .dash-cs-lbl{font-size:8px!important}
  /* Activity feed */
  .dash-activity{max-height:300px!important;overflow-y:auto!important}
  /* Header */
  .dash-header-title{font-size:16px!important}
  .dash-header-title span{font-size:11px!important}
}
@media(max-width:640px){
  .dash-qa-grid{grid-template-columns:repeat(3,1fr)!important;gap:6px!important}
  .dash-qa-btn{padding:10px 8px!important;text-align:center!important}
  .dash-qa-icon{font-size:16px!important;margin-bottom:3px!important}
  .dash-qa-desc{display:none!important}
}
@media(max-width:480px){
  .dash-scroll{padding:8px 8px!important}
  .dash-stats{grid-template-columns:repeat(2,1fr)!important;gap:6px!important}
  .dash-stat{padding:10px 12px!important}
  .dash-stat-value{font-size:16px!important}
  .dash-hbar-name{width:65px!important;min-width:65px!important;font-size:9.5px!important}
  .dash-hbar-track{height:18px!important}
}

/* \u2500\u2500 14. Page header \u2500\u2500 */
@media(max-width:540px){
  .page-header{height:auto!important;min-height:48px!important;flex-wrap:wrap!important;padding:8px 12px!important;row-gap:6px!important}
  .page-header>div:last-child{width:100%!important}
  #dash-search{width:100px!important}
}

/* \u2500\u2500 15. Filter drawer \u2500\u2500 */
@media(max-width:768px){
  #mobile-filter-drawer{width:88vw;max-width:320px}
  #mobile-filter-drawer .qf-chips{max-height:260px}
  /* Prevent full-page horizontal scroll */
  #tbl-scroll-x{overflow-x:visible!important;width:100%!important}
  .col-filter-strip{overflow-x:auto!important;width:100%!important;max-width:100vw!important}
  .col-filter-strip[style]{width:100%!important;min-width:unset!important}
  /* Misc */
  .appt-pin-group{min-width:160px}
  .pwrap{padding:16px 12px}
  .ugrid{grid-template-columns:1fr 1fr;gap:10px}
  .sgrid{grid-template-columns:repeat(2,1fr);gap:8px}
  .sv{font-size:1.15rem}
  .modal-bg{align-items:flex-end!important}
  .modal{width:100vw!important;max-width:100vw!important;max-height:92vh!important;border-radius:20px 20px 0 0!important;margin:0!important;padding:20px 16px!important}
  .modal::before{content:'';display:block;width:36px;height:4px;border-radius:2px;background:var(--bd);margin:0 auto 16px}
  .smtp-cfg-grid{grid-template-columns:1fr}
  .ts-banner{padding:0;cursor:pointer}
  .ts-banner-inner{padding:6px 12px;display:flex;align-items:center;gap:8px}
  .ts-banner-toggle{font-size:0.6rem;color:var(--mu);margin-left:auto;font-family:DM Mono,monospace;flex-shrink:0}
  .ts-banner-expanded{padding:6px 12px 8px;border-top:1px solid rgba(255,255,255,.06);display:none}
  .ts-banner.expanded .ts-banner-expanded{display:block}
  .ts-main{font-size:0.7rem;font-weight:700}
  .ts-sub{font-size:0.58rem}
  .unmapped-banner{margin:5px 8px 0;border-radius:8px;padding:0;overflow:hidden}
  .ub-header{display:flex;align-items:center;gap:8px;padding:7px 12px;cursor:pointer}
  .ub-badge{background:#f97316;color:#000;font-size:0.6rem;font-weight:800;padding:1px 7px;border-radius:10px;font-family:DM Mono,monospace;flex-shrink:0}
  .ub-title{margin-bottom:0;font-size:0.68rem}
  .ub-caret{font-size:0.6rem;color:#fb923c;margin-left:auto;transition:transform .2s;flex-shrink:0}
  .ub-caret.open{transform:rotate(180deg)}
  .ub-body{display:none;padding:0 12px 8px}
  .unmapped-banner.expanded .ub-body{display:block}
  .unmapped-items{display:flex;flex-wrap:wrap;gap:5px}
}

/* \u2500\u2500 16. Login \u2500\u2500 */
@media(max-width:400px){
  .tab{font-size:0.68rem;padding:0 9px}
  .tbrand{font-size:0.8rem}
  #itab-po,#itab-amend{font-size:0.7rem}
  .l-right{padding:12px!important}
  .lbox{padding:36px 22px 26px!important}
  .l-avatar{width:64px!important;height:64px!important;margin-bottom:22px!important}
  .lbtn{padding:12px!important;letter-spacing:2px!important}
}

/* \u2500\u2500 17. Mobile topbar: glass on dark themes \u2500\u2500 */
html:not([data-theme="light"]):not([data-theme="silver"]):not([data-theme="skyblue"]):not([data-theme="lightnavy"]):not([data-theme="cleanslate"]):not([data-theme="warmpaper"]) #mobile-topbar{
  background:rgba(6,9,20,.97)!important;
  border-bottom:1px solid rgba(255,255,255,.07)!important;
  backdrop-filter:blur(20px)!important;
  -webkit-backdrop-filter:blur(20px)!important;
}

/* \u2500\u2500 18. D-Mart MRP Amendment mobile card view \u2500\u2500 */
@media(max-width:768px){
  /* Full-screen panel */
  .dm-amend-panel{width:100vw!important;max-width:100vw!important;height:100svh!important;max-height:100svh!important;border-radius:0!important}
  /* Compact header: stack filter row + wrap action buttons */
  .dm-amend-hd{padding:8px 10px!important;gap:5px!important}
  .dm-amend-hd>div:first-child{font-size:0.8rem!important}
  .dm-amend-hd>div:nth-child(2){flex-direction:column!important;align-items:stretch!important;gap:5px!important}
  .dm-amend-sel{font-size:0.7rem!important;width:100%!important}
  #dm-amend-search{min-width:unset!important;width:100%!important;font-size:0.7rem!important;box-sizing:border-box!important}
  .dm-amend-hd>div:nth-child(3){flex-wrap:wrap!important;gap:4px!important}
  .dm-amend-hd>div:nth-child(3) .bsm,.dm-amend-hd>div:nth-child(3) .bo{font-size:0.62rem!important;padding:5px 9px!important;min-height:32px!important}
  /* PO group header */
  .dma-mob-po-hdr{padding:7px 12px;font-size:0.7rem;font-weight:700;color:var(--ac);background:rgba(74,222,128,0.07);border-top:1px solid var(--bd);border-bottom:1px solid var(--bd);margin-top:8px;overflow:hidden}
  /* Item card */
  .dma-mob-card{margin:6px 10px;background:var(--sf);border:1px solid var(--bd);border-radius:8px;padding:10px 12px}
  .dma-mob-card.dm-amend-chg{border-color:rgba(251,191,36,0.45)!important;background:rgba(251,191,36,0.03)!important}
  /* Top row: EAN + brand */
  .dma-mob-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:3px}
  .dma-mob-ean{font-family:DM Mono,monospace;font-size:0.67rem;color:var(--mu)}
  .dma-mob-brand{font-size:0.65rem;color:#c4b5fd;font-weight:600;text-align:right;max-width:55%}
  /* Description */
  .dma-mob-desc{font-size:0.76rem;font-weight:600;color:var(--tx);line-height:1.35;margin-bottom:8px}
  /* Key-value row */
  .dma-mob-kv-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,0.06)}
  .dma-mob-kv{display:flex;flex-direction:column;gap:1px}
  .dma-mob-lbl{font-size:0.58rem;color:var(--mu);text-transform:uppercase;letter-spacing:.04em}
  .dma-mob-val{font-family:DM Mono,monospace;font-size:0.72rem;font-weight:700;color:var(--tx)}
  /* Input row */
  .dma-mob-inp-row{display:flex;gap:8px;margin-bottom:5px}
  .dma-mob-inp-grp{flex:1;display:flex;flex-direction:column;gap:3px}
  .dma-mob-inp-grp .dma-in{text-align:left!important;font-size:0.82rem!important;padding:8px 10px!important}
  /* Suggested landing */
  .dma-mob-sug{display:flex;align-items:center;gap:6px;font-size:0.7rem;color:#a78bfa;margin-top:5px}
}

/* Forced explicit width for PO Number column */
th.cg-po, td.cg-po {
  width: 140px !important;
  min-width: 140px !important;
  max-width: 140px !important;
}

/* Force description column to absorb all remaining width */
th[data-k="PRODUCT_DESCRIPTION"], td.td-desc-wrap {
  width: 100% !important;
}
