.pdmbn-root { display: none; }

html.pdmbn-enabled,
html.pdmbn-enabled body {
    scroll-padding-bottom: calc(86px + env(safe-area-inset-bottom, 0px));
}

html.pdmbn-enabled body {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
}

html.pdmbn-enabled .pdmbn-root { display: block; }

html.pdmbn-filter-open,
html.pdmbn-filter-open body { overflow: hidden !important; overscroll-behavior: none; }

html.pdmbn-enabled .pdmbn-bar {
    position: fixed;
    z-index: 7000;
    right: 0;
    bottom: 0;
    left: 0;
    border-top: 1px solid rgb(226 232 240 / .95);
    background: rgb(255 255 255 / .98);
    box-shadow: 0 -8px 24px rgb(15 23 42 / .10);
    padding-bottom: env(safe-area-inset-bottom, 0px);
}

html.pdmbn-enabled .pdmbn-bar__inner {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: stretch;
    width: min(100%, 720px);
    min-height: 71px;
    margin: 0 auto;
}

html.pdmbn-enabled .pdmbn-count-1 .pdmbn-bar__inner { grid-template-columns: repeat(1, minmax(0, 1fr)); }
html.pdmbn-enabled .pdmbn-count-2 .pdmbn-bar__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html.pdmbn-enabled .pdmbn-count-3 .pdmbn-bar__inner { grid-template-columns: repeat(3, minmax(0, 1fr)); }
html.pdmbn-enabled .pdmbn-count-4 .pdmbn-bar__inner { grid-template-columns: repeat(4, minmax(0, 1fr)); }
html.pdmbn-enabled .pdmbn-count-5 .pdmbn-bar__inner { grid-template-columns: repeat(5, minmax(0, 1fr)); }
html.pdmbn-enabled .pdmbn-count-6 .pdmbn-bar__inner { grid-template-columns: repeat(6, minmax(0, 1fr)); }
html.pdmbn-enabled .pdmbn-count-7 .pdmbn-bar__inner { grid-template-columns: repeat(7, minmax(0, 1fr)); }
html.pdmbn-enabled .pdmbn-count-8 .pdmbn-bar__inner { grid-template-columns: repeat(8, minmax(0, 1fr)); }

html.pdmbn-enabled .pdmbn-item {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 68px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #334155;
    font: inherit;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

html.pdmbn-enabled .pdmbn-item:hover,
html.pdmbn-enabled .pdmbn-item:focus-visible,
html.pdmbn-enabled .pdmbn-item[aria-expanded="true"] {
    background: rgb(31 72 197 / .07);
    color: var(--color-primary, #1f48c5);
    text-decoration: none;
    outline: none;
}

html.pdmbn-enabled .pdmbn-item:focus-visible { box-shadow: inset 0 0 0 2px currentColor; }

html.pdmbn-enabled .pdmbn-item__icon {
    position: relative;
    display: grid;
    width: 26px;
    height: 26px;
    place-items: center;
    flex: 0 0 auto;
    /*
     * Establish a component-local type scale. The checkout document uses a
     * 10px root while normal Hyva pages use 16px; `initial` keeps the badge
     * scale independent from either page root without copying header pixels.
     */
    font-size: initial;
}

html.pdmbn-enabled .pdmbn-item__icon svg { width: 23px; height: 23px; }

html.pdmbn-enabled .pdmbn-item__label {
    display: -webkit-box;
    max-width: 100%;
    overflow: hidden;
    padding-inline: 2px;
    color: inherit;
    font-size: 10.5px;
    font-weight: 650;
    line-height: 1.08;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/*
 * One component-owned cart badge style for every MobileBottomNav context.
 * All measurements are relative to the badge's local type scale, so checkout
 * and normal Hyva pages stay visually identical even when their root font
 * sizes differ. This intentionally follows the BottomNav design rather than
 * copying the separate checkout/header cart badge dimensions.
 */
html.pdmbn-enabled .pdmbn-cart-badge {
    position: absolute;
    top: -0.5em;
    right: -0.5em;
    display: block;
    box-sizing: border-box;
    padding: 0.333333em 0.666667em;
    border-radius: 999em;
    background-color: #1f48c5;
    color: #fff;
    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 0.75em;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
}

html.pdmbn-enabled .pdmbn-cart-badge[x-cloak],
html.pdmbn-enabled .pdmbn-cart-badge[hidden] {
    display: none !important;
}

html.pdmbn-enabled .pdmbn-filter-dialog {
    position: fixed;
    z-index: 8000;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 0;
    background: rgb(15 23 42 / .55);
    color: #111827;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

html.pdmbn-enabled .pdmbn-filter-dialog[hidden] { display: none !important; }

html.pdmbn-enabled .pdmbn-filter-dialog__panel {
    display: flex;
    width: 100%;
    max-width: 720px;
    height: min(88dvh, 820px);
    max-height: 88dvh;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
    border-radius: 18px 18px 0 0;
    background: #fff;
    box-shadow: 0 -18px 50px rgb(15 23 42 / .25);
}

html.pdmbn-enabled .pdmbn-filter-dialog__header {
    display: flex;
    min-height: 72px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border-bottom: 1px solid #e5e7eb;
    background: #fff;
}

html.pdmbn-enabled .pdmbn-filter-dialog__header strong { display: block; font-size: 18px; line-height: 1.2; }
html.pdmbn-enabled .pdmbn-filter-dialog__header span { display: block; margin-top: 3px; color: #64748b; font-size: 12px; }

html.pdmbn-enabled .pdmbn-filter-dialog__close {
    display: grid;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    place-items: center;
    margin: 0;
    padding: 8px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: #334155;
}

html.pdmbn-enabled .pdmbn-filter-dialog__close:hover,
html.pdmbn-enabled .pdmbn-filter-dialog__close:focus-visible {
    border-color: transparent;
    background: #f1f5f9;
    color: #111827;
    outline: none;
}

html.pdmbn-enabled .pdmbn-filter-dialog__body {
    min-height: 0;
    flex: 1 1 auto;
    overflow: auto;
    overscroll-behavior: contain;
    padding: 14px 14px calc(18px + env(safe-area-inset-bottom, 0px));
    -webkit-overflow-scrolling: touch;
}

html.pdmbn-enabled .pdmbn-filter-dialog__body [data-pd-layered-nav] {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 1px;
    margin: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
}

html.pdmbn-enabled .pdmbn-filter-dialog__body .pdln-shell,
html.pdmbn-enabled .pdmbn-filter-dialog__body .filter.block { width: 100% !important; max-width: none !important; margin: 0 !important; }

html.pdmbn-enabled .pdmbn-filter-dialog__body [data-pd-layered-nav]:not([aria-busy="true"]) {
    pointer-events: auto !important;
}

html.pdmbn-enabled .pdmbn-filter-dialog__body a,
html.pdmbn-enabled .pdmbn-filter-dialog__body button,
html.pdmbn-enabled .pdmbn-filter-dialog__body input,
html.pdmbn-enabled .pdmbn-filter-dialog__body select,
html.pdmbn-enabled .pdmbn-filter-dialog__body label {
    touch-action: manipulation;
}

html.pdmbn-enabled.pdmbn-catalog-mobile body.catalog-category-view .sidebar.sidebar-main,
html.pdmbn-enabled.pdmbn-catalog-mobile body.catalogsearch-result-index .sidebar.sidebar-main {
    display: none !important;
}

html.pdmbn-layered-moved body.catalog-category-view .sidebar.sidebar-main,
html.pdmbn-layered-moved body.catalogsearch-result-index .sidebar.sidebar-main { display: none !important; }

html.pdmbn-hide-catalog-fitment body.catalog-category-view .pd-fitment-placement--category,
html.pdmbn-hide-catalog-fitment body.catalogsearch-result-index .pd-fitment-placement--search { display: none !important; }

html.pdmbn-enabled .toolbar-products.pdmbn-toolbar-has-filter .modes { display: none !important; }

html.pdmbn-enabled .toolbar-products .pdmbn-toolbar-filter {
    order: 1;
    grid-column: span 1 / span 1;
    display: flex;
    min-width: 0;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0;
    padding: 8px 10px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background: #fff;
    color: #374151;
    font: inherit;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    white-space: nowrap;
    cursor: pointer;
}

html.pdmbn-enabled .toolbar-products .pdmbn-toolbar-filter:hover,
html.pdmbn-enabled .toolbar-products .pdmbn-toolbar-filter:focus-visible,
html.pdmbn-enabled .toolbar-products .pdmbn-toolbar-filter[aria-expanded="true"] {
    border-color: var(--color-primary, #1f48c5);
    color: var(--color-primary, #1f48c5);
    outline: none;
}

html.pdmbn-enabled .toolbar-products .pdmbn-toolbar-filter__icon {
    display: grid;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    place-items: center;
}

html.pdmbn-enabled .toolbar-products .pdmbn-toolbar-filter__icon svg { width: 20px; height: 20px; }
html.pdmbn-enabled .toolbar-products.pdmbn-toolbar-has-filter .toolbar-sorter { min-width: 0; }

html.pdmbn-enabled .pdmbn-account-popover {
    position: fixed;
    z-index: 7900;
    right: 12px;
    bottom: calc(78px + env(safe-area-inset-bottom, 0px));
    width: min(260px, calc(100vw - 24px));
    max-height: min(62dvh, 480px);
    overflow: auto;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 16px 36px rgb(15 23 42 / .22);
}

html.pdmbn-enabled .pdmbn-account-popover[hidden] { display: none !important; }
html.pdmbn-enabled .pdmbn-account-popover__body { padding: 8px 4px; }

html.pdmbn-enabled .pdmbn-account-popover .pdmbn-account-link,
html.pdmbn-enabled .pdmbn-account-popover__body > a,
html.pdmbn-enabled .pdmbn-account-popover__body > button {
    display: block;
    width: 100%;
    padding: 10px 16px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #1f2937;
    font: inherit;
    text-align: left;
    text-decoration: none;
}

html.pdmbn-enabled .pdmbn-account-popover .pdmbn-account-link:hover,
html.pdmbn-enabled .pdmbn-account-popover .pdmbn-account-link:focus-visible {
    background: #f3f4f6;
    color: #111827;
    outline: none;
    text-decoration: none;
}

@media (max-width: 420px) {
    html.pdmbn-enabled .pdmbn-item__label { font-size: 9.5px; }
    html.pdmbn-enabled .pdmbn-item__icon svg { width: 22px; height: 22px; }
    html.pdmbn-enabled .toolbar-products .pdmbn-toolbar-filter { gap: 4px; padding-inline: 8px; font-size: 13px; }
}