/* Tamaño de texto predeterminado */
.text-responsive {
    font-size: 16px; /* Tamaño base del texto */
}

/* Ajuste para pantallas medianas (tablets) */
@media (max-width: 768px) {
    .text-responsive {
        font-size: 14px;
    }
}

/* Ajuste para pantallas pequeñas (teléfonos) */
@media (max-width: 576px) {
    .text-responsive {
        font-size: 12px;
    }

    .table td {
        padding: 6px 1px !important;  /* Reducir el padding en teléfonos */
    }
}

/* Ajuste para pantallas muy pequeñas */
@media (max-width: 360px) {
    .text-responsive {
        font-size: 10px;
    }
}

.highlight {
    border: 2px solid red;
}

/* Los títulos de modal deben heredar el color de su header.
   app.css fuerza color: var(--bs-heading-color) (#000) en todos los h5,
   por lo que los títulos en headers con color (gradiente/bg-*) salían negros. */
.modal-title {
    color: inherit;
}

/* SweetAlert2 debe quedar SIEMPRE por encima de los modales de Bootstrap
   (los modales anidados llegan hasta z-index 1075; Swal usa 1060 por defecto
   y quedaba detrás al confirmar/guardar dentro de un modal). */
div.swal2-container {
    z-index: 3000 !important;
}