/* Cafe operations dashboard. Global (not scoped) because the classes are shared across the page and
   its child components (DashboardChartCard, DashboardRangeToggle, InsightList). Uses the app's design
   tokens so it tracks the active brand palette. */

/* ── Header ─────────────────────────────────────────────────────────────────── */
.dash-head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; }
.dash-head__actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.dash-btn {
    display:inline-flex; align-items:center; gap:6px; padding:8px 14px;
    border:1px solid var(--border-subtle); border-radius:var(--radius-md); background:#fff;
    font-size:13px; font-weight:500; color:var(--fg-1); cursor:pointer;
}
.dash-btn:hover { background:var(--primary-50); border-color:var(--primary-200); }
.dash-updated { font-size:12px; color:var(--fg-3); }

/* ── Banners ────────────────────────────────────────────────────────────────── */
.dash-clamp, .dash-note {
    display:flex; align-items:center; gap:8px; padding:10px 14px;
    border-radius:var(--radius-md); font-size:13px; margin-bottom:16px;
}
.dash-clamp { background:var(--warning-50, #fffbeb); color:var(--warning-700, #b45309); border:1px solid var(--warning-200, #fde68a); }
.dash-note  { background:var(--primary-50); color:var(--fg-2, #374151); border:1px solid var(--border-subtle); }
.dash-clamp a, .dash-note a { margin-left:auto; font-weight:600; color:var(--primary-600); text-decoration:none; }

/* ── KPI strips ─────────────────────────────────────────────────────────────── */
.dash-kpis {
    display:grid; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr));
    gap:14px; margin-bottom:16px;
}
.dash-kpis--sub { margin-bottom:24px; }

/* ── Grids ──────────────────────────────────────────────────────────────────── */
.dash-grid { display:grid; gap:16px; margin-bottom:16px; }
.dash-grid--1 { grid-template-columns:1fr; }
.dash-grid--2 { grid-template-columns:1fr 1fr; }
.dash-grid--3 { grid-template-columns:repeat(3, 1fr); }
@media (max-width:1000px) { .dash-grid--2, .dash-grid--3 { grid-template-columns:1fr; } }
@media (max-width:720px)  { .dash-head { flex-direction:column; } .dash-head__actions { width:100%; } }

/* ── Locked / empty chart states ────────────────────────────────────────────── */
.dash-locked { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; text-align:center; padding:20px; }
.dash-locked__badge { width:44px; height:44px; border-radius:12px; background:var(--warning-50, #fffbeb); display:grid; place-items:center; color:var(--warning-500, #f59e0b); }
.dash-locked__title { font-size:13px; color:var(--fg-3); max-width:280px; line-height:1.5; }
.dash-locked__cta { display:inline-flex; align-items:center; gap:4px; font-size:13px; font-weight:600; color:var(--primary-600); text-decoration:none; }
.dash-chart-empty { display:grid; place-items:center; }
.dash-locked-foot { margin-top:12px; padding-top:12px; border-top:1px solid var(--border-subtle); font-size:12px; color:var(--fg-3); }
.dash-locked-foot a { color:var(--primary-600); font-weight:600; text-decoration:none; }

/* ── Insights panel ─────────────────────────────────────────────────────────── */
.dash-insights { display:flex; flex-direction:column; }
.dash-insight { display:flex; align-items:center; gap:12px; padding:11px 8px; border-radius:var(--radius-md); text-decoration:none; color:inherit; border-bottom:1px solid var(--border-subtle); }
.dash-insight:last-child { border-bottom:none; }
.dash-insight:hover { background:var(--primary-50); }
.dash-insight__dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; background:var(--fg-3); }
.dash-insight--critical .dash-insight__dot { background:var(--danger-500, #ef4444); }
.dash-insight--warning  .dash-insight__dot { background:var(--warning-500, #f59e0b); }
.dash-insight--info     .dash-insight__dot { background:var(--info-500, #3b82f6); }
.dash-insight--success  .dash-insight__dot { background:var(--success-500, #22c55e); }
.dash-insight__icon { color:var(--fg-3); display:flex; flex-shrink:0; }
.dash-insight__body { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.dash-insight__title { font-size:13px; font-weight:600; color:var(--fg-1); }
.dash-insight__detail { font-size:12px; color:var(--fg-3); line-height:1.4; }
.dash-insight__metric { font-size:13px; font-weight:700; white-space:nowrap; margin-left:auto; color:var(--fg-2, #374151); }
.dash-insight--critical .dash-insight__metric { color:var(--danger-600, #dc2626); }
.dash-insight--warning  .dash-insight__metric { color:var(--warning-600, #d97706); }
.dash-insight--success  .dash-insight__metric { color:var(--success-600, #16a34a); }
.dash-insights-empty { display:flex; flex-direction:column; align-items:center; gap:8px; padding:36px 16px; color:var(--fg-3); font-size:13px; text-align:center; }
.dash-insights-empty :global(svg) { color:var(--success-500, #22c55e); }

/* ── Range toggle ───────────────────────────────────────────────────────────── */
.dash-range { display:inline-flex; background:var(--primary-50); border:1px solid var(--border-subtle); border-radius:var(--radius-md); padding:2px; gap:2px; }
.dash-range__btn { padding:6px 12px; border:none; background:transparent; font-size:13px; color:var(--fg-3); cursor:pointer; border-radius:6px; white-space:nowrap; }
.dash-range__btn:hover { color:var(--fg-1); }
.dash-range__btn.is-active { background:#fff; color:var(--fg-1); font-weight:600; box-shadow:0 1px 2px rgba(16,24,40,.08); }

/* ── Tables ─────────────────────────────────────────────────────────────────── */
.dash-table th.num, .dash-table td.num { text-align:right; }
.dash-table td.muted { color:var(--fg-3); }

/* ── Cash movements by shift ───────────────────────────────────────────────── */
.dash-shift-group { margin-bottom:16px; }
.dash-shift-group:last-child { margin-bottom:0; }
.dash-shift-group-head { display:flex; align-items:baseline; gap:8px; margin-bottom:6px; font-size:13px; }
.dash-shift-group-head strong { color:var(--fg-1); }
.dash-shift-group-head span { color:var(--fg-3); }

/* ── Recent orders + tables ─────────────────────────────────────────────────── */
.dash-order-row { display:flex; justify-content:space-between; align-items:center; padding:9px 0; border-bottom:1px solid var(--border-subtle); }
.dash-order-row:last-child { border-bottom:none; }
.dash-order-row__code { font-size:13px; font-weight:500; color:var(--fg-1); }
.dash-order-row__meta { font-size:12px; color:var(--fg-3); }
.dash-table-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; }
@media (max-width:420px) { .dash-table-grid { grid-template-columns:repeat(3, 1fr); } }
