/* Krumora POS — camada de refino visual (carregada depois das demais folhas de estilo).
 * Só acabamento: nada aqui muda regra de venda. As classes k-overlay-open / k-checkout-bar e a variável
 * --k-bottom são mantidas por refino.js. */
:root { --k-bottom: 0px; }

/* ========== 1. Camadas: nada flutuando por cima do que o operador precisa tocar ========== */
/* Aviso rápido sobe quando a barra "Finalizar pedido" está na tela (antes cobria o botão). */
.toast {
    bottom: calc(80px + var(--k-bottom) + env(safe-area-inset-bottom, 0px));
    max-width: calc(100vw - 24px);
}
@media (max-width: 600px) {
    .toast { white-space: normal; width: max-content; border-radius: 16px; line-height: 1.3; }
}
/* Botões flutuantes de comanda somem atrás de qualquer janela aberta e na tela de PIN. */
#comandasFab, #comandaKioskBtn { transition: opacity .18s ease, bottom .2s ease; }
body.k-overlay-open #comandasFab,
body.k-overlay-open #comandaKioskBtn { opacity: 0; visibility: hidden; pointer-events: none; }
@media (max-width: 1100px) {
    body.k-checkout-bar #comandasFab,
    body.k-checkout-bar #comandaKioskBtn { bottom: calc(18px + var(--k-bottom) + env(safe-area-inset-bottom, 0px)) !important; }
}
/* Indicador de conexão: uma linha só; com janela aberta vai para o topo em vez de cobrir o conteúdo dela. */
#krumoraNetPill { white-space: nowrap; max-width: calc(100vw - 16px); overflow: hidden; text-overflow: ellipsis; }
body.k-overlay-open #krumoraNetPill { bottom: auto !important; top: calc(8px + env(safe-area-inset-top, 0px)); }
@media (max-width: 480px) { #krumoraNetPill { font-size: 12px !important; padding: 7px 12px !important; } }

/* ========== 2. Formas de pagamento: cabem na tela do tablet sem cortar ========== */
.pay-method-modal { display: flex; flex-direction: column; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); }
.pay-method-header, .pay-method-total { flex-shrink: 0; }
.pay-method-grid { overflow-y: auto; overscroll-behavior: contain; }
@media (min-width: 760px) {
    .modal-overlay:not(.pay-method-fullscreen) .pay-method-modal { max-width: 760px; }
    .modal-overlay:not(.pay-method-fullscreen) .pay-method-grid { grid-template-columns: repeat(4, 1fr); gap: 12px; }
}
@media (max-width: 480px) {
    .pay-method-option { padding: 14px 8px; gap: 6px; }
    .pay-method-icon { width: 46px; height: 46px; font-size: 1.25rem; border-radius: 14px; }
}

/* ========== 3. Dinheiro: campo de valor sem setinhas de navegador ========== */
#cashReceivedInput::-webkit-outer-spin-button,
#cashReceivedInput::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
#cashReceivedInput { -moz-appearance: textfield; appearance: textfield; }

/* ========== 4. Cardápio da equipe: nome do produto legível no escuro ========== */
@media (min-width: 768px) {
    .product-card-name { font-size: 0.7rem; letter-spacing: 0; color: var(--text-primary); opacity: 0.88; }
}

/* ========== 5. Garçom no celular: cabeçalho sem sobreposição ========== */
@media (max-width: 480px) {
    .waiter-header .header-mode-badge { display: none; }
    .waiter-header .header-left { gap: 6px; }
    .waiter-header .header-right { gap: 6px !important; }
    .waiter-header .header-center { flex: 1 1 auto; min-width: 0; display: flex; justify-content: center; }
    .waiter-header .table-selector { white-space: nowrap; }
    #krumoraRecentBtn { margin-left: 0 !important; padding: 0 !important; width: 38px; height: 38px; justify-content: center; font-size: 0 !important; border-radius: 50% !important; flex-shrink: 0; }
    #krumoraRecentBtn i { font-size: 0.95rem; }
}

/* ========== 6. Toque e teclado ========== */
@media (pointer: coarse) {
    .modal-close { width: 44px; height: 44px; font-size: 1rem; }
}
button:focus-visible, a:focus-visible, [role="button"]:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* ========== 7. Monitor ========== */
/* Abas que não cabem: a borda direita esmaece para mostrar que há mais. */
.admin-tabs.k-more {
    -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 56px), transparent);
    mask-image: linear-gradient(90deg, #000 calc(100% - 56px), transparent);
}
/* Atalho das contas SumUp: etiqueta discreta em vez de uma faixa na largura toda. */
#sumupAccountsLink {
    display: inline-flex !important; align-self: flex-start; width: auto; align-items: center;
    padding: 7px 14px !important; margin: 10px 16px !important; border-radius: 999px !important;
    border-color: rgba(var(--accent-rgb), 0.4) !important; color: var(--accent) !important;
    background: rgba(var(--accent-rgb), 0.08); font: 700 0.8rem var(--font);
}
.admin-tab-panel > .exchange-entry { margin: 14px 16px 0 !important; }