/* ============================================================
   CardápioApp — print.css (Layout Térmico & Desktop)
   ============================================================ */

/* ── LAYOUT DESKTOP — carrinho como overlay lateral ── */
@media (min-width: 1024px) {
  /* Header ocupa 100% */
  .topo { width: 100%; }

  /* Conteúdo centralizado */
  #conteudo-principal {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 40px;
  }

  /* Carrinho permanece como slide-over (overlay)
     O botão flutuante fica visível */
  #painel-carrinho {
    max-width: 400px;
  }

  /* Grid de itens 2 colunas no desktop */
  .itens-lista {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 12px;
  }
  .itens-lista > .item { margin-bottom: 0; }
  .secao-cardapio h2 { grid-column: 1 / -1; }

  /* Destaques em grid */
  .grid-destaques {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    overflow-x: visible;
    gap: 12px;
  }
  .card-destaque { min-width: 0; }
}

@media (min-width: 1400px) {
  .itens-lista {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ── IMPRESSÃO TÉRMICA (80mm / 58mm) ── */
@media print {
  /* Esconde tudo que não é o pedido */
  body * { visibility: hidden; }
  #painel-carrinho, #painel-carrinho * { visibility: visible; }
  
  #painel-carrinho {
    position: absolute;
    left: 0; top: 0; width: 100%;
    border: none; box-shadow: none;
    transform: none;
    padding: 0; margin: 0;
  }

  /* Estilo do Cupom */
  .carrinho-topo, #btn-fechar-carrinho, #btn-finalizar, #btn-whatsapp, .controles-qtd, .btn-link-editar {
    display: none !important;
  }

  .carrinho-conteudo {
    width: 100%;
    font-family: 'Courier New', Courier, monospace;
    font-size: 12px;
    color: #000;
    padding: 0;
  }

  .carrinho-conteudo::before {
    content: '--- COMPROVANTE DE PEDIDO ---';
    display: block; text-align: center; font-weight: bold; margin-bottom: 10px;
  }

  .lista-itens li {
    border: none; border-bottom: 1px dashed #000;
    padding: 5px 0; background: none;
    flex-direction: column; align-items: flex-start;
  }

  .item-info { width: 100%; }
  .item-nome { font-size: 14px; font-weight: bold; white-space: normal; }
  .item-preco { float: right; }
  
  .total {
    border-top: 2px solid #000;
    margin-top: 10px; padding-top: 10px;
    font-size: 16px; font-weight: bold;
    text-align: right;
  }

  .dados-cliente {
    display: block !important;
    margin-top: 15px; border-top: 1px solid #000; padding-top: 10px;
  }
  
  .dados-cliente input, .dados-cliente textarea, .dados-cliente select {
    border: none; background: none; padding: 0; margin: 0;
    font-family: inherit; font-size: inherit;
    display: inline-block; width: auto;
  }

  @page {
    margin: 0;
    size: auto;
  }
}