/* ============================================================
   MadSGestor MINI · Identidade v74 (dourado + azul · Exo 2)
   ============================================================
   Override EXCLUSIVO do mini. Carregado por ÚLTIMO no app.html,
   depois de gestor-shared.css, para remapear os tokens
   compartilhados aos valores v74 SEM tocar bar/clínica/salão
   (que seguem no shared). Fonte de verdade:
   design_handoff_gestor_madssolutions/Gestor Minimercado App.dc.html
   Fase 1 (fundação): tokens + tipografia + casca. As telas ganham
   paridade estrutural completa nas fases seguintes.
   ============================================================ */

/* ────────────── TOKENS · tema escuro (padrão) ────────────── */
:root, [data-theme="dark"] {
  --bg:#0B0F14;  --bg2:#0d1219;  --card:#10141B;  --card-hover:#141a22;  --pl:#141a22;
  --bd:rgba(154,166,178,.13);  --bd-soft:rgba(154,166,178,.08);
  --fg:#E8ECF1;  --fg-soft:#C3CCD6;  --mu:#9AA6B2;  --mu2:#6b7682;

  /* marca: dourado carrega a identidade, azul é o secundário */
  --gold-text:#C8A24A;  --gold-soft:#E6C36B;  --blue-text:#3A7BA6;
  --brand-yellow:#C8A24A;  --brand-cyan:#3A7BA6;  --brand-purple:#6B3FA0;
  --brand-magenta:#E0729F;  --brand-orange:#E6C36B;
  --brand-green:#22C55E;  --brand-red:#EF4444;  --brand-amber:#F59E0B;
  --setor-color:#C8A24A;  --setor-color-2:#3A7BA6;

  /* aliases curtas que os modules.js do mini referenciam */
  --pr:#C8A24A;  --pr-soft:#E6C36B;  --pu:#6B3FA0;  --gd:#C8A24A;  --am:#F59E0B;
  --rd:#EF4444;  --gr:#22C55E;  --tl:#3A7BA6;  --or:#E6C36B;  --ye:#C8A24A;
  --ma:#E0729F;  --cy:#3A7BA6;

  /* gradientes: dourado→azul nos destaques, botão em dourado sólido */
  --grad-tech:linear-gradient(135deg,#E6C36B,#3A7BA6);
  --grad-cool:linear-gradient(135deg,#3A7BA6,#6B3FA0);
  --grad-warm:linear-gradient(135deg,#E6C36B,#C8A24A);
  --grad-gold:linear-gradient(180deg,#E6C36B,#C8A24A);
  --grad-setor:linear-gradient(135deg,#C8A24A,#3A7BA6);
  --grad-solid:linear-gradient(180deg,#E6C36B,#C8A24A);
  --side:#0d1219;
}

/* ────────────── TOKENS · tema claro ────────────── */
[data-theme="light"] {
  --bg:#EAEFF6;  --bg2:#EDF2F9;  --card:#FFFFFF;  --card-hover:#FFFFFF;  --pl:#F1F5F9;
  --bd:rgba(13,23,36,.16);  --bd-soft:rgba(13,23,36,.05);
  --fg:#172029;  --fg-soft:#2C3A48;  --mu:#3B4954;  --mu2:#4E5B66;
  --gold-text:#8A6B1B;  --blue-text:#0C6BAB;
  --brand-yellow:#8A6B1B;  --brand-cyan:#0C6BAB;
  --setor-color:#8A6B1B;  --setor-color-2:#0C6BAB;
  --pr:#8A6B1B;  --gd:#8A6B1B;  --ye:#8A6B1B;  --tl:#0C6BAB;  --cy:#0C6BAB;
  --brand-green:#137A37;
  --side:#FFFFFF;
}

/* ────────────── TIPOGRAFIA · Exo 2 no mini inteiro ────────────── */
body { font-family:'Exo 2', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
::selection { background:#C8A24A; color:#0B0F14; }
::-webkit-scrollbar-thumb { background:var(--bd); border-radius:8px; }

/* ────────────── CASCA · sidebar / topbar ────────────── */
#sidebar { background:var(--side); border-right:1px solid var(--bd); }
.topbar  { background:var(--side); border-bottom:1px solid var(--bd); }

/* item de menu ativo: dourado (o .ico já herda --brand-yellow = dourado) */
.sb-menu a.nav.active {
  background:rgba(200,162,74,.12);
  color:var(--fg);
}
.sb-menu a.nav.active .ico { color:var(--gold-text); }

/* pílula "modo local" no padrão v74 (contorno + ponto verde) */
.topbar .conn {
  border:1px solid var(--bd);
  color:var(--mu);
  background:transparent;
}

/* plano do usuário no rodapé: pílula dourada sólida */
.sb-foot .plan {
  background:linear-gradient(90deg,#E6C36B,#C8A24A);
  color:#0B0F14;
  font-weight:800;
}

/* ────────────── BOTÕES ────────────── */
.btn-primary {
  background:var(--grad-solid);
  color:#0B0F14;
  font-weight:800;
}

/* ════════════════ COMPONENTES · paridade estrutural v74 ════════════════ */
/* As ~37 telas do mini já usam estas classes compartilhadas (.page-header,
   .kpi, .panel, .agent-suggest, .btn, inputs). Reescrever o VISUAL delas aqui
   sobe todas as telas ao padrão v74 de uma vez, sem tocar template nem dado. */

/* ── Título de tela: dourado sólido 27/900 (elimina o gradient-text) ── */
.page-header h1,
[data-theme="light"] .page-header h1 {
  background:none;
  -webkit-background-clip:border-box; background-clip:border-box;
  color:var(--gold-text);
  font-size:27px; font-weight:900; letter-spacing:-.02em;
}
.page-header .sub { color:var(--mu); font-size:13.5px; font-weight:500; }

/* ── Cards e painéis: superfície plana v74, borda sutil, raio 16 ── */
.panel {
  background:var(--card);
  border:1px solid var(--bd);
  border-radius:16px;
  box-shadow:none;
}
[data-theme="light"] .panel {
  background:#fff;
  box-shadow:0 1px 2px rgba(13,23,36,.06), 0 8px 22px rgba(13,23,36,.06);
}
.panel h3 { color:var(--fg); }

/* ── KPIs: superfície v74, topo em acento dourado fino, valor 22/900 ── */
.kpi {
  background:var(--card);
  border:1px solid var(--bd);
  border-radius:16px;
  box-shadow:none;
}
[data-theme="light"] .kpi {
  background:#fff;
  box-shadow:0 1px 2px rgba(13,23,36,.06), 0 8px 22px rgba(13,23,36,.06);
}
.kpi::before { background:var(--grad-solid); opacity:.9; }
.kpi-l { color:var(--mu2); font-size:10.5px; letter-spacing:.06em; }
.kpi-v { font-size:22px; font-weight:900; letter-spacing:-.01em; color:var(--fg); }
.kpi.kpi-hero {
  background:linear-gradient(135deg, rgba(200,162,74,.06), rgba(0,184,255,.04));
  border-color:rgba(200,162,74,.30);
}
.kpi.kpi-hero::before { background:var(--grad-solid); }
.kpi.kpi-hero .kpi-v {
  background:none;
  -webkit-background-clip:border-box; background-clip:border-box;
  color:var(--gold-text);
  font-size:30px;
}
/* Sinal de status via o acento do topo (::before); a barra-lateral colorida
   fica 1px neutra (evita side-stripe). */
.kpi.kpi-good, .kpi.kpi-warn, .kpi.kpi-bad, .kpi.kpi-info { border-left:1px solid var(--bd); }
.kpi.kpi-good::before { background:linear-gradient(90deg,#22C55E,#3A7BA6); }
.kpi.kpi-warn::before { background:linear-gradient(90deg,#F59E0B,#E6C36B); }
.kpi.kpi-bad::before  { background:linear-gradient(90deg,#EF4444,#E0729F); }
.kpi.kpi-info::before { background:linear-gradient(90deg,#3A7BA6,#6B3FA0); }

/* ── SugereCard (o agentBox): superfície levemente dourada = "voz do agente" ── */
.agent-suggest {
  background:linear-gradient(135deg, rgba(200,162,74,.06), rgba(0,184,255,.03));
  border:1px solid rgba(200,162,74,.20);
  border-radius:16px;
}

/* ── Botões e campos no padrão v74 ── */
.btn { border-radius:10px; }
input[type="text"], input[type="number"], input[type="email"],
input[type="password"], input[type="date"], input[type="tel"],
input[type="search"], select, textarea {
  background:var(--bg);
  border:1px solid rgba(154,166,178,.30);
  border-radius:9px;
  color:var(--fg);
}
[data-theme="light"] input[type="text"], [data-theme="light"] input[type="number"],
[data-theme="light"] select, [data-theme="light"] textarea {
  border:1px solid rgba(13,23,36,.20);
}
input:focus, select:focus, textarea:focus { border-color:var(--blue-text); outline:none; }

/* ── Pílula/tag no padrão v74 ── */
.tag, .sem { border-radius:20px; }
