/*
|--------------------------------------------------------------------------
| FGenio Dark Palettes
|--------------------------------------------------------------------------
| Shared by Admin and User panels.
*/

/* FGEN DARK INPUT BACKGROUND VARIABLE */
html[data-bs-theme="dark"] {
    --vz-input-bg-custom: var(--vz-secondary-bg);
}

[data-bs-theme="dark"][data-dark-palette="navy"] {
    --vz-body-bg: #020817;
    --vz-body-bg-rgb: 2, 8, 23;

    --vz-secondary-bg: #061225;
    --vz-secondary-bg-rgb: 6, 18, 37;

    --vz-tertiary-bg: #091a31;
    --vz-tertiary-bg-rgb: 9, 26, 49;

    --vz-light: #0a1c34;
    --vz-light-rgb: 10, 28, 52;

    --vz-dark: #0d2038;
    --vz-dark-rgb: 13, 32, 56;

    --vz-border-color: #193452;
    --vz-border-color-translucent: #193452;

    --vz-card-bg: #061225;
    --vz-card-cap-bg: #08182c;

    --vz-header-bg: #020817;
    --vz-header-border: #193452;
    --vz-header-item-bg: #0b2340;

    --vz-topbar-search-bg: rgba(4, 16, 32, .92);
    --vz-topbar-user-bg: #07182c;

    --vz-vertical-menu-bg: #030d1c;
    --vz-vertical-menu-border: #152e4a;
    --vz-vertical-menu-item-color: #a9b7c9;
    --vz-vertical-menu-sub-item-color: #879ab2;
    --vz-vertical-menu-title-color: #6f849e;

    --vz-footer-bg: #020817;
    --vz-footer-color: #879ab2;

    --vz-page-title-border: #193452;
}

/* FGEN CHOICES DARK COMPATIBILITY */
html[data-bs-theme="dark"] .choices__inner,
html[data-bs-theme="dark"] .choices__input {
    background-color: var(--vz-input-bg-custom);
    color: var(--vz-body-color);
    border-color: var(--vz-border-color);
}

html[data-bs-theme="dark"] .choices__list[aria-expanded] {
    background-color: var(--vz-secondary-bg);
    color: var(--vz-body-color);
    border-color: var(--vz-border-color);
    box-shadow: var(--vz-box-shadow);
    z-index: 1060;
}

html[data-bs-theme="dark"] .choices__list[aria-expanded] .choices__list {
    margin: 0;
    padding: 0;
    max-height: 300px;
    overflow-y: auto;
}

html[data-bs-theme="dark"] .choices__list[aria-expanded] .choices__item {
    color: var(--vz-body-color);
    padding: .5rem .9rem;
}

html[data-bs-theme="dark"] .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
    background-color: var(--vz-tertiary-bg);
    color: var(--vz-body-color);
}

html[data-bs-theme="dark"] .choices__placeholder {
    color: var(--vz-secondary-color);
    opacity: 1;
}


/* FGEN DARK FORM COMPONENTS */
html[data-bs-theme="dark"] .form-control,
html[data-bs-theme="dark"] .form-select,
html[data-bs-theme="dark"] .form-control:disabled,
html[data-bs-theme="dark"] .form-control[readonly],
html[data-bs-theme="dark"] .flatpickr-input {
    background-color: var(--vz-input-bg-custom, var(--vz-secondary-bg));
    color: var(--vz-body-color);
    border-color: var(--vz-border-color);
}

html[data-bs-theme="dark"] .form-control::placeholder,
html[data-bs-theme="dark"] .flatpickr-input::placeholder {
    color: var(--vz-secondary-color);
    opacity: 1;
}

html[data-bs-theme="dark"] .form-control:focus,
html[data-bs-theme="dark"] .form-select:focus,
html[data-bs-theme="dark"] .flatpickr-input:focus {
    background-color: var(--vz-input-bg-custom, var(--vz-secondary-bg));
    color: var(--vz-body-color);
    border-color: var(--vz-primary);
}

html[data-bs-theme="dark"] .form-select {
    --vz-form-select-bg-img: var(--vz-form-select-bg-img-dark);
}

html[data-bs-theme="dark"] .flatpickr-calendar {
    background-color: var(--vz-secondary-bg);
    border-color: var(--vz-border-color);
    box-shadow: var(--vz-box-shadow);
}

html[data-bs-theme="dark"] .flatpickr-months,
html[data-bs-theme="dark"] .flatpickr-weekdays,
html[data-bs-theme="dark"] .flatpickr-current-month,
html[data-bs-theme="dark"] .flatpickr-day,
html[data-bs-theme="dark"] .flatpickr-time input,
html[data-bs-theme="dark"] .flatpickr-time .flatpickr-am-pm {
    color: var(--vz-body-color);
}

html[data-bs-theme="dark"] .flatpickr-day:hover,
html[data-bs-theme="dark"] .flatpickr-day:focus {
    background-color: var(--vz-tertiary-bg);
    border-color: var(--vz-tertiary-bg);
}

html[data-bs-theme="dark"] .ck.ck-editor__main > .ck-editor__editable,
html[data-bs-theme="dark"] .ck.ck-toolbar,
html[data-bs-theme="dark"] .ck.ck-dropdown__panel,
html[data-bs-theme="dark"] .ck.ck-list {
    background-color: var(--vz-input-bg-custom, var(--vz-secondary-bg));
    color: var(--vz-body-color);
    border-color: var(--vz-border-color);
}

html[data-bs-theme="dark"] .ck.ck-button,
html[data-bs-theme="dark"] .ck.ck-button .ck-button__label,
html[data-bs-theme="dark"] .ck.ck-icon {
    color: var(--vz-body-color);
}

html[data-bs-theme="dark"] .ck.ck-button:hover:not(.ck-disabled),
html[data-bs-theme="dark"] .ck.ck-button.ck-on {
    background-color: var(--vz-tertiary-bg);
}

html[data-bs-theme="dark"] .ck.ck-editor__editable.ck-focused:not(.ck-editor__nested-editable) {
    border-color: var(--vz-primary);
}