/* BayanGO Tindahan analytics — data-dense report layout inspired by retail POS dashboards. */
.analytics-page{--analytics-blue:#0c8fc7;--analytics-ink:#27333f;--analytics-muted:#6f7b87;--analytics-border:#e1e7ec;--analytics-page:#f2f5f9;--analytics-green:#48bd91;--analytics-cost:#d7e0e9;--analytics-debt:#ef9f51;color:var(--analytics-ink)}
body[data-section="reports"] .container{max-width:none;background:var(--analytics-page)}
.analytics-page-tools{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:18px}
.analytics-page-tools h2{margin:3px 0 4px;font-size:18px;font-weight:700;letter-spacing:-.015em}
.analytics-page-tools>div>small{color:var(--analytics-muted);font-size:11px}
.analytics-kicker{display:block;color:var(--analytics-blue);font-size:9px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}
.analytics-filter-controls{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
.analytics-filter-controls .input{width:auto;min-width:132px;min-height:38px;font-size:11px}
.analytics-filter-controls input[type="date"]{min-width:142px}
.analytics-filter-controls .btn{min-height:38px}
.analytics-date-separator{color:#81909d;font-size:10px}
.analytics-section-heading{margin:24px 0 11px;font-size:15px;font-weight:700}

.analytics-kpi-grid,.analytics-debt-grid{display:grid;gap:12px}
.analytics-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.analytics-debt-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.analytics-kpi-card,.analytics-debt-card{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;align-items:center;min-width:0;min-height:88px;padding:15px 16px;border:1px solid var(--analytics-border);border-radius:10px;background:#fff;box-shadow:0 2px 5px rgba(31,47,61,.07)}
.analytics-kpi-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:9px}
.analytics-kpi-icon .icon{width:22px;height:22px}
.analytics-kpi-card small,.analytics-kpi-card strong,.analytics-kpi-card em,.analytics-debt-card small,.analytics-debt-card strong,.analytics-debt-card em{display:block;min-width:0}
.analytics-kpi-card small,.analytics-debt-card small{overflow:hidden;color:#66727e;font-size:10.5px;font-style:normal;font-weight:500;text-overflow:ellipsis;white-space:nowrap}
.analytics-kpi-card strong,.analytics-debt-card strong{overflow:hidden;margin-top:4px;color:#202a34;font-size:20px;font-weight:750;letter-spacing:-.025em;text-overflow:ellipsis;white-space:nowrap}
.analytics-kpi-card em,.analytics-debt-card em{overflow:hidden;margin-top:3px;color:#8a959e;font-size:8.5px;font-style:normal;text-overflow:ellipsis;white-space:nowrap}
.analytics-kpi-card[data-tone="blue"] .analytics-kpi-icon{background:#e7f1ff;color:#3177d7}
.analytics-kpi-card[data-tone="green"] .analytics-kpi-icon,.analytics-debt-card[data-tone="green"] .analytics-kpi-icon{background:#ddf8ec;color:#129d62}
.analytics-kpi-card[data-tone="purple"] .analytics-kpi-icon{background:#f1e7ff;color:#9348d9}
.analytics-kpi-card[data-tone="orange"] .analytics-kpi-icon,.analytics-debt-card[data-tone="orange"] .analytics-kpi-icon{background:#fff0dc;color:#df7a19}
.analytics-debt-card[data-tone="red"] .analytics-kpi-icon{background:#ffe7e9;color:#d93945}

.analytics-panel{min-width:0;padding:18px 20px;border:1px solid var(--analytics-border);border-radius:10px;background:#fff;box-shadow:0 2px 5px rgba(31,47,61,.07)}
.analytics-trend-panel{margin-top:24px;padding:0;overflow:hidden}
.analytics-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:17px}
.analytics-trend-panel>.analytics-panel-head{margin:0;padding:15px 20px;border-bottom:1px solid #e7edf2}
.analytics-panel-head h3{margin:0;color:#25313d;font-size:15px;font-weight:700}
.analytics-panel-head h3 small{color:#788591;font-size:10px;font-weight:500}
.analytics-chart-controls{display:flex;align-items:center;gap:9px}
.analytics-segmented{display:flex;gap:2px;padding:3px;border:1px solid #e1e7ec;border-radius:8px;background:#f5f7f9}
.analytics-segmented button{min-height:27px;border:0;border-radius:6px;background:transparent;padding:5px 10px;color:#697581;font-size:9.5px;font-weight:650;cursor:pointer}
.analytics-segmented button.active{background:var(--analytics-blue);color:#fff;box-shadow:0 1px 3px rgba(12,143,199,.25)}

.analytics-chart-legend{display:flex;justify-content:flex-end;gap:14px;padding:12px 20px 0;color:#74818d;font-size:9px}
.analytics-chart-legend span{display:inline-flex;align-items:center;gap:5px}
.analytics-chart-legend i{width:8px;height:8px;border-radius:2px}
.analytics-chart-legend .legend-cost{background:var(--analytics-cost)}
.analytics-chart-legend .legend-profit{background:var(--analytics-green)}
.analytics-chart-legend .legend-debt{background:var(--analytics-debt)}
.analytics-chart-scroll{overflow-x:auto;padding:12px 20px 0;scrollbar-width:thin;overscroll-behavior-inline:contain}
.analytics-chart-bars{width:100%;height:235px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(30px,1fr);align-items:end;gap:10px;min-width:720px;padding:10px 0 0;border-bottom:1px solid #e7edf2;background:repeating-linear-gradient(to bottom,transparent 0,transparent 53px,#f0f3f6 54px)}
.analytics-chart-column{height:100%;min-width:0;display:grid;grid-template-rows:minmax(0,1fr) 29px;align-items:end;gap:7px;border:0;background:transparent;padding:0;color:#7a8793;cursor:pointer}
.analytics-chart-column:hover,.analytics-chart-column.selected{color:#0787ba}
.analytics-chart-stack{width:min(40px,75%);height:100%;display:flex;flex-direction:column-reverse;align-self:end;justify-self:center;overflow:hidden;border-radius:3px 3px 0 0;transition:filter .16s ease}
.analytics-chart-column:hover .analytics-chart-stack{filter:saturate(1.15)}
.analytics-chart-stack i{display:block;min-height:0;flex:0 0 auto}
.analytics-chart-stack .cost{background:var(--analytics-cost)}
.analytics-chart-stack .profit{background:var(--analytics-green)}
.analytics-chart-stack .debt{background:var(--analytics-debt)}
.analytics-chart-column.selected .analytics-chart-stack{box-shadow:0 0 0 2px #fff,0 0 0 4px rgba(12,143,199,.48)}
.analytics-chart-column small{width:100%;overflow:hidden;font-size:8px;font-weight:500;line-height:1.1;text-overflow:ellipsis;white-space:nowrap}
.analytics-selected-period{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:18px 20px 20px;padding:14px 15px;border:1px solid #edf1f4;border-radius:8px;background:#fafbfd}
.analytics-selected-period>div>span,.analytics-selected-period>div>b{display:block}
.analytics-selected-period>div>span{color:#7b8792;font-size:8px;font-weight:650;letter-spacing:.08em;text-transform:uppercase}
.analytics-selected-period>div>b{margin-top:5px;font-size:13px}
.analytics-selected-period dl{display:grid;grid-template-columns:repeat(4,minmax(76px,1fr));gap:22px;margin:0}
.analytics-selected-period dl div{text-align:right}
.analytics-selected-period dt{color:#788590;font-size:8px;font-weight:650;text-transform:uppercase}
.analytics-selected-period dd{margin:4px 0 0;font-size:14px;font-weight:750}
.analytics-selected-period dl div:nth-child(2) dd{color:#168e67}
.analytics-selected-period dl div:nth-child(4) dd{color:#d36e17}
.analytics-chart-empty{min-height:310px;display:grid;place-content:center;gap:5px;padding:24px;text-align:center;color:#7a8792}
.analytics-chart-empty b{color:#34414d;font-size:13px}.analytics-chart-empty span{font-size:10px}

.analytics-lower-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.analytics-hour-groups{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.analytics-hour-caption{display:block;margin-bottom:8px;color:#8a96a1;font-size:8px;font-weight:650;letter-spacing:.06em;text-align:center;text-transform:uppercase}
.analytics-hour-bars{height:106px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:end;gap:5px;border-bottom:1px solid #e8edf2;background:linear-gradient(to bottom,transparent calc(50% - .5px),#f1f4f6 50%,transparent calc(50% + .5px))}
.analytics-hour-column{height:100%;display:grid;grid-template-rows:minmax(0,1fr) 18px;align-items:end;gap:4px}
.analytics-hour-column i{width:72%;min-height:2px;justify-self:center;border-radius:2px 2px 0 0;background:#cfe1f7}
.analytics-hour-column.active i{background:#12a8dd}
.analytics-hour-column small{color:#8a96a2;font-size:7px;text-align:center}
.analytics-busiest-summary{display:grid;grid-template-columns:1fr auto;gap:3px 14px;align-items:center;margin-top:15px;padding:11px 13px;border-radius:8px;background:#f8fafc;text-align:center}
.analytics-busiest-summary span{grid-column:1/-1;color:#6d7984;font-size:9px;font-weight:600}
.analytics-busiest-summary b{justify-self:end;font-size:18px}.analytics-busiest-summary small{justify-self:start;color:#77838e;font-size:9px}
.analytics-compact-empty{min-height:184px;display:grid;place-content:center;gap:5px;text-align:center;color:#7a8792}
.analytics-compact-empty b{color:#34414d;font-size:13px}.analytics-compact-empty span{font-size:10px}

.analytics-top-products{display:grid;gap:0;margin:0;padding:0;list-style:none}
.analytics-top-products li{min-width:0;display:grid;grid-template-columns:22px 36px minmax(0,1fr) auto;gap:9px;align-items:center;min-height:47px;padding:5px 0;border-bottom:1px solid #eef2f5}
.analytics-top-products li:last-child{border-bottom:0}
.analytics-product-rank{color:#98a3ad;font-size:11px;font-weight:700;text-align:center}
.analytics-product-photo{width:36px;height:36px;display:grid;place-items:center;overflow:hidden;border-radius:7px;background:#edf4f7;color:#1486b3;font-size:13px;font-weight:750}
.analytics-product-photo img{width:100%;height:100%;object-fit:cover}
.analytics-product-copy{min-width:0}.analytics-product-copy b,.analytics-product-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.analytics-product-copy b{font-size:11.5px;font-weight:650}.analytics-product-copy small{margin-top:2px;color:#7d8994;font-size:8.5px}
.analytics-top-products>li>strong{font-size:10.5px;font-weight:700;white-space:nowrap}

.analytics-breakdown-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-top:16px}
.analytics-breakdown-grid .report-list{gap:11px}
.analytics-breakdown-grid .report-bar{grid-template-columns:minmax(74px,1fr) minmax(72px,1.25fr) auto;gap:9px;font-size:9px}
.analytics-breakdown-grid .report-bar>b{min-width:60px;font-size:9px}
.analytics-breakdown-grid .report-bar-track{height:6px}
.analytics-value-summary dl{display:grid;gap:0;margin:0}
.analytics-value-summary dl div{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:35px;border-bottom:1px solid #eef2f5}
.analytics-value-summary dl div:last-child{border-bottom:0}.analytics-value-summary dt{color:#6f7c87;font-size:10px}.analytics-value-summary dd{margin:0;font-size:11px;font-weight:700}

@media(max-width:1150px){
  .analytics-page-tools{align-items:flex-start;flex-direction:column}.analytics-filter-controls{justify-content:flex-start}
  .analytics-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .analytics-breakdown-grid{grid-template-columns:1fr 1fr}.analytics-breakdown-grid .analytics-value-summary{grid-column:1/-1}
}
@media(max-width:900px){
  .analytics-debt-grid{grid-template-columns:1fr}.analytics-debt-card{min-height:78px}
  .analytics-panel-head{align-items:flex-start;flex-direction:column}.analytics-chart-controls{width:100%;justify-content:space-between}
  .analytics-lower-grid{grid-template-columns:1fr}.analytics-selected-period{align-items:flex-start;flex-direction:column}.analytics-selected-period dl{width:100%}.analytics-selected-period dl div{text-align:left}
}
@media(max-width:640px){
  .analytics-page-tools{margin-bottom:14px}.analytics-page-tools h2{font-size:17px}
  .analytics-filter-controls{display:grid;grid-template-columns:1fr 1fr;width:100%}.analytics-filter-controls .input{width:100%;min-width:0}.analytics-filter-controls #reportRange,.analytics-filter-controls .analytics-export{grid-column:1/-1;width:100%}.analytics-date-separator{display:none}
  .analytics-kpi-grid{gap:8px}.analytics-kpi-card{grid-template-columns:38px minmax(0,1fr);gap:9px;min-height:83px;padding:11px}.analytics-kpi-icon{width:38px;height:38px}.analytics-kpi-icon .icon{width:18px;height:18px}.analytics-kpi-card strong,.analytics-debt-card strong{font-size:17px}.analytics-kpi-card em{display:none}
  .analytics-section-heading{margin-top:19px}.analytics-debt-grid{gap:8px}.analytics-debt-card{grid-template-columns:42px minmax(0,1fr);gap:10px;padding:11px 12px}
  .analytics-panel{padding:14px}.analytics-trend-panel{padding:0}.analytics-trend-panel>.analytics-panel-head{padding:13px 14px}.analytics-chart-controls{align-items:stretch;flex-direction:column}.analytics-segmented{width:100%}.analytics-segmented button{flex:1}
  .analytics-chart-legend{justify-content:flex-start;padding:11px 14px 0}.analytics-chart-scroll{padding-left:14px;padding-right:14px}.analytics-chart-bars{height:210px;min-width:690px;gap:8px}.analytics-selected-period{margin:14px;padding:12px}.analytics-selected-period dl{grid-template-columns:1fr 1fr;gap:13px}.analytics-selected-period dd{font-size:13px}
  .analytics-hour-groups{grid-template-columns:1fr;gap:14px}.analytics-hour-bars{height:96px}.analytics-breakdown-grid{grid-template-columns:1fr}.analytics-breakdown-grid .analytics-value-summary{grid-column:auto}
}
@media(max-width:380px){.analytics-kpi-grid{grid-template-columns:1fr}.analytics-kpi-card em{display:block}}
