/* Override Bootstrap LUX theme primary color variables that cause purple */
:root {
    --bs-primary: red !important;
    --bs-primary-rgb: 255, 0, 0 !important;
    --bs-focus-ring-color: rgba(255, 0, 0, 0.25) !important;
    --bs-link-color: black !important;
    --bs-link-hover-color: red !important;
}

/* Buttons */
.btn-outline-primary:hover {
    color: white;
    background-color: red;
    border-color: red;
}

.btn-outline-primary {
    color: black;
    border-color: black;
}

.btn-outline-primary:focus,
.btn-outline-primary.focus {
    box-shadow: 0 0 0 1.5px red !important;
}

[class*="btn-outline-"] {
    border-width: 1px;
}

/* Dash Dropdown - legacy Select component */
.custom-dropdown .Select--multi .Select-value {
    background-color: lightgrey;
    border-color: lightgrey;
    color: black;
}

.Select--multi .Select-value-icon {
    border-right: 1px solid darkgrey;
}

.is-focused:not(.is-open) > .Select-control {
    border-color: lightgrey !important;
    box-shadow: 0 0 0 1px red !important;
}

.Select-control:focus,
.Select.is-focused > .Select-control {
    border-color: red !important;
    box-shadow: 0 0 0 1px red !important;
    outline: none !important;
}

/* Dash 2.x dropdown (uses dash-dropdown class) */
.dash-dropdown .Select.is-focused > .Select-control,
.dash-dropdown .Select.is-focused:not(.is-open) > .Select-control {
    border-color: red !important;
    box-shadow: 0 0 0 1px red !important;
    outline: none !important;
}

/* RangeSlider track and handles */
.rc-slider-track {
    background-color: darkgrey;
}

.rc-slider-dot-active {
    border-color: grey;
    border: solid 1px grey;
}

.rc-slider-handle {
    background-color: grey;
    border-color: dimgrey;
    border: solid 1px black;
}

.rc-slider-handle:hover {
    border-color: grey;
    border: solid 1px black;
}

.rc-slider-handle:active {
    border-color: black;
    border: solid 1px black;
    box-shadow: 0 0 0 5px rgba(255, 0, 0, 0.3) !important;
}

.rc-slider-handle-dragging,
.rc-slider-handle-dragging.rc-slider-handle-dragging.rc-slider-handle-dragging {
    border-color: black !important;
    box-shadow: 0 0 0 5px red !important;
}

.rc-slider-handle-click-focused:focus {
    border-color: black;
    box-shadow: none;
    outline: none;
}

/* RangeSlider number input boxes (min/max year fields) */
input[type="number"],
input[type="text"] {
    border-color: #ccc;
    outline: none !important;
    box-shadow: none !important;
}

input[type="number"]:focus,
input[type="text"]:focus {
    border-color: red !important;
    box-shadow: 0 0 0 1px red !important;
    outline: none !important;
}

/* Catch-all for any remaining Bootstrap focus purple */
*:focus-visible {
    outline-color: red !important;
}

*:focus {
    outline-color: red !important;
}
/* Multi-select dropdown value tags — override default blue */
.Select--multi .Select-value {
    background-color: #e8e8e8 !important;
    border-color: #aaa !important;
}

.Select--multi .Select-value-label {
    color: #333 !important;
}

.Select--multi .Select-value-icon {
    color: #666 !important;
    border-right-color: #aaa !important;
}

.Select--multi .Select-value-icon:hover {
    background-color: #ccc !important;
    color: #333 !important;
}