//
// Datepicker
// --------------------------------------------------

@if not $prev-datepicker {
    .ui-widget-header {
        border: none !important;
        background: var(--hh-background-color-main) !important;
        color: var(--hh-text-color-secondary) !important;
        font-weight: 300 !important;
    }

    .ui-widget-content {
        border: 1px solid #dddcda !important;
        border-radius: 0 !important;
        background: var(--hh-background-color-main);
        color: var(--hh-text-color-highlight) !important;
        box-shadow: 0 6px 6px rgba(0, 0, 0, 0.1);
    }

    .ui-datepicker .ui-datepicker-prev span,
    .ui-datepicker .ui-datepicker-next span {
        opacity: 0.2;
    }

    .ui-datepicker .ui-datepicker-prev:hover,
    .ui-datepicker .ui-datepicker-next:hover {
        background: var(--hh-background-color-main) !important;
        border: none;
        margin: 1px;
    }

    .ui-state-default,
    .ui-widget-content .ui-state-default,
    .ui-widget-header .ui-state-default {
        border: none !important;
        background: var(--hh-background-color-secondary) !important;
        color: var(--hh-text-color-secondary) !important;
    }

    .ui-state-highlight,
    .ui-widget-content .ui-state-highlight,
    .ui-widget-header .ui-state-highlight {
        border: none !important;
        border: 1px solid var(--hh-background4) !important;
    }

    .ui-state-active,
    .ui-widget-content .ui-state-active,
    .ui-widget-header .ui-state-active {
        border: 1px solid var(--bs-accent) !important;
        background: var(--accent) !important;
        color: var(--hh-accent-contrast) !important;
    }
}