/* bundles branch (Krishna t524u / t526u / t522u-B, 30 Oct 2026). Loaded after theme3.css. LAYOUT / COLOUR ONLY – no money logic. */

/* ---- t524u MFD range chips on capacitor lists (display filter only) ---- */
.mfdc{display:flex;gap:8px;align-items:center;overflow-x:auto;padding:6px 2px 10px;margin:0 0 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.mfdc::-webkit-scrollbar{display:none}
.mfdl{flex:none;font-weight:800;font-size:14px;color:var(--mute,#555);letter-spacing:.3px}
.mfdb{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50px;min-width:58px;padding:5px 14px;border-radius:14px;
  border:2px solid var(--bd2,#e3c9ca);background:var(--glass,#fff);color:var(--ink,#1a1a1a);font:inherit;cursor:pointer;line-height:1.15}
.mfdb b{font-size:16px;font-weight:800;white-space:nowrap}.mfdb small{font-size:12.5px;font-weight:700;color:var(--mute,#666)}
.mfdb.on{background:var(--t3p,#D81E27);border-color:var(--t3p,#D81E27);color:#fff}.mfdb.on small{color:rgba(255,255,255,.9)}
[data-theme=dark] .mfdb.on{color:#111}[data-theme=dark] .mfdb.on small{color:rgba(0,0,0,.75)}
html:not(.yqneu)[data-theme=dark] .mfdb.on{background:#E01F29;border-color:#E01F29;color:#fff}html:not(.yqneu)[data-theme=dark] .mfdb.on small{color:rgba(255,255,255,.9)}

/* ---- t526u CARTFIT: phones – no inner scroll box, compact rows, sticky Grand Total + CTA bar ---- */
@media(max-width:959.98px){
  body:has(#ccw){overflow-x:clip}   /* body overflow-x:hidden made BODY the sticky container -> bar never stuck; clip keeps the no-sideways-scroll without that */
  .ccw{height:auto!important;display:block;padding-bottom:0}
  .ccw>.cch{margin:2px 0 6px}.cch h1{font-size:21px;font-weight:800}
  .ccl{overflow:visible;max-height:none;padding:0 10px}
  .cc{padding:4px 0;gap:0 8px;grid-template-columns:30px auto minmax(0,1fr) 30px}
  .cci{width:30px;height:30px}.cci .ico{width:16px;height:16px}
  .cc .nm{font-size:15px;font-weight:700;line-height:19px}
  .cc .amt{font-size:15.5px;font-weight:800}
  .cc .sub{font-size:12px;line-height:15px}
  .ccq .stp{height:31px;padding:1px}.ccq .stp button{width:29px;height:29px;font-size:18px;font-weight:800}.ccq .stp input{font-size:16px;font-weight:800}
  .cc .rm{width:30px;height:30px}.ccq .slu{height:31px}
  .ccs#sumbox{position:sticky;bottom:var(--ccbn,0px);z-index:5;margin:8px -2px 0;padding:8px 12px 10px;gap:4px;border-radius:16px 16px 12px 12px;
    box-shadow:0 -6px 18px rgba(0,0,0,.12)}
  #sumbox .ccd{margin:0}
  #sumbox .ccdt{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer;font-size:20px;font-weight:900;padding:0;margin:0}
  #sumbox .ccdt::-webkit-details-marker{display:none}
  #sumbox .ccdt .ccdm{white-space:nowrap;font-size:12.5px;font-weight:700;color:var(--mute);text-decoration:underline dotted;margin-left:4px}
  #sumbox .ccdt .ccdm::after{content:' ▾'}#sumbox .ccd[open] .ccdt .ccdm::after{content:' ▴'}
  #sumbox .ccdb{display:flex;flex-direction:column;gap:4px;padding:6px 0 4px;max-height:42vh;overflow:auto;border-top:1px solid var(--bd);margin-top:6px}
  #sumbox .ccdb .sr{font-size:15px}
  #sumbox .offs{margin:4px 0 2px;gap:6px}#sumbox .off input{min-height:42px;font-size:17px}
  #sumbox .ofgo{min-height:52px;font-size:19px;font-weight:900;margin-top:6px;border-radius:14px}
  #sumbox .ofgo .ico{width:22px;height:22px}
  #sumbox .ofhint{font-size:11.5px;line-height:14px;margin:4px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #sumbox .sqsim{margin:4px 0 0;padding:3px 8px;font-size:11.5px}
  /* delivery-reimbursement badge (inside details): single line */
  #sumbox .ccdb [class*=rmb],#sumbox .ccdb [class*=reimb]{padding:6px 10px;font-size:13px}
  #sumbox .ccdb [class*=rmb] br,#sumbox .ccdb [class*=reimb] br{display:none}
}

/* ---- t522u-B dark mode: 'My Bills' / 'Details' (and the other home-dashboard buttons/cards) stayed WHITE – homedash.css only had a dark rule for the
   old data-hth=dark home theme, not theme3's html[data-theme=dark]. Logo chips (white on purpose) are not touched. ---- */
html[data-theme=dark] .hsdash:not(.out) .hsme .btn,html[data-theme=dark] .hsdash:not(.out) .hsla .btn.gb,html[data-theme=dark] .hsla .btn.gb{background:var(--glass2,#2a2422);color:var(--ink,#f3ece9);border-color:var(--bd2,#4a3f3b)}
html[data-theme=dark] .hsdash,html[data-theme=dark] .hsbx,html[data-theme=dark] .hdb,html[data-theme=dark] .hslg{background:var(--glass,#231d1b);color:var(--ink,#f3ece9);border-color:var(--bd2,#4a3f3b)}
/* t528 fix: the big 'My Bills' / 'My Orders' home button (.hsb) – homedash.css 'html.appx .apx .hsb:not(.pri):not(.wa)' forced #2b2121 text (dark-on-dark)
   and the old rule here also turned the red 'Order Form' (.pri) dark. Now: neutral buttons = raised dark card + light text, .pri keeps its red, .wa = dark green. */
html[data-theme=dark] .hsb:not(.pri):not(.wa),html[data-theme=dark].appx .apx .hsb:not(.pri):not(.wa){background:var(--glass2,#2a2422);color:var(--ink,#f3ece9);border:1.5px solid var(--bd2,#4a3f3b)}
html[data-theme=dark] .hsb.wa,html[data-theme=dark].appx .apx .hsb.wa{background:#103222;border:1.5px solid #1e5a3a;color:#7be3a4}
html[data-theme=dark] .hsb *,html[data-theme=dark] .hsbx>b,html[data-theme=dark] .hsbx>small{color:inherit}

/* ---- t522u-B header name cut at 390px ('ATC Electri…' / 'Rate & Quo…'): smaller + tighter on phones, may wrap to 2 lines, never '…' ---- */
@media(max-width:430px){
  html.appx .apt b{font-size:clamp(14px,4.1vw,16.5px);letter-spacing:-.25px;line-height:1.08;white-space:normal;overflow:visible;text-overflow:clip;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:normal;overflow-wrap:normal}
  html.appx .apt small{font-size:10.5px}
}
