/* ══════════════════════════════════════════
   IDENTIDADE VISUAL — JUDERA
   Marinho, ouro e papel; de noite, o mesmo marinho mais fundo. Carregado logo
   depois do bootstrap.min.css em todas as páginas: define os tokens da marca,
   troca a cor "primary" do Bootstrap 5.2 (botões, links, seleções, paginação,
   foco) e as variáveis que a navegação (navbar.css) e o modo escuro (dark.css)
   usam. Logo: assets/img/judera-marca.svg (símbolos selo, assinatura,
   assinatura-compacta e vertical, cores por variável) e os avulsos judera-*.svg.
   ══════════════════════════════════════════ */

/* ── Fontes, hospedadas em assets/fonts (licença OFL, ver LICENCA.txt; só o subconjunto latino, ~165 KB
   no total). EB Garamond e IBM Plex Sans são variáveis: um arquivo por família cobre todos os pesos;
   os itálicos e a Plex Mono são instâncias fixas. ── */
@font-face { font-family: 'EB Garamond'; font-style: normal; font-weight: 400 800; font-display: swap; src: url(../fonts/EBGaramond.woff2) format('woff2'); }
@font-face { font-family: 'EB Garamond'; font-style: italic; font-weight: 400; font-display: swap; src: url(../fonts/EBGaramond-Italic.woff2) format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 100 700; font-display: swap; src: url(../fonts/IBMPlexSans.woff2) format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-style: italic; font-weight: 400; font-display: swap; src: url(../fonts/IBMPlexSans-Italic.woff2) format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/IBMPlexMono.woff2) format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/IBMPlexMono-600.woff2) format('woff2'); }

:root {
  /* marca */
  --judera-marinho: #0B1F3B;          /* cor da marca: barra lateral, botões principais, cabeçalhos de tabela */
  --judera-marinho-rgb: 11, 31, 59;
  --judera-marinho-claro: #16345F;    /* hover de botão */
  --judera-marinho-escuro: #071528;   /* "noite": botão pressionado, menus sobre a barra, placa do selo sobre a barra */
  --judera-azul: #2C5C99;             /* links e destaques sobre fundo claro */
  --judera-azul-rgb: 44, 92, 153;
  --judera-azul-suave: #E8EEF6;       /* fundo de hover/ativo em áreas claras */
  --judera-destaque: #9DBBE3;         /* azul-claro sobre o marinho (links e botões no modo escuro) */
  --judera-texto-barra: #B4C3D8;      /* itens da barra lateral */
  --judera-ouro: #B08D57;             /* ouro velho: filete do selo, item ativo da barra, linhas de documento — nunca em botão */
  --judera-ouro-claro: #D4B978;       /* o mesmo ouro sobre o marinho e no modo escuro */
  --judera-ouro-texto: #8A6B34;       /* ouro para letras pequenas sobre branco (rótulos), com contraste */

  /* dia */
  --judera-papel: #F2F4F8;            /* fundo da página: branco puxado ao marinho */
  --judera-tinta: #101B2D;            /* texto */
  --judera-cinza: #5B6B82;            /* texto secundário, rótulos, ícones */
  --judera-linha: #DCE2EC;            /* bordas e divisórias */

  /* noite (modo escuro) */
  --judera-noite-fundo: #0A1324;      /* página */
  --judera-noite-cartao: #111C31;     /* cards, tabelas, modais */
  --judera-noite-cartao-alto: #172440;/* hover, campos, linhas intercaladas */
  --judera-noite-linha: #22314D;      /* bordas e divisórias */
  --judera-noite-texto: #E7ECF5;      /* texto (nunca branco puro) */
  --judera-noite-secundario: #9AA8BF; /* rótulos e ícones */
  --judera-noite-barra: #070F1D;      /* barra lateral */

  /* estados — os únicos lugares onde entram outras cores */
  --judera-vencido: #B3261E;          /* prazo fatal, tarefa atrasada, erro */
  --judera-atencao: #B45309;          /* vence em breve, aviso do DataJud */
  --judera-em-dia: #1E7B4F;           /* concluído, online, sincronizado */

  /* tipografia: a serifa dá a voz (marca, título da página, saudação, números grandes); a Plex faz o trabalho */
  --judera-fonte-marca: 'EB Garamond', Garamond, 'Times New Roman', serif;
  --judera-fonte-texto: 'IBM Plex Sans', system-ui, 'Segoe UI', Roboto, sans-serif;
  --judera-fonte-mono: 'IBM Plex Mono', Consolas, 'Courier New', monospace;   /* número CNJ, OAB, valores em coluna */
  --bs-body-font-family: var(--judera-fonte-texto);
  --bs-font-sans-serif: var(--judera-fonte-texto);
  --bs-font-monospace: var(--judera-fonte-mono);

  --bs-primary: var(--judera-marinho);
  --bs-primary-rgb: var(--judera-marinho-rgb);
  --bs-link-color: var(--judera-azul);
  --bs-link-hover-color: var(--judera-marinho);
}

/* ── Componentes "primary" do Bootstrap ── */
.btn-primary {
  --bs-btn-bg: var(--judera-marinho);
  --bs-btn-border-color: var(--judera-marinho);
  --bs-btn-hover-bg: var(--judera-marinho-claro);
  --bs-btn-hover-border-color: var(--judera-marinho-claro);
  --bs-btn-active-bg: var(--judera-marinho-escuro);
  --bs-btn-active-border-color: var(--judera-marinho-escuro);
  --bs-btn-disabled-bg: var(--judera-marinho);
  --bs-btn-disabled-border-color: var(--judera-marinho);
  --bs-btn-focus-shadow-rgb: var(--judera-azul-rgb);
}
.btn-outline-primary {
  --bs-btn-color: var(--judera-marinho);
  --bs-btn-border-color: var(--judera-marinho);
  --bs-btn-hover-bg: var(--judera-marinho);
  --bs-btn-hover-border-color: var(--judera-marinho);
  --bs-btn-active-bg: var(--judera-marinho-escuro);
  --bs-btn-active-border-color: var(--judera-marinho-escuro);
  --bs-btn-disabled-color: var(--judera-marinho);
  --bs-btn-disabled-border-color: var(--judera-marinho);
  --bs-btn-focus-shadow-rgb: var(--judera-azul-rgb);
}
.btn-link {
  --bs-btn-color: var(--judera-azul);
  --bs-btn-hover-color: var(--judera-marinho);
  --bs-btn-active-color: var(--judera-marinho);
}
.text-bg-primary { color: #fff !important; background-color: RGBA(var(--judera-marinho-rgb), var(--bs-bg-opacity, 1)) !important; }
.link-primary { color: var(--judera-azul) !important; }
.link-primary:hover, .link-primary:focus { color: var(--judera-marinho) !important; }

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  border-color: #8AA6CC;
  box-shadow: 0 0 0 .25rem rgba(var(--judera-azul-rgb), .25);
}
.form-check-input:checked {
  background-color: var(--judera-marinho);
  border-color: var(--judera-marinho);
}

.pagination {
  --bs-pagination-color: var(--judera-azul);
  --bs-pagination-hover-color: var(--judera-marinho);
  --bs-pagination-focus-color: var(--judera-marinho);
  --bs-pagination-focus-box-shadow: 0 0 0 .25rem rgba(var(--judera-azul-rgb), .25);
  --bs-pagination-active-bg: var(--judera-marinho);
  --bs-pagination-active-border-color: var(--judera-marinho);
}
.nav { --bs-nav-link-hover-color: var(--judera-marinho); }
.nav-pills { --bs-nav-pills-link-active-bg: var(--judera-marinho); }
.dropdown-menu { --bs-dropdown-link-active-bg: var(--judera-marinho); }
.list-group {
  --bs-list-group-active-bg: var(--judera-marinho);
  --bs-list-group-active-border-color: var(--judera-marinho);
}
.progress { --bs-progress-bar-bg: var(--judera-marinho); }

/* ── Modo escuro: o marinho puro some no fundo escuro — usa o azul da mesma família ── */
body.dark-mode {
  --bs-primary: #5B88C4;
  --bs-primary-rgb: 91, 136, 196;
  --bs-link-color: var(--judera-destaque);
  --bs-link-hover-color: #C3D5EE;
}
body.dark-mode .btn-primary {
  --bs-btn-bg: var(--judera-azul);
  --bs-btn-border-color: var(--judera-azul);
  --bs-btn-hover-bg: #3A6CAD;
  --bs-btn-hover-border-color: #3A6CAD;
  --bs-btn-active-bg: #234C80;
  --bs-btn-active-border-color: #234C80;
  --bs-btn-disabled-bg: var(--judera-azul);
  --bs-btn-disabled-border-color: var(--judera-azul);
}
body.dark-mode .btn-outline-primary {
  --bs-btn-color: var(--judera-destaque);
  --bs-btn-border-color: #5B88C4;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--judera-azul);
  --bs-btn-hover-border-color: var(--judera-azul);
  --bs-btn-active-bg: #234C80;
  --bs-btn-active-border-color: #234C80;
}
body.dark-mode .form-check-input:checked { background-color: var(--judera-azul); border-color: var(--judera-azul); }
body.dark-mode .pagination {
  --bs-pagination-active-bg: var(--judera-azul);
  --bs-pagination-active-border-color: var(--judera-azul);
}
body.dark-mode .nav-pills { --bs-nav-pills-link-active-bg: var(--judera-azul); }
body.dark-mode .list-group { --bs-list-group-active-bg: var(--judera-azul); --bs-list-group-active-border-color: var(--judera-azul); }
