/* ============================================
   Dashboard Page Styles
   Extracted from dashboard.html inline styles
   ============================================ */

/* KPI Grid & Cards — now in styles.css (global) */

/* === Dashboard Grids === */
.dashboard-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
  align-items: start;
}
.dashboard-grid-equal {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
  align-items: start;
}
.dashboard-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 16px;
  align-items: start;
}

/* === Progress Bars === */
.progress-bar {
  height: 8px;
  background: #e2e8f0;
  border-radius: 4px;
  overflow: hidden;
}
.progress-bar .fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.3s ease;
}

/* === Promo Row === */
.promo-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px solid var(--border-color);
}
.promo-row:last-child { border-bottom: none; }
.promo-name { font-weight: 500; color: var(--text-primary); }
.promo-meta { font-size: 0.8125rem; color: var(--text-secondary); }

/* === Low Stock Items === */
.low-stock-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid var(--border-color);
}
.low-stock-item:last-child { border-bottom: none; }
.low-stock-pct { font-weight: 700; font-size: 0.875rem; }

/* === Activity Items === */
.activity-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border-color);
}
.activity-item:last-child { border-bottom: none; }
.activity-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-top: 6px;
  flex-shrink: 0;
}
.activity-text { font-size: 0.8125rem; color: var(--text-primary); }
.activity-time { font-size: 0.75rem; color: var(--text-muted); margin-top: 2px; }

/* KPI helpers — now in styles.css (global) */

/* === Stock Breakdown Row === */
.stock-breakdown {
  display: flex;
  gap: 16px;
  margin-top: 8px;
}
.stock-breakdown__item {
  font-size: 0.8125rem;
}
.stock-breakdown__count {
  font-weight: 600;
}
.stock-breakdown__count--available { color: var(--primary); }
.stock-breakdown__count--reserved { color: var(--success); }

/* === Section Heading Row === */
.section-heading {
  margin-bottom: 4px;
}
.section-heading__label {
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* === Topbar Store Link Pill === */
.store-link-pill {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  margin-right: 8px;
}
.store-link-pill__url {
  font-size: 0.75rem;
  color: #0364B1;
  text-decoration: none;
  font-weight: 500;
  white-space: nowrap;
}
.store-link-pill__copy {
  padding: 2px 6px;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 5px;
  cursor: pointer;
  font-size: 0.6875rem;
  color: #475569;
  white-space: nowrap;
}

/* === Export PDF Button === */
.btn--export-pdf {
  padding: 6px 10px;
}
.btn--export-pdf img {
  height: 26px;
}

/* === Cursor Pointer Utility === */
.cursor-pointer { cursor: pointer; }

/* === Sidebar Logo Sizes === */
.sidebar-logo .logo-full--dashboard {
  height: 38px;
  margin: 0 auto;
}
.sidebar-logo .logo-mark--dashboard {
  height: 28px;
  margin: 0 auto;
}

/* === Inline Icon Alignment === */
.icon--inline {
  vertical-align: middle;
  margin-right: 4px;
}

/* === Footer Text Styles === */
.dashboard-footer-vs {
  color: var(--text-primary);
}

.dashboard-footer-muted {
  color: var(--text-muted);
}

/* === Inquiry Pipeline === */
.pipeline-stage {
  margin-bottom: 12px;
}
.pipeline-stage:last-child {
  margin-bottom: 0;
}
.pipeline-count--danger { color: var(--danger); }
.pipeline-count--warning { color: var(--warning); }
.pipeline-count--primary { color: var(--primary); }
.pipeline-count--muted { color: var(--text-muted); }

/* === Pipeline Summary === */
.pipeline-summary {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--border-color);
}

/* === Card Body No Padding === */
.card-body--flush {
  padding: 0;
}

/* === Dashboard Grid: 35/65 split === */
.dashboard-grid-35-65 {
  display: grid;
  grid-template-columns: 35fr 65fr;
  gap: 16px;
  margin-bottom: 16px;
  align-items: start;
}

/* === Dashboard Equal Grid Negative Top === */
.dashboard-grid-equal--tight {
  margin-top: -8px;
}

/* === Idle Days === */
.idle-days--danger {
  color: var(--danger);
  font-weight: 600;
}
.idle-days--warning {
  color: var(--warning);
  font-weight: 600;
}

/* === Revenue Progress === */
.revenue-row {
  margin-bottom: 10px;
}
.revenue-row:last-child {
  margin-bottom: 0;
}

/* === Revenue Summary === */
.revenue-summary {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--border-color);
}

/* === Conversion Funnel === */
.funnel-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid var(--border-color);
}
.funnel-row:last-child {
  border-bottom: none;
}
.funnel-value {
  text-align: right;
}
.funnel-value__number {
  font-weight: 700;
}
.funnel-value__number--primary { color: var(--primary); }
.funnel-value__number--success { color: var(--success); }
.funnel-value__number--warning { color: var(--warning); }
.funnel-pct--primary { color: var(--primary); }
.funnel-pct--success { color: var(--success); }
.funnel-pct--warning { color: var(--warning); }

/* === Powered By Footer === */
.powered-by {
  text-align: right;
  padding: 20px 0 8px;
  font-size: 10px;
  color: #b0b0b0;
}
.powered-by a {
  color: #b0b0b0;
  text-decoration: none;
}

/* === Responsive === */
@media (max-width: 1100px) {
  .kpi-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .dashboard-grid-3 { grid-template-columns: repeat(2, 1fr) !important; }
  .dashboard-grid-35-65 { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  html { font-size: 13px; }
  .kpi-card .kpi-value { font-size: 1.5rem; }
  .kpi-card .kpi-icon { width: 44px; height: 44px; }
  .kpi-card .kpi-icon svg { width: 22px; height: 22px; }
  .kpi-card { padding: 14px; }
  .content { padding: 16px; }
  .card-header h3 { font-size: 1rem; }
  h2 { font-size: 1.25rem; }
}
@media (max-width: 600px) {
  html { font-size: 12px; }
  .kpi-grid { grid-template-columns: 1fr !important; }
  .dashboard-grid-3 { grid-template-columns: 1fr !important; }
  .kpi-card .kpi-value { font-size: 1.35rem; }
  .kpi-card .kpi-icon { width: 38px; height: 38px; }
  .kpi-card .kpi-icon svg { width: 20px; height: 20px; }
  .content { padding: 12px; }
}