/*.career_block{*/
/*	padding: 1em 2em;*/
/*	border: 0.1em solid #D9D9D9;*/
/*	border-radius: 0.3em;*/
/*}*/

.career_select{
	position: relative;

}

.section__career select{
    font-size: 1em;
	font-weight: 600;
	padding: 1em 4em 1em 2em;
	border: 0.1em solid #D9D9D9;
	border-radius: 0.3em;
	width: 100%;
    overflow: hidden;
}
.toggle-btn {
    padding: 0.8vh 0;
    display: block;
    box-sizing: border-box;
    border-radius: 0.3vw;
    background: #ffe600;
    color: #000000;
    font-size: 0.95vw;
    font-weight: 400;
    text-align: center;
    width: 20em;
}
.toggle-btn:hover {
    color: white;
    background: #854385;
}
.toggle-btn.active {
    color: white;
    background: #854385;
}
.search-toggle {
    margin-bottom: 1rem;
    display: flex;
    gap: 1rem;
}
.custom-arrow {
	position: absolute;
	top: 50%;
	right: 1em;
	transform: translateY(-75%) rotate(-45deg);
	width: 0.7em;
	height: 0.7em;
	border-left: 0.2em solid #D9D9D9;
	border-bottom: 0.2em solid #D9D9D9;
	pointer-events: none;
}

.section__career select {
	-webkit-appearance: none; /* Убираем стандартную стрелку в WebKit */
	-moz-appearance: none; /* Убираем стандартную стрелку в Firefox */
	appearance: none; /* Убираем стандартную стрелку для всех браузеров */
	background: transparent;
}

#subCategoryWrapper{
	margin-top: 1em;
}

.custom-select:focus + .custom-arrow {
	transform: rotate(135deg);
	border-color: #007bff;
}

.section__career h3{
	margin-top: 2em;
	font-size: 1.4em;
	font-weight: 600;
	margin-bottom: 1em;
}

#professionsList div{
	padding: 1em 1em;
	border-radius: 0.3em;
	border: 0.1em solid #D9D9D9;
	margin-bottom: 1em;
	transition: all 0.5s ease;

}

#professionsList div:hover,
#professionsList div.active{
	transform: scale(1.03);
	background: #018370;
    color: white;
    border-color: #018370;
    cursor: pointer;
}
#requirementsTable table {
    width: 100%;
    border-collapse: separate; /* КЛЮЧЕВО */
    border-spacing: 0;         /* чтобы не было зазоров */
    border: 0.1em solid #D9D9D9;
    border-radius: 0.3em;
    overflow: hidden;          /* КЛЮЧЕВО */
}

#requirementsTable th, #requirementsTable td {
	border: 0.01em solid #D9D9D9; /* Границы ячеек */
	padding: 1em 2em;         /* Отступы внутри ячеек */
}

#requirementsTable th {
	/*background-color: #D9D9D9; !* Цвет фона для заголовков *!*/
	font-weight: bold;         /* Жирный текст */
	width: 30%;                /* Устанавливаем ширину для первого столбца */
    color: #018370;
    text-align: left;
}

#requirementsTable td {
	vertical-align: top; /* Выравнивание текста по верху */
    font-weight: bold;
}


#requirementsTableWrapper{
	display: none;
}

#infoBlock div{
	display: none;
}

.career__courses{
    margin-top: 2em;
	display: none;
    border: 0.1rem solid #D9D9D9;
    border-radius: 0.3em;
}

.career__courses h3{
    color: #018370;
    padding: 1em 2em;
    border-bottom: 0.1em solid #D9D9D9;
    margin-top: 0;
    margin-bottom: 0;
}

#searchProfession{
	padding: 1rem 4rem 1rem 2rem;
	border: 0.1em solid #D9D9D9;
	border-radius: 0.3em;
	width: 100%;
	margin-bottom: 1em;
}
.career__courses li:last-child{
    border-bottom: none;
}

.career__courses li{
    font-weight: 600;
    padding: 1em 2em;
    border-bottom: 0.1em solid #D9D9D9;
}

/*#coursesList{*/
/*    padding: 1em 2em 2em;*/
/*}*/

#requirementsTableWrapper {
    min-height: 260px;       /* ты уже считаешь динамически — ок */
    overflow: hidden;        /* ⬅ критично */
    will-change: contents;  /* снижает первый reflow */
}

.career__info{
   /* background: #018370;*/
    background: #6E7082;
    padding: 1em 2em;
    border-radius: 0.3em;
    margin-bottom: 1em;
}

.career__title{
    margin-bottom: 1em;
}

.career__title__grey{
    color: grey;
}

.career__info_wrap{
    display: flex;
    align-items: center;
    gap: 1em;
    justify-content: space-between;
}

.career__info_wrap p{
    color: white;
    flex: 0 0 40em;
}

.footer_contact_us_btn:hover{
    color: white;
}

.career__info_wrap .footer_contact_us_btn{
    width: 20em;
    align-self: flex-end;
}

.show-more-courses{
    color: #000000;
    font-size: 1.1em;
    font-weight: 600;
    padding: 0.5em 2em;
    box-sizing: border-box;
    border-radius: 0.3em;
    background: #ffe600;
    text-align: center;
    margin: 0 auto;
    display: block;
    margin-bottom: 1em;
}
.career_block span {
    display: block;
    margin-bottom: 1rem;
    font-size: 1.5rem;
}

@media screen and (max-width: 768px) {
    #requirementsTable table {
        width: 100%; /* Таблица занимает всю ширину */
        border-collapse: collapse; /* Убираем двойные границы */
    }

    #requirementsTable table,
    #requirementsTable th,
    #requirementsTable td {
        display: block;
        width: 100%;
    }

    .career__info_wrap {
        flex-direction: column;
    }

    .career__info_wrap p {
        flex: 1;
    }

    .career__info_wrap .footer_contact_us_btn {
        width: 100%;
        padding: 0.7em;
    }

    .section__career select {
        font-size: 0.9em;
    }
}
@media screen and (orientation: portrait) {
    .toggle-btn {
        width: 60%;
        border-radius: 1.3vw;
        background: #ffe600;
        font-size: 4.5vw;
        padding: 0.7em;
    }
}