/* ============================================================================
   GRAFICA UCHOA | DESIGN SYSTEM v201.1 | PADRONIZACAO VISUAL VISIVEL
   Camada visual: cartoes, indicadores, tabelas e controles.
   Preserva o header azul v196, Visao Geral v173.4, Producao v200,
   Retiradas v198 e Caixa v197. Sem alteracoes em JS, autenticacao ou dados.
   Carregar esta folha por ultimo dentro do <head> de cada pagina.
   ============================================================================ */

body.gg-v201 {
  --gg201-ink: #162c4b;
  --gg201-primary: #2166d5;
  --gg201-primary-deep: #144b9b;
  --gg201-line: #d8e4f2;
  --gg201-soft: #eff5ff;
  --gg201-card: #ffffff;
  --gg201-shadow: 0 10px 26px rgba(19, 47, 87, .085);
}

/* Evita alterar paginas com layout fechado ou anteriormente homologado. */
/* Visao Geral = dashboard.html; Producao/Retiradas = main.ops038; Caixa = main.cash034-main */

/* Identidade visivel das superficies nos modulos administrativos/comerciais. */
body.gg-v201 main:not(.gg173-operational):not(.ops038):not(.cash034-main)
  :is(.panel, .dash036-panel, .dash036-kpi, .gg178-metric, .client133-metrics > div) {
  background-color: var(--gg201-card) !important;
  border: 1px solid var(--gg201-line) !important;
  border-top: 3px solid var(--gg201-primary) !important;
  border-radius: 13px !important;
  box-shadow: var(--gg201-shadow) !important;
}

/* Hierarquia clara nos titulos de secoes, sem alterar o hero aprovado. */
body.gg-v201 main:not(.gg173-operational):not(.ops038):not(.cash034-main)
  :is(.panel > h2, .panel .section-head > h2, .dash036-panel .dash036-heading h2) {
  color: var(--gg201-ink) !important;
  letter-spacing: -.015em;
  font-weight: 750;
}

/* Indicadores e acessos do Painel Gerencial. */
body.gg-v201 main.dash036 :is(.gg173-hub-grid > a, .dash036-shortcuts > a) {
  border: 1px solid var(--gg201-line) !important;
  box-shadow: 0 4px 13px rgba(18, 48, 89, .075) !important;
  border-radius: 12px !important;
  transition: box-shadow .16s ease, transform .16s ease !important;
}
body.gg-v201 main.dash036 :is(.gg173-hub-grid > a, .dash036-shortcuts > a):hover {
  box-shadow: 0 9px 22px rgba(18, 48, 89, .13) !important;
  transform: translateY(-2px);
}

/* Tabelas: cabecalho azul claro e separacao visual consistente. */
body.gg-v201 main:not(.gg173-operational):not(.ops038):not(.cash034-main)
  table thead th {
  background-color: var(--gg201-soft) !important;
  color: #214b82 !important;
  border-bottom: 1px solid #c9dbee !important;
  font-weight: 750 !important;
  font-variant-numeric: tabular-nums;
}
body.gg-v201 main:not(.gg173-operational):not(.ops038):not(.cash034-main)
  table tbody td {
  border-bottom-color: #e7edf6 !important;
  font-variant-numeric: tabular-nums;
}

/* Controles: foco visivel sem alterar largura nem altura dos campos. */
body.gg-v201 main:not(.gg173-operational):not(.ops038):not(.cash034-main)
  :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus-visible {
  border-color: var(--gg201-primary) !important;
  outline: 3px solid rgba(33, 102, 213, .17) !important;
  outline-offset: 1px !important;
  box-shadow: none !important;
}

/* Acoes principais reconheciveis; exclui botoes secundarios e perigosos. */
body.gg-v201 main:not(.gg173-operational):not(.ops038):not(.cash034-main)
  :is(.crud-heading > button, .erp011-heading > button, .p50-actions > button#p50-add, button.primary) {
  background-color: #142a49 !important;
  border-color: #142a49 !important;
  color: #ffffff !important;
  border-radius: 11px !important;
  box-shadow: 0 4px 11px rgba(20, 42, 73, .15) !important;
}
body.gg-v201 main:not(.gg173-operational):not(.ops038):not(.cash034-main)
  :is(.crud-heading > button, .erp011-heading > button, .p50-actions > button#p50-add, button.primary):hover {
  background-color: #224a7b !important;
  border-color: #224a7b !important;
}

/* Microinteracao nao altera o estado disabled nem a funcao de cada botao. */
body.gg-v201 main:not(.gg173-operational):not(.ops038):not(.cash034-main)
  :is(button, a, input, select, textarea):focus-visible {
  outline: 2px solid #71a6f3 !important;
  outline-offset: 2px !important;
}

@media (prefers-reduced-motion: reduce) {
  body.gg-v201 main.dash036 :is(.gg173-hub-grid > a, .dash036-shortcuts > a) {
    transition: none !important;
    transform: none !important;
  }
}
