/* --- СТИЛИ ДЛЯ НАШИХ DIV-ПИКЕРОВ --- */
.picker-group {
    display: flex;
    gap: 30px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.picker-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 180px;
}

.picker-label {
    font-size: 11px;
    font-weight: 700;
    color: #9aa0a6;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.datetime-display {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    font-size: 14px;
    font-weight: 800;
    color: #4a5568;
    cursor: pointer;
    user-select: none;
    border-bottom: 2px solid #e2e8f0;
    transition: border-color 0.2s ease;
}

    .datetime-display:hover {
        border-color: #3b82f6; /* Синяя линия при наведении как на макете */
    }

.datetime-icon {
    color: #3b82f6;
    
    display: flex;
    align-items: center;
}
/* Базовые настройки для контейнера плагина */
.air-datepicker {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
    padding: 12px !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    width: 290px !important;
    box-sizing: border-box !important;
    z-index: 9999 !important;
}

/* Шапка календаря (Март, 2026) — ВОЗВРАЩАЕМ И ВЫРАВНИВАЕМ */
.air-datepicker-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    border-bottom: none !important;
    padding: 4px 0 12px 0 !important;
    height: 32px !important; /* Фиксируем высоту шапки */
    box-sizing: border-box !important;
}

.air-datepicker-nav--title {
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #4a5568 !important;
    text-transform: capitalize !important;
}

.air-datepicker-nav--action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    background: transparent !important;
    color: #a0aec0 !important;
}

    .air-datepicker-nav--action:hover {
        color: #3b82f6 !important;
    }

/* Дни недели (Пн, Вт, Ср...) */
.air-datepicker-body--day-names {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    margin: 4px 0 !important;
}

.air-datepicker-body--day-name {
    color: #f59e0b !important; /* Оранжевый цвет дней */
    font-weight: 600 !important;
    font-size: 12px !important;
    text-align: center !important;
}

/* Сетка календаря */
.air-datepicker-body--cells.-days- {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 2px !important;
}

.air-datepicker-cell.-day- {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    color: #2d3748 !important;
    height: 36px !important;
    border-radius: 8px !important;
}

.air-datepicker-cell.-other-month- {
    color: #cbd5e1 !important;
}

.air-datepicker-cell.-selected-,
.air-datepicker-cell.-selected-.-current- {
    background: #46b5ed !important; /* Голубой квадрат выбора */
    color: #ffffff !important;
}

/* --- СТИЛИЗАЦИЯ ПОПАПА ВРЕМЕНИ --- */

/* Прячем шапку (навигацию) ТОЛЬКО в блоке выбора времени */
.air-datepicker.-only-timepicker- .air-datepicker-nav {
    display: none !important;
}

/* Делаем блок компактным по высоте, раз шапки больше нет */
.air-datepicker.-only-timepicker- {
    width: 250px !important;
    padding: 15px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
}

    /* Сбрасываем верхний отступ у блока с ползунками, чтобы не было пустых дыр */
    .air-datepicker.-only-timepicker- .air-datepicker-time {
        border-top: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }