/*
 * "Моє авто" card — shared by the planner and the reachability zone.
 *
 * One row: a small caption, the usual car and a switch. On means the tool takes
 * the vehicle parameters from that car and their manual fields are hidden; off
 * reveals them again. Deliberately free of accent colour, so it reads as part
 * of the form rather than as a promotion.
 */
/*
 * `hidden` on a vehicle field has to beat the layout rules of both forms:
 * the range panel styles its rows as flex/grid, which would otherwise keep a
 * hidden row on screen.
 */
[data-vehicle-setting][hidden] { display: none !important; }

/* "Моє авто": one neutral row — car name and a switch. */
.evb-car-picker.evb-car-picker--card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    column-gap: 12px;
    align-items: center;
    margin: 0 0 10px;
    padding: 8px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fff;
}
.evb-car-picker.evb-car-picker--card [hidden] { display: none !important; }
.evb-car-picker.evb-car-picker--card .evb-car-picker__label {
    grid-column: 1;
    grid-row: 1;
    color: #6b7280;
    font-size: 10px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.evb-car-picker__name {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
    overflow: hidden;
    color: #111827;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.evb-car-picker.evb-car-picker--card.is-off .evb-car-picker__name { color: #6b7280; font-weight: 600; }
.evb-car-picker__toggle {
    grid-column: 2;
    grid-row: 1 / 3;
    display: inline-flex;
    align-items: center;
    margin: 0;
    cursor: pointer;
}
.evb-car-picker__toggle-input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.evb-car-picker__toggle-ui {
    position: relative;
    display: block;
    width: 38px;
    height: 22px;
    border-radius: 999px;
    background: #d1d5db;
    transition: background .15s;
}
.evb-car-picker__toggle-ui::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(17, 24, 39, .25);
    transition: transform .15s;
}
.evb-car-picker__toggle-input:checked + .evb-car-picker__toggle-ui { background: #111827; }
.evb-car-picker__toggle-input:checked + .evb-car-picker__toggle-ui::after { transform: translateX(16px); }
.evb-car-picker__toggle-input:focus-visible + .evb-car-picker__toggle-ui { outline: 2px solid #111827; outline-offset: 2px; }
.evb-car-picker.evb-car-picker--card .evb-car-picker__summary {
    grid-column: 1 / -1;
    grid-row: 3;
    margin: 4px 0 0;
    color: #6b7280;
    font-size: 11px;
    line-height: 1.3;
}

@media (max-width: 380px) {
    .evb-car-picker.evb-car-picker--card { padding: 7px 10px; margin-bottom: 8px; }
}