/* =========================
   BOTONES MODERNOS Y SUAVES - TODOS LOS BOTONES BOOTSTRAP
   ========================= */

/* Base para todos los botones */
.btn {
    border-radius: 6px;
    padding: 0.45rem 1rem;
    font-weight: 500;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    transition: all 0.2s ease-in-out;
}

    /* Hover general */
    .btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }

    /* Focus general */
    .btn:focus {
        outline: none;
        box-shadow: 0 0 0 0.15rem rgba(0,123,255,0.15);
    }

    /* Active general */
    .btn:active {
        transform: translateY(0);
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

/* ----------------------
   Colores suaves con contraste en hover
   ---------------------- */

/* Primary */
.btn-primary {
    background-color: #cce5ff;
    border-color: #cce5ff;
    color: #004085;
}

    .btn-primary:hover {
        background-color: #b3d7ff;
        border-color: #b3d7ff;
        color: #004085; /* texto oscuro para contraste */
    }

    .btn-primary:active {
        background-color: #99c9ff;
        border-color: #99c9ff;
        color: #004085;
    }

/* Secondary */
.btn-secondary {
    background-color: #e2e3e5;
    border-color: #e2e3e5;
    color: #383d41;
}

    .btn-secondary:hover {
        background-color: #d6d8db;
        border-color: #d6d8db;
        color: #383d41;
    }

    .btn-secondary:active {
        background-color: #c8cbcf;
        border-color: #c8cbcf;
        color: #383d41;
    }

/* Success */
.btn-success {
    background-color: #d4edda;
    border-color: #d4edda;
    color: #155724;
}

    .btn-success:hover {
        background-color: #c3e6cb;
        border-color: #c3e6cb;
        color: #155724;
    }

    .btn-success:active {
        background-color: #b1dfbb;
        border-color: #b1dfbb;
        color: #155724;
    }

/* Danger */
.btn-danger {
    background-color: #f8d7da;
    border-color: #f8d7da;
    color: #721c24;
}

    .btn-danger:hover {
        background-color: #f5c6cb;
        border-color: #f5c6cb;
        color: #721c24;
    }

    .btn-danger:active {
        background-color: #f1b0b7;
        border-color: #f1b0b7;
        color: #721c24;
    }

/* Warning */
.btn-warning {
    background-color: #fff3cd;
    border-color: #fff3cd;
    color: #856404;
}

    .btn-warning:hover {
        background-color: #ffe8a1;
        border-color: #ffe8a1;
        color: #856404;
    }

    .btn-warning:active {
        background-color: #ffdf7d;
        border-color: #ffdf7d;
        color: #856404;
    }

/* Info */
.btn-info {
    background-color: #d1ecf1;
    border-color: #d1ecf1;
    color: #0c5460;
}

    .btn-info:hover {
        background-color: #bee5eb;
        border-color: #bee5eb;
        color: #0c5460;
    }

    .btn-info:active {
        background-color: #abdde5;
        border-color: #abdde5;
        color: #0c5460;
    }

/* Light */
.btn-light {
    background-color: #fefefe;
    border-color: #fefefe;
    color: #818182;
}

    .btn-light:hover {
        background-color: #fdfdfe;
        border-color: #fdfdfe;
        color: #818182;
    }

    .btn-light:active {
        background-color: #fcfcfd;
        border-color: #fcfcfd;
        color: #818182;
    }

/* Dark */
.btn-dark {
    background-color: #d6d8d9;
    border-color: #d6d8d9;
    color: #1b1e21;
}

    .btn-dark:hover {
        background-color: #c6c8ca;
        border-color: #c6c8ca;
        color: #1b1e21;
    }

    .btn-dark:active {
        background-color: #b5b7b9;
        border-color: #b5b7b9;
        color: #1b1e21;
    }

/* Link */
.btn-link {
    color: #3399ff;
    background-color: transparent;
    border: none;
    padding: 0;
    box-shadow: none;
}

    .btn-link:hover {
        color: #007bff;
        text-decoration: underline;
    }

    .btn-link:active {
        color: #0056b3;
    }

/* ==========================
   Fondos suaves y modernos para todos los bg-*
========================== */
.bg-primary {
    background-color: #cce5ff !important;
    color: #004085 !important;
    border-radius: 6px;
    padding: 0.45rem 1rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    transition: all 0.2s ease-in-out;
}

    .bg-primary:hover {
        background-color: #b3d7ff !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }

    .bg-primary:active {
        background-color: #99c9ff !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
        transform: translateY(0);
    }

.bg-secondary {
    background-color: #e2e3e5 !important;
    color: #383d41 !important;
    border-radius: 6px;
    padding: 0.45rem 1rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    transition: all 0.2s ease-in-out;
}

    .bg-secondary:hover {
        background-color: #d6d8db !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }

    .bg-secondary:active {
        background-color: #c8cbcf !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

.bg-success {
    background-color: #d4edda !important;
    color: #155724 !important;
    border-radius: 6px;
    padding: 0.45rem 1rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    transition: all 0.2s ease-in-out;
}

    .bg-success:hover {
        background-color: #c3e6cb !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }

    .bg-success:active {
        background-color: #b1dfbb !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

.bg-danger {
    background-color: #f8d7da !important;
    color: #721c24 !important;
    border-radius: 6px;
    padding: 0.45rem 1rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    transition: all 0.2s ease-in-out;
}

    .bg-danger:hover {
        background-color: #f5c6cb !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }

    .bg-danger:active {
        background-color: #f1b0b7 !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

.bg-warning {
    background-color: #fff3cd !important;
    color: #856404 !important;
    border-radius: 6px;
    padding: 0.45rem 1rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    transition: all 0.2s ease-in-out;
}

    .bg-warning:hover {
        background-color: #ffe8a1 !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }

    .bg-warning:active {
        background-color: #ffdf7d !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

.bg-info {
    background-color: #d1ecf1 !important;
    color: #0c5460 !important;
    border-radius: 6px;
    padding: 0.45rem 1rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    transition: all 0.2s ease-in-out;
}

    .bg-info:hover {
        background-color: #bee5eb !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }

    .bg-info:active {
        background-color: #abdde5 !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

.bg-light {
    background-color: #fefefe !important;
    color: #818182 !important;
    border-radius: 6px;
    padding: 0.45rem 1rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    transition: all 0.2s ease-in-out;
}

    .bg-light:hover {
        background-color: #fdfdfe !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }

    .bg-light:active {
        background-color: #fcfcfd !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

.bg-dark {
    background-color: #d6d8d9 !important;
    color: #1b1e21 !important;
    border-radius: 6px;
    padding: 0.45rem 1rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    transition: all 0.2s ease-in-out;
}

    .bg-dark:hover {
        background-color: #c6c8ca !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    }

    .bg-dark:active {
        background-color: #b5b7b9 !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }
.text-primary {
    color: #0055A5 !important;
}

.text-success {
    color: #45B369 !important;
}

.text-danger {
    color: #D64646 !important;
}

.text-warning {
    color: #E3A526 !important;
}

.text-info {
    color: #2FA8D8 !important;
}

.text-secondary {
    color: #6C757D !important;
}

.text-dark {
    color: #2B2B2B !important;
}


/* =========================
   Select2 dentro de modales (Bootstrap 5 + form-control)
========================== */

/* Forzar ancho completo del select original */
.select2modal {
    width: 100% !important;
}

    /* Contenedor de selección generado por Select2 */
    .select2modal + .select2-container--bootstrap5.select2-container {
        width: 100% !important;
    }

    /* Selección */
    .select2modal + .select2-container--bootstrap5 .select2-selection {
        height: calc(2.25rem + 2px) !important; /* altura de form-control */
        padding: 0.375rem 0.75rem !important; /* padding de form-control */
        border: 1px solid #ced4da !important; /* borde visible */
        border-radius: 0.375rem !important; /* borde redondeado */
        background-color: #fff !important;
        display: flex !important;
        align-items: center !important;
        box-sizing: border-box;
    }

    /* Texto dentro de la selección */
    .select2modal + .select2-container--bootstrap5 .select2-selection__rendered {
        line-height: 1.5 !important;
        color: #212529;
    }

    /* Placeholder */
    .select2modal + .select2-container--bootstrap5 .select2-selection__placeholder {
        color: #6c757d !important;
    }

    /* Flecha del dropdown */
    .select2modal + .select2-container--bootstrap5 .select2-selection__arrow {
        height: calc(2.25rem + 2px) !important;
    }

/* Dropdown encima del modal */
.select2-container--open {
    z-index: 2000 !important;
}

/* Enfocado / hover */
.select2modal + .select2-container--bootstrap5.select2-container--focus .select2-selection {
    border-color: #86b7fe !important;
    box-shadow: 0 0 0 0.25rem rgba(13,110,253,.25) !important;
}
/* Ajuste global para Select2 single select */
.select2-container .select2-selection--single {
    height: calc(2.2rem + 2px) !important; /* altura exacta de form-control */
    padding: 0.5rem 0.75rem !important; /* padding similar a form-control */
    border: 1px solid #ced4da !important; /* mismo borde */
    border-radius: 0.375rem !important; /* mismo border-radius */
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box;
    background-color: #fff;
}

/* Texto dentro del select */
.select2-container .select2-selection__rendered {
    line-height: 1.5 !important;
    padding: 0 !important;
}

/* Flecha */
.select2-container .select2-selection__arrow {
    height: calc(2rem + 2px) !important;
}

/* Aplica a todos los labels dentro de un formulario */
.form-label {
    margin-bottom: 0.45rem !important; /* o 0.5rem, según gusto */
}
/* Bloquear Select2 sin deshabilitar el select nativo */
.select2modal.readonly .select2-selection__rendered {
    pointer-events: none !important; /* No permite abrir el dropdown */
    user-select: none !important; /* No permite seleccionar el texto */
}

.select2modal.readonly .select2-selection__arrow {
    display: none !important; /* Oculta la flecha */
}

/* Clase para simular un select2 en modo readonly */
.select2readonly {
    pointer-events: none; /* Bloquea cualquier click/interacción */
    opacity: 0.6; /* Lo hace visualmente más opaco */
    background-color: #e9ecef; /* Fondo tipo readonly */
}

/* Para afectar solo el contenedor de Select2 */
.select2-container.select2readonly .select2-selection {
    background-color: #e9ecef;
    opacity: 0.6;
    cursor: not-allowed;
}