/* =============================
   Estilos generales del sitio
   ============================= */



/* ==============================================
   Personalización de Select2 con scroll vertical
   ============================================== */

/* Ajusta el área donde se muestran los elementos seleccionados (tags) */
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    max-height: 90px; /* Alto máximo antes de que aparezca el scroll */
    min-height: 90px;
    overflow-y: auto; /* Scroll vertical cuando es necesario */
    overflow-x: hidden; /* Evita scroll horizontal */
    padding-right: 8px; /* Espacio para evitar que se corte el scroll */
    box-sizing: border-box;
}

/* Mejora la apariencia de los tags */
.select2-selection__choice {
    margin: 2px 4px 2px 0;
    padding: 3px 6px;
    font-size: 0.85rem;
    background-color: #e9ecef;
    border: 1px solid #ced4da;
    color: #000 !important; /* fuerza texto negro */
    border-radius: 4px;
    opacity: 1 !important; /* evita que parezca desactivado */
}

/* Opcional: tamaño del botón "x" en cada tag */
.select2-selection__choice__remove {
    color: #6c757d;
    font-weight: bold;
    margin-right: 4px;
}

/* Asegura que Select2 se expanda correctamente al 100% del contenedor */
.select2-container {
    width: 100% !important;
}

/* Corrige bordes para que se vean como un control normal */
.select2-container--default .select2-selection--multiple {
    border: 1px solid #ced4da;
    border-radius: 4px;
    min-height: 38px;
    padding: 4px;
}

/* ==============================
   Otros estilos opcionales
   ============================== */

/* Botones personalizados */
.btn-azul {
    background-color: #007bff;
    border-color: #007bff;
    color: white;
}

    .btn-azul:hover {
        background-color: #0056b3;
        border-color: #004085;
    }

/* Puedes seguir agregando tus estilos propios aquí abajo */