/* =========================================================
   MudDatePicker / MudTimePicker POPUP (Calendar + Clock)
   PickerClass -> атрибут:
   <div pickerclass="mud-dark-picker-popover" class="mud-picker ...">
   ========================================================= */

/* Основная "бумага" пикера */
.mud-picker[pickerclass="mud-dark-picker-popover"] {
    background: #1f1f1f !important;
    color: #f2d3a7 !important;
    border: 1px solid rgba(239, 208, 158, 0.45) !important;
    border-radius: 12px !important;
    box-shadow: 0 14px 40px rgba(0,0,0,0.55) !important;
}

    /* Внутренний контейнер */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-container,
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-content,
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-calendar-container {
        background: #1f1f1f !important;
        color: #f2d3a7 !important;
    }

    /* =========================
   CALENDAR (DatePicker)
   ========================= */

    /* Шапка календаря (месяц + стрелки) */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-calendar-header,
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-calendar-header-switch {
        background: #262626 !important;
        color: #f2d3a7 !important;
        border-bottom: 1px solid rgba(239, 208, 158, 0.25) !important;
    }

    /* Название месяца */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-button-month .mud-typography {
        color: #f2d3a7 !important;
    }

    /* Стрелки календаря prev/next */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-calendar-header .mud-icon-button,
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-calendar-header .mud-icon-button svg {
        color: var(--login-gold) !important;
        fill: var(--login-gold) !important;
        background: transparent !important;
    }

        .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-calendar-header .mud-icon-button:hover {
            background: rgba(239, 208, 158, 0.12) !important;
        }

    /* Дни недели */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-day-label {
        color: rgba(239, 208, 158, 0.75) !important;
    }

    /* Обычные дни */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-calendar-day.mud-day {
        color: #f2d3a7 !important;
        border-radius: 10px !important;
    }

        .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-calendar-day.mud-day:hover {
            background: rgba(239, 208, 158, 0.12) !important;
        }

    /* Сегодня */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-calendar-day.mud-current {
        border: 1px dashed rgba(239, 208, 158, 0.70) !important;
        color: var(--login-gold) !important;
    }

    /* Выбранный день */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-calendar-day.mud-selected,
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-calendar-day.mud-day.mud-selected {
        background: rgba(239, 208, 158, 0.22) !important;
        border: 1px solid rgba(239, 208, 158, 0.80) !important;
        color: var(--login-gold) !important;
    }

    /* Скрытые/неактивные дни */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-hidden {
        opacity: 0.20 !important;
    }

    /* =========================
   CLOCK (TimePicker)
   ========================= */

    /* Фон блока часов */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-timepicker-clock,
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-clock {
        background: #202020 !important;
    }

    /* Цифры на циферблате */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-time-number,
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-clock-number {
        color: #f2d3a7 !important;
        border-radius: 999px !important;
    }

        /* Hover цифр */
        .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-time-number:hover,
        .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-clock-number:hover {
            background: rgba(239, 208, 158, 0.12) !important;
        }

        /* Выбранная цифра */
        .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-time-number.mud-selected,
        .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-clock-number.mud-selected {
            background: rgba(239, 208, 158, 0.22) !important;
            color: var(--login-dark) !important;
            border: 1px solid rgba(239, 208, 158, 0.80) !important;
        }

   

    /* ===== Реальная стрелка TimePicker (pointer + thumb) ===== */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-time-clock-pointer,
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-time-clock-pointer-thumb,
    .mud-popover.mud-dark-picker-popover .mud-picker-time-clock-pointer,
    .mud-popover.mud-dark-picker-popover .mud-picker-time-clock-pointer-thumb {
        background: var(--login-gold) !important;
        background-color: var(--login-gold) !important;
        border-color: var(--login-gold) !important;
    }

        /* если линия стрелки сделана через псевдоэлемент */
        .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-time-clock-pointer::before,
        .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-time-clock-pointer::after,
        .mud-popover.mud-dark-picker-popover .mud-picker-time-clock-pointer::before,
        .mud-popover.mud-dark-picker-popover .mud-picker-time-clock-pointer::after {
            background: var(--login-gold) !important;
            background-color: var(--login-gold) !important;
            border-color: var(--login-gold) !important;
        }

        /* на случай, если mud-primary задаёт цвет */
        .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-time-clock-pointer.mud-primary,
        .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-time-clock-pointer-thumb.mud-primary,
        .mud-popover.mud-dark-picker-popover .mud-picker-time-clock-pointer.mud-primary,
        .mud-popover.mud-dark-picker-popover .mud-picker-time-clock-pointer-thumb.mud-primary {
            background: var(--login-gold) !important;
            background-color: var(--login-gold) !important;
            color: var(--login-gold) !important;
        }

    /* если выбранная цифра подсвечивается mud-theme-primary */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-theme-primary,
    .mud-popover.mud-dark-picker-popover .mud-theme-primary {
        color: var(--login-dark) !important;
    }

/* =========================================================
   Поля ввода Date/Time (чтобы НЕ становились чёрными)
   ========================================================= */

.mud-dark-picker {
    width: 100%;
}

    

    .mud-dark-picker .mud-input-outlined-border {
        border-color: var(--login-gold) !important;
        opacity: 1 !important;
    }

    .mud-dark-picker .mud-input-slot,
    .mud-dark-picker input,
    .mud-dark-picker .mud-input-slot .mud-typography {
        color: var(--login-gold) !important;
    }

        .mud-dark-picker input.mud-input-slot::placeholder {
            color: #d4aa7d !important;
            opacity: 0.9 !important;
        }

    .mud-dark-picker .mud-input-adornment,
    .mud-dark-picker .mud-input-adornment svg,
    .mud-dark-picker .mud-icon-button,
    .mud-dark-picker .mud-icon-button svg {
        color: var(--login-gold) !important;
    }

        .mud-dark-picker .mud-icon-button:hover {
            background: rgba(239, 208, 158, 0.12) !important;
        }

    .mud-dark-picker .mud-input-control.mud-input-focused .mud-input-outlined-border {
        border-color: var(--login-gold) !important;
        box-shadow: 0 0 0 1px var(--login-gold) !important;
    }



/* ===== TimePicker: шапка (фиолетовая) -> gold ===== */
.mud-picker[pickerclass="mud-dark-picker-popover"] .mud-timepicker-toolbar,
.mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-toolbar,
.mud-picker[pickerclass="mud-dark-picker-popover"] .mud-time-picker-toolbar {
    background: var(--login-gold) !important;
    color: var(--login-dark) !important;
    border-bottom: 1px solid rgba(0,0,0,0.15) !important;
}

    /* Текст/кнопки в шапке (чтобы не остались белыми/фиолетовыми) */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-timepicker-toolbar *,
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-picker-toolbar * {
        color: var(--login-dark) !important;
    }

    /* Если есть активные элементы/таблички времени сверху — тоже в тёмный */
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-timepicker-toolbar .mud-typography,
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-timepicker-toolbar .mud-button-root,
    .mud-picker[pickerclass="mud-dark-picker-popover"] .mud-timepicker-toolbar svg {
        color: var(--login-dark) !important;
        fill: var(--login-dark) !important;
    }