/* Caixa (PDV) — a tela que o operador usa em pé, no balcão, quase sempre sem
   mouse (NFC-e 03 §7).

   Existe como arquivo próprio porque o painel NÃO tem tema Tailwind (sem
   `tailwind.config.js`, sem `viteTheme()`): utilitária arbitrária
   (`grid-cols-[…]`, `max-w-[10rem]`) não compila em view de painel, e o que
   sobra são as utilidades já presentes no CSS do Filament. As Blades expõem só
   os hooks `fi-pos-*`; grade, tipografia de balcão e a barra fixa moram aqui.

   Registrado em `AdminPanelProvider::boot()` com `Css::make(...)` e publicado
   por `php artisan filament:assets` — sem isso `public/css/app/` fica velho e o
   caixa sai sem estilo em produção.

   A tela usa `layout.base` (sem sidebar e sem topbar): tudo o que a orienta —
   qual caixa, qual operador e como voltar ao painel — está na primeira linha. */

.fi-pos {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  /* Espaço para a barra de atalhos fixa no rodapé não cobrir o cupom. */
  padding-bottom: 5rem;
}

/* --- Linha de identidade ------------------------------------------------ */

.fi-pos-topline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.fi-pos-identity {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
}

.fi-pos-terminal {
  font-size: 1.25rem;
  font-weight: 700;
}

.fi-pos-operator {
  font-size: 0.875rem;
  opacity: 0.7;
}

.fi-pos-topline-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.fi-pos-back {
  font-size: 0.875rem;
  text-decoration: underline;
}

/* --- Portão do turno ---------------------------------------------------- */

.fi-pos-gate-action {
  margin-top: 1rem;
}

/* --- Grade: cupom à esquerda, dinheiro à direita ------------------------ */

.fi-pos-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

@media (min-width: 1024px) {
  .fi-pos-grid {
    /* Dois terços para o cupom: é a coluna que o operador lê em voz alta. */
    grid-template-columns: 2fr 1fr;
  }
}

.fi-pos-column {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* --- Busca -------------------------------------------------------------- */

.fi-pos-search-input {
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 1.25rem;
  border-radius: 0.5rem;
  border: 1px solid rgb(212 212 216);
  background-color: rgb(255 255 255);
  color: inherit;
}

.dark .fi-pos-search-input {
  border-color: rgb(63 63 70);
  background-color: rgb(24 24 27);
}

.fi-pos-hits {
  margin-top: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  max-height: 18rem;
  overflow-y: auto;
}

.fi-pos-hit-button {
  width: 100%;
  text-align: left;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.fi-pos-hit-button:hover {
  background-color: rgb(244 244 245);
}

.dark .fi-pos-hit-button:hover {
  background-color: rgb(39 39 42);
}

.fi-pos-hit-description {
  font-weight: 600;
}

.fi-pos-hit-meta {
  font-size: 0.75rem;
  opacity: 0.7;
}

.fi-pos-hit-warning {
  font-size: 0.75rem;
  color: rgb(180 83 9);
}

/* --- Cupom -------------------------------------------------------------- */

.fi-pos-cart {
  overflow-x: auto;
}

.fi-pos-cart-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1rem;
}

.fi-pos-cart-table th,
.fi-pos-cart-table td {
  padding: 0.5rem 0.75rem;
  text-align: left;
  white-space: nowrap;
}

.fi-pos-cart-table th {
  font-size: 0.75rem;
  text-transform: uppercase;
  opacity: 0.6;
}

.fi-pos-cart-row {
  cursor: pointer;
  border-top: 1px solid rgb(228 228 231);
}

.dark .fi-pos-cart-row {
  border-top-color: rgb(63 63 70);
}

/* A linha em foco é a que F3, F4 e Del alcançam: precisa ser inconfundível a
   um metro de distância. */
.fi-pos-cart-row-selected {
  background-color: rgb(224 242 254);
  font-weight: 600;
}

.dark .fi-pos-cart-row-selected {
  background-color: rgb(12 74 110);
}

.fi-pos-cart-empty,
.fi-pos-tenders-empty,
.fi-pos-today-empty {
  font-size: 0.875rem;
  opacity: 0.7;
}

.fi-pos-cart-remove,
.fi-pos-tender-remove {
  font-size: 0.75rem;
  text-decoration: underline;
  opacity: 0.8;
}

/* --- Totais ------------------------------------------------------------- */

.fi-pos-totals {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.fi-pos-totals-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
}

/* O total e o troco são os dois números que a fila inteira olha. */
.fi-pos-totals-total {
  font-size: 2rem;
  font-weight: 700;
}

.fi-pos-totals-change {
  font-size: 1.5rem;
  font-weight: 600;
}

/* O motivo pelo qual o Total saiu em branco (RT F3.5): calendário não semeado,
   alíquota não publicada, município ausente ou classificação vencida.

   É um parágrafo longo — nomeia a chave e o comando que resolvem — e cai logo
   abaixo do Total de 2rem/700. Sem regra própria ele colava no número grande,
   com o mesmo corpo e o mesmo peso do resto do painel, num balcão desenhado
   para dois números e nada mais. Aqui ele fica pequeno, vermelho e afastado:
   o operador vê que o Total não saiu e POR QUÊ, sem confundir o texto com
   dinheiro. */
.fi-pos-totals-fiscal-error {
  margin-top: 0.25rem;
  font-size: 0.75rem;
  line-height: 1.3;
  font-weight: 500;
  color: rgb(185 28 28);
}

/* No tema escuro o vermelho 700 fica ilegível sobre o fundo zinc: sobe para o
   300, que é o mesmo par que o Filament usa nos textos de perigo. */
.dark .fi-pos-totals-fiscal-error {
  color: rgb(252 165 165);
}

.fi-pos-totals-customer {
  font-size: 0.75rem;
  opacity: 0.7;
}

/* --- Pagamentos --------------------------------------------------------- */

.fi-pos-tenders-title,
.fi-pos-today-title {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  opacity: 0.6;
}

.fi-pos-tenders-list {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.fi-pos-tender {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
}

.fi-pos-tender-amount {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

/* --- Painel do turno (F7) ---------------------------------------------- */

.fi-pos-today-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.fi-pos-today-table th,
.fi-pos-today-table td {
  padding: 0.375rem 0.5rem;
  text-align: left;
}

/* --- Desfecho fiscal do último cupom ------------------------------------ */

/* O painel fica DEPOIS do carrinho de propósito: enquanto o operador digita, a
   coluna do cupom é a que importa; ele só desce os olhos quando a venda fecha. */
.fi-pos-fiscal {
  border-width: 1px;
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
}

/* Cor pela borda e por uma faixa clara, nunca por texto colorido: a tela do
   balcão é lida de longe e quase sempre com brilho alto. */
.fi-pos-fiscal-ok {
  border-color: rgb(34 197 94);
  background-color: rgb(240 253 244);
}

.fi-pos-fiscal-pendente {
  border-color: rgb(245 158 11);
  background-color: rgb(255 251 235);
}

.fi-pos-fiscal-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

.fi-pos-fiscal-title {
  font-size: 1rem;
  font-weight: 700;
}

.fi-pos-fiscal-status {
  font-size: 0.875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.fi-pos-fiscal-body {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.fi-pos-fiscal-facts {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  /* Sem isto a coluna de fatos não encolhe e a chave de 44 dígitos empurra o QR
     para fora da tela em monitor de balcão (1366 px é o comum). */
  min-width: 0;
  flex: 1 1 20rem;
}

.fi-pos-fiscal-label {
  display: block;
  font-size: 0.75rem;
  opacity: 0.7;
}

/* A chave é DITADA e DIGITADA: monoespaçada, com respiro entre os dígitos, e
   quebrando onde couber — 44 dígitos não cabem numa linha de coluna estreita. */
.fi-pos-fiscal-key {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.9375rem;
  letter-spacing: 0.08em;
  word-break: break-all;
}

.fi-pos-fiscal-actions {
  margin-top: 0.25rem;
}

.fi-pos-fiscal-qr {
  flex: 0 0 auto;
  background-color: rgb(255 255 255);
  padding: 0.5rem;
  border-radius: 0.375rem;
}

/* O SVG do QR vem com largura própria do gerador; aqui ele obedece ao layout. */
.fi-pos-fiscal-qr svg {
  display: block;
  width: 12.5rem;
  height: 12.5rem;
}

/* --- Barra de atalhos --------------------------------------------------- */

/* Fixa no rodapé porque é a legenda do teclado: ela tem de estar visível
   enquanto o operador digita, sem depender de rolagem. */
.fi-pos-keymap {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 20;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  padding: 0.5rem 0.75rem;
  background-color: rgb(24 24 27);
  color: rgb(250 250 250);
}

.fi-pos-keymap-button {
  display: flex;
  align-items: baseline;
  gap: 0.375rem;
  padding: 0.25rem 0.5rem;
  border-radius: 0.375rem;
}

.fi-pos-keymap-button:hover {
  background-color: rgb(63 63 70);
}

.fi-pos-keymap-key {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.fi-pos-keymap-label {
  font-size: 0.75rem;
  opacity: 0.8;
}

/* --- Contingência off-line ----------------------------------------------- */

/* Tarja âmbar, larga e no topo da tela: o operador precisa saber, sem procurar,
   que existem cupons esperando transmissão — a via do estabelecimento é dele, e
   é ela que prova a venda se a retransmissão falhar. Mesmo vocabulário de cor do
   `.fi-pos-fiscal-pendente`. */
.fi-pos-contingency {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
  padding: 0.5rem 0.75rem;
  border-width: 1px;
  border-color: rgb(245 158 11);
  border-radius: 0.5rem;
  background-color: rgb(255 251 235);
}

.fi-pos-contingency-title {
  font-weight: 700;
  color: rgb(146 64 14);
}

.fi-pos-contingency-detail {
  font-size: 0.875rem;
  color: rgb(120 53 15);
}

/* O desfecho fiscal em contingência usa a MESMA tarja: o cupom saiu, mas a nota
   ainda não existe do lado da SEFAZ. */
.fi-pos-fiscal-contingencia {
  border-color: rgb(245 158 11);
  background-color: rgb(255 251 235);
}

/* --- Reimpressão no painel do turno -------------------------------------- */

.fi-pos-today-reprint {
  padding: 0.125rem 0.5rem;
  border-width: 1px;
  border-radius: 0.375rem;
  font-size: 0.75rem;
  font-weight: 600;
}

/* O iframe da impressão existe para carregar o PDF e chamar `print()`: ele fica
   FORA da tela, e não com `display: none` — parte dos navegadores não imprime
   documento removido do fluxo de renderização. */
#pos-danfce-frame {
  position: absolute;
  width: 0;
  height: 0;
  border: 0;
}