/* Tema visual do shell (palco, sidebar, header, superfícies).
   Carregado por último; regras de componentes do Overview vivem em overview.css. */
:root {
  --background: #111315;
  --sidebar: #1b1d21;
  --surface: #1d1f23;
  --foreground: #f5f5f4;
  --muted: #aeb1b7;
  --muted-dim: #777c84;
  --border: #2a2d31;
  --border-soft: #24272b;
  --accent: #34d399;
  --positive: #31c48d;
  --warning: #f3b85f;
  --radius: 16px;
  --sidebar-width: 250px;
  --header-height: 64px;
}

body { background: var(--background); }

.dashboard-shell {
  width: 100%;
  min-height: 100dvh;
  margin: 0;
  padding: 0;
  overflow: visible;
  border-radius: 0;
  background: var(--background);
  box-shadow: none;
}

.sidebar {
  top: 0;
  height: 100dvh;
  border: 0;
  border-right: 1px solid var(--border-soft);
  border-radius: 0;
  background: var(--sidebar);
}

.dashboard-main {
  border: 0;
  border-radius: 0;
  background: var(--background);
}

.site-header {
  top: 0;
  height: var(--header-height);
  padding-inline: 28px;
  border-bottom: 1px solid var(--border-soft);
  background: rgb(17 19 21 / 94%);
  box-shadow: none;
}

.header-title h1 { font-size: 17px; font-weight: 620; letter-spacing: -.025em; }

.brand-mark {
  width: 30px;
  height: 30px;
  border: 1px solid rgb(255 255 255 / 14%);
  border-radius: 999px;
  background: linear-gradient(145deg, #2fbf8b, #14805c);
  color: #fff;
  box-shadow: 0 7px 20px rgb(49 196 141 / 22%);
}

.nav-item { min-height: 38px; border-radius: 8px; color: #92979f; }
.nav-item:hover { background: #24272b; color: #f4f4f5; }
.nav-item.active { background: #2b2e33; color: #fff; box-shadow: inset 0 1px 0 rgb(255 255 255 / 3%); }
.nav-item.active::before { display: none; }
.user-avatar { border-radius: 999px; background: linear-gradient(145deg, #34383e, #24272b); }

.range-chip {
  border-color: #30343a;
  background: #1d2024;
  color: #aeb2b9;
  box-shadow: none;
}

.range-chip:hover {
  border-color: #41464e;
  background: #282c31;
  color: #fff;
}

.range-chip.active {
  border-color: #41464e;
  background: #30343a;
  color: #fff;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 5%);
}

.range-chip:focus-visible,
.control-chip:focus-visible,
.nav-item:focus-visible { outline-color: #6ee7b7; }

.card,
.analytics-panel {
  border: 1px solid rgb(255 255 255 / 4%);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 2%);
}

.chart-tooltip,
.data-status-panel,
.filters-panel.card {
  border-color: #373b42;
  background: #24272c;
  box-shadow: 0 18px 44px rgb(0 0 0 / 36%);
}

.table-wrap { overflow: hidden; border-radius: 13px; }
table thead { background: #23262a; }
th { background: #23262a; }
table tbody tr:hover { background: #22252a; }

@media (max-width: 900px) {
  .sidebar { border-right: 1px solid var(--border); border-radius: 0 20px 20px 0; }
}

@media (max-width: 620px) {
  .site-header { height: 58px; padding-inline: 14px; }
  .card, .analytics-panel { border-radius: 14px; }
}

@media (max-width: 340px) {
  .site-header .header-milestone { display: none; }
  .header-title h1 { font-size: 15px; }
}