/* Comments for this file live in .claude/comment.md -- moved there so they
   stop shipping to every visitor. Search it for the selector you are about
   to change; several of these decisions were reverted once already. */
.slider-address-fixed {
    opacity:0;
    visibility:hidden;

    transition:
        opacity 0.45s ease,
        transform 0.45s ease;

    transform:
        translate(-50%, -46%);
	position:absolute;
    z-index:50;
    left:50%;
    top:45%;
    transform:translate(-50%, -50%);
    width:100%;
    max-width:540px;
    pointer-events:auto;
}
.slider-address-fixed.loaded {
    opacity:1;
    visibility:visible;

    transform:
        translate(-50%, -50%);
}

.slider-address-box {
    width:100%;
    margin:0 auto;
    padding:22px 20px;
    background:rgba(255,255,255,0.96);
    border-radius:14px;
    box-shadow:0 18px 44px rgba(3,16,28,0.28), 0 2px 6px rgba(3,16,28,0.10);
    text-align:center;
}

.slider-address-title {
    margin:0 0 0.3em 0 !important;
    font-family:var(--font-display);
    font-size:20px !important;
    font-weight:800;
    line-height:1.2;
    letter-spacing:-0.02em;
    color:var(--ink) !important;
    text-transform:none !important;
    text-shadow:none !important;
}

.slider-address-subtitle {
    margin:0 0 0.85em 0;
    font-size:13px;
    line-height:1.5;
    color:var(--muted);
}

.slider-vehicle-step[hidden],
.slider-address-step[hidden] {
    display:none !important;
}

.slider-vehicle-help {
    display:inline-flex;
    align-items:center;
    gap:4px;
    margin:0 0 0.6em;
    margin-left:3px;
    font-size:12px !important;
    font-weight:700;
    text-transform:none;
    color:var(--blue) !important;
    text-decoration:none;
}

.slider-vehicle-help:hover {
    text-decoration:underline;
}

.slider-vehicle-search-wrap {
    position:relative;
    text-align:left;
}

#slider-address-fixed ~ article .hero-headline,
#slider-address-fixed ~ article .slider-actions {
    display:none !important;
}

.slider-vehicle-search-wrap .vp-search-input {
    width:100%;
    height:48px;
    margin:0;
    padding:0 12px;
    border:1px solid #cedae3;
    border-radius:8px;
    background:#fff;
    color:var(--ink);
}

.slider-vehicle-search-wrap .vp-search-input:focus {
    border-color:var(--blue);
    outline:none;
    box-shadow:0 0 0 3px rgba(8,119,201,0.14);
}

.slider-vehicle-search-wrap .vp-search-results {
    max-height:260px;
    overflow-y:auto;
    z-index:999999;
}

.slider-vehicle-staged {
    display:flex;
    margin:0 0 0.75em;
    border:1px solid var(--line);
    border-radius:8px;
    box-shadow:none;
    color:var(--ink) !important;
    text-decoration:none;
}

.slider-vehicle-staged .vp-search-result-label,
.slider-vehicle-staged .vp-search-result-sub {
    color:var(--ink) !important;
}

.slider-vehicle-staged .vp-search-result-label {
    display:flex;
    align-items:center;
    gap:8px;
}

.slider-vehicle-staged .ozfa-reset-vehicle {
    margin-left:auto;
    color:#c62828 !important;
    font-size:1.05em;
    line-height:1;
    text-decoration:none;
}

.slider-vehicle-staged[hidden] {
    display:none !important;
}

.slider-vehicle-staged::after {
    content:'View compatible products';
    margin-left:auto;
    align-self:center;
    padding-left:10px;
    color:var(--blue);
    font-size:12px;
    font-weight:900;
    white-space:nowrap;
}

.slider-vehicle-error {
    margin:0.55em 0 0;
    color:#a23a3a;
    font-size:0.82em;
}

.slider-address-box #checkout-warning,
.slider-address-box #map,
.slider-address-box #logger,
.slider-address-box #badder,
.slider-address-box .success,
.slider-address-box .warning {
    display:none !important;
}

.slider-address-box .col-12 {
    margin:0 !important;
}

.slider-address-box .address-topline {
    width:100% !important;
    max-width:100% !important;
    justify-content:center;
    margin:0 0 0.45em 0 !important;
}

.slider-address-box .address-note {
    color:#444 !important;
    font-size:0.82em !important;
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
}

.slider-address-box .address-row {
    width:100% !important;
    max-width:100% !important;
    margin:0 auto !important;
    justify-content:center !important;
}

.slider-address-box .geocoder,
.slider-address-box .mapboxgl-ctrl-geocoder,
.slider-address-box input.mapboxgl-ctrl-geocoder--input,
.slider-address-box input#address {
    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;
}

.slider-address-box input.mapboxgl-ctrl-geocoder--input,
.slider-address-box input#address {
    height:48px !important;
    font-size:0.95em !important;
    color:var(--ink) !important;
    background:#fff !important;
    border:1px solid #cedae3 !important;
    border-radius:8px !important;
}

.slider-address-box .geomarker {
    right:13px !important;
    color:var(--blue) !important;
}

.slider-actions {
    margin-top:0.7em;
}

@media screen and (max-width:768px) {

    .slider-address-fixed {
        top:46%;
        width:92%;
        max-width:92%;
    }

    .slider-address-box {
        padding:0.9em;
    }

    .slider-address-title {
        font-size:17px !important;
    }

    .slider-address-subtitle {
        font-size:0.82em;
    }

    .slider-address-box input.mapboxgl-ctrl-geocoder--input,
    .slider-address-box input#address {
        height:46px !important;
    }

}

.slider-address-box .mapboxgl-ctrl-geocoder {
    position:relative !important;
    text-align:left !important;
}

.slider-address-box .mapboxgl-ctrl-geocoder .suggestions {
    position:absolute !important;

    top:100% !important;
    left:0 !important;

    width:100% !important;

    background:#fff !important;

    border:1px solid var(--line) !important;
    border-radius:0 0 10px 10px !important;

    box-shadow:
        0 10px 30px rgba(0,0,0,0.18) !important;

    overflow:hidden !important;

    z-index:999999 !important;

    text-align:left !important;
}

.slider-address-box .suggestions > li,
.slider-address-box .suggestions .mapboxgl-ctrl-geocoder--suggestion {
    color:var(--ink) !important;

    border:0 !important;

    text-align:left !important;

    font-size:1em !important;
    line-height:1.35 !important;

    cursor:pointer !important;
}

.slider-address-box .suggestions > li:hover,
.slider-address-box .suggestions .mapboxgl-ctrl-geocoder--suggestion:hover,
.slider-address-box .active {
    background:var(--surface) !important;
    color:var(--ink) !important;
}

.slider-address-box .mapboxgl-ctrl-geocoder--suggestion-title {
    color:var(--ink) !important;
    font-weight:700 !important;
}

.slider-address-box .mapboxgl-ctrl-geocoder--suggestion-address {
    color:var(--muted) !important;
    font-size:0.82em !important;
}

.slider-address-box .address-row {
    align-items:flex-start !important;
}

@media screen and (max-width:768px) {

    .slider-address-fixed {
        transition:
            top 0.35s ease,
            left 0.35s ease,
            right 0.35s ease,
            width 0.35s ease,
            max-width 0.35s ease,
            transform 0.35s ease;
    }

    .slider-address-box {
        transition:
            border-radius 0.35s ease,
            box-shadow 0.35s ease;
    }

    body.geocoder-mobile-focus .slider-address-fixed {
        position:fixed !important;

        top:4em !important;
        left:12px !important;
        right:12px !important;

        width:auto !important;
        max-width:none !important;

        transform:none !important;

        z-index:999999 !important;
    }

    body.geocoder-mobile-focus .slider-address-box {
        border-radius:12px !important;

        box-shadow:
            0 12px 40px rgba(0,0,0,0.22) !important;
    }

    body.geocoder-mobile-focus .mapboxgl-ctrl-geocoder .suggestions {
        max-height:40vh !important;
        overflow-y:auto !important;
    }

}
