/* Tema visual — cores da Arati Distribuidora (autorizada Coca-Cola), mesma
   paleta do arati-fill-rate / arati-checklist. */

:root {
  --pico-font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

:root:not([data-theme="dark"]),
[data-theme="light"] {
  --pico-primary: #F40009;
  --pico-primary-background: #F40009;
  --pico-primary-border: #F40009;
  --pico-primary-underline: #F40009;
  --pico-primary-hover: #C40007;
  --pico-primary-hover-background: #C40007;
  --pico-primary-hover-border: #C40007;
  --pico-primary-hover-underline: #C40007;
  --pico-primary-focus: rgba(244, 0, 9, 0.375);
  --pico-primary-inverse: #FFFFFF;

  --pico-background-color: #FFFFFF;
  --pico-color: #1A1A1A;
  --pico-h1-color: #1A1A1A;
  --pico-h2-color: #1A1A1A;
  --pico-h3-color: #1A1A1A;

  --pico-card-background-color: #F5F5F5;
  --pico-card-sectioning-background-color: #F5F5F5;
  --pico-table-row-stripped-background-color: #F5F5F5;
}

a:not([role="button"]) {
  color: var(--pico-primary);
}



.topo {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
}

.marca { margin-bottom: 0.25rem; }
.marca span { color: var(--pico-primary); }

.barra { display: flex; flex-wrap: wrap; gap: 0 1.5rem; align-items: flex-start; }
.filtros { min-width: 18rem; max-width: 32rem; flex: 1; }
.upload { flex: 1; min-width: 18rem; }
.upload > summary[role="button"] { width: auto; display: inline-block; }
.upload form { margin-top: 0.75rem; }

.carregavel.htmx-request { opacity: 0.5; transition: opacity 0.2s; }

article > header { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; align-items: baseline; justify-content: space-between; }
article > header small { color: var(--pico-muted-color); }

table.compacta { font-size: 0.85rem; }

/* Tabela do genoma: 3 colunas fixas + 18 indicadores estreitos com o nome na
   vertical; rola na horizontal no celular. */
.rolagem { overflow-x: auto; }
table.genoma { font-size: 0.85rem; margin: 0; }
table.genoma th, table.genoma td { padding: 0.3rem 0.4rem; white-space: nowrap; }
table.genoma thead th { vertical-align: bottom; }
table.genoma tr.blocos th { text-align: center; font-size: 0.75rem; border-bottom: 2px solid var(--pico-primary); }
table.genoma th.ind { vertical-align: bottom; }
table.genoma th.ind span { writing-mode: vertical-rl; transform: rotate(180deg); font-weight: 600; }
table.genoma td.num { text-align: right; font-variant-numeric: tabular-nums; }
table.genoma td.flag { text-align: center; font-variant-numeric: tabular-nums; }
table.genoma td.flag.sim { color: #1B7F3B; background: #E6F4EA; font-weight: 700; }
table.genoma td.flag.nao { background: #FDE6E7; }
table.genoma tfoot small { color: var(--pico-muted-color); }

.linha-total td { font-weight: 700; border-top: 2px solid var(--pico-color); }

.bom { color: #1B7F3B; }
.ruim { color: #C40007; }

table.genoma td.cliente { max-width: 22rem; overflow: hidden; text-overflow: ellipsis; }
table.genoma td.cliente .cod { font-variant-numeric: tabular-nums; }
article > header button { width: auto; padding: 0.25rem 0.75rem; font-size: 0.85rem; margin: 0; }

/* Impressao / "Salvar como PDF": A4 deitado, so a tabela, cabecalho repetido
   em toda pagina e as cores dos ✓ mantidas. */
.so-impressao { display: none; }

@page { size: A4 landscape; margin: 8mm; }

@media print {
  .topo, .barra, .nao-imprime { display: none !important; }
  .so-impressao { display: inline; }
  main.container-fluid { padding: 0; }
  article.impressao { background: none; box-shadow: none; padding: 0; margin: 0; }
  article.impressao > header { background: none; padding: 0 0 2mm; margin: 0; border: 0; }
  .rolagem { overflow: visible; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

  table.genoma { font-size: 7pt; line-height: 1.15; width: 100%; border-collapse: collapse; }
  article.impressao > header strong { font-size: 11pt; }
  article.impressao > header small { font-size: 8pt; }
  table.genoma th, table.genoma td { padding: 0.6mm 1mm; border: 0.2mm solid #BBB; background-color: #FFF; }
  table.genoma thead { display: table-header-group; }
  table.genoma tfoot { display: table-row-group; }
  table.genoma tr { break-inside: avoid; }
  table.genoma tr.blocos th { font-size: 6pt; white-space: normal; }
  table.genoma th.ind span { font-size: 6.5pt; }
  table.genoma td.cliente { max-width: 70mm; }
  table.genoma td.flag.sim { background: #E6F4EA; }
  table.genoma td.flag.nao { background: #FDE6E7; }
}

article > header small .atualizado { color: var(--pico-color); }