/*
 * Estilos para reportes imprimibles.
 * - .fmt-a4    : hoja A4
 * - .fmt-ticket: ticket termico de 80 mm
 *
 * Ambas variantes funcionan en pantalla (preview) y en print.
 */

/* ==== A4 ==== */
.fmt-a4 .hoja {
    width: 210mm;
    min-height: 297mm;
    margin: 0 auto;
    padding: 15mm 12mm;
    background: white;
    box-shadow: 0 0 8px rgba(0,0,0,0.1);
    font-family: 'Segoe UI', sans-serif;
    font-size: 12pt;
    color: #000;
}

@media print {
    @page { size: A4; margin: 12mm; }
    .fmt-a4 .hoja { box-shadow: none; padding: 0; margin: 0; width: auto; min-height: auto; }
}

/* ==== Ticket termico 80 mm ==== */
.fmt-ticket .hoja {
    width: 80mm;
    margin: 0 auto;
    padding: 4mm 3mm;
    background: white;
    box-shadow: 0 0 8px rgba(0,0,0,0.1);
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 9pt;
    line-height: 1.25;
    color: #000;
}
.fmt-ticket .hoja h1, .fmt-ticket .hoja h2, .fmt-ticket .hoja h3 {
    font-size: 10pt; margin: 2mm 0; text-align: center;
}
.fmt-ticket .hoja table { font-size: 8.5pt; width: 100%; }
.fmt-ticket .hoja .totales { font-weight: bold; }

@media print {
    .fmt-ticket {
        @page { size: 80mm auto; margin: 2mm; }
    }
    .fmt-ticket .hoja { box-shadow: none; padding: 0; margin: 0; width: 76mm; }
}

/* ==== Comunes ==== */
.hoja .empresa-header { text-align: center; margin-bottom: 6mm; }
.hoja .empresa-header h2 { margin: 0; font-size: 14pt; }
.hoja .empresa-header small { display: block; margin-top: 1mm; }

.hoja .seccion { margin: 4mm 0; }
.hoja .seccion h3 {
    background: #eee; padding: 1.5mm 2mm; font-size: 10pt;
    margin: 0 0 2mm 0; border-radius: 2px;
}

.hoja table { border-collapse: collapse; width: 100%; }
.hoja table th, .hoja table td {
    border: 1px solid #888; padding: 1mm 2mm; font-size: 9.5pt;
}
.hoja table th { background: #f0f0f0; text-align: center; }

.hoja .firma { margin-top: 10mm; text-align: center; }
.hoja .firma-linea { display: inline-block; border-top: 1px solid #000; padding-top: 1mm; min-width: 60mm; }

.preview-bg { background: #e9ecef; min-height: 100vh; padding: 1rem 0; }
@media print { .preview-bg { background: white; padding: 0; } }