.progress-bar {
    background-color: var(--primary) !important;
}

/* Igualar Select2 a un input Bootstrap */
.select2-container--default .select2-selection--single {
    height: calc(1.5em + 0.75rem + 2px) !important;
    padding: 0.375rem 0.75rem !important;
    display: flex !important;
    align-items: center !important;
    border: 1px solid #ced4da !important;
    border-radius: 0.375rem !important;
}


/* Ajustar el texto dentro del select */
.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-left: 0 !important;
    line-height: normal !important;
}

/* Ajustar la flecha */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100% !important;
    right: 10px !important;
}

.select2-results__option span {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Flecha personalizada para selects nativos */
.select-arrow {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'><path fill='%23666' d='M4.5 5l3.5 4 3.5-4z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 14px;
    padding-right: 36px !important;
    cursor: pointer;
}

/* TABS */
#tabsGuardados.nav-tabs .nav-link,
#intercambiosTabs.nav-tabs .nav-link {
    color: #333 !important;
    border: 1px solid var(--primary);
    border-bottom: none;
    background-color: white;
    cursor: pointer;
    margin-right: 5px;
}

#tabsGuardados.nav-tabs .nav-link:hover,
#intercambiosTabs.nav-tabs .nav-link:hover {
    color: var(--primary) !important;
    border-bottom: none;
    background-color: white;
    cursor: pointer;
}

#tabsGuardados.nav-tabs .nav-link.active,
#intercambiosTabs.nav-tabs .nav-link.active {
    color: var(--primary) !important;
    background-color: white;
    border-bottom: 2px solid var(--primary);
}

#intercambiosTabs + .tab-content {
    padding: 10px;
}

#tabsGuardados + .tab-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#mis-guardados .container,
#intercambiosContent .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

@media (max-width: 991.98px) {
    #tabsGuardados .nav-link,
    #intercambiosTabs .nav-link {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}