/* Consumable & wastage pages. Uses the Shwapno tokens from styles.css and network.css. */
.cw-raw{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px;font-size:12px}
.cw-key{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.cw-key.c,.cw-split .c{background:var(--series-1)}
.cw-key.w,.cw-split .w{background:var(--series-3)}
.cw-split{display:flex;height:8px;border-radius:999px;overflow:hidden;background:var(--surface-3);gap:2px}
.cw-split span{display:block;min-width:2px}
.cw-donut{display:grid;grid-template-columns:130px minmax(0,1fr);gap:18px;align-items:center}
.cw-donut .donut{width:130px;height:130px}
.cw-donut .donut::after{width:86px;height:86px}
.cw-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.cw-legend strong{display:block;font-size:20px;font-weight:660}
.cw-legend span{font-size:12px;color:var(--ink-3)}
.cw-list{display:grid;gap:4px}
.cw-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px 10px;border-radius:var(--radius-sm);cursor:pointer}
.cw-row:hover{background:var(--surface-2)}
.cw-row:has(.cw-rank){grid-template-columns:28px minmax(0,1fr) auto}
.cw-row strong{display:block;font-size:12.5px;font-weight:620;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cw-row small,.cw-mat small{display:block;font-size:11.5px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cw-rank{font-size:12px;color:var(--ink-3);text-align:right}
.cw-amt{text-align:right}.cw-amt strong{font-size:13.5px}
.cw-h3{font-size:12.5px;color:var(--ink-2);margin-bottom:6px}
.cw-mat{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:center;padding:6px 2px}
.cw-mat strong{display:block;font-size:12.5px;font-weight:620;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cw-mat>span{font-size:12.5px;font-weight:650;text-align:right}
.cw-mat .bar{grid-column:1/-1;height:6px}
.cw-axis{font-size:10.5px;fill:var(--ink-3)}
.cw-method{padding:0}
.cw-method>summary{cursor:pointer;padding:14px 18px;font-weight:650;font-size:14px}
.cw-method dl.facts dt{font-weight:600;color:var(--ink)}
.cw-method dl.facts dd{color:var(--ink-2);max-width:80ch}
.cw-window{padding:10px 12px;border:1px solid var(--line-soft);border-radius:var(--radius-sm)}
.meter.cw-empty{background:repeating-linear-gradient(135deg,var(--idle-soft) 0 5px,transparent 5px 10px)}
tr[data-cwoutlet],tr[data-cwcrit]{cursor:pointer}
@media (max-width:640px){.cw-donut{grid-template-columns:1fr;justify-items:center}}

/* Availability: RHO wise matrix */
.av-rho table{font-size:12px}
.av-rho th,.av-rho td{padding:6px 8px;text-align:center}
.av-rho th:first-child,.av-rho td:first-child{text-align:left}
.av-rho thead th{white-space:nowrap}
.av-rho .av-grp{text-align:center;font-weight:700;letter-spacing:.04em}
.av-rho .av-sep{border-left:2px solid var(--line)}
.av-rho .av-g-core{background:color-mix(in srgb,var(--info) 10%,var(--surface))}
.av-rho .av-g-promo{background:color-mix(in srgb,var(--good) 10%,var(--surface))}
.av-rho .av-g-kvi{background:var(--surface-2)}
.av-rho .av-g-all{background:color-mix(in srgb,var(--series-1) 12%,var(--surface))}
.av-rho th.av-red{color:var(--bad)}
.av-rho td.av-red{color:var(--ink-3)}
.av-rho td.av-red.has{background:var(--bad);color:#fff;font-weight:700}
.av-rho tr[data-gpick]{cursor:pointer}
.av-rho tr.av-total td{font-weight:700;border-top:2px solid var(--line);background:var(--surface-2)}

/* Availability: criteria by New Division and CAT3 */
.av-crit .table-wrap{max-height:760px}
.av-crit td{padding:5px 10px}
.av-crit tr.av-div td{font-weight:700;background:var(--surface-2);border-top:1px solid var(--line)}
.av-crit td.av-band{padding-left:28px;color:var(--ink-2)}
.av-crit td.av-low{background:var(--bad-soft);color:var(--bad);font-weight:700}
.av-crit tr[data-avgrp]{cursor:pointer}
.av-crit tr[data-avgrp]:hover td,.av-crit td.av-click:hover{outline:1px solid var(--info);outline-offset:-1px}
.av-crit td.av-click{cursor:pointer}
.av-crit tr.av-gap td{border-top:14px solid var(--surface)}

/* Availability: criteria cards (SKU wise page) */
.av-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:12px}
.av-card{border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 14px;display:flex;flex-direction:column;gap:6px;background:var(--surface);min-width:0}
.av-card-head{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:1px}
.av-card-head:hover .av-card-name{color:var(--info)}
.av-card-head:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:4px}
.av-card-name{font-size:13px;font-weight:700}
.av-card-sub{font-size:11.5px;color:var(--ink-3)}
.av-card-val{font-size:30px;font-weight:700;letter-spacing:-.03em;line-height:1.1;margin-top:4px}
.av-card-note{font-size:11px;color:var(--ink-3);margin-top:-4px}
.av-card-val.b1{color:var(--good)}.av-card-val.b2{color:var(--info)}.av-card-val.b3{color:var(--warn)}.av-card-val.b4,.av-card-val.b5{color:var(--bad)}
.av-stack{display:flex;height:10px;border-radius:999px;overflow:hidden;gap:2px;background:var(--surface-3);margin:4px 0 2px}
.av-stack i,.av-bands i{display:block}
.b1{background:var(--good)}.b2{background:var(--info)}.b3{background:var(--warn)}.b4{background:color-mix(in srgb,var(--bad) 55%,var(--surface))}.b5{background:var(--bad)}
.av-card-val.b1,.av-card-val.b2,.av-card-val.b3,.av-card-val.b4,.av-card-val.b5{background:none}
.av-bands{list-style:none;margin:0;padding:0;display:grid;gap:1px}
.av-bands li{display:grid;grid-template-columns:9px 1fr auto;gap:8px;align-items:center;font-size:12px;padding:3px 4px;border-radius:4px}
.av-bands li[role=button]{cursor:pointer}
.av-bands li[role=button]:hover{background:var(--surface-2)}
.av-bands li i{width:9px;height:9px;border-radius:2px}
.av-bands li span{color:var(--ink-2)}
.av-bands li b{font-weight:650;font-variant-numeric:tabular-nums}
.av-bands li.zero b,.av-bands li.zero span{color:var(--ink-3)}

/* criteria cards: one wide card on a single-type page, division grid on the summary */
.av-cards.single{grid-template-columns:1fr}
.av-card.wide{display:grid;grid-template-columns:minmax(170px,220px) minmax(0,1fr);gap:8px 28px;align-items:center;padding:16px 18px}
.av-card.wide .av-card-val{font-size:38px}
.av-card.wide .av-stack{height:14px}
.av-card.wide .av-bands{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:6px}
.av-card.wide .av-bands li{grid-template-columns:9px 1fr;grid-template-rows:auto auto auto;padding:6px 8px;border:1px solid var(--line-soft)}
.av-card.wide .av-bands li b{grid-column:1/-1;font-size:18px}
.av-card.wide .av-bands li small{grid-column:1/-1;font-size:11px;color:var(--ink-3)}
.av-card-main,.av-card-dist{display:flex;flex-direction:column;gap:6px;min-width:0}
.av-cards.div{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.av-cards.div .av-card-val{font-size:24px}
@media (max-width:760px){.av-card.wide{grid-template-columns:1fr}.av-card.wide .av-bands{grid-template-columns:repeat(2,minmax(0,1fr))}}
.av-card-avg{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:6px;padding-top:8px;border-top:1px solid var(--line-soft);font-size:12px;color:var(--ink-2)}
.av-card-avg b{font-size:16px;font-weight:700}
.av-card-avg b.b1{color:var(--good)}.av-card-avg b.b2{color:var(--info)}.av-card-avg b.b3{color:var(--warn)}.av-card-avg b.b4,.av-card-avg b.b5{color:var(--bad)}
.av-card-avg b.b1,.av-card-avg b.b2,.av-card-avg b.b3,.av-card-avg b.b4,.av-card-avg b.b5{background:none}

/* KPI performance */
.k-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 14px;position:sticky;top:var(--k-top,57px);z-index:4;box-shadow:0 4px 10px -8px rgba(0,0,0,.25)}
.k-bar-l{font-size:13px;font-weight:650;color:var(--ink-2)}
.k-drill{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 14px;border:1px solid var(--info);border-radius:var(--radius-sm);background:color-mix(in srgb,var(--info) 8%,var(--surface));font-size:13px}
.k-drill-b{display:flex;gap:8px}
.k-mat,.k-lh{scroll-margin-top:calc(var(--k-top,57px) + 70px)}
.k-kpis{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))!important}
.k-kname{display:block;font-size:21px;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-t1{color:var(--good)}.k-t2{color:var(--info)}.k-t3{color:var(--warn)}.k-t4{color:color-mix(in srgb,var(--bad) 70%,var(--ink))}.k-t5{color:var(--bad)}
.k-pill{display:inline-block;padding:2px 8px;border-radius:999px;font-weight:650;font-size:12px;font-variant-numeric:tabular-nums;background:var(--surface-2)}
.k-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:stretch}
.k-two>.panel{display:flex;flex-direction:column;min-width:0}
.k-two>.panel>.panel-body{flex:1}
@media (max-width:1000px){.k-two{grid-template-columns:1fr}}
/* compact scorecard */
.k-sc-top{display:flex;align-items:center;gap:16px;margin-bottom:10px}
.k-sc-val{font-size:36px;font-weight:700;letter-spacing:-.03em;line-height:1}
.k-sc-val small{font-size:13px;color:var(--ink-3);font-weight:500;margin-left:4px;letter-spacing:0}
.k-sc-meta{display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--ink-2)}
.k-cats{display:grid;gap:7px;margin-bottom:10px}
.k-cat{display:grid;grid-template-columns:78px minmax(0,1fr) 78px;gap:10px;align-items:center;font-size:12px}
.k-cat b{font-weight:650;text-align:right;font-variant-numeric:tabular-nums}
.k-track{display:block;height:8px;border-radius:999px;background:var(--surface-3);overflow:hidden}
.k-track i{display:block;height:100%;border-radius:999px}
.k-bands{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.k-bands li{display:grid;grid-template-columns:8px minmax(0,1fr);gap:2px 6px;align-items:center;padding:5px 8px;border:1px solid var(--line-soft);border-radius:6px;font-size:11px;color:var(--ink-2);white-space:nowrap}
.k-bands li i{width:8px;height:8px;border-radius:2px}
.k-bands li b{grid-column:1/-1;font-size:17px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.k-bands li.zero b,.k-bands li.zero span{color:var(--ink-3)}
.k-bands li[role=button]{cursor:pointer}.k-bands li[role=button]:hover{background:var(--surface-2)}
/* KPI cards: four at a time */
.k-kcs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:124px;gap:10px;height:258px;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior:contain;padding-right:4px}
.k-kc{scroll-snap-align:start;border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 12px;display:flex;flex-direction:column;gap:5px;min-width:0;cursor:pointer;background:var(--surface)}
.k-kc:hover,.k-kc:focus-visible{border-color:var(--info);background:var(--surface-2)}
.k-kc-h b{display:block;font-size:12.5px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-kc-h span{display:block;font-size:11px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-kc-v{display:flex;align-items:baseline;gap:8px;min-width:0}
.k-kc-v strong{font-size:22px;font-weight:700;letter-spacing:-.02em}
.k-kc-v span{font-size:11px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-kc .k-track{height:6px}
.k-kc-f{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--ink-2);margin-top:auto;min-width:0}
.k-kc-f span{white-space:nowrap}.k-kc-f span+span{color:var(--ink-3);overflow:hidden;text-overflow:ellipsis}
.k-kcn{font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.k-arrow{min-width:34px;padding-left:8px;padding-right:8px}
@media (max-width:560px){.k-kcs{grid-template-columns:1fr}}
/* heat-matrix */
.k-mat table{font-size:12px}
.k-mat th,.k-mat td{padding:6px 7px;text-align:center;white-space:nowrap}
.k-mat th:first-child,.k-mat td:first-child{text-align:left}
.k-mh{cursor:pointer}.k-mh:hover{color:var(--info)}
.k-mh small{display:block;font-size:10px;color:var(--ink-3);font-weight:400}
.kc-g{background:color-mix(in srgb,var(--good) 18%,var(--surface));color:var(--good)}
.kc-a{background:color-mix(in srgb,var(--warn) 20%,var(--surface))}
.kc-r{background:color-mix(in srgb,var(--bad) 18%,var(--surface));color:var(--bad);font-weight:650}
.k-mat tr.k-ref td{font-weight:700;border-bottom:2px solid var(--line)}
.k-mat tr.k-ref td:not([class^=kc]){background:var(--surface-2)}
.k-name{cursor:pointer;font-weight:620}.k-name:hover{color:var(--info);text-decoration:underline}
tr.k-click{cursor:pointer}tr.k-click:hover td{outline:1px solid var(--info);outline-offset:-1px}
.k-mv{font-size:11px;margin-left:4px}
.k-spark polyline{fill:none;stroke:var(--good);stroke-width:2}
.k-dn .k-spark polyline{stroke:var(--bad)}
/* ranking table */
.k-rk{display:inline-grid;place-items:center;min-width:26px;height:26px;padding:0 6px;border-radius:999px;background:var(--surface-2);font-weight:650;font-size:12px}
.k-rk.top{background:color-mix(in srgb,var(--good) 18%,var(--surface));color:var(--good)}
.k-scc{display:inline-flex;flex-direction:column;align-items:flex-end;gap:4px}
.k-scc strong{font-size:14px}
.k-scc .k-track{width:96px;height:6px}
/* points lost view */
.k-facts{display:flex;gap:18px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-2);margin-bottom:10px}
.k-facts b{font-size:18px;font-weight:700;margin-left:4px;color:var(--ink)}
.k-facts b.down{color:var(--bad)}
.k-facts b.k-t1{color:var(--good)}.k-facts b.k-t2{color:var(--info)}.k-facts b.k-t3{color:var(--warn)}.k-facts b.k-t4,.k-facts b.k-t5{color:var(--bad)}
.k-lost{display:grid;gap:2px}
.k-lrow{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr) 52px;gap:12px;align-items:center;padding:5px 8px;border-radius:var(--radius-sm);cursor:pointer}
.k-lrow:hover{background:var(--surface-2)}
.k-lrow strong{display:block;font-size:12.5px;font-weight:620;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.k-lrow small{display:block;font-size:11px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.k-lrow b{text-align:right;font-size:13px;color:var(--bad);font-variant-numeric:tabular-nums}
.k-near-h{margin-top:12px;padding-top:10px;border-top:1px solid var(--line-soft);font-size:12.5px;font-weight:650;color:var(--ink-2)}
.k-near{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:2px}
.k-near li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:5px 8px;border-radius:6px;cursor:pointer}
.k-near li:hover{background:var(--surface-2)}
.k-near strong{display:block;font-size:12.5px;font-weight:620}
.k-near small{display:block;font-size:11px;color:var(--ink-3)}
.k-near b{font-size:13px;font-variant-numeric:tabular-nums}
.k-lc{display:inline-block;min-width:36px;padding:2px 6px;border-radius:4px;text-align:center;font-variant-numeric:tabular-nums}
tr.k-sel td{background:color-mix(in srgb,var(--info) 12%,var(--surface))!important}
@media (max-width:640px){.k-lrow{grid-template-columns:minmax(0,1fr) 52px}.k-lrow .k-track{grid-column:1/-1;grid-row:2}.k-bands{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* CW overview: shorter Rate trend and Target position */
.cw-short .panel-head{padding-top:11px;padding-bottom:11px}
.cw-short .panel-body{padding-top:10px;padding-bottom:10px}
.cw-short .chart-legend{margin-bottom:4px}
.cw-short .note{font-size:11.5px;padding:5px 10px;margin:6px 0 0;line-height:1.35}
.cw-short .cw-donut{grid-template-columns:104px minmax(0,1fr);gap:14px}
.cw-short .cw-donut .donut{width:104px;height:104px}
.cw-short .cw-donut .donut::after{width:70px;height:70px}
.cw-short .cw-legend strong{font-size:18px}

/* Loss-making outlets: primary reason of loss */
.lr-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:stretch}
.lr-pair>.panel{min-width:0}
@media (max-width:1000px){.lr-pair{grid-template-columns:1fr}}
.lr-table th,.lr-table td{white-space:nowrap}
.lr-table thead th{background:var(--surface-2)}
.lr-total td{font-weight:700;border-top:2px solid var(--line);background:var(--surface-2)}
.lr-total .age-drill-link{font-weight:700}
.lr-age th,.lr-age td,.lr-rt th,.lr-rt td{padding-top:7px;padding-bottom:7px}
.lr-bar{display:grid;grid-template-columns:minmax(40px,1fr) 38px;gap:8px;align-items:center}
.lr-bar i{display:block;height:8px;border-radius:999px;background:var(--bad);min-width:2px}
.lr-bar span{font-size:11.5px;color:var(--ink-2);text-align:right;font-variant-numeric:tabular-nums}
tr.lr-top td{background:var(--bad-soft)}
.kpi-click{cursor:pointer;transition:border-color .15s}
.kpi-click:hover,.kpi-click:focus-visible{border-color:var(--info)}
.lr-dtools{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:12px}

/* Panel description shown on hovering the title (hint-title + hint-text) */
.panel-head:has(.hint-title){position:relative}
.panel-head:has(.hint-title)>div:first-child{flex:1 1 auto;min-width:0}
.panel-head:has(.hint-title)>.panel-tools{margin-left:auto;justify-content:flex-end}
.hint-title{cursor:help;display:inline-flex;align-items:center;gap:6px;outline:none}
.hint-i{font-size:13px;color:var(--ink-3);font-weight:400}
.hint-title:hover .hint-i,.hint-title:focus .hint-i{color:var(--info)}
.panel-head p.hint-text{display:none;position:absolute;left:18px;top:calc(100% - 6px);z-index:6;max-width:min(640px,calc(100% - 36px));margin:0;padding:10px 12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:0 8px 24px -10px rgba(0,0,0,.35);color:var(--ink-2);font-size:12px;line-height:1.45}
.hint-title:hover+p.hint-text,.hint-title:focus+p.hint-text{display:block}
/* Loss by regional leader (half width) beside age + primary reason */
.lr-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:stretch}
.lr-stack{display:flex;flex-direction:column;gap:16px;min-width:0}
.lr-row>#t-loss-grp{contain:size;display:flex;flex-direction:column;min-width:0}
.lr-row>#t-loss-grp>.table-wrap{flex:1 1 0;min-height:0;max-height:none;overflow:auto}
@media (max-width:1000px){.lr-row{grid-template-columns:1fr}.lr-row>#t-loss-grp{contain:none}.lr-row>#t-loss-grp>.table-wrap{flex:none;max-height:560px}}

/* Audit fixes */
/* KPI toolbar stays put on phones so it does not cover a quarter of the screen */
@media (max-width:760px){.k-bar{position:static;box-shadow:none}}
/* Dark theme: readable green in the KPI heat-matrix */
:root:not([data-theme="light"]) .kc-g{background:color-mix(in srgb,var(--good) 28%,var(--surface));color:#8fe3c8}
:root:not([data-theme="light"]) .kc-r{color:#ff9b73}
/* Loss by regional leader at half width: compact so every column fits */
.lr-row>#t-loss-grp table{font-size:12px}
.lr-row>#t-loss-grp th,.lr-row>#t-loss-grp td{padding-left:7px;padding-right:7px}
.lr-row>#t-loss-grp .cell-secondary{font-size:11px}
/* Tables scrolled into view stop below the sticky header, so their title stays visible */
section[id^="t-"]{scroll-margin-top:calc(var(--k-top,57px) + 12px)}
/* Availability: stale-file warning sits beside the Scope title */
.av-stale{font-size:12.5px;font-weight:500;color:var(--warn);margin-left:6px}
