@import url('./public-dark-mode-v2.css?v=20260902-1');
@import url('./public-dark-mode-v2-compat.css?v=20260902-1');

/*
 * Autos Esquivel — public glass dropdown system
 * Intentionally scoped to .public-site-rebuild so CRM/back-office surfaces stay untouched.
 */
.public-site-rebuild {
    --ae-glass-bg: rgba(17, 19, 23, 0.72);
    --ae-glass-bg-strong: rgba(14, 16, 20, 0.9);
    --ae-glass-border: rgba(255, 255, 255, 0.14);
    --ae-glass-border-hover: rgba(255, 255, 255, 0.24);
    --ae-glass-highlight: rgba(255, 255, 255, 0.08);
    --ae-glass-highlight-strong: rgba(255, 255, 255, 0.12);
    --ae-glass-text: #f7f8fa;
    --ae-glass-muted: #aeb4bf;
    --ae-glass-shadow: 0 20px 52px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.07);
    --ae-glass-blur: 18px;
    --ae-glass-red-soft: rgba(227, 27, 35, 0.16);
    --ae-glass-red-ring: rgba(227, 27, 35, 0.18);
}

html[data-theme="light"] .public-site-rebuild {
    --ae-glass-bg: rgba(255, 255, 255, 0.68);
    --ae-glass-bg-strong: rgba(250, 251, 252, 0.9);
    --ae-glass-border: rgba(16, 20, 28, 0.12);
    --ae-glass-border-hover: rgba(16, 20, 28, 0.2);
    --ae-glass-highlight: rgba(16, 20, 28, 0.055);
    --ae-glass-highlight-strong: rgba(16, 20, 28, 0.09);
    --ae-glass-text: #16191f;
    --ae-glass-muted: #676e79;
    --ae-glass-shadow: 0 20px 52px rgba(31, 38, 49, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.82);
    --ae-glass-red-soft: rgba(217, 14, 43, 0.11);
    --ae-glass-red-ring: rgba(217, 14, 43, 0.14);
}

/* Custom select trigger: transparent enough to retain the surrounding surface. */
.public-site-rebuild .styled-select__trigger {
    border-color: var(--ae-glass-border);
    background: linear-gradient(145deg, var(--ae-glass-highlight-strong), rgba(255, 255, 255, 0.015));
    color: inherit;
    transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.public-site-rebuild .styled-select__trigger:hover {
    border-color: var(--ae-glass-border-hover);
    background: linear-gradient(145deg, var(--ae-glass-highlight-strong), var(--ae-glass-highlight));
}

.public-site-rebuild .styled-select__trigger:focus-visible,
.public-site-rebuild .styled-select.is-open .styled-select__trigger,
.public-site-rebuild .search-control.has-open-select .styled-select__trigger {
    outline: 0;
    border-color: var(--red, #e31b23);
    box-shadow: 0 0 0 3px var(--ae-glass-red-ring);
}

/* Floating option surfaces. */
.public-site-rebuild .styled-select__panel,
.public-site-rebuild .vehicle-autocomplete__panel {
    border: 1px solid var(--ae-glass-border);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.012)),
        var(--ae-glass-bg-strong);
    color: var(--ae-glass-text);
    box-shadow: var(--ae-glass-shadow);
    -webkit-backdrop-filter: blur(var(--ae-glass-blur)) saturate(135%);
    backdrop-filter: blur(var(--ae-glass-blur)) saturate(135%);
    isolation: isolate;
    overscroll-behavior: contain;
}

html[data-theme="light"] .public-site-rebuild .styled-select__panel,
html[data-theme="light"] .public-site-rebuild .vehicle-autocomplete__panel {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.7), rgba(246, 248, 250, 0.46)),
        var(--ae-glass-bg-strong);
}

.public-site-rebuild .styled-select__option,
.public-site-rebuild .vehicle-autocomplete__option {
    color: var(--ae-glass-text);
    border-color: var(--ae-glass-border);
    transition: background 140ms ease, color 140ms ease, transform 140ms ease;
}

.public-site-rebuild .styled-select__option:hover,
.public-site-rebuild .styled-select__option:focus-visible,
.public-site-rebuild .vehicle-autocomplete__option:hover,
.public-site-rebuild .vehicle-autocomplete__option:focus-visible {
    outline: 0;
    background: var(--ae-glass-highlight);
    color: var(--ae-glass-text);
}

.public-site-rebuild .styled-select__option.is-selected,
.public-site-rebuild .styled-select__option.is-active,
.public-site-rebuild .styled-select__option[aria-selected="true"],
.public-site-rebuild .vehicle-autocomplete__option.is-selected,
.public-site-rebuild .vehicle-autocomplete__option.is-active,
.public-site-rebuild .vehicle-autocomplete__option[aria-selected="true"] {
    background: linear-gradient(135deg, rgba(227, 27, 35, 0.94), rgba(185, 13, 20, 0.94));
    color: #fff;
}

.public-site-rebuild .styled-select__option small,
.public-site-rebuild .styled-select__option span,
.public-site-rebuild .vehicle-autocomplete__option small,
.public-site-rebuild .vehicle-autocomplete__option span {
    color: var(--ae-glass-muted);
}

.public-site-rebuild .styled-select__option.is-selected small,
.public-site-rebuild .styled-select__option.is-selected span,
.public-site-rebuild .styled-select__option.is-active small,
.public-site-rebuild .styled-select__option.is-active span,
.public-site-rebuild .styled-select__option[aria-selected="true"] small,
.public-site-rebuild .styled-select__option[aria-selected="true"] span,
.public-site-rebuild .vehicle-autocomplete__option.is-selected small,
.public-site-rebuild .vehicle-autocomplete__option.is-selected span,
.public-site-rebuild .vehicle-autocomplete__option.is-active small,
.public-site-rebuild .vehicle-autocomplete__option.is-active span,
.public-site-rebuild .vehicle-autocomplete__option[aria-selected="true"] small,
.public-site-rebuild .vehicle-autocomplete__option[aria-selected="true"] span {
    color: rgba(255, 255, 255, 0.82);
}

/* The home hero had an opaque white dropdown override; keep its clarity while restoring glass. */
.public-site-rebuild .vehicle-search--hero .styled-select__panel,
.public-site-rebuild .vehicle-search--hero .vehicle-autocomplete__panel {
    border-color: var(--ae-glass-border);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.64), rgba(244, 246, 249, 0.38)),
        var(--ae-glass-bg-strong);
    color: var(--ae-glass-text);
    box-shadow: var(--ae-glass-shadow);
}

html[data-theme="dark"] .public-site-rebuild .vehicle-search--hero .styled-select__panel,
html[data-theme="dark"] .public-site-rebuild .vehicle-search--hero .vehicle-autocomplete__panel {
    background:
        linear-gradient(180deg, rgba(39, 42, 48, 0.62), rgba(14, 16, 20, 0.68)),
        var(--ae-glass-bg-strong);
}

.public-site-rebuild .vehicle-search--hero .styled-select__option,
.public-site-rebuild .vehicle-search--hero .vehicle-autocomplete__option {
    color: var(--ae-glass-text);
}

.public-site-rebuild .vehicle-search--hero .styled-select__option:hover,
.public-site-rebuild .vehicle-search--hero .styled-select__option:focus-visible,
.public-site-rebuild .vehicle-search--hero .vehicle-autocomplete__option:hover,
.public-site-rebuild .vehicle-search--hero .vehicle-autocomplete__option:focus-visible {
    background: var(--ae-glass-highlight);
    color: var(--ae-glass-text);
}

.public-site-rebuild .vehicle-search--hero .styled-select__option.is-selected,
.public-site-rebuild .vehicle-search--hero .styled-select__option.is-active,
.public-site-rebuild .vehicle-search--hero .styled-select__option[aria-selected="true"],
.public-site-rebuild .vehicle-search--hero .vehicle-autocomplete__option.is-selected,
.public-site-rebuild .vehicle-search--hero .vehicle-autocomplete__option.is-active,
.public-site-rebuild .vehicle-search--hero .vehicle-autocomplete__option[aria-selected="true"] {
    background: linear-gradient(135deg, #ff354a, #d90e2b);
    color: #fff;
}

/* Native controls stay readable; the OS renders the opened native option list. */
.public-site-rebuild select:focus-visible,
.public-site-rebuild input[role="combobox"]:focus-visible {
    outline: 2px solid var(--red, #e31b23);
    outline-offset: 2px;
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .public-site-rebuild .styled-select__panel,
    .public-site-rebuild .vehicle-autocomplete__panel {
        background: var(--ae-glass-bg-strong);
    }
}

@media (max-width: 760px) {
    .public-site-rebuild .styled-select__panel,
    .public-site-rebuild .vehicle-autocomplete__panel {
        max-width: calc(100vw - 32px);
        max-height: min(360px, 55vh);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media (prefers-reduced-motion: reduce) {
    .public-site-rebuild .styled-select__trigger,
    .public-site-rebuild .styled-select__option,
    .public-site-rebuild .vehicle-autocomplete__option {
        transition: none;
    }
}

@media (forced-colors: active) {
    .public-site-rebuild .styled-select__trigger,
    .public-site-rebuild .styled-select__panel,
    .public-site-rebuild .vehicle-autocomplete__panel {
        border: 1px solid CanvasText;
        background: Canvas;
        color: CanvasText;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        box-shadow: none;
    }

    .public-site-rebuild .styled-select__option,
    .public-site-rebuild .vehicle-autocomplete__option {
        color: CanvasText;
    }

    .public-site-rebuild .styled-select__option.is-selected,
    .public-site-rebuild .styled-select__option.is-active,
    .public-site-rebuild .styled-select__option[aria-selected="true"],
    .public-site-rebuild .vehicle-autocomplete__option.is-selected,
    .public-site-rebuild .vehicle-autocomplete__option.is-active,
    .public-site-rebuild .vehicle-autocomplete__option[aria-selected="true"] {
        forced-color-adjust: none;
        background: Highlight;
        color: HighlightText;
    }
}