/* RGA Análise — padrão de layout do Diego (tokens do CLAUDE.md) */
.rga {
  --rga-pri: #0F5F73; --rga-txt: #1F2933; --rga-sec: #5B6672; --rga-fundo: #EEF1F4; --rga-borda: #D5DBE1; --rga-borda2: #C9D1D9; --rga-card: #fff;
  --rga-verm: #A61B1B; --rga-vermbg: #FDECEC; --rga-verde: #1E6B35; --rga-verdebg: #E6F4EA; --rga-info: #0F5F73; --rga-infobg: #EAF2F5;
  --rga-femea: #FCE8F1; --rga-femeaf: #D6649A; --rga-macho: #E3F6F8; --rga-machof: #2BA3B5; --rga-morte: #ECEEF1; --rga-mortef: #8A94A0; --rga-venda: #7A1F1F; --rga-descarte: #FDEBD8; --rga-descartef: #E07B1F;
}
:where(.rga) * { box-sizing: border-box; }
html, .rga { margin: 0; }
.rga { background: var(--rga-fundo); color: var(--rga-txt); font: 15px/1.4 Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
:where(.rga) a { color: var(--rga-pri); }
:where(.rga) button, :where(.rga) input, :where(.rga) select { font: inherit; color: inherit; }
:where(.rga) h1 { font-size: 20px; margin: 0; }
:where(.rga) h2 { font-size: 16px; margin: 0; }
:where(.rga) p { margin: 0; }
.rga-mut { color: var(--rga-sec); font-size: 13px; }
.rga-num { font-variant-numeric: tabular-nums; }

/* barra superior */
.rga-topo { background: var(--rga-pri); color: #fff; display: flex; align-items: center; gap: 12px; padding: 10px 16px; position: sticky; top: 0; z-index: 5; flex-wrap: wrap; }
.rga-marca { font-weight: 700; font-size: 17px; white-space: nowrap; }
.rga-busca { flex: 1; min-width: 160px; max-width: 420px; height: 40px; border-radius: 8px; border: none; padding: 0 12px; color: var(--rga-txt); }
.rga-carimbo { font-size: 13px; opacity: .92; white-space: nowrap; }
.rga-carimbo.rga-vazio { opacity: .75; }

/* menu: no computador, abaixo da barra; no celular, fixo embaixo */
.rga-menu { display: flex; gap: 4px; background: #fff; border-bottom: 1px solid var(--rga-borda); padding: 0 12px; }
.rga-menu a { padding: 12px 14px; text-decoration: none; color: var(--rga-sec); font-weight: 600; border-bottom: 3px solid transparent; min-height: 44px; display: flex; align-items: center; }
.rga-menu a.rga-ativo { color: var(--rga-pri); border-bottom-color: var(--rga-pri); }

:where(.rga) main { max-width: 1180px; margin: 0 auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.rga-linha { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.rga-linha > .rga-cresce { flex: 1; }

/* quadros */
.rga-quadro { background: var(--rga-card); border: 1px solid var(--rga-borda); border-radius: 8px; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.rga-rotulo { font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--rga-pri); background: none; border: none; padding: 0; cursor: pointer; text-align: left; display: inline-flex; align-items: center; gap: 4px; min-height: 24px; }
.rga-rotulo::after { content: "▾"; font-size: 12px; }
.rga-quadro.rga-fechado > .rga-rotulo::after, :where(.rga) details:not([open]) > summary.rga-rotulo::after { content: "▸"; }
:where(.rga) details > summary.rga-rotulo { list-style: none; }
:where(.rga) details > summary.rga-rotulo::-webkit-details-marker { display: none; }
:where(.rga) details[open] > summary.rga-rotulo { margin-bottom: 10px; }
.rga-quadro.rga-fechado > .rga-corpo { display: none; }
.rga-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.rga-grade2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
.rga-par { display: flex; flex-direction: column; min-width: 0; }
.rga-par b { font-size: 16px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.rga-par span { color: var(--rga-sec); font-size: 12px; }

/* índice */
.rga-ind { justify-content: space-between; border: 1px solid var(--rga-borda); border-radius: 8px; padding: 10px 12px; display: flex; flex-direction: column; gap: 4px; background: #fff; }
.rga-ind .rga-nome { display: flex; justify-content: space-between; gap: 8px; color: var(--rga-sec); font-size: 13px; }
.rga-ind .rga-vals { display: flex; flex-direction: column; gap: 0; }
.rga-ind .rga-valor { font-size: 24px; font-weight: 700; font-variant-numeric: tabular-nums; background: none; border: none; padding: 0; cursor: pointer; color: var(--rga-txt); text-align: left; min-height: 32px; }
.rga-ind .rga-valor:hover { text-decoration: underline; }
.rga-ind .rga-ant { color: var(--rga-sec); font-variant-numeric: tabular-nums; }
.rga-ind .rga-meta { font-size: 12px; color: var(--rga-sec); }
.rga-ind.rga-ruim { background: var(--rga-vermbg); border-color: #F1C3C3; } .rga-ind.rga-ruim .rga-valor { color: var(--rga-verm); }
.rga-ind.rga-bom .rga-valor { color: var(--rga-verde); }
.rga-q { width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--rga-borda2); background: #fff; color: var(--rga-pri); font-weight: 700; cursor: pointer; flex: none; padding: 0; }
.rga-desconhecido { color: var(--rga-sec); font-weight: 600; }

/* avisos e selos */
.rga-aviso { border-radius: 8px; padding: 10px 12px; font-size: 14px; }
.rga-aviso.rga-erro { background: var(--rga-vermbg); color: var(--rga-verm); }
.rga-aviso.rga-ok { background: var(--rga-verdebg); color: var(--rga-verde); }
.rga-aviso.rga-info { background: var(--rga-infobg); color: var(--rga-info); }
.rga-selo { display: inline-block; border-radius: 999px; padding: 2px 10px; font-size: 12px; font-weight: 600; background: var(--rga-vermbg); color: var(--rga-verm); }
.rga-selos { display: grid; grid-template-columns: repeat(2, max-content); gap: 6px; }

/* botões e campos */
.rga-bt { min-height: 44px; padding: 0 18px; border-radius: 8px; border: 1px solid var(--rga-pri); background: var(--rga-pri); color: #fff; font-weight: 600; cursor: pointer; }
.rga-bt.rga-sec { background: #fff; color: var(--rga-pri); }
.rga-bt:disabled { opacity: .5; cursor: default; }
.rga-campo { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--rga-sec); }
.rga-campo input, .rga-campo select, :where(.rga) select.rga-sel { height: 44px; border: 1px solid var(--rga-borda2); border-radius: 8px; padding: 0 10px; background: #fff; color: var(--rga-txt); min-width: 0; }
.rga-lista { display: flex; flex-direction: column; }
.rga-lista a, .rga-lista button.rga-item { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 12px 4px; border: none; border-top: 1px solid var(--rga-borda); background: none; text-align: left; text-decoration: none; color: var(--rga-txt); min-height: 48px; cursor: pointer; width: 100%; }
.rga-lista a:first-child, .rga-lista button.rga-item:first-child { border-top: none; }
.rga-lista .rga-cont { color: var(--rga-sec); white-space: nowrap; font-variant-numeric: tabular-nums; }
.rga-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.rga-chip { min-height: 36px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--rga-borda2); background: #fff; cursor: pointer; font-size: 13px; }
.rga-chip.rga-ativo { border-color: var(--rga-pri); background: var(--rga-infobg); color: var(--rga-pri); font-weight: 600; }

/* tabelas */
.rga-rolagem { overflow-x: auto; border: 1px solid var(--rga-borda); border-radius: 8px; background: #fff; }
:where(.rga) table { border-collapse: collapse; width: 100%; font-size: 14px; }
:where(.rga) th, :where(.rga) td { padding: 8px 10px; border-bottom: 1px solid #E6EAEE; text-align: left; white-space: nowrap; vertical-align: top; }
:where(.rga) th { background: #F7F9FA; font-size: 12px; color: var(--rga-sec); font-weight: 600; position: sticky; top: 0; }
:where(.rga) th .rga-ord { background: none; border: none; padding: 0; font: inherit; color: inherit; cursor: pointer; }
:where(.rga) th .rga-filtro { display: block; margin-top: 4px; width: 100%; min-width: 80px; height: 30px; border: 1px solid var(--rga-borda2); border-radius: 6px; font-size: 12px; padding: 0 6px; background: #fff; color: var(--rga-txt); }
:where(.rga) td.rga-n, :where(.rga) th.rga-n { text-align: right; font-variant-numeric: tabular-nums; }
:where(.rga) td.rga-fixa, :where(.rga) th.rga-fixa { position: sticky; left: 0; background: inherit; z-index: 1; }
:where(.rga) tbody tr { background: #fff; }
:where(.rga) tr.rga-perda td { color: var(--rga-verm); }
:where(.rga) td.rga-vazio { color: var(--rga-sec); text-align: center; }

/* ficha do animal: fundo pela situação (situação vence sexo) */
.rga-cab { border-radius: 8px; border: 1px solid var(--rga-borda); border-left-width: 6px; padding: 12px 14px; display: grid; grid-template-columns: auto 1fr; gap: 10px 24px; align-items: start; }
.rga-cab .rga-par .rga-codigo { font-size: 28px; font-weight: 800; line-height: 1.1; color: inherit; }
.rga-cab.rga-F { background: var(--rga-femea); border-left-color: var(--rga-femeaf); }
.rga-cab.rga-M { background: var(--rga-macho); border-left-color: var(--rga-machof); }
.rga-cab.rga-morte { background: var(--rga-morte); border-left-color: var(--rga-mortef); }
.rga-cab.rga-descarte { background: var(--rga-descarte); border-left-color: var(--rga-descartef); }
.rga-cab.rga-venda { background: var(--rga-venda); border-left-color: var(--rga-venda); color: #fff; }
.rga-cab.rga-venda .rga-par span, .rga-cab.rga-venda a { color: #F3DADA; }

:where(.rga) dialog { border: none; border-radius: 12px; padding: 18px; max-width: 560px; width: calc(100% - 32px); color: var(--rga-txt); }
:where(.rga) dialog::backdrop { background: rgba(0, 0, 0, .45); }
:where(.rga) dialog h2 { margin-bottom: 8px; }
:where(.rga) dialog ul { padding-left: 18px; margin: 6px 0; }
:where(.rga) dialog .rga-acoes { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }

@media (max-width: 720px) {
  .rga { padding-bottom: 64px; }
  .rga-topo { padding: 8px 12px; gap: 8px; }
  .rga-busca { order: 3; max-width: none; flex-basis: 100%; height: 44px; }
  .rga-carimbo { font-size: 12px; }
  .rga-menu { position: fixed; bottom: 0; left: 0; right: 0; z-index: 6; border-top: 1px solid var(--rga-borda); border-bottom: none; padding: 0; justify-content: space-around; }
  .rga-menu a { flex: 1; justify-content: center; border-bottom: none; border-top: 3px solid transparent; font-size: 13px; padding: 8px 2px; min-height: 56px; }
  .rga-menu a.rga-ativo { border-top-color: var(--rga-pri); }
  :where(.rga) main { padding: 12px; }
  .rga-grade { grid-template-columns: 1fr; }
  .rga-grade.rga-inds { grid-template-columns: 1fr 1fr; gap: 8px; }
  .rga-ind { padding: 8px 10px; }
  .rga-ind .rga-valor { font-size: 21px; }
  .rga-cab { grid-template-columns: 1fr; }
}
@media print { .rga-topo, .rga-menu, .rga-naoimprime { display: none !important; } .rga { background: #fff; } }
/* "?" pequeno na tela, mas com área de toque de 44 px */
.rga-q { position: relative; }
.rga-q::before { content: ""; position: absolute; inset: -9px; }
