/* Skechers.fr retail mega — layout/colors from skechers.fr, typography from DiamondTheme */

.diamond-skechers-menu {
    width: 100%;
    font-family: inherit;
    font-size: var(--font-size-base, 14px);
    --skechers-nav-fg: var(--color-neutral-700, #434343);
    --skechers-nav-hover: var(--color-neutral-900, #111111);
    --skechers-nav-active: var(--color-primary, #0063ba);
    --skechers-nav-sale: #ff4500;
    --skechers-nav-outlet: #990000;
    --skechers-mega-bg: #ffffff;
    --skechers-mega-gray: #f8f8f8;
    --skechers-mega-border: #e3e3e3;
    --skechers-mega-link: var(--color-neutral-700, #434343);
    --skechers-mega-link-hover: var(--color-neutral-900, #111111);
    --skechers-mega-rail-width: 20rem;
    --skechers-split-dir: right;
    --skechers-backdrop: rgba(0, 0, 0, 0.45);
}

.diamond-skechers-menu--rtl {
    --skechers-split-dir: left;
}

html.diamond-theme-surface-dark .diamond-skechers-menu {
    --skechers-nav-fg: var(--diamond-text-primary, #f5f5f5);
    --skechers-nav-hover: #ffffff;
    --skechers-nav-active: var(--color-primary, #4c91ce);
    --skechers-nav-sale: #ff7a45;
    --skechers-nav-outlet: #d46a6a;
    --skechers-mega-bg: var(--diamond-surface, #121212);
    --skechers-mega-gray: var(--diamond-surface-elevated, #1a1a1e);
    --skechers-mega-border: var(--diamond-border-subtle, #2a2a2e);
    --skechers-mega-link: var(--diamond-text-secondary, #c8c8cc);
    --skechers-mega-link-hover: #ffffff;
    --skechers-backdrop: rgba(0, 0, 0, 0.65);
}

.diamond-skechers-menu__desktop {
    display: block;
}

.diamond-skechers-menu__mobile {
    display: none;
}

.diamond-skechers-menu__shell {
    position: relative;
    width: 100%;
}

.diamond-skechers-menu__backdrop {
    position: fixed;
    top: var(--skechers-header-bottom, 115px);
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    background: var(--skechers-backdrop);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.diamond-skechers-menu__backdrop.is-visible {
    opacity: 1;
    pointer-events: auto;
}

.diamond-skechers-menu__bar {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 0 1.5rem;
    list-style: none;
    margin: 0;
    padding: 0.3rem 0; /* Reduced padding for gray bar */
    position: relative;
    z-index: 72;
}

.diamond-skechers-menu__item {
    position: relative;
    flex-shrink: 0;
}

.diamond-skechers-menu__link-text {
    white-space: nowrap;
}

.diamond-skechers-menu__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.25rem 0; /* Reduced padding for items inside gray bar */
    color: var(--skechers-nav-fg);
    font: inherit;
    font-size: 13px; /* Reduced font size for items inside gray bar */
    font-weight: 400;
    line-height: 1.3;
    text-decoration: none;
    border: 0;
    transition: color 0.15s ease;
}

.diamond-skechers-menu__link-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    flex-shrink: 0;
}

.diamond-skechers-menu__link::before,
.diamond-skechers-menu__link::after {
    display: none !important;
}

.diamond-skechers-menu__link:hover,
.diamond-skechers-menu__link:focus-visible,
.diamond-skechers-menu__item.is-active > .diamond-skechers-menu__link {
    color: var(--skechers-nav-hover);
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.diamond-skechers-menu__item.is-sale > .diamond-skechers-menu__link {
    color: var(--skechers-nav-sale);
}

.diamond-skechers-menu__item.is-outlet > .diamond-skechers-menu__link {
    color: var(--skechers-nav-outlet);
}

.diamond-skechers-menu__mega-viewport {
    position: absolute;
    inset-inline: 0;
    top: 100%;
    z-index: 71;
    background: var(--skechers-mega-bg);
    border-top: 1px solid var(--skechers-mega-border);
    margin-top: -1px;
    padding-top: 1px;
}

.diamond-skechers-menu__mega-viewport:not([hidden]) {
    display: block;
}

.diamond-skechers-menu__mega-panel {
    display: none;
}

.diamond-skechers-menu__mega-panel.is-active {
    display: block;
    background: var(--skechers-mega-bg);
}

.diamond-skechers-menu__mega-inner {
    width: min(100%, 102.5rem);
    margin-inline: auto;
    padding-inline: 1.25rem;
    display: flex;
}

.diamond-skechers-menu__mega-grid {
    display: flex;
    align-items: stretch;
    min-height: 16rem;
    width: 100%;
}

.diamond-skechers-menu__mega-rail {
    position: relative;
    flex: 0 0 var(--skechers-mega-rail-width);
    width: var(--skechers-mega-rail-width);
    max-width: var(--skechers-mega-rail-width);
    padding: 2.5rem 2.5rem 2.5rem 0;
    margin-inline-start: -1.25rem;
    padding-inline-start: 1.25rem;
    background-color: var(--skechers-mega-gray);
}

.diamond-skechers-menu__mega-rail::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    inset-inline-end: 100%;
    width: 50vw;
    background-color: var(--skechers-mega-gray);
}

.diamond-skechers-menu--rtl .diamond-skechers-menu__mega-rail {
    padding: 2.5rem 0 2.5rem 2.5rem;
    margin-inline-start: -1.25rem;
    padding-inline-start: 1.25rem;
}

.diamond-skechers-menu__mega-featured-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.diamond-skechers-menu__mega-featured-list > li {
    margin: 0;
    padding: 0;
}

.diamond-skechers-menu__mega-featured-link {
    display: block;
    padding: 0.25rem 0; /* Reduced padding */
    color: var(--skechers-mega-link);
    font: inherit;
    font-size: 0.95rem; /* Reduced font size */
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
    white-space: normal;
    word-break: break-word;
}

.diamond-skechers-menu__mega-featured-link::before,
.diamond-skechers-menu__mega-featured-link::after {
    display: none !important;
}

.diamond-skechers-menu__mega-featured-link:hover,
.diamond-skechers-menu__mega-featured-link:focus-visible {
    color: var(--skechers-mega-link-hover);
    text-decoration: underline;
}

.diamond-skechers-menu__mega-featured-link.text-danger,
.diamond-skechers-menu__mega-featured-link.is-sale {
    color: var(--skechers-nav-sale) !important;
}

.diamond-skechers-menu__mega-featured-link.text-warning,
.diamond-skechers-menu__mega-featured-link.is-outlet {
    color: var(--skechers-nav-outlet) !important;
}

.diamond-skechers-menu__mega-featured-link.text-primary,
.diamond-skechers-menu__mega-featured-link.is-primary {
    color: var(--color-primary) !important;
}

.diamond-skechers-menu__mega-body {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex: 1 1 auto;
    min-width: 0;
    background: transparent;
}

.diamond-skechers-menu__mega-main {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    align-content: flex-start;
    align-self: stretch;
    gap: 1.5rem 2.5rem;
    padding: 2.5rem 2.5rem;
}

.diamond-skechers-menu__mega-column {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    min-width: 12rem;
}

.diamond-skechers-menu__mega-group {
    display: flex;
    flex-direction: column;
}

.diamond-skechers-menu__mega-col-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0 0 0.6rem 0; /* Reduced padding */
    color: var(--skechers-mega-link);
    font: inherit;
    font-size: 0.95rem; /* Reduced font size for column titles */
    font-weight: 700;
    line-height: normal;
    text-decoration: none;
    white-space: nowrap;
}

.diamond-skechers-menu__mega-col-icon {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.diamond-skechers-menu__mega-col-title:hover,
.diamond-skechers-menu__mega-col-title:focus-visible {
    color: var(--skechers-mega-link-hover);
    text-decoration: underline;
}

.diamond-skechers-menu__mega-col-links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.diamond-skechers-menu__mega-col-links > li {
    margin: 0;
    padding: 0;
}

.diamond-skechers-menu__mega-col-link {
    display: block;
    padding: 0;
    color: var(--skechers-mega-link);
    font: inherit;
    font-size: 13px; /* Reduced font size */
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: 0.03em;
    text-decoration: none;
    white-space: normal;
}

.diamond-skechers-menu__mega-col-link:hover,
.diamond-skechers-menu__mega-col-link:focus-visible {
    color: var(--skechers-mega-link-hover);
    text-decoration: underline;
}

.diamond-skechers-menu__mega-banner {
    display: flex;
    gap: 1rem;
    flex: 0 0 auto;
    align-self: flex-start;
    align-items: flex-start;
    max-width: 46%;
    padding-block: 2.5rem;
    padding-inline: 1.5rem 0;
    background: transparent;
}

.diamond-skechers-menu__mega-banner-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    width: 12.75rem;
    text-decoration: none;
    color: var(--skechers-mega-link);
}

.diamond-skechers-menu__mega-banner-tile img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
}

.diamond-skechers-menu__mega-banner-label {
    font: inherit;
    font-size: var(--font-size-sm, 12px);
    font-weight: 400;
    line-height: 1.35;
    text-align: center;
    width: 100%;
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

.diamond-skechers-menu__mega-banner-tile:hover .diamond-skechers-menu__mega-banner-label,
.diamond-skechers-menu__mega-banner-tile:focus-visible .diamond-skechers-menu__mega-banner-label {
    color: var(--skechers-mega-link-hover);
}

.topMenu .diamond-skechers-menu a i:not(.topMenu__close_icon) {
    display: none;
}

.topMenu .diamond-skechers-menu .diamond-skechers-menu__link,
.topMenu .diamond-skechers-menu .diamond-skechers-menu__mega-featured-link,
.topMenu .diamond-skechers-menu .diamond-skechers-menu__mega-parent-link,
.topMenu .diamond-skechers-menu .diamond-skechers-menu__mega-flyout-link {
    flex-direction: row;
    gap: 0;
}

@media screen and (max-width: 1199px) {
    .diamond-skechers-menu__mobile-close {
        display: block;
    }

    .diamond-skechers-menu__desktop {
        display: none;
    }

    .diamond-skechers-menu__mobile {
        display: block;
        padding: 0.35rem 0.75rem 1rem;
    }

    .diamond-skechers-menu__mobile-list {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .diamond-skechers-menu__mobile-item {
        border-bottom: 1px solid var(--skechers-mega-border);
    }

    .diamond-skechers-menu__mobile-row {
        display: flex;
        align-items: center;
        gap: 0.35rem;
    }

    .diamond-skechers-menu__mobile-link {
        flex: 1 1 auto;
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.9rem 0.15rem;
        color: var(--skechers-nav-fg);
        font: inherit;
        font-size: var(--font-size-lg, 15px);
        font-weight: 400;
        text-decoration: none;
    }

    .diamond-skechers-menu__mobile-link-icon,
    .diamond-skechers-menu__mobile-section-icon {
        width: 24px;
        height: 24px;
        object-fit: contain;
        flex-shrink: 0;
    }

    .diamond-skechers-menu__mobile-item.is-sale > .diamond-skechers-menu__mobile-row .diamond-skechers-menu__mobile-link {
        color: var(--skechers-nav-sale);
    }

    .diamond-skechers-menu__mobile-item.is-outlet > .diamond-skechers-menu__mobile-row .diamond-skechers-menu__mobile-link {
        color: var(--skechers-nav-outlet);
    }

    .diamond-skechers-menu__mobile-expand,
    .diamond-skechers-menu__mobile-section-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2.25rem;
        height: 2.25rem;
        border: 0;
        border-radius: 50%;
        background: transparent;
        color: var(--skechers-mega-link);
        cursor: pointer;
        flex-shrink: 0;
    }

    .diamond-skechers-menu__mobile-panel {
        padding: 0 0 0.85rem 0.35rem;
    }

    .diamond-skechers-menu__mobile-panel:not([hidden]) {
        display: block;
    }

    .diamond-skechers-menu__mobile-featured {
        list-style: none;
        margin: 0 0 0.65rem;
        padding: 0.65rem 0.75rem;
        background: var(--skechers-mega-gray);
        border-bottom: 1px solid var(--skechers-mega-border);
    }

    .diamond-skechers-menu__mobile-featured a {
        display: block;
        padding: 0.35rem 0;
        color: var(--skechers-mega-link);
        font: inherit;
        font-size: var(--font-size-base, 14px);
        font-weight: 700;
        text-decoration: none;
        white-space: normal;
        word-break: break-word;
    }

    .diamond-skechers-menu__mobile-featured a.text-danger,
    .diamond-skechers-menu__mobile-featured a.is-sale {
        color: var(--skechers-nav-sale) !important;
    }

    .diamond-skechers-menu__mobile-featured a.text-warning,
    .diamond-skechers-menu__mobile-featured a.is-outlet {
        color: var(--skechers-nav-outlet) !important;
    }

    .diamond-skechers-menu__mobile-featured a.text-primary {
        color: var(--color-primary) !important;
    }

    .diamond-skechers-menu__mobile-section {
        padding: 0.35rem 0;
    }

    .diamond-skechers-menu__mobile-section-head {
        display: flex;
        align-items: center;
        gap: 0.35rem;
    }

    .diamond-skechers-menu__mobile-section-link {
        flex: 1 1 auto;
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.45rem 0;
        color: var(--skechers-mega-link);
        font: inherit;
        font-size: var(--font-size-base, 14px);
        font-weight: 700;
        text-decoration: none;
    }

    .diamond-skechers-menu__mobile-sub {
        list-style: none;
        margin: 0.15rem 0 0.5rem;
        padding-inline-start: 0.85rem;
    }

    .diamond-skechers-menu__mobile-sub:not([hidden]) {
        display: block;
    }

    .diamond-skechers-menu__mobile-sub a {
        display: block;
        padding: 0.35rem 0;
        color: var(--skechers-mega-link);
        font: inherit;
        font-size: var(--font-size-base, 14px);
        text-decoration: none;
    }

    .diamond-skechers-menu__mobile-item.is-open > .diamond-skechers-menu__mobile-row .diamond-skechers-menu__mobile-expand i,
    .diamond-skechers-menu__mobile-section.is-open .diamond-skechers-menu__mobile-section-toggle i {
        transform: rotate(180deg);
    }
}

@media screen and (min-width: 1200px) {
    .diamond-skechers-menu__mobile-close {
        display: none;
    }

    body:has(.diamond-skechers-menu) .preHeader__toggle,
    [data-skechers-hamburger] {
        display: none !important;
    }

    /* Keep theme position:fixed on .header. Only raise stacking so the mega
       is not painted under page content (theme .topMenu is z-index: -10). */
    body:has(.diamond-skechers-menu) .header,
    body:has(.diamond-skechers-menu) #header,
    body:has(.diamond-skechers-menu) [data-diamond-managed-header] {
        z-index: 80;
        overflow: visible;
        pointer-events: auto;
    }

    body:has(.diamond-skechers-menu) .preHeader,
    body:has(.diamond-skechers-menu) .mainHeader {
        position: relative;
        z-index: 90;
        overflow: visible;
    }

    /* Theme tools dropdown is z-index:2; Skechers mega/topMenu is 70. */
    body:has(.diamond-skechers-menu) .tools__content,
    body:has(.diamond-skechers-menu) #toptoolslink,
    body:has(.diamond-skechers-menu) .tools__btn {
        position: relative;
        z-index: 100;
    }

    body:has(.diamond-skechers-menu) .tools__modal {
        z-index: 100;
    }

    body:has(.diamond-skechers-menu) .topMenu,
    body:has(.diamond-skechers-menu) .diamond-top-menu-root {
        z-index: 70;
        overflow: visible;
        background: var(--color-header-bg, #fff);
    }

    .topMenu .diamond-skechers-menu__shell {
        position: static;
    }

    .topMenu .diamond-skechers-menu__mega-viewport {
        position: absolute;
        inset-inline: 0;
        left: 0;
        right: 0;
        width: 100%;
        transform: none;
        z-index: 70;
    }
}

@media screen and (max-width: 1199px) {
    body:has(.diamond-skechers-menu) .preHeader__toggle,
    [data-skechers-hamburger] {
        display: flex !important;
        align-items: center;
        justify-content: center;
        cursor: pointer;
    }

    .topMenu:has(.diamond-skechers-menu):not(.active) {
        display: none !important;
    }

    body.top-menu-mobile-open .topMenu:has(.diamond-skechers-menu),
    .topMenu.active:has(.diamond-skechers-menu) {
        display: block !important;
        position: fixed;
        inset: 0;
        z-index: 1075;
        width: 100vw;
        height: 100dvh;
        max-height: 100dvh;
        overflow: hidden;
        background: var(--color-header-bg, #fff);
    }

    .diamond-mobile-nav-panel__skechers {
        height: 100%;
        min-height: 0;
        overflow-y: auto;
    }

    .diamond-mobile-nav-panel--categories-mode .diamond-mobile-nav-panel__skechers .diamond-skechers-menu__mobile {
        padding: 0;
    }
}