/* FITMENTPRO_HYVA_GDS_CONTRACT_START
 * Native Hyva variables are the presentation source of truth.
 * PartsDone_GlobalDesignSystemSettings updates those variables and supplies
 * the remaining typography, spacing, status, motion, icon and overlay tokens.
 */
:root {
    --pd-fitment-color-primary: var(--color-primary, var(--pd-gds-color-primary, #1f48c5));
    --pd-fitment-color-primary-hover: var(--color-primary-darker, var(--pd-gds-color-primary-hover, #173aa3));
    --pd-fitment-color-on-primary: var(--color-on-primary, var(--pd-gds-button-primary-color, #fff));
    --pd-fitment-color-text: var(--color-fg, var(--pd-gds-color-text, #111827));
    --pd-fitment-color-text-muted: var(--color-fg-secondary, var(--pd-gds-color-text-muted, #6b7280));
    --pd-fitment-color-surface: var(--color-surface, var(--pd-gds-color-surface, #fff));
    --pd-fitment-color-container: var(--color-container, var(--pd-gds-color-surface-muted, #f8fafc));
    --pd-fitment-color-border: var(--card-stroke, var(--pd-gds-card-border, #d1d5db));
    --pd-fitment-form-border: var(--form-stroke, var(--pd-gds-control-border, #d1d5db));
    --pd-fitment-focus-color: var(--form-active-color, var(--pd-gds-color-focus, var(--pd-fitment-color-primary)));
    --pd-fitment-color-success: var(--color-success, var(--pd-gds-color-success, #166534));
    --pd-fitment-color-warning: var(--color-warning, var(--pd-gds-color-warning, #d78800));
    --pd-fitment-color-error: var(--color-error, var(--pd-gds-color-error, #e42e2d));
    --pd-fitment-color-info: var(--color-info, var(--pd-gds-color-info, #2563eb));
    --pd-fitment-font-family: var(--pd-gds-font-family, inherit);
    --pd-fitment-font-size-base: var(--pd-gds-font-size-base, 1rem);
    --pd-fitment-line-height-base: var(--pd-gds-line-height-base, 1.5);
    --pd-fitment-font-size-4xs: calc(var(--pd-fitment-font-size-base) * .5);
    --pd-fitment-font-size-3xs: calc(var(--pd-fitment-font-size-base) * .625);
    --pd-fitment-font-size-2xs: calc(var(--pd-fitment-font-size-base) * .6875);
    --pd-fitment-font-size-xs: calc(var(--pd-fitment-font-size-base) * .75);
    --pd-fitment-font-size-compact: calc(var(--pd-fitment-font-size-base) * .78125);
    --pd-fitment-font-size-sm: calc(var(--pd-fitment-font-size-base) * .8125);
    --pd-fitment-font-size-body-sm: calc(var(--pd-fitment-font-size-base) * .875);
    --pd-fitment-font-size-lg: calc(var(--pd-fitment-font-size-base) * 1.0625);
    --pd-fitment-font-size-xl: calc(var(--pd-fitment-font-size-base) * 1.125);
    --pd-fitment-font-size-2xl: calc(var(--pd-fitment-font-size-base) * 1.25);
    --pd-fitment-font-size-3xl: calc(var(--pd-fitment-font-size-base) * 1.75);
    --pd-fitment-weight-normal: var(--pd-gds-font-weight-normal, 400);
    --pd-fitment-weight-medium: var(--pd-gds-font-weight-medium, 500);
    --pd-fitment-weight-semibold: var(--pd-gds-font-weight-semibold, 600);
    --pd-fitment-weight-bold: var(--pd-gds-font-weight-bold, 700);
    --pd-fitment-heading-weight: var(--pd-gds-heading-weight, 600);
    --pd-fitment-space-1: var(--pd-gds-space-1, .25rem);
    --pd-fitment-space-2: var(--pd-gds-space-2, .5rem);
    --pd-fitment-space-3: var(--pd-gds-space-3, .75rem);
    --pd-fitment-space-4: var(--pd-gds-space-4, 1rem);
    --pd-fitment-space-6: var(--pd-gds-space-6, 1.5rem);
    --pd-fitment-space-8: var(--pd-gds-space-8, 2rem);
    --pd-fitment-radius-sm: var(--radius-sm, var(--pd-gds-radius-sm, .25rem));
    --pd-fitment-radius-md: var(--form-radius, var(--radius-md, var(--pd-gds-radius-md, .5rem)));
    --pd-fitment-radius-lg: var(--card-radius, var(--radius-lg, var(--pd-gds-radius-lg, .75rem)));
    --pd-fitment-radius-pill: var(--radius-full, var(--pd-gds-radius-pill, 9999px));
    --pd-fitment-shadow-sm: var(--shadow-sm, var(--pd-gds-shadow-sm, 0 1px 2px rgb(15 23 42 / .06)));
    --pd-fitment-shadow-md: var(--shadow-md, var(--pd-gds-shadow-md, 0 4px 12px rgb(15 23 42 / .10)));
    --pd-fitment-shadow-lg: var(--shadow-lg, var(--pd-gds-shadow-lg, 0 16px 38px rgb(15 23 42 / .14)));
    --pd-fitment-control-height-sm: var(--pd-gds-control-height-sm, 2.25rem);
    --pd-fitment-control-height-md: var(--pd-gds-control-height-md, 2.75rem);
    --pd-fitment-icon-size-sm: var(--pd-gds-icon-size-sm, 1rem);
    --pd-fitment-icon-size-md: var(--pd-gds-icon-size-md, 1.25rem);
    --pd-fitment-icon-size-lg: var(--pd-gds-icon-size-lg, 1.5rem);
    --pd-fitment-icon-stroke-width: var(--pd-gds-icon-stroke-width, 2);
    --pd-fitment-motion-fast: var(--pd-gds-motion-fast, 150ms);
    --pd-fitment-disabled-opacity: var(--pd-gds-disabled-opacity, .55);
    --pd-fitment-z-dropdown: var(--pd-gds-z-dropdown, 1000);
    --pd-fitment-z-modal: var(--pd-gds-z-modal, 1300);
}

:where(.pd-fitment, .pd-vehicle-bar, .pd-garage-account, .pd-fitment-results, .pd-compatibility, .pd-header-garage-menu) {
    font-family: var(--pd-fitment-font-family);
    font-size: var(--pd-fitment-font-size-base);
    line-height: var(--pd-fitment-line-height-base);
    color: var(--pd-fitment-color-text);
}
/* FITMENTPRO_HYVA_GDS_CONTRACT_END */

/* Header garage link */
.pd-header-garage{display:inline-flex;align-items:center;gap:var(--pd-fitment-space-2);color:inherit;font-weight:var(--pd-fitment-weight-semibold);white-space:nowrap;text-decoration:none}.pd-header-garage:hover{color:var(--pd-fitment-color-primary)}.pd-header-garage span{font-size:var(--pd-fitment-font-size-body-sm)}

/* FitmentPro finder styling aligned with HomeFitment / Hyva look */
.pd-fitment{position:relative;padding:var(--pd-fitment-space-4)}.pd-fitment--home{margin:0 0 24px}.pd-fitment__inner{width:100%}.pd-fitment__heading{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:14px;color:var(--pd-fitment-color-text)}.pd-fitment__heading strong{font-size:var(--pd-fitment-font-size-xl);font-weight:var(--pd-fitment-heading-weight);line-height:1.3}.pd-fitment__heading-actions{display:flex;align-items:center;gap:12px}.pd-fitment__selected{margin-top:4px;font-size:var(--pd-fitment-font-size-sm);color:var(--pd-fitment-color-text-muted)}.pd-fitment__loading{font-size:var(--pd-fitment-font-size-xs);color:var(--pd-fitment-color-text-muted)}
.pd-fitment__fields{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr)) auto auto;gap:10px;align-items:stretch}.pd-fitment select,.pd-fitment input{width:100%}.pd-fitment button{white-space:nowrap}.pd-fitment__message{margin-top:10px;font-size:var(--pd-fitment-font-size-sm);font-weight:var(--pd-fitment-weight-semibold);color:var(--pd-fitment-color-success)}.pd-fitment__message.pd-error{color:var(--pd-fitment-color-error)}

/* Compact/header selector */
.pd-vehicle-bar{margin:0 0 18px;border:1px solid var(--pd-fitment-color-border);border-radius:var(--pd-fitment-radius-lg);background:var(--pd-fitment-color-surface)}.pd-vehicle-bar__inner{display:flex;align-items:center;gap:10px;padding:12px 14px}.pd-vehicle-bar__select{display:inline-flex;align-items:center;gap:8px;max-width:min(100%,560px);min-height:var(--pd-fitment-control-height-md);padding:9px 14px;border:1px solid var(--pd-fitment-color-border);border-radius:var(--pd-fitment-radius-md);background:var(--pd-fitment-color-surface);color:var(--pd-fitment-color-text);font-weight:var(--pd-fitment-weight-bold);text-align:left}.pd-vehicle-bar__select:hover{border-color:var(--pd-fitment-color-primary)}.pd-vehicle-bar__select span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pd-vehicle-bar__garage-wrap{position:relative;margin-left:auto}.pd-vehicle-bar__garage{display:inline-flex;align-items:center;gap:6px;padding:9px 12px;border:1px solid var(--pd-fitment-color-border);border-radius:var(--pd-fitment-radius-md);background:var(--pd-fitment-color-surface);white-space:nowrap;min-height:var(--pd-fitment-control-height-md);color:var(--pd-fitment-color-text);font-weight:var(--pd-fitment-weight-bold)}.pd-vehicle-bar__garage:hover{border-color:var(--pd-fitment-color-primary)}.pd-vehicle-bar__garage{font-weight:var(--pd-fitment-weight-bold);color:var(--pd-fitment-color-text);text-decoration:none}.pd-vehicle-bar__garage:hover{text-decoration:none}

/* Header garage menu */
.pd-header-garage-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:var(--pd-fitment-z-dropdown);width:min(320px,90vw);padding:8px;border:1px solid var(--pd-fitment-color-border);border-radius:var(--pd-fitment-radius-lg);background:var(--pd-fitment-color-surface);box-shadow:var(--pd-fitment-shadow-lg)}.pd-header-garage-menu__list{display:grid;gap:4px}.pd-header-garage-menu__vehicle{display:block;width:100%;min-height:0!important;padding:9px 10px!important;border:1px solid transparent!important;border-radius:var(--pd-fitment-radius-md)!important;background:var(--pd-fitment-color-container)!important;color:var(--pd-fitment-color-text)!important;text-align:left!important}.pd-header-garage-menu__vehicle:hover{background:var(--pd-fitment-color-container)!important;border-color:var(--pd-fitment-color-border)!important}.pd-header-garage-menu__name{display:block;font-weight:var(--pd-fitment-weight-bold);line-height:1.25}.pd-header-garage-menu__details{display:block;margin-top:2px;font-size:var(--pd-fitment-font-size-xs);color:var(--pd-fitment-color-text-muted);line-height:1.25}.pd-header-garage-menu__empty{padding:10px;font-size:var(--pd-fitment-font-size-sm);color:var(--pd-fitment-color-text-muted)}.pd-header-garage-menu__link{display:block;margin-top:6px;padding:9px 10px;border-top:1px solid var(--pd-fitment-color-border);color:var(--pd-fitment-color-primary);font-weight:var(--pd-fitment-weight-bold);text-decoration:none}.pd-header-garage-menu__link:hover{text-decoration:underline}

/* Modal finder */
.pd-fitment-modal{position:fixed;inset:0;z-index:var(--pd-fitment-z-modal);isolation:isolate;display:flex;align-items:flex-start;justify-content:center;padding:8vh 18px 30px;background:color-mix(in srgb,var(--pd-fitment-color-text) 45%,transparent);overflow:auto}.pd-fitment-modal__dialog{position:relative;width:min(980px,100%);box-shadow:var(--pd-fitment-shadow-lg)}.pd-fitment-modal__close{position:absolute!important;right:10px;top:7px;z-index:2;width:var(--pd-fitment-control-height-sm)!important;min-width:var(--pd-fitment-control-height-sm)!important;height:var(--pd-fitment-control-height-sm)!important;min-height:var(--pd-fitment-control-height-sm)!important;padding:0!important;font-size:var(--pd-fitment-font-size-2xl)!important;line-height:1!important}.pd-fitment-modal__dialog .pd-fitment__heading{padding-right:38px}

/* Save row */
.pd-fitment__save-row{margin-top:10px}.pd-garage-save{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.pd-garage-save input{max-width:330px}

/* Garage page base styling retained */
.pd-garage-page__header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}.pd-garage-page__header h1{margin:0 0 .35rem}.pd-garage-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem}.pd-garage-card{border:1px solid var(--pd-fitment-color-border);border-radius:var(--pd-fitment-radius-lg);padding:1rem;background:var(--pd-fitment-color-surface)}.pd-garage-card__name{font-size:var(--pd-fitment-font-size-lg);font-weight:var(--pd-fitment-weight-bold);margin-bottom:.25rem}.pd-garage-card__vehicle{color:var(--pd-fitment-color-text-muted);margin-bottom:1rem}.pd-garage-card label{display:flex;flex-direction:column;gap:.35rem;font-weight:var(--pd-fitment-weight-semibold)}.pd-garage-card input{min-height:42px}.pd-garage-card__actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}.pd-garage-card__actions .delete{color:var(--pd-fitment-color-error)}.pd-garage-page__empty{padding:1rem;border:1px dashed var(--pd-fitment-color-border);border-radius:var(--pd-fitment-radius-md)}

/* Header compact placement: no position/layout changes, just matching cleaner style */
.pd-fitment-placement--header.pd-vehicle-bar{margin:0;border:0;background:transparent}.pd-fitment-placement--header .pd-vehicle-bar__inner{padding:0;gap:8px}.pd-fitment-placement--header .pd-vehicle-bar__select,.pd-fitment-placement--header .pd-vehicle-bar__garage{min-height:40px;padding:8px 11px}.pd-fitment-placement--header .pd-vehicle-bar__select{max-width:280px;background:transparent}.pd-fitment-placement--header .pd-vehicle-bar__garage-wrap{margin-left:0}.pd-fitment-placement--header .pd-vehicle-bar__garage{background:transparent}

@media(max-width:900px){.pd-fitment__fields{grid-template-columns:repeat(2,minmax(130px,1fr))}}
@media(max-width:640px){.pd-header-garage span{display:none}.pd-vehicle-bar__inner{align-items:stretch}.pd-vehicle-bar__select{flex:1;min-width:0}.pd-vehicle-bar__garage-wrap{margin-left:0}.pd-fitment__heading{display:block}.pd-fitment__heading-actions{margin-top:8px}.pd-fitment__fields{grid-template-columns:1fr}.pd-fitment{padding:14px}.pd-fitment-modal{padding:18px 10px}.pd-garage-save input{max-width:none}.pd-garage-page__header{flex-direction:column}.pd-fitment-placement--header .pd-vehicle-bar__select{max-width:190px}.pd-fitment-placement--header .pd-vehicle-bar__garage{padding-inline:8px}}

/* Header Select Vehicle / My Garage: smaller, cleaner Hyva-like buttons */
.pd-fitment-placement--header .pd-vehicle-bar__inner{
    gap:6px!important;
}
.pd-fitment-placement--header .pd-vehicle-bar__select,
.pd-fitment-placement--header .pd-vehicle-bar__garage{
    min-height:34px!important;
    height:34px!important;
    padding:5px 10px!important;
    border:1px solid var(--pd-fitment-color-border)!important;
    border-radius:var(--pd-fitment-radius-md)!important;
    background:var(--pd-fitment-color-surface)!important;
    color:var(--pd-fitment-color-text)!important;
    font-size:var(--pd-fitment-font-size-sm)!important;
    line-height:1.2!important;
    font-weight:var(--pd-fitment-weight-semibold)!important;
    box-shadow:none!important;
    text-decoration:none!important;
    transition:background-color var(--pd-fitment-motion-fast) ease,border-color var(--pd-fitment-motion-fast) ease,color var(--pd-fitment-motion-fast) ease,box-shadow var(--pd-fitment-motion-fast) ease!important;
}
.pd-fitment-placement--header .pd-vehicle-bar__select svg{
    width:17px!important;
    height:17px!important;
}
.pd-fitment-placement--header .pd-vehicle-bar__select:hover,
.pd-fitment-placement--header .pd-vehicle-bar__garage:hover{
    background:var(--pd-fitment-color-container)!important;
    border-color:var(--pd-fitment-color-text-muted)!important;
    color:var(--pd-fitment-color-text)!important;
    text-decoration:none!important;
}
.pd-fitment-placement--header .pd-vehicle-bar__select:focus,
.pd-fitment-placement--header .pd-vehicle-bar__garage:focus{
    outline:none!important;
    border-color:var(--pd-fitment-color-primary)!important;
    box-shadow:0 0 0 3px color-mix(in srgb,var(--pd-fitment-focus-color) 12%,transparent)!important;
}
.pd-fitment-placement--header .pd-vehicle-bar__select{
    max-width:245px!important;
}

/* My Garage dropdown link: standard neutral menu action, not blue text */
.pd-header-garage-menu__link{
    margin-top:6px!important;
    padding:9px 10px!important;
    border-top:1px solid var(--pd-fitment-color-border)!important;
    border-radius:0 0 var(--pd-fitment-radius-md) var(--pd-fitment-radius-md)!important;
    background:var(--pd-fitment-color-surface)!important;
    color:var(--pd-fitment-color-text)!important;
    font-size:var(--pd-fitment-font-size-sm)!important;
    font-weight:var(--pd-fitment-weight-semibold)!important;
    text-decoration:none!important;
}
.pd-header-garage-menu__link:hover{
    background:var(--pd-fitment-color-container)!important;
    color:var(--pd-fitment-color-text)!important;
    text-decoration:none!important;
}
.pd-header-garage-menu__link:focus{
    outline:none!important;
    box-shadow:0 0 0 3px color-mix(in srgb,var(--pd-fitment-focus-color) 12%,transparent)!important;
}

@media(max-width:640px){
    .pd-fitment-placement--header .pd-vehicle-bar__select{
        max-width:180px!important;
    }
    .pd-fitment-placement--header .pd-vehicle-bar__select,
    .pd-fitment-placement--header .pd-vehicle-bar__garage{
        min-height:34px!important;
        height:34px!important;
        padding:5px 8px!important;
        font-size:var(--pd-fitment-font-size-compact)!important;
    }
}


/* PD_HEADER_VEHICLE_CONSOLIDATED_START */
/* Single Hyvä-style header vehicle control replacing separate Select Vehicle / My Garage buttons. */
.pd-fitment-placement--header.pd-vehicle-bar{
    margin:0!important;
    border:0!important;
    background:transparent!important;
}
.pd-fitment-placement--header .pd-header-vehicle{
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;
    min-width:0!important;
}
.pd-fitment-placement--header .pd-header-vehicle__button{
    height:var(--pd-fitment-control-height-md)!important;
    min-height:var(--pd-fitment-control-height-md)!important;
    max-width:330px!important;
    min-width:0!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    padding:0 11px!important;
    border:1px solid transparent!important;
    border-radius:var(--pd-fitment-radius-md)!important;
    background:transparent!important;
    color:var(--pd-fitment-color-text)!important;
    box-shadow:none!important;
    font-size:var(--pd-fitment-font-size-sm)!important;
    line-height:1.2!important;
    font-weight:var(--pd-fitment-weight-semibold)!important;
    text-align:left!important;
    text-decoration:none!important;
    white-space:nowrap!important;
    transition:background-color var(--pd-fitment-motion-fast) ease,border-color var(--pd-fitment-motion-fast) ease,color var(--pd-fitment-motion-fast) ease,box-shadow var(--pd-fitment-motion-fast) ease!important;
}
.pd-fitment-placement--header .pd-header-vehicle__button:hover,
.pd-fitment-placement--header .pd-header-vehicle__button[aria-expanded="true"]{
    background:var(--pd-fitment-color-container)!important;
    border-color:var(--pd-fitment-color-border)!important;
    color:var(--pd-fitment-color-text)!important;
    text-decoration:none!important;
}
.pd-fitment-placement--header .pd-header-vehicle__button:focus-visible{
    outline:none!important;
    border-color:var(--pd-fitment-color-primary)!important;
    box-shadow:0 0 0 3px color-mix(in srgb,var(--pd-fitment-focus-color) 12%,transparent)!important;
}
.pd-fitment-placement--header .pd-header-vehicle__icon{
    width:17px!important;
    height:17px!important;
    flex:0 0 17px!important;
    color:currentColor!important;
}
.pd-fitment-placement--header .pd-header-vehicle__label{
    display:block!important;
    min-width:0!important;
    max-width:255px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}
.pd-fitment-placement--header .pd-header-vehicle__chevron{
    width:14px!important;
    height:14px!important;
    flex:0 0 14px!important;
    opacity:.75!important;
    color:currentColor!important;
    transition:transform var(--pd-fitment-motion-fast) ease,opacity var(--pd-fitment-motion-fast) ease!important;
}
.pd-fitment-placement--header .pd-header-vehicle__button:hover .pd-header-vehicle__chevron,
.pd-fitment-placement--header .pd-header-vehicle__button[aria-expanded="true"] .pd-header-vehicle__chevron{
    opacity:1!important;
}
.pd-fitment-placement--header .pd-header-vehicle__chevron--open{
    transform:rotate(180deg)!important;
}
@media(max-width:1280px){
    .pd-fitment-placement--header .pd-header-vehicle__button{max-width:270px!important;padding-left:9px!important;padding-right:9px!important;}
    .pd-fitment-placement--header .pd-header-vehicle__label{max-width:198px!important;}
}
@media(max-width:640px){
    .pd-fitment-placement--header .pd-header-vehicle__button{height:40px!important;min-height:40px!important;max-width:190px!important;padding-left:8px!important;padding-right:8px!important;font-size:var(--pd-fitment-font-size-compact)!important;}
    .pd-fitment-placement--header .pd-header-vehicle__label{max-width:132px!important;}
}
/* PD_HEADER_VEHICLE_CONSOLIDATED_END */


/* PD_MY_GARAGE_ACCOUNT_STYLE_START */
.pd-garage-account [x-cloak]{display:none!important;}
.pd-garage-account__message{margin-bottom:16px;}
.pd-garage-account__card{margin-bottom:24px;}
.pd-garage-account__card-title{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;}
.pd-garage-account__card-title h2{margin:0;font-size:var(--pd-fitment-font-size-2xl);line-height:1.3;font-weight:var(--pd-fitment-heading-weight);color:var(--pd-fitment-color-text);}
.pd-garage-account__count{font-size:var(--pd-fitment-font-size-sm);color:var(--pd-fitment-color-text-muted);white-space:nowrap;}
.pd-garage-account__muted{color:var(--pd-fitment-color-text-muted);font-size:var(--pd-fitment-font-size-body-sm);}
.pd-garage-account__intro{margin-top:-6px;margin-bottom:16px;}
.pd-garage-account__empty{padding:16px;border:1px dashed var(--pd-fitment-color-border);border-radius:var(--pd-fitment-radius-lg);background:var(--pd-fitment-color-container);display:flex;flex-direction:column;gap:4px;color:var(--pd-fitment-color-text-muted);}
.pd-garage-account__empty strong{color:var(--pd-fitment-color-text);}
.pd-garage-account__table{width:100%;border-collapse:separate;border-spacing:0;}
.pd-garage-account__table th,.pd-garage-account__table td{padding:14px 12px;text-align:left;vertical-align:middle;border-bottom:1px solid var(--pd-fitment-color-border);}
.pd-garage-account__table th{font-size:var(--pd-fitment-font-size-sm);font-weight:var(--pd-fitment-weight-semibold);color:var(--pd-fitment-color-text-muted);background:var(--pd-fitment-color-container);}
.pd-garage-account__table tbody tr:last-child td{border-bottom:0;}
.pd-garage-account__vehicle{font-weight:var(--pd-fitment-weight-semibold);color:var(--pd-fitment-color-text);}
.pd-garage-account__actions-col{width:1%;white-space:nowrap;}
.pd-garage-account__actions{display:flex;align-items:center;justify-content:flex-start;gap:8px;flex-wrap:wrap;}
.pd-garage-account__form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:end;}
.pd-garage-account__form .field{margin-top:0;}
.pd-garage-account__form label{margin-bottom:8px;}
.pd-garage-account__form select{width:100%;}
.pd-garage-account__toolbar{margin-top:20px;}
.pd-garage-account__replace{margin-top:18px;padding:16px;border:1px solid color-mix(in srgb, var(--pd-fitment-color-primary) 45%, var(--pd-fitment-color-surface));border-radius:var(--pd-fitment-radius-lg);background:color-mix(in srgb, var(--pd-fitment-color-primary) 7%, var(--pd-fitment-color-surface));}
.pd-garage-account__replace h3{margin:0 0 6px;font-size:var(--pd-fitment-font-size-base);font-weight:var(--pd-fitment-heading-weight);color:var(--pd-fitment-color-text);}
.pd-garage-account__replace p{margin:0 0 12px;color:var(--pd-fitment-color-text-muted);font-size:var(--pd-fitment-font-size-body-sm);}
.pd-garage-account__replace-list{display:grid;gap:8px;}
.pd-garage-account__replace-row{width:100%;min-height:var(--pd-fitment-control-height-md);text-align:left;display:flex;align-items:center;justify-content:flex-start;}
.pd-garage-account__replace-row:hover,.pd-garage-account__replace-row.is-selected{background:color-mix(in srgb,var(--pd-fitment-focus-color) 8%,transparent);border-color:color-mix(in srgb,var(--pd-fitment-focus-color) 25%,transparent);color:var(--pd-fitment-color-primary);}
.pd-garage-account__replace-actions{display:flex;align-items:center;justify-content:flex-start;gap:8px;flex-wrap:wrap;margin-top:14px;}
@media(max-width:900px){.pd-garage-account__form{grid-template-columns:1fr;}.pd-garage-account__actions-col{width:auto;white-space:normal;}.pd-garage-account__table th,.pd-garage-account__table td{padding:12px 10px;}}
@media(max-width:640px){.pd-garage-account__card-title{align-items:flex-start;flex-direction:column;}.pd-garage-account__actions .btn,.pd-garage-account__replace-actions .btn{width:100%;}.pd-garage-account__table-wrap{overflow-x:auto;}.pd-garage-account__table{min-width:560px;}}
/* PD_MY_GARAGE_ACCOUNT_STYLE_END */


/* PD_MY_GARAGE_TWO_COLUMN_START */
.pd-garage-account__layout{
    display:grid;
    grid-template-columns:minmax(280px,360px) minmax(0,1fr);
    gap:24px;
    align-items:start;
}
.pd-garage-account__add{position:sticky;top:16px;}
.pd-garage-account__saved{min-width:0;}
.pd-garage-account__form{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
    align-items:start;
}
.pd-garage-account__form select:disabled{
    background-color:var(--pd-fitment-color-container);
    border-color:var(--pd-fitment-color-border);
    color:var(--pd-fitment-color-text-muted);
    opacity:1;
    cursor:not-allowed;
}
.pd-garage-account__vehicle-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}
.pd-garage-account__vehicle-card{
    min-width:0;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap:16px;
    padding:var(--pd-fitment-space-4);
}
.pd-garage-account__vehicle-engine{margin-top:4px;}
.pd-garage-account__actions{
    justify-content:flex-start;
}
.pd-garage-account__actions .btn{
    white-space:nowrap;
}
@media(max-width:1100px){
    .pd-garage-account__layout{grid-template-columns:1fr;}
    .pd-garage-account__add{position:static;}
}
@media(max-width:720px){
    .pd-garage-account__vehicle-grid{grid-template-columns:1fr;}
    .pd-garage-account__actions .btn{width:100%;}
}
/* PD_MY_GARAGE_TWO_COLUMN_END */


/* PD_MY_GARAGE_CORRECTIVE_START */
.pd-garage-account__already-saved{margin-top:8px;padding:8px 12px;font-size:var(--pd-fitment-font-size-body-sm);}
/* PD_MY_GARAGE_CORRECTIVE_END */


/* PD_X_CLOAK_FAILSAFE */
.pd-fitment [x-cloak],
.pd-vehicle-bar [x-cloak],
.pd-fitment-modal [x-cloak]{
    display:none!important;
}


/* PD_HEADER_VEHICLE_FIXED_WIDTH_START */
/* Keep the header vehicle selector from resizing the search bar. */
.pd-fitment-placement--header.pd-vehicle-bar{
    flex:0 0 auto!important;
    width:auto!important;
    max-width:none!important;
}

.pd-fitment-placement--header .pd-vehicle-bar__inner{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important;
}

.pd-fitment-placement--header .pd-header-vehicle{
    flex:0 0 184px!important;
    width:184px!important;
    max-width:184px!important;
    min-width:184px!important;
    margin:0 2px!important;
    align-self:center!important;
}

.pd-fitment-placement--header .pd-header-vehicle__button{
    width:184px!important;
    min-width:184px!important;
    max-width:184px!important;
    height:40px!important;
    min-height:40px!important;
    padding:0 10px!important;
    justify-content:flex-start!important;
    gap:7px!important;
}

.pd-fitment-placement--header .pd-header-vehicle__icon{
    flex:0 0 17px!important;
}

.pd-fitment-placement--header .pd-header-vehicle__label{
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:none!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    text-align:left!important;
}

.pd-fitment-placement--header .pd-header-vehicle__chevron{
    flex:0 0 14px!important;
    margin-left:auto!important;
}

@media(max-width:1280px){
    .pd-fitment-placement--header .pd-header-vehicle{
        flex-basis:172px!important;
        width:172px!important;
        max-width:172px!important;
        min-width:172px!important;
    }

    .pd-fitment-placement--header .pd-header-vehicle__button{
        width:172px!important;
        min-width:172px!important;
        max-width:172px!important;
    }
}

@media(max-width:640px){
    .pd-fitment-placement--header .pd-header-vehicle{
        flex-basis:150px!important;
        width:150px!important;
        max-width:150px!important;
        min-width:150px!important;
    }

    .pd-fitment-placement--header .pd-header-vehicle__button{
        width:150px!important;
        min-width:150px!important;
        max-width:150px!important;
        height:40px!important;
        min-height:40px!important;
        padding-left:8px!important;
        padding-right:8px!important;
    }
}
/* PD_HEADER_VEHICLE_FIXED_WIDTH_END */


/* PD_MOBILE_VEHICLE_FINAL_STACK_START */
/*
 * Final mobile header stack:
 * - customer/profile dropdown must sit above the mobile Select Vehicle row
 * - Select Vehicle row stays in normal flow to avoid sticky-header flicker
 * - only the Select Vehicle dropdown gets its own overlay layer
 */
@media(max-width:1023px){
    header.page-header,
    #header.pd-stage2-header,
    #header .pd-stage2-main,
    #header .pd-stage2-actions{
        overflow:visible!important;
    }

    #header .pd-stage2-actions{
        position:relative!important;
        z-index:120!important;
    }

    #header .pd-stage2-customer{
        position:relative!important;
        z-index:160!important;
    }

    #header .pd-stage2-customer nav[aria-labelledby="customer-menu"]{
        z-index:170!important;
    }

    .pd-stage2-mobile-vehicle{
        display:block!important;
        position:relative!important;
        z-index:10!important;
        transform:none!important;
        will-change:auto!important;
        contain:none!important;
        overflow:visible!important;
    }

    .pd-stage2-mobile-vehicle .pd-fitment-placement--header.pd-vehicle-bar{
        display:block!important;
        width:100%!important;
        max-width:none!important;
        min-width:0!important;
        margin:0!important;
        border:0!important;
        background:transparent!important;
        z-index:auto!important;
        transform:none!important;
        will-change:auto!important;
        contain:none!important;
    }

    .pd-stage2-mobile-vehicle .pd-vehicle-bar__inner{
        display:block!important;
        width:100%!important;
        padding:0!important;
        z-index:auto!important;
    }

    .pd-stage2-mobile-vehicle .pd-header-vehicle{
        display:block!important;
        position:relative!important;
        width:100%!important;
        max-width:none!important;
        min-width:0!important;
        margin:0!important;
        z-index:auto!important;
    }

    .pd-stage2-mobile-vehicle .pd-header-vehicle__button{
        display:flex!important;
        width:100%!important;
        max-width:none!important;
        min-width:0!important;
        height:var(--pd-fitment-control-height-md)!important;
        min-height:var(--pd-fitment-control-height-md)!important;
        padding:0 12px!important;
        align-items:center!important;
        justify-content:flex-start!important;
        line-height:1.4!important;
        overflow:visible!important;
        font-size:var(--pd-fitment-font-size-body-sm)!important;
    }

    .pd-stage2-mobile-vehicle .pd-header-vehicle__label{
        min-width:0!important;
        max-width:none!important;
        line-height:1.4!important;
        padding-bottom:2px!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
    }


    .pd-stage2-mobile-vehicle [x-cloak]{
        display:none!important;
    }
}

@media(min-width:1024px){
    .pd-stage2-mobile-vehicle{
        display:none!important;
    }
}
/* PD_MOBILE_VEHICLE_FINAL_STACK_END */

/* PD_MOBILE_HEADER_VEHICLE_ICON_STABILITY_START */
/*
 * Stabilize the mobile Select Vehicle car icon inside the sticky header.
 * Prevent layout recalculation/jumping while scrolling.
 */
@media(max-width:1023px){
    .pd-stage2-mobile-vehicle .pd-header-vehicle__icon{
        display:block!important;
        width:18px!important;
        height:18px!important;
        min-width:18px!important;
        min-height:18px!important;
        max-width:18px!important;
        max-height:18px!important;
        flex:0 0 18px!important;
        flex-shrink:0!important;
        align-self:center!important;
        margin:0!important;
        padding:0!important;
        line-height:1!important;
        position:relative!important;
        top:0!important;
        transform:none!important;
        transition:none!important;
        animation:none!important;
        will-change:auto!important;
        backface-visibility:hidden!important;
        pointer-events:none!important;
    }

    .pd-stage2-mobile-vehicle .pd-header-vehicle__button{
        gap:8px!important;
        align-items:center!important;
    }
}
/* PD_MOBILE_HEADER_VEHICLE_ICON_STABILITY_END */

/* My Garage button layout; visual states come from Hyva btn-primary/btn-secondary and GDS. */
.pd-garage-account .pd-garage-account__actions {
    gap: 8px;
}
.pd-garage-account .pd-garage-account__actions .btn {
    min-width: 136px;
}
@media (max-width: 720px) {
    .pd-garage-account .pd-garage-account__actions .btn,
    .pd-garage-account .pd-garage-account__replace-actions .btn {
        width: 100%;
        min-width: 0;
    }
}


/* PD_HEADER_VEHICLE_EQUAL_HEADER_GAP_START */
/*
 * Desktop header:
 * - only one Select Vehicle button is visible at lg+
 * - the gap between Search -> Select Vehicle matches Select Vehicle -> Profile
 * - the vehicle button can grow for longer names
 * - growth is limited so it does not collide with profile/cart icons
 */
@media(min-width:1024px){
    #header{
        --pd-header-main-gap:clamp(.5rem,.75vw,.75rem);
        --pd-header-vehicle-min:184px;
        --pd-header-vehicle-max:clamp(184px,28vw,420px);
    }

    #header .pd-stage2-main{
        column-gap:var(--pd-header-main-gap)!important;
        gap:var(--pd-header-main-gap)!important;
    }

    #header .pd-stage2-actions{
        column-gap:var(--pd-header-main-gap)!important;
        gap:var(--pd-header-main-gap)!important;
        min-width:0!important;
        overflow:visible!important;
    }

    #header .pd-stage2-search{
        min-width:0!important;
    }

    #header .pd-stage2-fitment{
        flex:0 1 var(--pd-header-vehicle-max)!important;
        min-width:var(--pd-header-vehicle-min)!important;
        max-width:var(--pd-header-vehicle-max)!important;
        margin:0!important;
        display:flex!important;
        align-items:center!important;
        justify-content:flex-end!important;
        overflow:visible!important;
    }

    #header .pd-stage2-fitment .pd-fitment-placement--header.pd-vehicle-bar,
    #header .pd-stage2-fitment .pd-vehicle-bar__inner,
    #header .pd-stage2-fitment .pd-header-vehicle{
        width:100%!important;
        min-width:0!important;
        max-width:100%!important;
        margin:0!important;
    }

    #header .pd-stage2-fitment .pd-vehicle-bar__inner{
        display:flex!important;
        justify-content:flex-end!important;
    }

    #header .pd-stage2-fitment .pd-header-vehicle__button{
        width:100%!important;
        min-width:var(--pd-header-vehicle-min)!important;
        max-width:100%!important;
        height:42px!important;
        min-height:42px!important;
        padding-left:10px!important;
        padding-right:10px!important;
        display:flex!important;
        align-items:center!important;
        justify-content:flex-start!important;
        gap:8px!important;
        overflow:hidden!important;
    }

    #header .pd-stage2-fitment .pd-header-vehicle__icon{
        flex:0 0 18px!important;
        width:18px!important;
        min-width:18px!important;
        max-width:18px!important;
    }

    #header .pd-stage2-fitment .pd-header-vehicle__chevron{
        flex:0 0 14px!important;
        width:14px!important;
        min-width:14px!important;
        max-width:14px!important;
        margin-left:auto!important;
    }

    #header .pd-stage2-fitment .pd-header-vehicle__label{
        flex:0 1 auto!important;
        min-width:0!important;
        max-width:none!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
        text-align:left!important;
    }

    #header .pd-stage2-customer{
        margin-left:0!important;
    }
}
/* PD_HEADER_VEHICLE_EQUAL_HEADER_GAP_END */


/* FitmentPro 2.8.2.5: modal is teleported to body and layered above all Hyva UI. */
html.pd-fitment-modal-open {
    overflow: hidden !important;
    overscroll-behavior: none;
}
html.pd-fitment-modal-open body {
    overscroll-behavior: none;
}
.pd-fitment-modal { pointer-events: auto; }
.pd-fitment-modal__dialog { z-index: 1; }

/* FitmentPro SVGs follow the configured GDS icon stroke. */
.pd-header-garage__icon,
.pd-header-vehicle__icon,
.pd-header-vehicle__chevron {
    stroke-width: var(--pd-fitment-icon-stroke-width);
}

/* FITMENTPRO_HYVA_NATIVE_VIN_20260729 */
/* VIN finder layout only. PartsDone_VinFitment emits genuine Hyva controls;
 * Hyva/GDS owns their border, radius, colors, hover and focus states. */
.pd-vin-fitment-panel {
    position: relative;
    margin-top: var(--pd-fitment-space-3);
    padding-top: 0;
    border-top: 0;
    overflow: visible;
    color: var(--pd-fitment-color-text);
    font-family: var(--pd-fitment-font-family);
}

.pd-vin-fitment-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--pd-fitment-space-2);
    align-items: center;
}

.pd-vin-fitment-input-wrap {
    min-width: 0;
}

.pd-vin-fitment-help-toggle:focus-visible,
.pd-vin-fitment-help-close:focus-visible {
    outline: 2px solid var(--pd-fitment-focus-color) !important;
    outline-offset: 2px !important;
    box-shadow: none !important;
}

/* Keep Where is my VIN? as a text action, not a button-shaped control. */
.pd-vin-fitment-help-toggle {
    grid-column: 1 / -1;
    justify-self: start;
    display: inline !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--pd-fitment-color-primary) !important;
    box-shadow: none !important;
    font-family: var(--pd-fitment-font-family) !important;
    font-size: var(--pd-fitment-font-size-sm) !important;
    font-weight: var(--pd-fitment-weight-semibold) !important;
    line-height: var(--pd-fitment-line-height-base) !important;
    text-align: left !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    cursor: pointer !important;
}

.pd-vin-fitment-help-toggle:hover,
.pd-vin-fitment-help-toggle[aria-expanded="true"] {
    border: 0 !important;
    background: transparent !important;
    color: var(--pd-fitment-color-primary-hover) !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
}

/* PARTSDONE_VIN_CONSISTENCY_V5_20260812
 * Match HomeFitment's Where is my VIN? card exactly while keeping the injected
 * FitmentPro help node out of normal finder flow. VinFitment continues to own
 * decoding and open/close behavior; this block is layout/appearance only. */
.pd-vin-fitment-help {
    display: none;
    position: absolute !important;
    top: calc(100% + .625rem) !important;
    right: auto !important;
    bottom: auto !important;
    left: 0 !important;
    z-index: 10050 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow: visible !important;
}

.pd-vin-fitment-help.is-open {
    display: block;
}

.pd-vin-shared-homefitment,
.pd-vin-shared-homefitment-message {
    all: unset;
    display: block;
    box-sizing: border-box;
    width: 100%;
}

.pd-vin-fitment-help .pd-vin-shared-homefitment .pd-custom-vin-popover.card {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 1.5rem !important;
    border: 1px solid var(--card-stroke, oklch(87.2% .01 258.338)) !important;
    border-radius: var(--card-radius, var(--radius-lg, .5rem)) !important;
    background: var(--card-bg, var(--color-surface, #fff)) !important;
    color: var(--color-fg) !important;
    box-shadow: var(--shadow-xl, 0 16px 40px rgb(15 23 42 / .18)) !important;
    transform: none !important;
}

.pd-vin-fitment-help .pd-custom-vin-popover.card[hidden] {
    display: none !important;
}

.pd-vin-fitment-help .pd-custom-vin-popover > strong {
    display: block;
    padding-right: 2.75rem;
    font-size: 1rem;
    line-height: 1.5rem;
}

.pd-vin-fitment-help .pd-custom-vin-popover > p {
    margin: .5rem 0 0;
    color: var(--color-fg-secondary);
    font-size: .875rem;
    line-height: 1.375rem;
}

.pd-vin-fitment-help .pd-custom-vin-close.btn {
    position: absolute !important;
    top: .5rem !important;
    right: .5rem !important;
    width: 2.5rem !important;
    min-width: 2.5rem !important;
    height: 2.5rem !important;
    min-height: 0 !important;
    padding: .5rem !important;
    font-size: 1.25rem !important;
    line-height: 1 !important;
}

.pd-vin-fitment-help .pd-custom-vin-locations {
    display: grid;
    gap: .5rem;
    margin-top: 1rem;
}

.pd-vin-fitment-help .pd-custom-vin-locations > div {
    display: grid;
    grid-template-columns: 1.75rem minmax(0, 1fr);
    align-items: center;
    gap: .625rem;
    color: var(--color-fg-secondary);
    font-size: .875rem;
    line-height: 1.25rem;
}

.pd-vin-fitment-help .pd-custom-vin-locations > div > span {
    display: inline-grid;
    width: 1.75rem;
    height: 1.75rem;
    place-items: center;
    border-radius: 9999px;
    background: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface, #fff));
    color: var(--color-primary);
    font-weight: 600;
}

.pd-vin-shared-homefitment-message {
    margin: 0 0 var(--pd-fitment-space-3);
}

@media (max-width: 768px) {
    .pd-vin-fitment-help .pd-vin-shared-homefitment .pd-custom-vin-popover.card {
        padding: 1.25rem !important;
    }
}

/* PARTSDONE_VIN_MAIN_FINDER_MESSAGE_POPUP_FIX_V1_20260729
 * Each injected panel closes only its own popup on outside click.
 * Warning placement is owned by the V3 block below. */

/* Garage-full notice: readable spacing without altering replacement logic. */
.pd-garage-replace {
    margin: 0 0 var(--pd-fitment-space-4);
    padding: var(--pd-fitment-space-4);
    border: 1px solid color-mix(in srgb, var(--pd-fitment-color-primary) 35%, var(--pd-fitment-color-border));
    border-radius: var(--pd-fitment-radius-lg);
    background: color-mix(in srgb, var(--pd-fitment-color-primary) 6%, var(--pd-fitment-color-surface));
}

.pd-garage-replace__title {
    margin: 0 0 var(--pd-fitment-space-2);
    color: var(--pd-fitment-color-text);
    font-size: var(--pd-fitment-font-size-lg);
    font-weight: var(--pd-fitment-heading-weight);
    line-height: 1.3;
}

.pd-garage-replace > p {
    margin: 0 0 var(--pd-fitment-space-3);
    color: var(--pd-fitment-color-text-muted);
    font-size: var(--pd-fitment-font-size-body-sm);
    line-height: var(--pd-fitment-line-height-base);
}

.pd-garage-replace__list {
    display: grid;
    gap: var(--pd-fitment-space-2);
}

.pd-garage-replace__row {
    width: 100%;
    justify-content: flex-start;
    text-align: left;
}

.pd-garage-replace__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--pd-fitment-space-2);
    margin-top: var(--pd-fitment-space-3);
}

/* My Garage actions: always visible; Save left, Reset right. */
.pd-garage-account__toolbar {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: var(--pd-fitment-space-3) !important;
    width: 100% !important;
}

.pd-garage-account__toolbar-save,
.pd-garage-account__toolbar-reset {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
}

.pd-garage-account__toolbar-save {
    order: 1 !important;
    min-width: 0;
}

.pd-garage-account__toolbar-reset {
    order: 2 !important;
    margin-left: auto !important;
}

.pd-garage-account__toolbar .btn[disabled] {
    cursor: not-allowed !important;
    opacity: var(--pd-fitment-disabled-opacity) !important;
    pointer-events: none !important;
}

@media (max-width: 720px) {
    .pd-vin-fitment-row {
        grid-template-columns: 1fr;
    }

    .pd-vin-fitment-button.btn {
        width: 100% !important;
    }

    .pd-vin-fitment-help-toggle {
        grid-column: 1;
        width: auto !important;
        justify-self: start;
    }

    .pd-garage-replace__actions .btn {
        width: 100% !important;
    }

    .pd-garage-account__toolbar {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        align-items: start !important;
    }

    .pd-garage-account__toolbar-save,
    .pd-garage-account__toolbar-reset {
        width: 100% !important;
        margin: 0 !important;
    }

    .pd-garage-account__toolbar .btn {
        width: 100% !important;
    }
}
/* FITMENTPRO_UI_REFINEMENT2_20260729_END */

/* PARTSDONE_VIN_MAIN_FINDER_MESSAGE_POSITION_V2_ROLLED_BACK_20260729
 * Restored the exact pre-V2 V1 layout. Popup isolation and timeout behavior remain unchanged. */

/* PARTSDONE_VIN_WARNING_POPUP_V3_20260729
 * The warning uses the same below-VIN anchor as the help popup and the same
 * native/HomeFitment message classes. No custom warning colors, border, arrow,
 * transform, or finder-field positioning are applied. */
/* PARTSDONE_VIN_WARNING_HEADER_LAYER_V1_20260729
 * Keep the VIN warning above local finder content but below the sticky
 * HeaderMegaMenu shell (40) and its dropdown layer (60). */
.pd-vin-fitment-message-anchor {
    position: absolute !important;
    top: calc(100% + .625rem) !important;
    right: auto !important;
    bottom: auto !important;
    left: 0 !important;
    z-index: 39 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

.pd-vin-fitment-message-anchor .pd-custom-message.message:not([hidden]) {
    display: flex !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: .5rem .5rem .5rem 1.25rem !important;
    overflow: visible !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    line-height: 1.5rem !important;
}

/* PARTSDONE_SHARED_HYVA_SEARCHABLE_SELECT_V2_20260729
 * One progressive-enhancement component for FitmentPro, HomeFitment and
 * /my-garage. Hyvä owns the visible form, card and button primitives. */
.pd-hyva-searchable-select {
    position: relative;
    width: 100%;
    min-width: 0;
}

.pd-hyva-searchable-select__trigger.form-select {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: var(--pd-fitment-space-2) !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100%;
    min-height: var(--pd-fitment-control-height-md);
    padding-right: var(--pd-fitment-space-3) !important;
    background-image: none !important;
    text-align: left !important;
    white-space: nowrap !important;
    cursor: pointer;
}

.pd-hyva-searchable-select__trigger.is-placeholder {
    color: var(--pd-fitment-color-text-muted) !important;
}

.pd-hyva-searchable-select__trigger:disabled {
    cursor: not-allowed !important;
    opacity: var(--pd-fitment-disabled-opacity) !important;
}

.pd-hyva-searchable-select__value {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pd-hyva-searchable-select__chevron {
    flex: 0 0 auto;
    width: 1rem;
    height: 1rem;
    transition: transform var(--pd-fitment-motion-fast) ease;
}

.pd-hyva-searchable-select__trigger[aria-expanded="true"] .pd-hyva-searchable-select__chevron {
    transform: rotate(180deg);
}

.pd-hyva-searchable-select__popup.card {
    position: absolute !important;
    top: calc(100% + var(--pd-fitment-space-2)) !important;
    right: auto !important;
    bottom: auto !important;
    left: 0 !important;
    z-index: 39 !important;
    width: max(100%, 16rem) !important;
    min-width: 100% !important;
    max-width: min(22rem, calc(100vw - 2rem)) !important;
    margin: 0 !important;
    padding: var(--pd-fitment-space-2) !important;
    overflow: visible !important;
}

.pd-hyva-searchable-select__search.form-input {
    width: 100% !important;
    min-height: var(--pd-fitment-control-height-sm) !important;
}

.pd-hyva-searchable-select__options {
    max-height: 16rem;
    margin-top: var(--pd-fitment-space-2);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.pd-hyva-searchable-select__option.btn.btn-secondary {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: var(--pd-fitment-space-2) !important;
    width: 100% !important;
    min-height: var(--pd-fitment-control-height-sm) !important;
    padding: var(--pd-fitment-space-2) var(--pd-fitment-space-3) !important;
    border: 0 !important;
    border-radius: var(--pd-fitment-radius-md) !important;
    background: transparent !important;
    color: var(--pd-fitment-color-text) !important;
    box-shadow: none !important;
    font-size: var(--pd-fitment-font-size-body-sm) !important;
    font-weight: var(--pd-fitment-weight-normal) !important;
    line-height: var(--pd-fitment-line-height-base) !important;
    text-align: left !important;
    white-space: normal !important;
}

.pd-hyva-searchable-select__option.btn.btn-secondary:hover,
.pd-hyva-searchable-select__option.btn.btn-secondary.is-active {
    background: var(--pd-fitment-color-container) !important;
}

.pd-hyva-searchable-select__option.btn.btn-secondary.is-selected {
    color: var(--pd-fitment-color-primary) !important;
    font-weight: var(--pd-fitment-weight-semibold) !important;
}

.pd-hyva-searchable-select__option:focus-visible {
    outline: 2px solid var(--pd-fitment-focus-color) !important;
    outline-offset: -2px !important;
}

.pd-hyva-searchable-select__check {
    flex: 0 0 auto;
    color: var(--pd-fitment-color-primary);
    font-weight: var(--pd-fitment-weight-bold);
}

.pd-hyva-searchable-select__empty {
    padding: var(--pd-fitment-space-3);
    color: var(--pd-fitment-color-text-muted);
    font-size: var(--pd-fitment-font-size-body-sm);
    line-height: var(--pd-fitment-line-height-base);
    text-align: center;
}

.pd-home-body-v41 .pd-custom-fitment-form > .pd-hyva-searchable-select {
    grid-column: 1 / -1;
}

.pd-garage-account__form .pd-hyva-searchable-select {
    width: 100%;
}

@media (max-width: 640px) {
    .pd-hyva-searchable-select__popup.card {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* PD_HEADER_VEHICLE_ACTIVE_SYNC_20260731
 * Keep the VIN validation layer below the searchable dropdowns and retain the
 * current header trigger width/label containment. The menu itself uses Hyva
 * utility classes plus the structural profile-menu rule below.
 */
.pd-vin-fitment-message-anchor {
    z-index: 38 !important;
}

.pd-fitment-placement--header .pd-header-vehicle__button {
    max-width: min(22rem, calc(100vw - 8rem)) !important;
}

.pd-fitment-placement--header .pd-header-vehicle__label {
    flex: 1 1 auto !important;
    max-width: 100% !important;
}

/* PD_HEADER_VEHICLE_PROFILE_MENU_STRUCTURE_V3_20260730
 * Preserve the literal installed Hyva profile-menu classes in selector.phtml.
 * Override only the vehicle menu's structural width and overflow because this
 * menu contains current-vehicle details plus up to five garage entries.
 * Typography, padding, colors, radius, shadow and link styling remain Hyva-owned.
 */
.pd-fitment-placement--header .pd-header-vehicle > nav.pd-header-vehicle-profile-menu {
    top: 100% !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;
    width: min(24rem, calc(100vw - 2rem)) !important;
    min-width: min(24rem, calc(100vw - 2rem)) !important;
    max-width: calc(100vw - 2rem) !important;
    max-height: none !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

@media (max-width: 1023px) {
    .pd-fitment-placement--header .pd-header-vehicle > nav.pd-header-vehicle-profile-menu {
        width: min(24rem, calc(100vw - 1.5rem)) !important;
        min-width: min(24rem, calc(100vw - 1.5rem)) !important;
        max-width: calc(100vw - 1.5rem) !important;
    }
}
