body {
    font-family: 'Inter', sans-serif;
    background-color: #f8fafc;
}

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    vertical-align: middle;
}

[data-weight="fill"] .material-symbols-outlined {
    font-variation-settings: 'FILL' 1;
}

.custom-scrollbar::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 10px;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

.tabular-nums {
    font-variant-numeric: tabular-nums;
}

/* ========================================== */
/* ESTILOS DE IMPRESIÓN Y PREVISUALIZACIÓN POS */
/* ========================================== */

/* Formato Carta Estándar (Pantalla y PDF) */
#ticket-cierre-print.format-letter,
#print-order-receipt.format-letter {
    font-family: 'Inter', sans-serif !important;
    width: 100%;
    max-width: 190mm;
    padding: 15mm;
    background: #ffffff;
    color: #000000;
}

#ticket-cierre-print.format-letter *,
#print-order-receipt.format-letter * {
    font-family: 'Inter', sans-serif !important;
}

/* Formato Térmico Optimizado de 80mm (Pantalla y Ticketera) */
#ticket-cierre-print.format-thermal,
#print-order-receipt.format-thermal {
    font-family: 'Courier New', Courier, monospace !important;
    width: 80mm;
    max-width: 80mm;
    padding: 4mm 4mm 10mm 4mm;
    /* Margen inferior extra para el corte físico */
    background: #ffffff;
    color: #000000;
    box-sizing: border-box;
}

#ticket-cierre-print.format-thermal *,
#print-order-receipt.format-thermal * {
    font-family: 'Courier New', Courier, monospace !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
}

#ticket-cierre-print.format-thermal h2,
#print-order-receipt.format-thermal h2 {
    font-size: 16px !important;
    margin-bottom: 4px !important;
}

#ticket-cierre-print.format-thermal .dashed-line,
#print-order-receipt.format-thermal .dashed-line {
    border-top: 1px dashed #000000 !important;
    margin: 8px 0 !important;
    display: block;
}

@media print {
    body {
        background-color: #ffffff !important;
        color: #000000 !important;
    }

    #sidebar,
    header,
    main,
    #toast,
    #password-modal,
    #edit-modal,
    #sidebar-backdrop {
        display: none !important;
    }

    /* Ocultar ambos por defecto al imprimir */
    #ticket-cierre-print,
    #print-order-receipt {
        display: none !important;
    }

    /* Mostrar el ticket correspondiente según la clase asignada en javascript al body */
    body.print-mode-cierre #ticket-cierre-print {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.print-mode-orden #print-order-receipt {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Configuración nativa para cuando el usuario imprime directo al driver POS (Ctrl+P) */
    #ticket-cierre-print.format-thermal,
    #print-order-receipt.format-thermal {
        width: 72mm !important;
        /* Ancho seguro de impresión directa */
        max-width: 100% !important;
        padding: 0mm !important;
    }

    #ticket-cierre-print.format-letter,
    #print-order-receipt.format-letter {
        width: 100% !important;
        max-width: 190mm !important;
    }
}
