/* ============================================================
   Estilos propios del sistema.
   Bootstrap 5 aporta la base; aqui solo van los ajustes.
   ============================================================ */

:root {
    --sv-sidebar-width: 250px;
    --sv-header-height: 56px;
}

body {
    background-color: #f5f6f8;
    font-size: 0.95rem;
}

/* Tablas de listado --------------------------------------------------- */
.table-sistema thead th {
    background-color: #f1f3f5;
    font-size: 0.78rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #6c757d;
    white-space: nowrap;
}

.table-sistema td {
    vertical-align: middle;
}

/* Los montos se alinean a la derecha y se leen con ancho fijo. */
.monto {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.monto-vencido {
    color: #dc3545;
    font-weight: 600;
}

/* Estados ---------------------------------------------------------------
   Pensadas para usarse junto con .badge (que ya da forma/padding); aqui solo
   se fija fondo y color de texto, con contraste suficiente en cada caso. */
.estado-pendiente { background-color: #6c757d; color: #fff; }
.estado-parcial   { background-color: #0d6efd; color: #fff; }
.estado-pagada    { background-color: #198754; color: #fff; }
.estado-vencida   { background-color: #dc3545; color: #fff; }
.estado-cancelada { background-color: #adb5bd; color: #212529; }

/* Impresion de comprobantes ------------------------------------------- */
@media print {
    .no-imprimir,
    .navbar,
    footer {
        display: none !important;
    }

    body {
        background: #fff;
    }
}