.source-data-container-time-dynamic {
    position: absolute;
    width: 330px;
    height: 281px;
    left: 100px;
    top: 100px;
}

.source-data-title-time-dynamic {
    position: absolute;
    width: 330px;
    height: 80px;
    font-size: 14px;
    text-align: center;
    background: #EFECE6;
    border: 1px solid #A38C7C;
    border-radius: 20px;
    font-family: 'Ysabeau Infant Medium';
    font-weight: 500;
    color: #3F2E21;
    padding-top: 10px;
    cursor: grab; /* ✅ Можно двигать */
    z-index: 999999 !important;
    top: 10px;
    display: flex;
    align-items: flex-start; /* 🔹 Выравниваем текст и иконку */
    justify-content: start;
}


.source-data-icon-time-dynamic {
    width: 11px; /* 🔹 Размер иконки */
    height: 11px;
    margin-right: 10px; /* 🔹 Отступ между иконкой и текстом */
    margin-left: 14px;
    margin-top: 6px;
}

.source-data-icons-time-dynamic {
    display: flex;
    justify-content: flex-start; /* ✅ Центрируем элементы */
    gap: 2px; /* ✅ Добавляем расстояние между кнопками */
    align-items: center;
    margin-top: 12px;
    margin-left: 10px;
    margin-bottom: 10px;
}

    .source-data-icons-time-dynamic button {
        border: none;
        background: none;
        padding: 5px;
        cursor: pointer;
    }

    .source-data-icons-time-dynamic img {
        width: 20px;
        height: 20px;
    }

.source-data-wrapper-time-dynamic {
    position: relative;
    width: 330px;
    height: 190px;
    background: #FFFFFF;
    border: 1px solid #A38C7C;
    border-radius: 20px;
    margin-top: 50px; /* ✅ Отступ, чтобы заголовок был отдельно */
    z-index: 999999 !important;
}

/*.source-data-input-container-time-dynamic {
    display: flex;
    align-items: flex-start;*/ /* ✅ Выравниваем иконку и поле */
/*gap: 0px;*/ /* ✅ Добавляем отступ между иконкой и текстовым полем */
/*}*/

.source-data-container-input-datetime-time-dynamic {
    position: relative;
    width: 153px;
    height: 45px;
    border: 1px solid #3F2E21;
    border-radius: 10px;
    padding: 10px;
    display: flex;
    gap: 0px;
    top: 10px;
    left: 10px;
}

.background-data-container-input-datetime-time-dynamic {
    position: absolute;
    top: 22px;
    right: 10px;
    width: 153px;
    height: 45px;
    border: 1px solid #3F2E21;
    border-radius: 10px;
    padding: 10px;
    display: flex;
    /*gap: 5px;
    top: 10px;
    right: 10px;*/
    margin-left: -10px;
    margin-top: -11px;
}

.source-data-input-time-dynamic {
    height: 22px;
    font-family: 'Ysabeau Infant Medium';
    font-weight: 100;
    font-size: 12px;
    line-height: 12px;
    color: #3F2E21;
    margin-left: 0px;
    border: none;
    appearance: none; /* ✅ Отключает стандартные UI-элементы */
    -webkit-appearance: none;
    -moz-appearance: none;
    max-width: 60px;
    outline: none;
}

    .source-data-input-time-dynamic::-webkit-calendar-picker-indicator {
        display: none; /* ✅ Убирает значок календаря и часов */
        background-color: none;
        background: none;
    }

    .source-data-input-time-dynamic::selection {
        background: transparent; /* ✅ Убирает цвет выделения */
        color: inherit; /* ✅ Оставляет стандартный цвет текста */
    }

.btn-open-time-dynamic {
    margin-left: 9px;
    margin-top: -12px;
    background: none;
    border: none;
}

    .btn-open-time-dynamic img {
        width: 20px;
        height: 20px;
    }

.btn-now-datetime-time-dynamic {
    margin-left: 9px;
    margin-top: 7px;
    background: none;
    border: none;
}

    .btn-now-datetime-time-dynamic img {
        width: 20px;
        height: 20px;
    }

.btn-now-place-time-dynamic {
    margin-left: 9px;
    margin-top: 5px;
    background: none;
    border: none;
}

    .btn-now-place-time-dynamic img {
        width: 20px;
        height: 20px;
    }

.btn-now-ll-time-dynamic {
    margin-left: 9px;
    margin-top: 3px;
    background: none;
    border: none;
}

    .btn-now-ll-time-dynamic img {
        width: 20px;
        height: 20px;
    }

/*.source-data-button-time-dynamic {
    position: absolute;
    width: 75px;
    height: 22px;
    background: #E9E4DD;
    border-radius: 20px;
    top: 140px;
    left: 202px;
    font-family: 'Ysabeau Infant Medium';
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    color: #3F2E21;
    text-align: center;
}*/

.close-button-time-dynamic {
    position: absolute;
    top: 5px;
    right: 10px;
    width: 20px;
    height: 20px;
    border: none;
    background: none;
    font-size: 18px;
    color: #A38C7C;
    cursor: pointer;
}

.time-control-container-time-dynamic {
    display: flex;
    flex-direction: column; /* ✅ Расположение элементов в столбец */
    gap: 1px;
    width: 100%;
    margin-left: 17px;
}

.time-step-time-dynamic {
    display: flex;
    align-items: center;
    gap: 7px;
    padding-bottom: 2px;
}

.time-input-time-dynamic {
    width: 20px;
    height: 20px;
    border: 1px solid #3F2E21; /* ✅ Добавляем границу */
    border-radius: 5px; /* ✅ Закругляем углы */
    /*  padding: 5px;  ✅ Добавляем внутренний отступ */
    padding-bottom: 5px;
    font-family: 'Ysabeau SC Regular';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 14px;
    text-align: center;
    text-transform: uppercase;
    color: #3F2E21;
}


.time-step-time-dynamic button {
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 5px;
    cursor: pointer;
    background: #FFFFFF;
    border: 1px solid #3F2E21;
    border-radius: 5px;
    font-family: 'Ysabeau Infant Medium';
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    transition: background-color 0.3s ease, transform 0.1s ease;
}

    .time-step-time-dynamic button:hover {
        background-color: #EFECE6; /* ✅ Цвет при наведении */
        transform: scale(1.05); /* ✅ Легкое увеличение */
    }

    .time-step-time-dynamic button:active {
        background-color: #EFECE6; /* ✅ Цвет при нажатии */
        transform: scale(0.95); /* ✅ Легкое уменьшение */
    }

.time-step-time-dynamic label {
    width: 60px; /* ✅ Фиксированная ширина для подписи */
    text-align: left;
    font-family: 'Ysabeau Infant Medium';
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: #3F2E21;
}

.time-slider-time-dynamic {
    width: 154px;
    cursor: pointer;
    accent-color: #A38C7C; /* ✅ Цвет ползунка */
    height: 0px;
    border: 1px solid #A38C7C;
    -webkit-appearance: none;
}

    .time-slider-time-dynamic::-webkit-slider-thumb {
        appearance: none !important;
        background: url('../images/slider.png') no-repeat center center; /* ✅ Добавляем иконку */
        background-size: contain; /* ✅ Масштабируем */
        width: 20px; /* ✅ Размер */
        height: 20px;
        border: none; /* ✅ Убираем стандартную рамку */
        cursor: pointer; /* ✅ Делаем удобнее для взаимодействия */
    }

#dateTimeTimeDynamic {
    width: 80px;
    height: 22px;
    top: 80px;
    left: 10px;
}

/*#dateTimeBackgroundTimeDynamic {
    width: 80px;
    height: 22px;
    top: 80px;
    left: 10px;
}*/

#timeTimeDynamic {
    width: 80px;
    height: 22px;
    top: 80px;
    left: 95px;
}

#gmtTimeDynamic {
    width: 29px;
    max-width: 29px; /* Дублируем для надежности */
    margin-right: 20px;
}

#gmtBackgroundTimeDynamic {
    width: 29px; /* Фиксированная ширина */
    max-width: 29px; /* Дублируем для надежности */
    padding: 0 1px; /* Опционально: внутренние отступы */
}

.timeDynamic-active-button {
    background-color: #E9E4DD !important;
    border-radius: 5px !important;
    border: 2px solid #A38C7C !important;
}

    .timeDynamic-active-button img {
        filter: brightness(0.9);
    }

.time-step-time-dynamic label[for="timeDaysTimeDynamic"],
.time-step-time-dynamic label[for="timeMonthsTimeDynamic"],
.time-step-time-dynamic label[for="timeYearsTimeDynamic"] {
    padding-left: 10px;
}

#show_background_data_time_dynamic:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}