/* ── dcc.Dropdown dark theme (.dark-dropdown) ─────────────────────────────── */

/* Nuclear: force every child element dark */
.dark-dropdown * {
    background-color: #16213e !important;
    color: #e0e0e0 !important;
}

/* Control bar border */
.dark-dropdown .Select-control,
.dark-dropdown [class*="-control"] {
    border-color: #444466 !important;
}
.dark-dropdown .Select-control:hover,
.dark-dropdown [class*="-control"]:hover {
    border-color: #6666aa !important;
    box-shadow: none !important;
}

/* Dropdown menu panel */
.dark-dropdown .Select-menu-outer,
.dark-dropdown [class*="-menu"],
.dark-dropdown [class*="-MenuList"] {
    background-color: #16213e !important;
    border: 1px solid #444466 !important;
    z-index: 9999 !important;
}

/* Individual options — hover / focused */
.dark-dropdown .Select-option:hover,
.dark-dropdown .Select-option.is-focused,
.dark-dropdown [class*="-option"]:hover,
.dark-dropdown [class*="-option--is-focused"] {
    background-color: #0f3460 !important;
    color: #ffffff !important;
}

/* Selected option */
.dark-dropdown .Select-option.is-selected,
.dark-dropdown [class*="-option--is-selected"] {
    background-color: #0f3460 !important;
    color: #00b09b !important;
}

/* Dropdown arrow */
.dark-dropdown .Select-arrow,
.dark-dropdown [class*="-dropdownIndicator"] svg,
.dark-dropdown [class*="-indicatorContainer"] svg {
    fill: #9090b0 !important;
    color: #9090b0 !important;
}
.dark-dropdown [class*="-indicatorSeparator"] {
    background-color: #444466 !important;
}

/* Multi-value tags */
.dark-dropdown .Select-value,
.dark-dropdown [class*="-multiValue"] {
    background-color: #0f3460 !important;
    border: 1px solid #6666aa !important;
}
.dark-dropdown [class*="-multiValue"] * {
    color: #e0e0e0 !important;
}
.dark-dropdown [class*="-multiValueRemove"]:hover {
    background-color: #ff4e50 !important;
    color: white !important;
}

/* ── dbc.Select (native <select>) ─────────────────────────────────────────── */
select.bg-dark {
    background-color: #16213e !important;
    color: #e0e0e0 !important;
    border-color: #444466 !important;
}
select.bg-dark option {
    background-color: #16213e !important;
    color: #e0e0e0 !important;
}

/* ── dbc.Input number box ─────────────────────────────────────────────────── */
input.bg-dark {
    background-color: #16213e !important;
    color: #e0e0e0 !important;
    border-color: #444466 !important;
}
input.bg-dark::placeholder {
    color: #6666aa !important;
}

/* ── dbc.RadioItems / dbc.Checklist labels ────────────────────────────────── */
.text-light .form-check-label,
.form-check.text-light label,
.form-check-inline label {
    color: #e0e0e0 !important;
}

/* ── dbc.Label ────────────────────────────────────────────────────────────── */
.text-light.form-label,
label.text-light {
    color: #c0c0d0 !important;
}