
.idiss-h3 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700; /* Bold */
    font-size: 28px; /* Размер шрифта */
    color:#000000;
}

.designer-main {
    padding: 2em;
    gap: 1em;
    display: flex;
    flex-direction: column;
    min-height: 80vh;
}
.formulator-block {
    margin-top: 2em;
    font-family: 'Montserrat', sans-serif;
    color: #AEADB1;
    font-size: 24px; /* Размер шрифта */

}


.nav-pills .nav-link {
    background-color: #F1AFB4; /* Красный фон */
    color: #FFFFFF; /* Белый цвет текста */
    border-radius: 25px; /* Закругленные края */
    margin: 5px; /* Отступы между кнопками */
    padding: 10px 20px; /* Внутренние отступы */
    border: none; /* Убираем границу */
    transition: background-color 0.3s; /* Плавный переход цвета */
}

.nav-pills .nav-link:hover {
    background-color: #E02A36; /* Цвет кнопки при наведении */
}

.nav-pills .nav-link.active {
    background-color: #E02A36; /* Цвет активной кнопки */
}



.mb-3 {
    position: relative; /* Устанавливаем относительное позиционирование для контейнера */
}

.mb-3 label {
    position: absolute; /* Устанавливаем абсолютное позиционирование для лейбла */
    top: -10px; /* Поднимаем лейбл над полем ввода */
    left: 10px; /* Устанавливаем отступ слева */
    font-size: 0.9rem; /* Размер шрифта для лейбла */
    color: #AEADB1; /* Цвет текста для лейбла */
    z-index: 2;
    padding: 0 5px; /* Отступы вокруг текста лейбла */
    background: white;
}
.mb-3 select {
    z-index: 1;
}

  .idiss-button {
        background: linear-gradient(to right, #FE5C60, #E02A36); /* Линейный градиент */
        color: white; /* Белый цвет шрифта */
        font-size: 28px; /* Размер шрифта */
        font-weight: bold; /* Жирный шрифт */
        height: 100px; /* Высота кнопки */
        width: 30%; /* Ширина 100% для адаптивности */
        border: none; /* Убираем границу */
        border-radius: 15px; /* Закругленные углы */
        cursor: pointer; /* Указатель при наведении */
        transition: background 0.3s; /* Плавный переход фона */
        text-transform: uppercase;
        
    }

    .idiss-button:hover {
        background: linear-gradient(to right, #E02A36, #FE5C60); /* Обратный градиент при наведении */
    }

.mb-3 input {
    color: #AEADB1; /* Цвет текста для лейбла */
}

.flex-container {
    display: flex; /* Используем flexbox для контейнера */
    flex-wrap: wrap; /* Позволяем элементам переноситься на новую строку */
}

@media (max-width: 768px) {
    .flex-container {
        flex-direction: column; /* На малых экранах элементы располагаются в колонку */
    }

    .input-group {
        width: 100%; /* Устанавливаем ширину для поля ввода */
    }

    .idiss-button {
        margin-top: 10px; /* Добавляем отступ сверху для кнопки */
    }
    .input-group .form-control {
        width: 100%;

    }
}

.designer-title-block {
    background:  #F5F5F5 !important;
    box-shadow: none;
}

.formulator-form {
    height: auto;
}
    @media (max-width: 768px) {
        .form-control, .idiss-button {
            height: 45px; /* Уменьшенная высота для меньших экранов */
        }
        .idiss-button {
            width: 100%;
        }
    }

    @media (max-width: 480px) {
        .form-control, .idiss-button {
            height: 40px; /* Еще меньшая высота для мобильных устройств */
        }
        .idiss-button {
            width: 100%;
        }
    }

  .input-label .form-label {
        font-size: 24px; /* Крупный шрифт для метки */
        font-weight: bold; /* Жирный шрифт */
        margin-bottom: 10px; /* Отступ снизу */
        display: block; /* Отображение в блоке для корректного отступа */
        text-transform: uppercase;
    }

.form-select {
    height: 70px;
}