/* ============================================================================
   Identidade Visual do Governo do Estado do Ceará (Manual 2023-2026)
   Fonte: documentation/identidade_visual/manual_identidade_visual_ceara_2023.pdf
          (11.GRAFISMO - "Elemento base", p.26; 4.TIPOGRAFIA, p.10; 5.CORES, p.11)

   Este arquivo é uma CAMADA DE TEMA: não redefine layout, só cor, tipografia e
   estados. Precisa ser carregado DEPOIS de adminlte.css, do tema do PrimeFaces
   e de custom-4.css, porque tanto o Bootstrap 5.3 embutido no AdminLTE quanto o
   tema Saga do PrimeFaces gravam suas cores de marca *literalmente* nas regras
   (o Saga tem 75 ocorrências de #2196f3 e 36 de #e3f2fd, e não usa
   var(--primary-color)). Ou seja: só sobrescrever variáveis não pinta nada —
   é preciso repetir os seletores. É o que a seção 5 faz.

   Acessibilidade: o verde #26a737 do "Elemento base" tem contraste 3,15:1 com
   branco, o que reprova em AA para texto normal (botão, link). Por isso o verde
   de PREENCHIMENTO/TEXTO é o verde do brasão #008241 (4,9:1 com branco, AA ok),
   e o #26a737 fica para realce, hover-claro, indicadores e grafismo — usos em
   que 3:1 basta. O laranja nunca leva texto branco: sempre texto escuro.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tipografia oficial: Kanit (títulos) e Maitree (texto corrido)
   Se a rede bloquear fonts.googleapis.com, troque pelo espelho do jsDelivr:
     @import url("https://cdn.jsdelivr.net/npm/@fontsource/kanit@5/400.css");
     @import url("https://cdn.jsdelivr.net/npm/@fontsource/maitree@5/400.css");
   A pilha de fallback termina em Source Sans 3, que o template já carrega.
   -------------------------------------------------------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500;600;700&family=Maitree:wght@300;400;500;600;700&display=swap");

/* --------------------------------------------------------------------------
   2. Tokens da marca
   -------------------------------------------------------------------------- */
:root {
  /* Verdes do "Elemento base" (p.26) */
  --ce-verde: #26a737;
  --ce-verde-limao: #5db12f;
  --ce-verde-medio: #46ac33;
  --ce-verde-claro: #45b16e;
  --ce-verde-agua: #2db39e;

  /* Laranjas e amarelos do "Elemento base" (p.26) */
  --ce-laranja: #f59c00;
  --ce-laranja-vermelho: #e94f0e;
  --ce-laranja-queimado: #e06a0c;
  --ce-ocre: #e4a500;
  --ce-amarelo: #fccf05;

  /* Cores institucionais do brasão (5.CORES, p.11) */
  --ce-verde-brasao: #008241; /* C100 M0 Y75 K30 - Pantone 348 C */
  --ce-grafite: #465564;      /* C70 M85 Y100 K0 - Pantone 7545 C */

  /* Papéis semânticos derivados (ver nota de acessibilidade no topo) */
  --ce-primary: var(--ce-verde-brasao);
  --ce-primary-hover: #006c36;
  --ce-primary-active: #005a2d;
  --ce-primary-rgb: 0, 130, 65;
  --ce-primary-contraste: #ffffff;
  --ce-realce: var(--ce-verde);          /* preenchimentos decorativos, badges */
  --ce-realce-rgb: 38, 167, 55;
  --ce-suave: #e4f4e6;                   /* substitui o #e3f2fd do Saga */
  --ce-suave-borda: #c3e6c8;
  --ce-texto: #212529;
  --ce-texto-suave: #495057;
  --ce-foco: 0 0 0 0.2rem rgba(38, 167, 55, 0.4);

  /* Tipografia (4.TIPOGRAFIA, p.10) */
  --ce-fonte-titulo: "Kanit", "Source Sans 3", "Segoe UI", system-ui, sans-serif;
  --ce-fonte-texto: "Maitree", "Source Sans 3", "Segoe UI", system-ui, sans-serif;

  /* Faixa do grafismo: os dez blocos do "Elemento base" em paradas duras.
     Verdes à esquerda, laranjas à direita — "o que mais se destaca é o verde
     e o laranja" (p.26). */
  --ce-grafismo: linear-gradient(
    to right,
    #26a737 0 10%, #5db12f 10% 20%, #46ac33 20% 30%, #45b16e 30% 40%,
    #2db39e 40% 50%, #f59c00 50% 60%, #e4a500 60% 70%, #fccf05 70% 80%,
    #e06a0c 80% 90%, #e94f0e 90% 100%
  );

  /* Compatibilidade: custom-4.css já expõe --green0..--green4 (os mesmos
     verdes do manual) e o template usa var(--green4) inline no user-header.
     Redeclarados aqui para manter uma única origem de verdade. */
  --green0: var(--ce-verde);
  --green1: var(--ce-verde-limao);
  --green2: var(--ce-verde-medio);
  --green3: var(--ce-verde-claro);
  --green4: var(--ce-verde-agua);
}

/* --------------------------------------------------------------------------
   3. Bootstrap 5.3 (embutido no adminlte.css)
   As variáveis de :root cobrem utilitários que usam var(--bs-*); os componentes
   compilados (botões, paginação, form-check) fixam os valores em cada classe,
   então precisam ser reescritos um a um logo abaixo.
   -------------------------------------------------------------------------- */
:root,
[data-bs-theme="light"] {
  --bs-primary: var(--ce-primary);
  --bs-primary-rgb: var(--ce-primary-rgb);
  --bs-primary-text-emphasis: var(--ce-primary-active);
  --bs-primary-bg-subtle: var(--ce-suave);
  --bs-primary-border-subtle: var(--ce-suave-borda);

  --bs-secondary: var(--ce-grafite);
  --bs-secondary-rgb: 70, 85, 100;

  /* Sucesso usa o mesmo verde do brasão da primária: é o único verde do manual
     que passa em AA com texto branco (#46ac33 dá 2,9:1). Os verdes claros do
     "Elemento base" ficam só em superfícies decorativas (faixa, marcadores). */
  --bs-success: var(--ce-verde-brasao);
  --bs-success-rgb: 0, 130, 65;
  --bs-info: var(--ce-verde-agua);
  --bs-info-rgb: 45, 179, 158;
  --bs-warning: var(--ce-laranja);
  --bs-warning-rgb: 245, 156, 0;
  /* --bs-danger fica no vermelho padrão de propósito: o laranja-vermelho do
     manual (#e94f0e) confunde-se com o laranja de aviso em botões de excluir. */

  --bs-link-color: var(--ce-primary);
  --bs-link-color-rgb: var(--ce-primary-rgb);
  --bs-link-hover-color: var(--ce-primary-active);
  --bs-link-hover-color-rgb: 0, 90, 45;

  --bs-focus-ring-color: rgba(38, 167, 55, 0.35);

  --bs-body-font-family: var(--ce-fonte-texto);
  --bs-body-color: var(--ce-texto);
}

/* Títulos em Kanit; o manual usa a família geométrica para títulos e a Maitree
   para texto corrido. */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.card-title,
.brand-text,
#page-header,
.ce-titulo {
  font-family: var(--ce-fonte-titulo);
  font-weight: 600;
  letter-spacing: 0.01em;
}

body,
body .ui-widget,
body .ui-widget .ui-widget {
  font-family: var(--ce-fonte-texto);
}

/* Botões ---------------------------------------------------------------- */
.btn-primary {
  --bs-btn-color: var(--ce-primary-contraste);
  --bs-btn-bg: var(--ce-primary);
  --bs-btn-border-color: var(--ce-primary);
  --bs-btn-hover-color: var(--ce-primary-contraste);
  --bs-btn-hover-bg: var(--ce-primary-hover);
  --bs-btn-hover-border-color: var(--ce-primary-hover);
  --bs-btn-focus-shadow-rgb: var(--ce-realce-rgb);
  --bs-btn-active-color: var(--ce-primary-contraste);
  --bs-btn-active-bg: var(--ce-primary-active);
  --bs-btn-active-border-color: var(--ce-primary-active);
  --bs-btn-disabled-color: var(--ce-primary-contraste);
  --bs-btn-disabled-bg: var(--ce-primary);
  --bs-btn-disabled-border-color: var(--ce-primary);
}

.btn-outline-primary {
  --bs-btn-color: var(--ce-primary);
  --bs-btn-border-color: var(--ce-primary);
  --bs-btn-hover-color: var(--ce-primary-contraste);
  --bs-btn-hover-bg: var(--ce-primary);
  --bs-btn-hover-border-color: var(--ce-primary);
  --bs-btn-focus-shadow-rgb: var(--ce-realce-rgb);
  --bs-btn-active-color: var(--ce-primary-contraste);
  --bs-btn-active-bg: var(--ce-primary);
  --bs-btn-active-border-color: var(--ce-primary);
  --bs-btn-disabled-color: var(--ce-primary);
  --bs-btn-disabled-border-color: var(--ce-primary);
}

.btn-secondary {
  --bs-btn-bg: var(--ce-grafite);
  --bs-btn-border-color: var(--ce-grafite);
  --bs-btn-hover-bg: #38434f;
  --bs-btn-hover-border-color: #38434f;
  --bs-btn-active-bg: #2c353f;
  --bs-btn-active-border-color: #2c353f;
  --bs-btn-disabled-bg: var(--ce-grafite);
  --bs-btn-disabled-border-color: var(--ce-grafite);
}

.btn-success {
  --bs-btn-bg: var(--ce-verde-brasao);
  --bs-btn-border-color: var(--ce-verde-brasao);
  --bs-btn-hover-bg: var(--ce-primary-hover);
  --bs-btn-hover-border-color: var(--ce-primary-hover);
  --bs-btn-active-bg: var(--ce-primary-active);
  --bs-btn-active-border-color: var(--ce-primary-active);
  --bs-btn-disabled-bg: var(--ce-verde-brasao);
  --bs-btn-disabled-border-color: var(--ce-verde-brasao);
}

/* Laranja com texto escuro: branco sobre #f59c00 reprova em AA. */
.btn-warning {
  --bs-btn-color: var(--ce-texto);
  --bs-btn-bg: var(--ce-laranja);
  --bs-btn-border-color: var(--ce-laranja);
  --bs-btn-hover-color: var(--ce-texto);
  --bs-btn-hover-bg: var(--ce-ocre);
  --bs-btn-hover-border-color: var(--ce-ocre);
  --bs-btn-active-color: var(--ce-texto);
  --bs-btn-active-bg: var(--ce-laranja-queimado);
  --bs-btn-active-border-color: var(--ce-laranja-queimado);
  --bs-btn-disabled-color: var(--ce-texto);
  --bs-btn-disabled-bg: var(--ce-laranja);
  --bs-btn-disabled-border-color: var(--ce-laranja);
}

.btn-info {
  --bs-btn-color: var(--ce-texto);
  --bs-btn-bg: var(--ce-verde-agua);
  --bs-btn-border-color: var(--ce-verde-agua);
  --bs-btn-hover-color: var(--ce-texto);
  --bs-btn-hover-bg: #26a08e;
  --bs-btn-hover-border-color: #26a08e;
  --bs-btn-active-color: var(--ce-texto);
  --bs-btn-active-bg: #1f8d7d;
  --bs-btn-active-border-color: #1f8d7d;
}

/* Estados e utilitários compilados ---------------------------------------- */
.bg-primary,
.text-bg-primary {
  background-color: var(--ce-primary) !important;
  color: var(--ce-primary-contraste) !important;
}

.text-primary {
  color: var(--ce-primary) !important;
}

.border-primary {
  border-color: var(--ce-primary) !important;
}

.link-primary {
  color: var(--ce-primary) !important;
}

.link-primary:hover,
.link-primary:focus {
  color: var(--ce-primary-active) !important;
}

.badge.bg-primary {
  background-color: var(--ce-primary) !important;
}

.badge.bg-warning {
  color: var(--ce-texto) !important;
}

.page-item.active .page-link,
.page-link.active {
  background-color: var(--ce-primary);
  border-color: var(--ce-primary);
}

.page-link {
  color: var(--ce-primary);
}

.nav-pills {
  --bs-nav-pills-link-active-bg: var(--ce-primary);
}

.list-group-item.active {
  background-color: var(--ce-primary);
  border-color: var(--ce-primary);
}

.dropdown-menu {
  --bs-dropdown-link-active-bg: var(--ce-primary);
}

.form-check-input:checked {
  background-color: var(--ce-primary);
  border-color: var(--ce-primary);
}

.form-check-input:focus,
.form-control:focus,
.form-select:focus {
  border-color: var(--ce-realce);
  box-shadow: var(--ce-foco);
}

.progress-bar {
  background-color: var(--ce-primary);
}

/* --------------------------------------------------------------------------
   4. AdminLTE 4 - moldura da aplicação
   -------------------------------------------------------------------------- */

/* Faixa do grafismo sob o cabeçalho: é a leitura mais direta do "Elemento
   base" numa interface — a marca aparece como assinatura cromática, sem roubar
   área útil da tela. */
.app-header {
  position: relative;
  border-bottom: 0;
}

.app-header::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: var(--ce-grafismo);
}

.sidebar-brand {
  border-bottom: 2px solid var(--ce-suave-borda);
}

.brand-text {
  color: var(--ce-primary);
}

/* Menu lateral: item ativo em verde institucional, hover em verde suave. */
.app-sidebar {
  --lte-sidebar-menu-active-bg: var(--ce-suave);
  --lte-sidebar-menu-active-color: var(--ce-primary-active);
  --lte-sidebar-hover-bg: rgba(var(--ce-realce-rgb), 0.1);
  --lte-sidebar-hover-color: var(--ce-primary-active);
  --lte-sidebar-active-color: var(--ce-primary-active);
  --lte-sidebar-submenu-active-bg: var(--ce-suave);
  --lte-sidebar-submenu-active-color: var(--ce-primary-active);
  --lte-sidebar-submenu-hover-bg: rgba(var(--ce-realce-rgb), 0.1);
  --lte-sidebar-submenu-hover-color: var(--ce-primary-active);
  --lte-sidebar-header-color: var(--ce-grafite);
}

/* Marcador do item ativo: barra verde à esquerda, ecoando a faixa do grafismo. */
.app-sidebar .sidebar-menu .nav-link.active {
  box-shadow: inset 3px 0 0 var(--ce-verde);
  font-weight: 600;
}

.app-sidebar .nav-header {
  font-family: var(--ce-fonte-titulo);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.app-footer {
  border-top: 2px solid var(--ce-suave-borda);
}

/* Cards com variante de cor do AdminLTE (.card-primary, .card-success, ...) */
.card-primary:not(.card-outline) > .card-header,
.card-primary.card-outline {
  --lte-card-variant-bg: var(--ce-primary);
  --lte-card-variant-bg-rgb: var(--ce-primary-rgb);
}

.card-success:not(.card-outline) > .card-header,
.card-success.card-outline {
  --lte-card-variant-bg: var(--ce-verde-brasao);
  --lte-card-variant-bg-rgb: 0, 130, 65;
}

.card-warning:not(.card-outline) > .card-header,
.card-warning.card-outline {
  --lte-card-variant-bg: var(--ce-laranja);
  --lte-card-variant-bg-rgb: 245, 156, 0;
  --lte-card-variant-color: var(--ce-texto);
  --lte-card-variant-color-rgb: 33, 37, 41;
}

.card-info:not(.card-outline) > .card-header,
.card-info.card-outline {
  --lte-card-variant-bg: var(--ce-verde-agua);
  --lte-card-variant-bg-rgb: 45, 179, 158;
  --lte-card-variant-color: var(--ce-texto);
  --lte-card-variant-color-rgb: 33, 37, 41;
}

/* --------------------------------------------------------------------------
   5. PrimeFaces (tema Saga)
   O Saga grava #2196f3 (marca) e #e3f2fd (realce/seleção) direto nas regras,
   sem variável intermediária. Cada seletor abaixo espelha um seletor do
   theme.css do PrimeFaces 14 — daí a repetição aparentemente redundante.
   -------------------------------------------------------------------------- */

/* Botões */
body .ui-button {
  background: var(--ce-primary);
  border-color: var(--ce-primary);
  color: var(--ce-primary-contraste);
}

body .ui-button:enabled:hover,
body .ui-button.ui-state-hover {
  background: var(--ce-primary-hover);
  border-color: var(--ce-primary-hover);
}

body .ui-button:focus,
body .ui-button.ui-state-focus {
  box-shadow: var(--ce-foco);
}

/* custom-4.css deixa .ui-button cinza (#f8f9fa) com !important para o botão
   neutro; só os botões de ação declarados abaixo voltam ao verde. */
body .ui-button.ui-button-primary,
body .ui-button.ui-priority-primary {
  background-color: var(--ce-primary) !important;
  border-color: var(--ce-primary) !important;
  color: var(--ce-primary-contraste) !important;
}

/* custom-4.css pinta ui-button-success de #689f38; aqui volta ao verde do
   brasão, que é o botão de ação principal da maioria das telas (Salvar,
   Calcular) e precisa de contraste AA com o texto branco. */
body .ui-button.ui-button-success {
  background: var(--ce-primary) !important;
  border-color: var(--ce-primary) !important;
  color: var(--ce-primary-contraste) !important;
}

/* Botão de encerrar sessão do gov.br: custom-4.css o fixa em --green0
   (#26a737, 3,15:1 com branco). Alinhado ao verde institucional. */
#govBrLogoutBtn > button {
  border-color: var(--ce-primary) !important;
  background: var(--ce-primary) !important;
}

#govBrLogoutBtn > button:hover {
  border-color: var(--ce-primary-hover) !important;
  background: var(--ce-primary-hover) !important;
}

body .ui-button.ui-button-warning {
  background: var(--ce-laranja) !important;
  border-color: var(--ce-laranja) !important;
  color: var(--ce-texto) !important;
}

body .ui-button.ui-button-outlined,
body .ui-button.ui-button-flat {
  color: var(--ce-primary);
}

body .ui-button.ui-button-outlined.ui-state-hover,
body .ui-button.ui-button-flat.ui-state-hover {
  background: rgba(var(--ce-realce-rgb), 0.06);
  color: var(--ce-primary);
}

body .ui-button.ui-button-outlined.ui-state-active,
body .ui-button.ui-button-outlined.ui-state-down,
body .ui-button.ui-button-flat.ui-state-active,
body .ui-button.ui-button-flat.ui-state-down {
  background: rgba(var(--ce-realce-rgb), 0.16);
  color: var(--ce-primary);
}

body .ui-selectbooleanbutton.ui-state-active,
body .ui-selectonebutton > .ui-button.ui-state-active,
body .ui-selectmanybutton > .ui-button.ui-state-active {
  background: var(--ce-primary) !important;
  border-color: var(--ce-primary) !important;
  color: var(--ce-primary-contraste) !important;
}

/* Links */
body .ui-commandlink,
body .ui-link {
  color: var(--ce-primary) !important;
}

/* Campos: borda e anel de foco */
body .ui-inputfield.ui-state-hover,
body .ui-selectonemenu.ui-state-hover,
body .ui-selectcheckboxmenu.ui-state-hover,
body .ui-cascadeselect:not(.ui-state-disabled):hover,
body .ui-datepicker .ui-timepicker-timeinput input:hover {
  border-color: var(--ce-realce);
}

body .ui-inputfield.ui-state-focus,
body .ui-selectonemenu.ui-state-focus,
body .ui-selectcheckboxmenu.ui-state-focus,
body .ui-cascadeselect:not(.ui-state-disabled).ui-state-focus,
body .ui-inplace .ui-inplace-display.ui-state-focus,
body .ui-inputswitch .ui-inputswitch-handle.ui-state-focus,
body .ui-datepicker .ui-timepicker-timeinput input:focus {
  border-color: var(--ce-realce);
  box-shadow: var(--ce-foco);
}

/* Seleção (checkbox, radio, switch) */
body .ui-chkbox .ui-chkbox-box.ui-state-hover,
body .ui-radiobutton .ui-radiobutton-box.ui-state-hover {
  border-color: var(--ce-realce);
}

body .ui-chkbox .ui-chkbox-box.ui-state-active,
body .ui-radiobutton .ui-radiobutton-box.ui-state-active,
body.ui-input-filled .ui-chkbox .ui-chkbox-box.ui-state-active,
body .ui-input-filled .ui-chkbox .ui-chkbox-box.ui-state-active,
body.ui-input-filled .ui-radiobutton .ui-radiobutton-box.ui-state-active,
body .ui-input-filled .ui-radiobutton .ui-radiobutton-box.ui-state-active {
  border-color: var(--ce-primary) !important;
  background: var(--ce-primary) !important;
  color: var(--ce-primary-contraste) !important;
}

body .ui-inputswitch.ui-inputswitch-checked,
body .ui-toggleswitch.ui-toggleswitch-checked .ui-toggleswitch-slider {
  background: var(--ce-primary);
}

/* Tabelas: coluna ordenada, linha selecionada, redimensionador */
body .ui-datatable thead th.ui-state-active,
body .ui-datatable thead th.ui-state-active.ui-state-hover,
body .ui-treetable thead th.ui-state-active,
body .ui-treetable thead th.ui-state-active.ui-state-hover {
  color: var(--ce-primary) !important;
}

body .ui-datatable thead th .ui-sortable-column-badge,
body .ui-treetable thead th .ui-sortable-column-badge {
  background: var(--ce-primary) !important;
  color: var(--ce-primary-contraste) !important;
}

body .ui-datatable .ui-column-resizer-helper,
body .ui-treetable .ui-column-resizer-helper {
  background: var(--ce-realce);
}

body .ui-datatable .ui-datatable-data > tr.ui-state-highlight,
body .ui-datatable .ui-datatable-data > tr.ui-datatable-rowordering,
body .ui-datatable.ui-datatable-striped .ui-datatable-data > tr.ui-datatable-odd.ui-state-highlight,
body .ui-treetable .ui-treetable-data > tr.ui-state-highlight {
  background: var(--ce-suave);
  color: var(--ce-texto-suave);
}

/* Realce/seleção em painéis, listas e overlays */
body .ui-autocomplete-panel .ui-autocomplete-items .ui-autocomplete-item.ui-state-highlight,
body .ui-autocomplete-itemtip.ui-state-highlight,
body .ui-selectonemenu-panel .ui-selectonemenu-items .ui-selectonemenu-item.ui-state-highlight,
body .ui-selectcheckboxmenu-panel .ui-selectcheckboxmenu-items .ui-selectcheckboxmenu-item.ui-state-highlight,
body .ui-cascadeselect-panel .ui-cascadeselect-items .ui-cascadeselect-item.ui-state-highlight,
body .ui-selectonelistbox .ui-selectlistbox-listcontainer .ui-selectlistbox-list .ui-selectlistbox-item.ui-state-highlight,
body .ui-selectmanymenu .ui-selectlistbox-listcontainer .ui-selectlistbox-list .ui-selectlistbox-item.ui-state-highlight,
body .ui-multiselectlistbox .ui-multiselectlistbox-listcontainer .ui-multiselectlistbox-list .ui-multiselectlistbox-item.ui-state-highlight,
body .ui-orderlist .ui-orderlist-list .ui-orderlist-item.ui-state-highlight,
body .ui-picklist .ui-picklist-list .ui-picklist-item.ui-state-highlight,
body .ui-tree .ui-tree-container .ui-treenode .ui-treenode-content .ui-treenode-label.ui-state-highlight,
body .ui-tree .ui-tree-container .ui-treenode .ui-treenode-content.ui-state-highlight,
body .ui-tree.ui-tree-horizontal .ui-treenode-content.ui-state-highlight,
body .ui-tagcloud a.ui-state-hover,
body .ui-wizard .ui-wizard-step-titles .ui-wizard-step-title.ui-state-highlight,
body .ui-steps .ui-steps-item.ui-state-highlight .ui-steps-number {
  background: var(--ce-suave);
  color: var(--ce-texto-suave);
  border-color: var(--ce-suave-borda);
}

/* Marcadores (tokens, chips) */
body .ui-autocomplete .ui-autocomplete-multiple-container .ui-autocomplete-token,
body .ui-selectcheckboxmenu .ui-selectcheckboxmenu-multiple-container .ui-selectcheckboxmenu-token,
body .ui-chips .ui-chips-container .ui-chips-token,
body .ui-chip {
  background: var(--ce-suave);
  color: var(--ce-texto-suave);
}

/* Paginação */
body .ui-paginator .ui-paginator-pages .ui-paginator-page.ui-state-active {
  background: var(--ce-suave);
  color: var(--ce-primary-active);
  font-weight: 600;
}

/* Calendário */
body .ui-datepicker .ui-datepicker-calendar td > a.ui-state-active,
body .ui-datepicker .ui-datepicker-calendar td > span.ui-state-active,
body .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-today > a.ui-state-active,
body .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-today > span.ui-state-active,
body .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-current-day > a.ui-state-active,
body .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-current-day > span.ui-state-active,
body .ui-datepicker .ui-monthpicker-month.ui-state-active,
body .fc .fc-daygrid-day.fc-day-today,
body .fc .fc-timegrid-col.fc-day-today {
  background: var(--ce-suave);
  color: var(--ce-texto-suave);
}

body .fc .fc-toolbar .fc-button {
  background: var(--ce-primary);
  border-color: var(--ce-primary);
  color: var(--ce-primary-contraste);
}

/* Abas */
body .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active a,
body .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active .ui-icon,
body .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem.ui-state-active a,
body .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem.ui-state-active a .ui-icon {
  color: var(--ce-primary);
}

body .ui-tabs.ui-tabs-top > .ui-tabs-nav li.ui-tabs-header.ui-state-active,
body .ui-tabs.ui-tabs-bottom > .ui-tabs-nav li.ui-tabs-header.ui-state-active,
body .ui-tabs.ui-tabs-left > .ui-tabs-nav li.ui-tabs-header.ui-state-active,
body .ui-tabs.ui-tabs-right > .ui-tabs-nav li.ui-tabs-header.ui-state-active,
body .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem.ui-state-active,
body .ui-tabmenu.ui-tabs-bottom .ui-tabmenu-nav .ui-tabmenuitem.ui-state-active,
body .ui-tabmenu.ui-tabs-left .ui-tabmenu-nav .ui-tabmenuitem.ui-state-active,
body .ui-tabmenu.ui-tabs-right .ui-tabmenu-nav .ui-tabmenuitem.ui-state-active {
  border-color: var(--ce-primary);
}

/* Indicadores diversos */
body .ui-badge,
body .ui-tag,
body .ui-progressbar .ui-progressbar-value,
body .ui-slider .ui-slider-range,
body .ui-overlaypanel .ui-overlaypanel-close,
body .ui-carousel .ui-carousel-indicators .ui-carousel-indicator.ui-state-highlight button,
body .ui-galleria .ui-galleria-indicators .ui-galleria-indicator.ui-state-highlight button {
  background: var(--ce-primary);
  color: var(--ce-primary-contraste);
}

body .ui-slider .ui-slider-handle {
  border-color: var(--ce-realce);
}

body .ui-slider .ui-slider-handle.ui-state-hover {
  border-color: var(--ce-primary);
  background: var(--ce-primary);
}

body .ui-chronoline .ui-chronoline-event-marker {
  border-color: var(--ce-primary);
}

body .ui-dashboard .ui-sortable-placeholder {
  background-color: var(--ce-suave);
}

/* Cabeçalhos de painel/card em Kanit, como nos títulos do manual. */
body .ui-panel .ui-panel-titlebar,
body .ui-fieldset .ui-fieldset-legend,
body .ui-card .ui-card-title,
body .ui-dialog .ui-dialog-titlebar {
  font-family: var(--ce-fonte-titulo);
  font-weight: 600;
}

/* --------------------------------------------------------------------------
   6. Utilitários da marca
   Para uso pontual em telas (cabeçalho de relatório, destaque de seção).
   -------------------------------------------------------------------------- */
.ce-faixa-grafismo {
  height: 6px;
  width: 100%;
  background: var(--ce-grafismo);
  border-radius: 3px;
}

.ce-texto-verde { color: var(--ce-primary) !important; }
.ce-texto-laranja { color: var(--ce-laranja-queimado) !important; }
.ce-texto-grafite { color: var(--ce-grafite) !important; }

.ce-bg-verde { background-color: var(--ce-primary) !important; color: #fff !important; }
.ce-bg-verde-suave { background-color: var(--ce-suave) !important; color: var(--ce-texto) !important; }
.ce-bg-laranja { background-color: var(--ce-laranja) !important; color: var(--ce-texto) !important; }
.ce-bg-grafite { background-color: var(--ce-grafite) !important; color: #fff !important; }

/* Cabeçalho de seção com a barra do grafismo à esquerda. */
.ce-secao {
  border-left: 4px solid var(--ce-verde);
  padding-left: 0.75rem;
  font-family: var(--ce-fonte-titulo);
  font-weight: 600;
}

/* --------------------------------------------------------------------------
   7. Tema escuro
   O AdminLTE alterna via [data-bs-theme="dark"]. Em fundo escuro o verde do
   brasão fica com contraste baixo, então o papel de primária passa ao verde
   do "Elemento base" (#26a737 sobre #212529 dá ~4,7:1) — é o que o manual
   chama de aplicação sobre tons escuros com a versão de maior contraste.
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] {
  --ce-primary: var(--ce-verde);
  --ce-primary-hover: var(--ce-verde-limao);
  --ce-primary-active: #7cc94f;
  --ce-primary-rgb: var(--ce-realce-rgb);
  --ce-primary-contraste: #06210b;
  --ce-suave: rgba(38, 167, 55, 0.18);
  --ce-suave-borda: rgba(38, 167, 55, 0.35);
  --ce-texto: #e9ecef;
  --ce-texto-suave: #ced4da;

  --bs-primary: var(--ce-primary);
  --bs-primary-rgb: var(--ce-primary-rgb);
  --bs-link-color: var(--ce-primary);
  --bs-link-hover-color: var(--ce-primary-active);
  --bs-primary-bg-subtle: var(--ce-suave);
  --bs-primary-border-subtle: var(--ce-suave-borda);
}

/* --------------------------------------------------------------------------
   8. Impressão
   Relatórios saem em preto e branco na maioria das impressoras do setor; a
   faixa do grafismo vira ruído. O manual prevê versão em escala de cinza.
   -------------------------------------------------------------------------- */
@media print {
  .app-header::after,
  .ce-faixa-grafismo {
    display: none;
  }
}
