/* ═══════════════════════════════════════════════════
   THEME.CSS — overrides compartilhados (salesone)
   Carregar APÓS styles.css
════════════════════════════════════════════════════ */

/* ── BOTÃO DE TEMA ────────────────────────────────── */
/* Vive no topbar escuro em ambos os temas */
.btn-theme {
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 8px;
  color: #fff;
  font-size: .85rem;
  padding: .28rem .6rem;
  cursor: pointer;
  transition: all .15s;
  line-height: 1;
  flex-shrink: 0;
}
.btn-theme:hover { background: rgba(255,255,255,.22); }

/* No tema claro o topbar continua navy, então mantemos visual claro */
[data-theme="light"] .btn-theme {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.22);
}
[data-theme="light"] .btn-theme:hover { background: rgba(255,255,255,.25); }

/* ── OVERRIDES LIGHT — elementos com cor hardcoded ── */

[data-theme="light"] body {
  background: var(--bg) !important;
  color: var(--text) !important;
}

/* Topbar: mantém fundo escuro (navy) em ambos os temas */
[data-theme="light"] .topbar {
  background: var(--topbar-bg) !important;
  border-bottom-color: var(--topbar-border) !important;
}
[data-theme="light"] .topbar-brand { color: #fff !important; }
[data-theme="light"] .topbar-user  { color: rgba(255,255,255,.7) !important; }
[data-theme="light"] .topbar-user strong { color: #fff !important; }
[data-theme="light"] .topbar-status { color: rgba(255,255,255,.6) !important; }

/* Botão de perigo no topbar */
[data-theme="light"] .topbar .btn-danger {
  background: rgba(217,48,37,.18) !important;
  color: #ff7676 !important;
  border-color: rgba(217,48,37,.35) !important;
}

/* Botão admin no topbar (btn-sm sem classe especial) */
[data-theme="light"] .topbar .btn-sm:not(.btn-danger) {
  background: rgba(255,255,255,.1) !important;
  border-color: rgba(255,255,255,.18) !important;
  color: rgba(255,255,255,.85) !important;
}
[data-theme="light"] .topbar .btn-sm:not(.btn-danger):hover {
  background: rgba(255,255,255,.18) !important;
  color: #fff !important;
}

/* Login screen */
[data-theme="light"] #login-screen { background: var(--bg) !important; }
[data-theme="light"] .login-box {
  background: var(--surface) !important;
  border-color: var(--border2) !important;
  box-shadow: 0 8px 40px rgba(0,0,0,.12) !important;
}
[data-theme="light"] .login-logo h1 { color: var(--text) !important; }
[data-theme="light"] .login-logo p  { color: var(--text2) !important; }
[data-theme="light"] .login-error {
  background: var(--danger-bg) !important;
  border-color: rgba(217,48,37,.3) !important;
  color: var(--danger) !important;
}

/* Dropdowns de autocomplete (inline style com var()) */
[data-theme="light"] #cliente-sug,
[data-theme="light"] #vendedor-sug {
  background: var(--surface) !important;
  border-color: var(--border2) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,.1) !important;
}

/* Itens das sugestões */
[data-theme="light"] #cliente-sug div:hover,
[data-theme="light"] #vendedor-sug div:hover { background: var(--surface2) !important; }

/* Items table */
[data-theme="light"] .items-table th {
  color: var(--th-color) !important;
  border-bottom-color: var(--border) !important;
}
[data-theme="light"] .items-table td { border-bottom-color: var(--border) !important; }
[data-theme="light"] .items-table tbody tr:hover td { background: var(--surface2) !important; }
[data-theme="light"] .items-table tbody tr { background: transparent; }

/* Botão primário: texto branco no tema claro */
[data-theme="light"] .btn-primary { color: #ffffff !important; }
[data-theme="light"] .btn-primary:hover { color: #ffffff !important; }

/* Sticky header (ph-totals) */
[data-theme="light"] .page-header {
  background: var(--bg) !important;
  border-bottom-color: var(--border) !important;
}
[data-theme="light"] .ph-totals { border-color: var(--border) !important; }
[data-theme="light"] .ph-total { background: var(--surface) !important; }
[data-theme="light"] .ph-total + .ph-total { border-left-color: var(--border) !important; }
[data-theme="light"] .ph-total-highlight { background: var(--accent-light) !important; }
[data-theme="light"] .ph-total-label { color: var(--text3) !important; }
[data-theme="light"] .ph-total-value { color: var(--text) !important; }
[data-theme="light"] .ph-total-danger  { color: var(--danger) !important; }
[data-theme="light"] .ph-total-highlight .ph-total-value { color: var(--accent) !important; }
[data-theme="light"] .ph-total-sub { color: var(--text3) !important; }

/* Pedido preview groups */
[data-theme="light"] .pedido-group { background: var(--surface) !important; border-color: var(--border) !important; }
[data-theme="light"] .pedido-group-header {
  background: var(--surface2) !important;
  border-bottom-color: var(--border) !important;
}
[data-theme="light"] .pedido-group-header .medico-name { color: var(--text) !important; }
[data-theme="light"] .pedido-group-header .badge {
  background: rgba(26,92,255,.08) !important;
  color: var(--accent) !important;
  border-color: rgba(26,92,255,.2) !important;
}
[data-theme="light"] .pedido-group-header .total-pill { color: var(--accent) !important; }

/* Tabela de usuários (admin) */
[data-theme="light"] .user-table th {
  color: var(--th-color) !important;
  background: var(--surface2) !important;
  border-bottom-color: var(--border) !important;
}
[data-theme="light"] .user-table td {
  color: var(--text) !important;
  border-bottom-color: var(--border) !important;
}
[data-theme="light"] .user-table tbody tr:hover td { background: var(--surface2) !important; }

/* Role badges (admin) */
[data-theme="light"] .role-badge.admin {
  background: rgba(26,92,255,.12) !important;
  color: #1a5cff !important;
  border-color: rgba(26,92,255,.28) !important;
}
[data-theme="light"] .role-badge.user {
  background: rgba(19,115,51,.1) !important;
  color: #137333 !important;
  border-color: rgba(19,115,51,.25) !important;
}

/* Avatar */
[data-theme="light"] .avatar-sm {
  background: rgba(26,92,255,.1) !important;
  border-color: rgba(26,92,255,.3) !important;
  color: var(--accent) !important;
}

/* Env badge (admin topbar) */
[data-theme="light"] .env-badge.prod {
  background: rgba(19,115,51,.12) !important;
  color: #137333 !important;
  border-color: rgba(19,115,51,.25) !important;
}
[data-theme="light"] .env-badge.test {
  background: rgba(180,83,9,.12) !important;
  color: #b45309 !important;
  border-color: rgba(180,83,9,.25) !important;
}

/* Env buttons (admin card) */
[data-theme="light"] .env-btn {
  background: var(--surface2) !important;
  border-color: var(--border2) !important;
  color: var(--text2) !important;
}
[data-theme="light"] .env-btn.active {
  border-color: var(--accent) !important;
  background: var(--accent-light) !important;
  color: var(--accent) !important;
}
[data-theme="light"] .env-btn:hover:not(.active) {
  background: var(--surface3) !important;
  color: var(--text) !important;
}

/* Modal */
[data-theme="light"] .modal-overlay { background: rgba(0,0,0,.5) !important; }
[data-theme="light"] .modal {
  background: var(--surface) !important;
  border-color: var(--border2) !important;
}
[data-theme="light"] .modal h2  { color: var(--text) !important; }
[data-theme="light"] .modal .sub { color: var(--text2) !important; }

/* Toasts */
[data-theme="light"] .toast {
  background: var(--surface3) !important;
  border-color: var(--border2) !important;
  color: var(--text) !important;
}
[data-theme="light"] .toast.success { border-color: rgba(19,115,51,.4) !important; color: var(--success) !important; }
[data-theme="light"] .toast.error   { border-color: rgba(217,48,37,.4) !important; color: var(--danger) !important; }

/* Inputs focus ring no tema claro */
[data-theme="light"] input:focus,
[data-theme="light"] select:focus,
[data-theme="light"] textarea:focus {
  box-shadow: 0 0 0 2px rgba(26,92,255,.14) !important;
}

/* Computed values (linha de itens) */
[data-theme="light"] .computed-val { color: var(--text2) !important; }
[data-theme="light"] .computed-val.negative { color: var(--danger) !important; }
[data-theme="light"] .computed-val.positive { color: var(--accent) !important; }

/* Receita button */
[data-theme="light"] .receita-btn {
  border-color: var(--border2) !important;
  color: var(--text2) !important;
}
[data-theme="light"] .receita-btn:hover {
  border-color: var(--accent) !important;
  color: var(--accent) !important;
  background: var(--accent-light) !important;
}
[data-theme="light"] .receita-btn.attached {
  border-color: var(--accent) !important;
  color: var(--accent) !important;
  background: var(--accent-light) !important;
}

/* ── MOBILE ────────────────────────────────────────── */
@media (max-width: 640px) {
  [data-theme="light"] .topbar .btn-sm:not(.btn-danger),
  [data-theme="light"] .topbar .btn-theme {
    min-height: auto;
  }
}
