.ui-card__image.ui-card__image--ratio-vacancy {
	--aspect-ratio: 1.95;
}
.vacancy-tabs {
    width: 100%;
}

.tabs-nav {
    display: flex;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 30px;
}

.tab-btn {
    padding: 15px 30px;
    border: none;
    background: none;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    transition: all 0.3s ease;
    font-size: 16px;
    font-weight: 500;
}

.tab-btn:hover {
    background-color: #f5f5f5;
}

.tab-btn.active:first-child {
    border-bottom-color: #53ad39;
    color: #53ad39;
}
.tab-btn.active:nth-child(2) {
    border-bottom-color: #cb157b;
    color: #cb157b;
}
.tab-btn.active:last-child {
    border-bottom-color: #008bce;
    color: #008bce;
}

.tab-content {
    display: none;
}

.tab-content.active {
    display: block;
}

.vacancy-filter {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 30px;
}

.filter-row {
    display: flex;
    gap: 20px;
    align-items: end;
    flex-wrap: wrap;
}

.filter-col {
    display: flex;
    flex-direction: column;
    min-width: 200px;
}

.filter-col label {
    margin-bottom: 5px;
    font-weight: 500;
}

.filter-col select,
.filter-col button {
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
}

.filter-col select:disabled {
    background-color: #f5f5f5;
    color: #999;
}

@media (max-width: 768px) {
    .tabs-nav {
        flex-direction: column;
    }
    
    .filter-row {
        flex-direction: column;
    }
    
    .filter-col {
        min-width: 100%;
    }
}
/* Добавляем в существующий style блок */
.loading-placeholder {
    text-align: center;
    padding: 40px 20px;
}

.loader {
    display: inline-block;
    padding: 10px 20px;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    color: #6c757d;
    font-size: 14px;
}

.loader:before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid #007bff;
    border-radius: 50%;
    border-top-color: transparent;
    animation: spin 1s linear infinite;
    margin-right: 8px;
    vertical-align: middle;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

#vacancy-list-container {
    transition: opacity 0.3s ease;
}

.filter-results .alert {
    margin: 20px 0;
    padding: 15px;
    border-radius: 4px;
}

.alert-info {
    background-color: #d1ecf1;
    border-color: #bee5eb;
    color: #0c5460;
}

.alert-warning {
    background-color: #fff3cd;
    border-color: #ffeaa7;
    color: #856404;
}

.alert-error {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    color: #721c24;
}

/* Стили для пагинации */
.bx-pagination {
    margin: 30px 0;
    text-align: center;
}

.bx-pagination a {
    display: inline-block;
    padding: 8px 12px;
    margin: 0 2px;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    color: #007bff;
    text-decoration: none;
    transition: all 0.3s ease;
}

.bx-pagination a:hover {
    background-color: #007bff;
    color: white;
    border-color: #007bff;
}

.bx-pagination .bx-active {
    background-color: #007bff;
    color: white;
    border-color: #007bff;
}

.filter-col button.select2-selection__clear {
    padding: 0;
}
.select2-results__options .select2-results__option:before{
    display: none;
}
.vacancy-filter .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 29px;
}
.vacancy-filter .select2-container--default .select2-selection--single {
    background-color: #fff;
    border: 1px solid #aaa;
    border-radius: 4px;
    height: 40px;
    color: var(--input_color);
    box-shadow: none;
    border: 1px solid var(--input_border_color);
    height: 44px;
    padding: 6px 16px;
    background: var(--input_bg_color);
    font-size: 0.9375rem;
    line-height: 1.47;
    border-radius: var(--theme-button-border-radius);
    position: relative;
}
.vacancy-filter .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px;
}
.vacancy-filter .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #000 transparent transparent transparent;
	border-width: 3px 2px 0 2.5px;
}
.vacancy-filter .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #000 transparent;
    border-width: 0 2px 3px 2.5px;
}
.vacancy-filter .select2-container--default .select2-selection--single .select2-selection__clear {
	height: 31px;
	margin-right: 14px;
}
.vacancy-filter .select2-container .select2-selection--single .select2-selection__clear {
	font-size: 0.7em;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--theme-base-color);
}
.select2-container--default .select2-search--dropdown .select2-search__field {
    color: var(--input_color);
    box-shadow: none;
    border: 1px solid var(--input_border_color);
    height: 30px;
    padding: 6px 16px;
    background: var(--input_bg_color);
    font-size: 0.9375rem;
    line-height: 1.47;
    border-radius: var(--theme-button-border-radius);
    position: relative;
}
/* Адаптивность для фильтра */
@media (max-width: 768px) {
    .filter-row {
        flex-direction: column;
        gap: 15px;
    }
    
    .filter-col {
        min-width: 100%;
    }
    
    .filter-col select {
        width: 100%;
    }
}

.accordion-head:not(.collapsed) .svg-inline-right-arrow {
  transform: rotate(135deg);
}
.accordion-head:not(.collapsed):hover .svg-inline-right-arrow {
  transform: scale(1.1) rotate(135deg);
}