/* GrupoMaxx Gerencial — UI profissional leve V2026.10.7.10
   Camada visual apenas. Nao altera dados, regras, JS ou calculos. */
:root {
  --gm-bg: #f6f8fb;
  --gm-surface: #ffffff;
  --gm-surface-soft: #f9fbfd;
  --gm-text: #172033;
  --gm-muted: #667085;
  --gm-line: #e2e8f0;
  --gm-line-strong: #d5dde8;
  --gm-blue: #255da8;
  --gm-green: #187760;
  --gm-amber: #b66d12;
  --gm-red: #b94a48;
  --gm-violet: #6656a8;
  --gm-shadow-soft: 0 1px 2px rgba(16, 24, 40, .04), 0 4px 12px rgba(16, 24, 40, .035);
  --gm-shadow-float: 0 3px 10px rgba(16, 24, 40, .055);
  --gm-radius: 14px;
  --gm-radius-sm: 10px;
}

html { background: var(--gm-bg) !important; }
body {
  background: var(--gm-bg) !important;
  background-image: none !important;
  color: var(--gm-text) !important;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.app-shell {
  width: min(1520px, calc(100% - 32px)) !important;
  padding-top: 18px !important;
  padding-bottom: 32px !important;
}
.portal-shell {
  align-content: start !important;
  gap: 16px !important;
  padding-top: 18px !important;
}

/* Cabecalhos */
.topbar,
.hero,
.metas-page-header {
  border: 1px solid var(--gm-line) !important;
  border-radius: var(--gm-radius) !important;
  background: var(--gm-surface) !important;
  background-image: none !important;
  box-shadow: var(--gm-shadow-soft) !important;
}
.topbar {
  min-height: 0 !important;
  padding: 15px 18px !important;
  margin-bottom: 2px !important;
}
.metas-page-header {
  padding: 16px 18px !important;
  margin-bottom: 12px !important;
  align-items: center !important;
}
.hero { padding: 18px !important; }

h1 {
  color: #162840 !important;
  font-size: clamp(25px, 2.5vw, 32px) !important;
  font-weight: 760 !important;
  letter-spacing: -.02em !important;
}
h2 { color: #1b2b42 !important; font-weight: 730 !important; }
.eyebrow,
.portal-card-kicker,
.executive-alert-eyebrow,
.metas-section-kicker {
  color: #758196 !important;
  letter-spacing: .055em !important;
  font-weight: 760 !important;
}

.brand-logo-link {
  width: 88px !important;
  height: 72px !important;
  min-width: 88px !important;
}
.portal-topbar .brand-logo-link { width: 96px !important; height: 82px !important; }
.brand-logo-link img { object-fit: contain !important; }
.meta-stack { gap: 3px !important; font-size: 12px !important; color: #6d788a !important; }

/* Superficies: menos sombra, mais hierarquia */
.panel,
.overview-card,
.sales-summary-card,
.sales-executive-card,
.comparison-panel,
.chart-panel,
.trend-panel,
.table-panel,
.purchase-panel,
.purchase-chart-card,
.purchase-trend-card,
.factory-panel,
.factory-kpi-card,
.factory-customer-panel,
.factory-inventory-panel,
.comparison-kpi-card,
.info-card,
.metric-card,
.nav-card,
.panel-lite,
.update-panel,
.sales-goals-panel,
.data-health-panel,
.portal-health-strip > div,
.store-goal-card {
  border-color: var(--gm-line) !important;
  border-radius: var(--gm-radius-sm) !important;
  background-color: var(--gm-surface) !important;
  box-shadow: var(--gm-shadow-soft) !important;
}
.panel { padding: 16px !important; }
.panel-heading { margin-bottom: 12px !important; }
.dashboard-section { gap: 10px !important; margin-top: 10px !important; }
.panel-grid,
.sales-complete-grid,
.purchase-chart-grid,
.factory-kpi-grid,
.comparison-kpi-grid { gap: 10px !important; }

/* Central e hubs */
.executive-alert-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
.executive-alert-card {
  min-height: 152px !important;
  padding: 15px 16px !important;
  gap: 7px !important;
  border-radius: 12px !important;
  background: var(--gm-surface) !important;
  background-image: none !important;
  box-shadow: var(--gm-shadow-soft) !important;
  border-left-width: 3px !important;
}
.executive-alert-card.good { border-left-color: var(--gm-green) !important; }
.executive-alert-card.warn { border-left-color: var(--gm-amber) !important; }
.executive-alert-card.danger { border-left-color: var(--gm-red) !important; }
.executive-alert-title { font-size: 18px !important; }
.executive-alert-value { font-size: 24px !important; }
.executive-alert-description { font-size: 12.5px !important; color: #5f6b7b !important; }
.executive-alert-link { color: var(--gm-blue) !important; }

.branch-grid,
.portal-grid,
.portal-grid-farmacias,
.factory-hub-grid,
.fiscal-hub-grid { gap: 12px !important; }
.portal-card {
  min-height: 208px !important;
  padding: 17px 18px !important;
  gap: 8px !important;
  border: 1px solid var(--gm-line) !important;
  border-radius: 14px !important;
  background: var(--gm-surface) !important;
  background-image: none !important;
  box-shadow: var(--gm-shadow-soft) !important;
}
.portal-card::before { display: none !important; }
.portal-card-icon {
  right: 16px !important;
  bottom: 16px !important;
  width: 72px !important;
  height: 72px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #f5f8fb !important;
  opacity: .78 !important;
}
.portal-card-icon img { object-fit: contain !important; }
.portal-card-title { font-size: 24px !important; color: #182b45 !important; }
.portal-card-description { max-width: 70% !important; color: #667085 !important; font-size: 13px !important; }
.portal-card-stats { gap: 6px !important; padding-top: 8px !important; }
.portal-card-stats i {
  min-height: 25px !important;
  padding: 4px 8px !important;
  border: 1px solid #e7ecf2 !important;
  background: #f8fafc !important;
  color: #526074 !important;
  font-size: 11px !important;
}
.portal-card-action,
.primary-button,
.update-button,
.store-card-action {
  border-radius: 9px !important;
  box-shadow: none !important;
}
.portal-card-action { background: #183653 !important; }
.portal-card-action.secondary { background: #fff !important; color: #243a53 !important; border: 1px solid var(--gm-line) !important; }

/* Links e botoes */
.back-link,
.text-link {
  color: var(--gm-blue) !important;
  text-decoration: none !important;
}
.back-link {
  border-color: var(--gm-line) !important;
  border-radius: 9px !important;
  background: #fff !important;
  box-shadow: none !important;
}
button,
input,
select { border-radius: 8px; }
button { box-shadow: none !important; }

/* KPI */
.sales-summary-kpis { gap: 8px !important; }
.sales-summary-card { padding: 12px 13px !important; }
.sales-summary-card strong { font-size: 20px !important; }
.sales-executive-card {
  padding: 12px 14px !important;
  background: #fff !important;
  background-image: none !important;
}
.sales-executive-card.good,
.sales-executive-card.warn,
.sales-executive-card.danger { background: #fff !important; }

/* Cards de metas por loja */
.sales-goal-grid { gap: 10px !important; }
.store-goal-card {
  gap: 10px !important;
  padding: 14px !important;
  background: #fff !important;
  background-image: none !important;
  border-left: 3px solid var(--tone-border, var(--gm-line-strong)) !important;
}
.store-goal-card:hover { box-shadow: var(--gm-shadow-float) !important; }
.store-goal-values div {
  padding: 9px 10px !important;
  border-color: #e4eaf1 !important;
  border-radius: 9px !important;
  background: #fbfcfe !important;
}
.goal-progress-track { height: 8px !important; background: #e9eef4 !important; }
.goal-progress-marker { opacity: .45 !important; }

/* Tabelas */
.table-wrap,
.sales-image-scroll,
.metas-table-wrap {
  border-color: var(--gm-line) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
table thead th,
.metas-table thead th {
  background: #f5f8fb !important;
  color: #40506a !important;
  box-shadow: inset 0 -1px 0 var(--gm-line) !important;
}
table tbody tr:nth-child(even) td { background-color: #fbfcfe; }
table tbody tr:hover td { background-color: #f5f8fc !important; }

/* Metas */
.metas-commandbar,
.metas-board {
  border-color: var(--gm-line) !important;
  border-radius: 12px !important;
  box-shadow: var(--gm-shadow-soft) !important;
}
.metas-command-main { padding: 13px 15px 11px !important; }
.metas-statusline { background: #f8fafc !important; border-color: var(--gm-line) !important; }
.metas-board-heading { padding: 14px 16px !important; border-color: var(--gm-line) !important; }
.metas-table th,
.metas-table td { border-color: #e6ebf1 !important; }
.metas-table tbody tr:nth-child(even) td,
.metas-table tbody tr:nth-child(even) td:first-child { background: #fbfcfe !important; }
.meta-a-head { background: #f4f8fd !important; color: #2f5f99 !important; }
.meta-b-head { background: #f7f5fb !important; color: #66558f !important; }
.meta-c-head { background: #f3f9f6 !important; color: #27715b !important; }
.metas-button.primary { background: #245fae !important; }
.metas-button.secondary { background: #234a72 !important; }

/* Graficos e barras */
.labeled-chart-track,
.bar-chart-track,
.goal-progress-track { background: #e9eef4 !important; }
.labeled-chart-track { height: 14px !important; }

/* Atualizador */
.update-panel { padding: 18px !important; }
.update-stat {
  border-color: var(--gm-line) !important;
  border-radius: 10px !important;
  background: #f8fafc !important;
  box-shadow: none !important;
}


/* Paginas tecnicas com CSS inline */
body > main:not(.app-shell):not(.update-shell) {
  width: min(1520px, calc(100% - 32px)) !important;
  margin: 0 auto !important;
  padding-top: 18px !important;
}
body > main:not(.app-shell) > nav {
  margin-bottom: 10px !important;
}
body > main:not(.app-shell) > nav a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: 0 11px !important;
  border: 1px solid var(--gm-line) !important;
  border-radius: 9px !important;
  background: #fff !important;
  color: var(--gm-blue) !important;
  text-decoration: none !important;
}
.cards > div {
  border-color: var(--gm-line) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: var(--gm-shadow-soft) !important;
}
.filters input,
.filters select {
  border-color: var(--gm-line-strong) !important;
  background: #fff !important;
  color: var(--gm-text) !important;
  box-shadow: none !important;
}
.filters button {
  background: #255d9b !important;
  border-color: #255d9b !important;
  box-shadow: none !important;
}
.table { border-radius: 10px !important; }

/* Atualizador: neutraliza o visual inline mais pesado */
.update-shell { width: min(100% - 32px, 1040px) !important; padding-top: 18px !important; }
.update-panel {
  border-color: var(--gm-line) !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: var(--gm-shadow-soft) !important;
}
.upload-zone {
  border-color: #c7d1df !important;
  border-radius: 10px !important;
  background: #f8fafc !important;
}
.update-button { background: #245d9f !important; border-radius: 9px !important; }
.update-secondary { background: #eef3f8 !important; color: #245d9f !important; }

/* Remove animacoes/efeitos pesados sem deixar a interface seca */
a, button, .portal-card, .store-goal-card, .nav-card {
  transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease, color .12s ease !important;
}
.portal-card:hover,
.nav-card:hover,
.store-goal-card:hover { transform: none !important; }

@media (max-width: 1100px) {
  .app-shell { width: min(100% - 22px, 1520px) !important; }
  .topbar { align-items: flex-start !important; }
  .executive-alert-grid { grid-template-columns: 1fr !important; }
  .portal-card-description { max-width: 100% !important; padding-right: 76px !important; }
}

@media (max-width: 700px) {
  .topbar,
  .metas-page-header { padding: 13px !important; border-radius: 11px !important; }
  .brand-logo-link { width: 72px !important; height: 62px !important; min-width: 72px !important; }
  .portal-card { min-height: 190px !important; }
  .panel { padding: 13px !important; }
  .sales-goal-grid { grid-template-columns: 1fr !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}