/* --- Premium Capsule Dropdown Pill Cohesive Theme --- */
.premium-dropdown-pill {
    display: inline-flex;
    align-items: center;
    background: #F8FAFC; /* Sleeker soft background */
    border: 1.5px solid #E2E8F0; /* Much cleaner light slate border */
    border-radius: 14px; /* Matches modern grid borders and rounded design */
    padding: 0 0.5rem 0 0.75rem; /* Tight, sleek internal padding */
    height: 38px; /* Sleeker, tighter vertical height */
    width: 175px; /* Perfect width preventing line wrapping */
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.02);
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    box-sizing: border-box;
    position: relative;
    z-index: 10 !important;
}

.dash-dropdown,
.dash-dropdown-content {
    border: none !important;
    background: none !important;
}


.premium-dropdown-pill:hover {
    border-color: var(--accent-purple);
    background: #FFFFFF;
    box-shadow: 0 6px 16px rgba(124, 58, 237, 0.08);
    transform: translateY(-1px);
}

.premium-dropdown-pill:focus-within {
    border-color: var(--accent-purple);
    background: #FFFFFF;
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.12);
}

.premium-dropdown-icon {
    color: var(--accent-purple);
    font-size: 0.85rem; /* Sleeker, standard size */
    margin-right: 0.35rem; /* Snug breathing room */
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}

/* Hide default Dash dropdown borders & shadows in clean dropdown mode */
.premium-dropdown-pill .dash-dropdown-clean {
    flex-grow: 1;
    width: 100% !important;
}

/* Target and completely remove any inner border, separator or background from React-Select (handles both v1 and v2+) */
.premium-dropdown-pill .Select,
.premium-dropdown-pill .Select-control,
.premium-dropdown-pill .dash-dropdown-clean .Select,
.premium-dropdown-pill .dash-dropdown-clean .Select-control,
.premium-dropdown-pill .Select__control,
.premium-dropdown-pill .Select__control:hover,
.premium-dropdown-pill .Select__control--is-focused,
.premium-dropdown-pill .Select__control--is-focused:hover,
.premium-dropdown-pill .dash-dropdown-clean .Select__control,
.premium-dropdown-pill .dash-dropdown-clean .Select__control:hover,
.premium-dropdown-pill .dash-dropdown-clean .Select__control--is-focused,
.premium-dropdown-pill .dash-dropdown-clean .Select__control--is-focused:hover {
    border: none !important;
    border-color: transparent !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    height: 34px !important; /* Adjusted to center vertically in 38px pill */
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
}

/* Align and clean up the value container and indicators wrapper */
.premium-dropdown-pill .Select__value-container,
.premium-dropdown-pill .Select__indicators,
.premium-dropdown-pill .Select__indicator,
.premium-dropdown-pill .Select__dropdown-indicator,
.premium-dropdown-pill .dash-dropdown-clean .Select-value,
.premium-dropdown-pill .dash-dropdown-clean .Select__value-container,
.premium-dropdown-pill .dash-dropdown-clean .Select__indicators {
    border: none !important;
    border-color: transparent !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    height: 34px !important; /* Adjusted to center vertically in 38px pill */
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
}

/* Hide the ugly react-select vertical separator line */
.premium-dropdown-pill .Select__indicator-separator {
    display: none !important;
}

/* Target placeholders and selected values inside the dropdown */
.premium-dropdown-pill .dash-dropdown-clean .Select-placeholder,
.premium-dropdown-pill .dash-dropdown-clean .Select-value-label,
.premium-dropdown-pill .dash-dropdown-clean .Select__placeholder,
.premium-dropdown-pill .dash-dropdown-clean .Select__single-value {
    padding-left: 2px !important;
    color: var(--text-main) !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}

/* Make sure the single-value is centered and doesn't get offset */
.premium-dropdown-pill .dash-dropdown-clean .Select__single-value {
    line-height: normal !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    transform: none !important;
    top: auto !important;
}

/* Input container needs standard typography and zero spacing to prevent pushing text */
.premium-dropdown-pill .dash-dropdown-clean .Select__input-container,
.premium-dropdown-pill .dash-dropdown-clean .Select__input {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--text-main) !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}

.premium-dropdown-pill .dash-dropdown-clean .Select-arrow-zone,
.premium-dropdown-pill .dash-dropdown-clean .Select__indicators {
    padding-right: 2px !important;
}

.premium-dropdown-pill .dash-dropdown-clean .Select-arrow {
    border-color: #64748B transparent transparent !important;
    border-width: 5px 4px 0 !important;
}

.premium-dropdown-pill .dash-dropdown-clean .Select__dropdown-indicator {
    color: #64748B !important;
}

.premium-dropdown-pill .dash-dropdown-clean .is-open .Select-arrow {
    border-color: transparent transparent #64748B !important;
    border-width: 0 4px 5px !important;
}

.premium-dropdown-pill .dash-dropdown-clean .Select-menu-outer,
.premium-dropdown-pill .dash-dropdown-clean .Select__menu {
    border-radius: 16px !important; /* Extremely smooth rounded option menu */
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1) !important;
    background-color: #FFFFFF !important;
    overflow: hidden !important;
    margin-top: 8px !important;
    z-index: 999 !important;
    min-width: 160px !important; /* Ensures plenty of room for option text */
}

.premium-dropdown-pill .dash-dropdown-clean .Select-option,
.premium-dropdown-pill .dash-dropdown-clean .Select__option {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;
    color: var(--text-sub) !important;
    padding: 10px 16px !important;
    transition: all 0.2s ease !important;
}

.premium-dropdown-pill .dash-dropdown-clean .Select-option.is-focused,
.premium-dropdown-pill .dash-dropdown-clean .Select__option--is-focused {
    background-color: rgba(124, 58, 237, 0.06) !important;
    color: var(--accent-purple) !important;
}

.premium-dropdown-pill .dash-dropdown-clean .Select-option.is-selected,
.premium-dropdown-pill .dash-dropdown-clean .Select__option--is-selected {
    background-color: var(--accent-purple) !important;
    color: #FFFFFF !important;
}
