/**
 * CSS complementar ao Tailwind — apenas o que utilitários não resolvem:
 * variáveis de tema, comportamento do Alpine e regras de impressão.
 */

:root {
  --uva-rgb: 116 56 255;
  --fonte-titulo: Poppins;
}

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: #FAFBFE;
}

a { color: rgb(var(--uva-rgb)); text-decoration: none; }
a:hover { color: #4B4260; }

/* Evita o flash de conteúdo antes do Alpine inicializar. */
[x-cloak] { display: none !important; }

/* ------------------------------------------------------------------ *
 *  Coluna de opções presa à direita (GeradorTabela)
 * ------------------------------------------------------------------ */

/**
 * A separação entre a coluna presa e o resto da tabela não pode ser nem
 * `border` nem `box-shadow` na própria célula: a tabela é `border-collapse:
 * collapse`, e nesse modelo o Chrome descarta as duas coisas em célula
 * posicionada. Aplicadas, elas aparecem certinhas no computed style e
 * simplesmente não são pintadas — foi o que fez a sombra "não funcionar"
 * mesmo com o CSS correto chegando na tela.
 *
 * Trocar para `border-collapse: separate` resolveria a pintura, mas no modelo
 * separado o CSS ignora `border` em `<tr>` — e é de lá que vêm todos os
 * divisores horizontais das linhas. O conserto de um problema apagaria a
 * grade inteira.
 *
 * O pseudo-elemento escapa dos dois: ele não é célula de tabela, então pinta
 * normalmente, e a `<td>` sendo sticky já é bloco de contenção para ele. Fica
 * inteiramente à esquerda da célula (`right: 100%`), cobrindo a altura toda da
 * linha (`top/bottom: 0`), então as faixas de cada linha se encostam e formam
 * uma coluna contínua.
 *
 * O degradê, e não uma sombra dura, é o que passa a ideia de sobreposição: o
 * conteúdo não termina ali, ele entra por baixo. O fio de 1px usa `cinza` em
 * vez do `cinza-claro` das outras bordas porque aqui a divisão não é entre
 * duas colunas quaisquer — é entre o que rola e o que fica.
 *
 * pointer-events: none porque a faixa cobre parte da coluna vizinha, e sem
 * isso ela roubaria o clique de quem estivesse por baixo.
 */
.coluna-fixa::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 100%;
  width: 6px;
  border-right: 1px solid #B4B7D0;
  background: linear-gradient(to left, rgba(31, 34, 42, 0.08), rgba(31, 34, 42, 0));
  pointer-events: none;
}

@media print {
  .coluna-fixa::before { display: none; }
}

/* Faixa listrada usada em estados "em processamento". */
.faixa { background-image: repeating-linear-gradient(135deg, #E4E7F4 0 8px, #F0F2FD 8px 16px); }

/* Barra de rolagem discreta, alinhada à paleta. */
* { scrollbar-width: thin; scrollbar-color: #B4B7D0 transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: #B4B7D0; border-radius: 8px; }
*::-webkit-scrollbar-thumb:hover { background: #797C98; }

/* Remove as setas nativas de inputs numéricos. */
input[type='number']::-webkit-outer-spin-button,
input[type='number']::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type='number'] { -moz-appearance: textfield; }

/* O plugin @tailwindcss/forms já normaliza checkbox/radio; garantimos o acento. */
input[type='checkbox'], input[type='radio'] { accent-color: rgb(var(--uva-rgb)); }

/* ------------------------------------------------------------------ *
 *  Impressão
 * ------------------------------------------------------------------ */

@media print {
  .d-print-none,
  #smart-sidebar,
  #smart-topbar,
  #smart-loading,
  #smart-toasts { display: none !important; }

  #smart-conteudo { padding: 0 !important; }

  body { background: #fff !important; }

  /* Tabelas paginadas devem imprimir todas as linhas. */
  tr[data-linha] { display: table-row !important; }

  table { page-break-inside: auto; }
  tr { page-break-inside: avoid; page-break-after: auto; }
  thead { display: table-header-group; }

  a[href]:after { content: ''; }
}
