/* Hamburger only on the All Categories nav trigger (Elementor n-menu). */
.e-n-menu-item:has(.ps-all-categories-menu) .e-n-menu-title-container {
    align-items: center;
    display: inline-flex;
    gap: 0.5rem;
}

.e-n-menu-item:has(.ps-all-categories-menu) .e-n-menu-title-text {
    align-items: center;
    display: inline-flex;
    gap: 0.5rem;
}

.e-n-menu-item:has(.ps-all-categories-menu) .e-n-menu-title-text::before {
    background-color: currentColor;
    content: "";
    display: inline-block;
    flex-shrink: 0;
    height: 20px;
    width: 22px;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 6h18v2H3V6zm0 5h18v2H3v-2zm0 5h18v2H3v-2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 6h18v2H3V6zm0 5h18v2H3v-2zm0 5h18v2H3v-2z'/%3E%3C/svg%3E");
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.ps-all-categories-menu {
    background: #fff;
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    min-height: 420px;
    width: 100%;
}

.ps-all-categories-menu__nav {
    border-right: 1px solid #eef2f7;
    display: flex;
    flex-direction: column;
    padding: 0.75rem 0;
}

.ps-all-categories-menu__root {
    align-items: center;
    color: #111827;
    display: flex;
    gap: 0.75rem;
    padding: 0.7rem 1.1rem;
    text-decoration: none;
    transition: background-color 0.35s ease, box-shadow 0.35s ease, color 0.35s ease;
}

.ps-all-categories-menu__root:hover,
.ps-all-categories-menu__root.is-active {
    background: #fff8e8;
}

.ps-all-categories-menu__root.is-active {
    box-shadow: inset 4px 0 0 #f5b400;
    font-weight: 600;
}

.ps-all-categories-menu__icon {
    color: #6b7280;
    display: inline-flex;
    flex: 0 0 36px;
    height: 36px;
    transition: color 0.35s ease;
    width: 36px;
}

.ps-all-categories-menu__icon svg,
.ps-all-categories-menu__icon-img {
    display: block;
    height: 36px;
    object-fit: contain;
    width: 36px;
}

.ps-all-categories-menu__root.is-active .ps-all-categories-menu__icon {
    color: #111827;
}

.ps-all-categories-menu__panels {
    min-width: 0;
    padding: 1.25rem 1.5rem 1.5rem;
    position: relative;
}

.ps-all-categories-menu__panel {
    display: grid;
    gap: 1.5rem 2rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    inset: 1.25rem 1.5rem 1.5rem;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transform: translateY(10px);
    transition: opacity 0.45s cubic-bezier(0.33, 1, 0.68, 1), transform 0.45s cubic-bezier(0.33, 1, 0.68, 1), visibility 0.45s;
    visibility: hidden;
    z-index: 0;
}

.ps-all-categories-menu__panel.is-active {
    opacity: 1;
    pointer-events: auto;
    position: relative;
    inset: auto;
    transform: translateY(0);
    visibility: visible;
    z-index: 1;
}

.ps-all-categories-menu__group {
    min-width: 0;
}

.ps-all-categories-menu__heading {
    color: #111827;
    display: block;
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 0.55rem;
    text-decoration: none;
}

.ps-all-categories-menu__links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ps-all-categories-menu__links a {
    color: #4b5563;
    display: block;
    font-size: 14px;
    line-height: 1.45;
    padding: 0.18rem 0;
    text-decoration: none;
}

.ps-all-categories-menu__links a:hover,
.ps-all-categories-menu__heading:hover {
    color: #111827;
}

.ps-all-brands-menu {
    display: block;
    min-height: 0;
    padding: 1.1rem 1.35rem 1.35rem;
}

.ps-all-brands-menu__index {
    align-items: center;
    border-bottom: 1px solid #eef2f7;
    display: flex;
    flex-wrap: wrap;
    gap: 0.2rem;
    margin: 0 0 1rem;
    padding: 0 0 0.75rem;
}

.ps-all-brands-menu__index a {
    border-radius: 6px;
    color: #4b5563;
    display: inline-flex;
    font-size: 13px;
    font-weight: 600;
    justify-content: center;
    min-width: 28px;
    padding: 0.35rem 0.45rem;
    text-decoration: none;
    transition: background-color 0.35s ease, box-shadow 0.35s ease, color 0.35s ease;
}

.ps-all-brands-menu__index a:hover,
.ps-all-brands-menu__index a.is-active {
    background: #fff8e8;
    box-shadow: inset 0 -3px 0 #f5b400;
    color: #111827;
}

.ps-all-brands-menu__directory {
    display: grid;
    gap: 1.15rem 2rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ps-all-brands-menu__heading {
    color: #111827;
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 0.4rem;
}

.ps-all-brands-menu__links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ps-all-brands-menu__links a {
    color: #4b5563;
    display: block;
    font-size: 14px;
    line-height: 1.4;
    padding: 0.16rem 0;
    text-decoration: none;
}

.ps-all-brands-menu__links a:hover {
    color: #111827;
}

.ps-all-brands-menu.is-filtered .ps-all-brands-menu__group {
    display: none;
}

.ps-all-brands-menu.is-filtered .ps-all-brands-menu__group.is-active {
    display: block;
    grid-column: 1 / -1;
}

.ps-all-brands-menu.is-filtered .ps-all-brands-menu__group.is-active .ps-all-brands-menu__links {
    column-count: 4;
    column-gap: 2rem;
}

.ps-all-brands-menu.is-filtered .ps-all-brands-menu__group.is-active .ps-all-brands-menu__links li {
    break-inside: avoid;
}

.elementor-widget-n-menu .e-n-menu-heading:has(.ps-shop-by-menu),
.elementor-widget-n-menu .e-n-menu-wrapper:has(.ps-shop-by-menu) {
    overflow: visible !important;
}

.elementor-widget-n-menu .e-n-menu-item:has(.ps-shop-by-menu) {
    position: relative;
}

.elementor-widget-n-menu .e-n-menu:not([data-layout=dropdown]) .e-n-menu-content:has(.ps-shop-by-menu) {
    height: auto !important;
    inset-inline-end: auto !important;
    inset-inline-start: 0 !important;
    left: 0 !important;
    max-width: min(420px, calc(100vw - 1.5rem)) !important;
    min-height: 0 !important;
    min-width: 0 !important;
    right: auto !important;
    width: max-content !important;
}

.e-con:has(> .elementor-widget-shortcode .ps-shop-by-menu),
.elementor-element-1bb3253d {
    background-color: #fff !important;
    box-shadow: 0 10px 28px rgba(17, 24, 39, 0.12);
    height: auto !important;
    max-width: 420px !important;
    min-height: 0 !important;
    min-width: 0 !important;
    width: max-content !important;
}

.ps-shop-by-menu {
    display: flex;
    gap: 2.25rem;
    min-height: 0;
    padding: 0.75rem 1rem 0.85rem;
    width: max-content;
}

.ps-shop-by-menu__column {
    min-width: 148px;
}

.ps-shop-by-menu__heading {
    color: #111827;
    font-size: 14px;
    font-weight: 700;
    margin: 0 0 0.45rem;
}

.ps-shop-by-menu__links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ps-shop-by-menu__links a {
    color: #4b5563;
    display: block;
    font-size: 13px;
    line-height: 1.35;
    padding: 0.18rem 0;
    text-decoration: none;
    white-space: nowrap;
}

.ps-shop-by-menu__links a:hover {
    color: #111827;
}

/* Soft open animation for Elementor mega dropdowns. */
@keyframes ps-mega-in {
    from {
        opacity: 0;
        transform: translateY(14px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.elementor-widget-n-menu .e-n-menu:not([data-layout=dropdown]) .e-n-menu-content:has(.ps-all-categories-menu),
.elementor-widget-n-menu .e-n-menu:not([data-layout=dropdown]) .e-n-menu-content:has(.ps-all-brands-menu),
.elementor-widget-n-menu .e-n-menu:not([data-layout=dropdown]) .e-n-menu-content:has(.ps-shop-by-menu) {
    transition: opacity 0.5s cubic-bezier(0.33, 1, 0.68, 1),
        transform 0.5s cubic-bezier(0.33, 1, 0.68, 1),
        visibility 0.5s !important;
}

.e-n-menu-item:hover .ps-all-categories-menu,
.e-n-menu-item:hover .ps-all-brands-menu,
.e-n-menu-item:hover .ps-shop-by-menu,
.e-n-menu-item:has([aria-expanded="true"]) .ps-all-categories-menu,
.e-n-menu-item:has([aria-expanded="true"]) .ps-all-brands-menu,
.e-n-menu-item:has([aria-expanded="true"]) .ps-shop-by-menu {
    animation: ps-mega-in 0.5s cubic-bezier(0.33, 1, 0.68, 1) both;
}

@media (prefers-reduced-motion: reduce) {
    .ps-all-categories-menu__root,
    .ps-all-categories-menu__icon,
    .ps-all-categories-menu__panel,
    .ps-all-brands-menu__index a,
    .elementor-widget-n-menu .e-n-menu-content:has(.ps-all-categories-menu),
    .elementor-widget-n-menu .e-n-menu-content:has(.ps-all-brands-menu),
    .elementor-widget-n-menu .e-n-menu-content:has(.ps-shop-by-menu),
    .e-n-menu-item:hover .ps-all-categories-menu,
    .e-n-menu-item:hover .ps-all-brands-menu,
    .e-n-menu-item:hover .ps-shop-by-menu,
    .e-n-menu-item:has([aria-expanded="true"]) .ps-all-categories-menu,
    .e-n-menu-item:has([aria-expanded="true"]) .ps-all-brands-menu,
    .e-n-menu-item:has([aria-expanded="true"]) .ps-shop-by-menu {
        animation: none !important;
        transition: none !important;
    }
}

/* Wider layout: 5 columns (4 on medium screens) so big categories like Apparel fit without scrolling. */
@media (min-width: 1025px) {
    .ps-all-categories-menu__panel {
        gap: 1.25rem 1.75rem;
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .ps-all-categories-menu__links a {
        line-height: 1.35;
    }
}

@media (min-width: 1025px) and (max-width: 1365px) {
    .ps-all-categories-menu__panel {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* Compact desktop typography so the whole panel fits on screen without scrolling.
   --ps-mega-scale is lowered automatically by JS on short screens. */
@media (min-width: 1025px) {
    .ps-all-categories-menu {
        min-height: 0;
    }

    .ps-all-categories-menu__panels {
        padding: 1rem 1.25rem 1rem;
    }

    .ps-all-categories-menu__panel {
        gap: calc(1rem * var(--ps-mega-scale, 1)) 1.5rem;
    }

    .ps-all-categories-menu__heading {
        font-size: calc(15px * var(--ps-mega-scale, 1));
        margin-bottom: calc(0.4rem * var(--ps-mega-scale, 1));
    }

    .ps-all-categories-menu__links a {
        font-size: calc(13.5px * var(--ps-mega-scale, 1));
        line-height: 1.3;
        padding: calc(0.12rem * var(--ps-mega-scale, 1)) 0;
    }
}

/* Brands directory: more columns + compact text so all letters fit on screen without scrolling.
   --ps-mega-scale is lowered automatically by JS on short screens. */
@media (min-width: 1025px) {
    .ps-all-brands-menu {
        padding: 0.9rem 1.25rem 1rem;
    }

    .ps-all-brands-menu__index {
        margin-bottom: calc(0.75rem * var(--ps-mega-scale, 1));
        padding-bottom: calc(0.55rem * var(--ps-mega-scale, 1));
    }

    .ps-all-brands-menu__directory {
        gap: calc(0.85rem * var(--ps-mega-scale, 1)) 1.25rem;
        grid-auto-flow: row dense;
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }

    .ps-all-brands-menu__heading {
        font-size: calc(14px * var(--ps-mega-scale, 1));
        margin-bottom: calc(0.3rem * var(--ps-mega-scale, 1));
    }

    .ps-all-brands-menu__links a {
        font-size: calc(13px * var(--ps-mega-scale, 1));
        line-height: 1.3;
        overflow: hidden;
        padding: calc(0.1rem * var(--ps-mega-scale, 1)) 0;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Letters with many brands (9+) take two columns and split the list. */
    .ps-all-brands-menu:not(.is-filtered) .ps-all-brands-menu__group:has(.ps-all-brands-menu__links > li:nth-child(9)) {
        grid-column: span 2;
    }

    .ps-all-brands-menu:not(.is-filtered) .ps-all-brands-menu__group:has(.ps-all-brands-menu__links > li:nth-child(9)) .ps-all-brands-menu__links {
        column-count: 2;
        column-gap: 1.25rem;
    }

    .ps-all-brands-menu__links > li {
        break-inside: avoid;
    }
}

@media (min-width: 1025px) and (max-width: 1365px) {
    .ps-all-brands-menu__directory {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}

/* Long groups (12+ links, e.g. T-Shirts, Headwear, Outerwear): take two grid columns and
   split their links into two columns, so the panel stays short. */
@media (min-width: 1025px) {
    .ps-all-categories-menu__panel {
        grid-auto-flow: row dense;
    }

    .ps-all-categories-menu__group:has(.ps-all-categories-menu__links > li:nth-child(12)) {
        grid-column: span 2;
    }

    .ps-all-categories-menu__group:has(.ps-all-categories-menu__links > li:nth-child(12)) .ps-all-categories-menu__links {
        column-count: 2;
        column-gap: 1.75rem;
    }

    .ps-all-categories-menu__group:has(.ps-all-categories-menu__links > li:nth-child(12)) .ps-all-categories-menu__links > li {
        break-inside: avoid;
    }
}

@media (min-width: 901px) and (max-width: 1024px) {
    .ps-all-categories-menu__panel {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .ps-all-categories-menu {
        grid-template-columns: 1fr;
    }

    .ps-all-categories-menu__nav {
        border-bottom: 1px solid #eef2f7;
        border-right: 0;
        flex-direction: row;
        overflow-x: auto;
    }

    .ps-all-categories-menu__panel.is-active {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ps-all-brands-menu__directory {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ps-shop-by-menu {
        flex-direction: column;
        gap: 1.1rem;
        width: 100%;
    }
}

@media (max-width: 640px) {
    .ps-all-categories-menu__panel.is-active {
        grid-template-columns: 1fr;
    }

    .ps-all-brands-menu__directory {
        grid-template-columns: 1fr;
    }
}
