/* =============================================
   MAHI ERP — DASHBOARD CSS v9
   Stage boxes: 6-per-row, dark colors, big labels, small counts
   NO default table — only show on click
   ============================================= */

/* ── STAGE FILTER SECTION ── */
.stage-filter-section {
  background: #eaedf0;
  border-bottom: 1px solid #aab7c4;
  padding: 8px 10px 6px;
}
.stage-filter-label {
  font-size: 11px;
  font-weight: 700;
  color: #1a3a6e;
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-bottom: 7px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Stage grid — 6 per row, fills width */
.stage-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-auto-rows: 1fr;
  gap: 4px;
  height: calc(100vh - 125px);
  background: transparent;
  border: none;
  padding: 0;
}

/* Each stage card — dark, bold, beautiful */
.sg-card {
  border: 2px solid transparent;
  padding: 40px 40px;
  cursor: pointer;
  transition: all .15s;
  text-align: center;
  border-radius: 3px;
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.sg-card:hover  { transform:translateY(-2px); box-shadow:0 4px 10px rgba(0,0,0,.25); filter:brightness(1.08); }
.sg-card.sg-on  { border-color: rgba(255,255,255,.7) !important; box-shadow:0 0 0 2px rgba(255,255,255,.4); transform:translateY(-1px); }

/* Label — BIG, BOLD */
.sg-card .sg-lbl {
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .3px;
  text-transform: uppercase;
  color: rgba(255,255,255,.95);
  margin-bottom: 3px;
  font-family: 'Segoe UI', Tahoma, Arial, sans-serif;
  line-height: 1.2;
}

/* Count — small, normal weight */
.sg-card .sg-num {
  font-size: 13px;
  font-weight: 400;
  color: rgba(255,255,255,.85);
  line-height: 1;
  font-family: 'Segoe UI', Tahoma, Arial, sans-serif;
}

/* Remove old icon slot */
.sg-card .sg-ic { display: none; }

/* Dark color palette for each stage */
.sg-all       { background: linear-gradient(135deg, #2a5296, #1a3a6e); }
.sg-prs       { background: linear-gradient(135deg, #4a7a9b, #2a5a80); }
.sg-rvp       { background: linear-gradient(135deg, #8a4a9b, #6a2a80); }
.sg-booking   { background: linear-gradient(135deg, #9b7a10, #7a5a00); }
.sg-manifest  { background: linear-gradient(135deg, #0a8a9b, #06627a); }
.sg-mmaster   { background: linear-gradient(135deg, #b85a10, #903c00); }
.sg-intransit { background: linear-gradient(135deg, #1a6aaa, #0e4a80); }
.sg-ofd       { background: linear-gradient(135deg, #8a7a00, #6a5c00); }
.sg-delivered { background: linear-gradient(135deg, #1a7a3c, #0e5828); }
.sg-cds       { background: linear-gradient(135deg, #2a6a9b, #1a4a7a); }
.sg-rto_it    { background: linear-gradient(135deg, #9b2a2a, #7a1414); }
.sg-rto_del   { background: linear-gradient(135deg, #2a7a5a, #185a40); }
.sg-app_req   { background: linear-gradient(135deg, #1d4ed8, #1e3a8a); }
.sg-incoming  { background: linear-gradient(135deg, #b06010, #8a4000); }

/* ── KPI ROW ── */
.dash-kpis {
  display: flex;
  width: 100%;
  background: white;
  border: 1px solid #aab7c4;
  border-top: none;
}
.kpi {
  flex: 1;
  padding: 6px 12px;
  border-right: 1px solid #aab7c4;
  animation: fu .3s ease forwards;
  opacity: 0;
  text-align: center;
}
.kpi:last-child { border-right: none; }
.kpi:nth-child(1){animation-delay:.05s;}
.kpi:nth-child(2){animation-delay:.1s;}
.kpi:nth-child(3){animation-delay:.15s;}
.kpi-ic  { display: none; }
.kpi-val { font-size: 22px;font-weight:700;line-height:1;color:#1a3a6e; }
.kpi-lbl { font-size:9px;color:#5a7090;margin-top:2px;font-weight:600;text-transform:uppercase;letter-spacing:.5px; }
.kpi-bar { display: none; }

/* ── BRANCH OVERVIEW ── */
.bo-section { padding: 8px 10px; }

.bo-grid-header {
  display: grid;
  grid-template-columns: 65px 140px 55px 1fr 130px;
  background: linear-gradient(180deg, #d8e8f4, #b8ccde);
  border: 1px solid #aab7c4;
  border-bottom: 2px solid #8ab0d0;
}
.bo-grid-header > span {
  padding: 3px 10px;
  font-size: 9px;
  font-weight: 700;
  color: #1a3a6e;
  text-transform: uppercase;
  letter-spacing: .3px;
  border-right: 1px solid #aab7c4;
}
.bo-grid-header > span:last-child { border-right: none; }

.bo-grid {
  width: 100%;
  border: 1px solid #aab7c4;
  border-top: none;
  background: white;
}
.bo-card {
  display: grid;
  grid-template-columns: 65px 140px 55px 1fr 130px;
  align-items: center;
  border-bottom: 1px solid #dde5ed;
  cursor: pointer;
  transition: background .08s;
}
.bo-card:last-child { border-bottom: none; }
.bo-card:hover { background: #d8e8f8; }
.bo-card::after { display: none; }
.bo-card > div {
  padding: 4px 10px;
  border-right: 1px solid #dde5ed;
  font-size: 11px;
  min-height: 26px;
  display: flex;
  align-items: center;
}
.bo-card > div:last-child { border-right: none; }

.bo-branch { font-size:13px !important;font-weight:700;color:#1a3a6e; }
.bo-city   { font-size:10px !important;color:#5a7090; }
.bo-total  { font-size:16px !important;font-weight:700;color:#1f2d3d;justify-content:flex-end; }
.bo-stats  { gap:10px;flex-wrap:wrap; }
.bo-stat   { display:flex;gap:3px;font-size:10px; }
.bo-stat-lbl { color:#5a7090; }
.bo-stat-val { font-weight:700;color:#1f2d3d; }
.bo-excel-btn { padding:2px 8px;border-radius:1px;border:1px solid #8ec89a;background:#e2f4e8;cursor:pointer;font-size:10px;font-weight:600;color:#1a5a2e;font-family:'Segoe UI',Tahoma,Arial,sans-serif;text-transform:uppercase; }
.bo-excel-btn:hover { background:#c8e8d0; }

/* Section header */
.section-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:5px; }
.section-title  { font-size:11px;font-weight:700;color:#1a3a6e;text-transform:uppercase;letter-spacing:.3px; }
.erp-section-hdr { background:linear-gradient(180deg,#4878b8,#2a5296);color:white;font-size:11px;font-weight:700;padding:4px 10px;border:1px solid #1a3a6e;margin:7px 0 4px;text-transform:uppercase;letter-spacing:.3px; }

/* ═══ HIDE BRANCH OVERVIEW completely ═══ */
.bo-section,
.bo-grid,
.bo-grid-header,
.bo-card { display: none !important; }
