/** Shopify CDN: Minification failed

Line 844:1 Expected "}" to go with "{"

**/
/* ==========================================================================
   1. Base, Fonts & CSS Variables
   ========================================================================== */

/* Primary Brand Font: Extended Heavy style for main headers & buttons */
@font-face {
    font-family: 'United Sans Ex Hv';
    src: url('/cdn/shop/files/UnitedSansExt-Heavy.woff2?v=1764824277') format('woff2'),
         url('/cdn/shop/files/UnitedSansExt-Heavy.woff?v=1764824278') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

/* Secondary Brand Font: Regular Heavy style for subheadings, cards, and interactive elements */
@font-face {
    font-family: 'United Sans Rg Hv';
    src: url('/cdn/shop/files/UnitedSansReg-Heavy_8cfd7c1e-d6e6-47e3-8405-2cd2dade7942.woff2?v=1764824277') format('woff2'),
         url('/cdn/shop/files/UnitedSansReg-Heavy_e46d7e7f-e9b6-4598-ac1f-b0452e6cfc36.woff?v=1764824278') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Font Families Mapping */
    --font-heading--family: 'United Sans Ex Hv';
    --font-highlight--family: 'United Sans Ex Hv';
    --primary-font: 'United Sans Ex Hv';
    --secondary-font: 'United Sans Rg Hv';
    --accent-font: 'JUNO Demo';

    /* Color Palette */
    --t-color: #E80029;             /* Primary theme red */
    --brand-red: #E80029;           /* Brand accent red */
    --text-black: #000000;          /* Primary dark text */
    --btn-bg: #E80029;              /* Default button background */
    --border-color: #E80029;        /* Default border highlight */
    --btn-hover: #000000;           /* Button hover state color */
    --text-gray: #50555B;           /* Secondary body text */
    --light-grey: #f1f1f1;          /* Component card backgrounds */
    --text-white: #FFFFFF;          /* Light text */
    --oke-highlightColor: #E80029;  /* Okendo reviews star/highlight color */
}

/* Enable smooth scrolling across the website */
html {
    scroll-behavior: smooth;
}

/* Base body optimization: cleaner typography rendering */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Keyboard accessibility: distinct outline on focus without cluttering mouse clicks */
:focus-visible {
    outline: 2px solid var(--brand-red);
    outline-offset: 4px;
}

/* Global button styling overrides */
button, 
.button {
    font-family: var(--primary-font);
    font-weight: bold;
}


/* ==========================================================================
   2. Shared Typography Grouping (Optimization)
   ========================================================================== */

/* Grouped elements sharing the secondary font styling and uppercase transform for efficiency */
.mega-menu__link,
.custom-liquid-block__content strong,
.reversed-link__text,
.product-card__price,
.badge,
.rsPrice,
.variant-option__label-text,
.tabs__button-text,
.skb-tab-btn,
.skb-mobile-tab-toggle,
.skb-desktop-tab-btn {
    font-family: var(--secondary-font) !important;
    text-transform: uppercase;
}


/* ==========================================================================
   3. Header & Navigation
   ========================================================================== */

/* Main header menu link items */
.menu__item {
    font-size: 2rem; 
    font-family: var(--secondary-font);
}

/* Specific mega-menu sizing override */
.mega-menu__link {
    font-size: 1.6rem !important;
}

/* Desktop-only Navigation Customizations (Width >= 1024px) */
@media screen and (min-width: 1024px) {
    /* Hover effects only on pointer-capable devices to prevent sticky states on mobile */
    @media (hover: hover) {
        .menu__item:hover {
            color: var(--brand-red) !important;
        }
        .menu__item:hover::before {
            opacity: 0 !important;
        }
        /* Top-level mega-menu link hover state */
        .mega-menu__link--top:hover {
            color: var(--brand-red) !important;
        }
    }

    details[open] > summary .menu__item {
        color: var(--brand-red) !important;
    }
    details[open] > summary .menu__item::before {
        opacity: 0 !important;
    }

    /* Navigation sidebar toggle custom states (remove default backgrounds) */
    .menu-sidebar__toggle.is-visible .reversed-link__text {
        background: none !important;
        color: rgb(var(--color-foreground)) !important;
    }
    .menu-sidebar__toggle[aria-expanded="true"] .reversed-link__text {
        color: var(--brand-red) !important;
        background: none !important;
    }

    /* Navigation sidebar header size adjustments */
    .menu-sidebar__toggle .h6 {
        font-size: 1.6rem;
    }

    /* Sidebar category listing layout and aspect ratios */
    .menu-sidebar__collection-image {
        width: 100% !important;
        border-radius: 0 !important;
    }
    .menu-sidebar__collection-image img {
        object-fit: cover !important;
        width: 100% !important;
        height: 100% !important;
    }
    @media (max-width: 767px) {
    .menu-sidebar__collection-image {width: 10rem !important; border-radius: 0 !important;}
    .menu-sidebar__collections {gap: 1px !important;}
    }
    .menu-sidebar__collections {
        gap: 1px !important;
    }

    /* Specific menu overrides for Accessories sub-menu */
    #menu-sidebar-item-accessories .menu-sidebar__collection-image {
        display: none !important;
    }
    #menu-sidebar-item-accessories .menu-sidebar__collections.layout-panel-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 1rem !important;
    }
}

/* Header Stacking Context Adjustment to appear above page main content */
.header-section,
.header-sticky,
.header-wrapper,
.header {
    z-index: 101 !important;
}

/* Position search mega menu absolutely to span full width and be visible */
.header-search-details .mega-menu {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    background-color: transparent !important;
    z-index: 100 !important;
    box-shadow: none !important;
    border-bottom: none !important;
}

.header-search-details .mega-menu__container {
    background-color: #ffffff !important;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1) !important;
    border-bottom: 1px solid #e3e3e3 !important;
}

/* Make select element containers and tags span full width in mega menu */
.mega-menu .select {
    width: 100% !important;
    max-width: none !important;
}
.mega-menu .select select {
    width: 100% !important;
    max-width: none !important;
}

/* Ensure all titles/headings inside any mega menu use the secondary font */
.mega-menu h1,
.mega-menu h2,
.mega-menu h3,
.mega-menu h4,
.mega-menu h5,
.mega-menu h6,
.mega-menu .h1,
.mega-menu .h2,
.mega-menu .h3,
.mega-menu .h4,
.mega-menu .h5,
.mega-menu .h6 {
    font-family: var(--secondary-font) !important;
}

/* Search Mega-Menu Layout & Grid Columns (40% Form, 40% Help Text) */
.search-menu-wrapper {
    width: 100% !important;
}

.search-menu-sidebar {
    --toggle-width: 240px;
    width: 100% !important;
}

.search-form-col {
    width: 40% !important;
    flex: 0 0 40% !important;
    max-width: 40% !important;
    min-width: 0 !important;
}

.search-text-col {
    width: 40% !important;
    flex: 0 0 40% !important;
    max-width: 40% !important;
    min-width: 0 !important;
    padding-left: 30px !important;
    border-left: 1px solid #e3e3e3 !important;
    box-sizing: border-box !important;
}

.search-text-col h3 {
    margin: 0 0 15px 0 !important;
    font-size: 1.6rem !important;
    font-weight: bold !important;
}

.search-text-col .search-text {
    margin: 0 !important;
    font-size: 1.4rem !important;
    color: #5a5a5a !important;
    line-height: 1.6 !important;
}

.search-text-col .size-case {
    margin: 0 !important;
}

.search-text-col .size-img {
    max-width: 100px !important;
    flex-shrink: 0 !important;
}

/* Hide labels in the search modal forms */
.search-modal__form label,
.search-modal__form .field__label,
label[for="Search-In-Modal"],
.visually-hidden {
    display: none !important;
}

/* Match the keyword search input font size and padding to standard forms */
.mega-menu .search__input {
    font-size: 1.8rem !important;
    padding: var(--input-padding-block, 0.8rem) var(--input-padding-inline, 1.6rem) !important;
}

/* Mobile Drawer Navigation Overrides */
.menu-drawer__item-link,
.accordion__summary {
    font-family: var(--secondary-font) !important;
}

.menu-drawer__item-link {
    padding-block: 0 !important;
}

/* Ensure mobile menu drawer h3 elements and accordion h3 elements use the secondary font */
.menu-drawer h3,
.menu-drawer .h3,
.menu-drawer .accordion h3,
.menu-drawer .accordion .h3 {
    font-family: var(--secondary-font) !important;
}


/* ==========================================================================
   4. General Content & Layout
   ========================================================================== */

/* Remove rounding on image card containers */
.image-card__media-wrapper {
    border-radius: 0 !important;
}

/* Hide breadcrumbs navigation on mobile */
@media (max-width: 767px) {
    .breadcrumbs {
        display: none;
    }
}


/* ==========================================================================
   5. Footer
   ========================================================================== */
/* No specific footer styling defined currently */


/* ==========================================================================
   6. Collection / Category Pages
   ========================================================================== */

/* Hide search and filter facets toolbar on desktop viewports */
@media (min-width: 768px) {
    .facet-toolbar {
        display: none;
    }
}


/* ==========================================================================
   7. Product Elements (Cards & Details Pages)
   ========================================================================== */

/* --- Product Cards --- */

/* Enforce square ratio and center items in product cards */
.product-card__media {
    background: var(--light-grey);
    padding: 0;
    width: 100%;
    aspect-ratio: 1 / 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Stretch the inner anchor and container to fill product card boundary */
.product-card__media > a,
.product-card__media .media {
    display: block;
    width: 100%;
    height: 100%;
}

/* Image containment rules for product listings */
.product-card .media__image {
    object-fit: contain;
    filter: brightness(0.96);
}

.product-card__title {line-height: 1;}
.search-drawer .variant-count, .search-drawer .interior-dimensions {display: none;}
.search-drawer .swiper-slide {margin-right: 1px !important;}

@media (max-width: 767px) {
    /* Responsive sizing adjustments for small-screen product cards */
    .product-card__title {
        line-height: 1.4;
    }
    .product-card__title .reversed-link__text {
        font-size: 1.4rem !important;
    }
    .product-card__title .h6 {
        font-size: 1.2rem;
        line-height: 1;
    }
}

@media (min-width: 768px) {
    /* Desktop-scale typography for product cards */
    .product-card__title .h6 {
        font-size: 2rem;
        line-height: 1;
    }
    .search-drawer .product-card__title .h6 {
        font-size: 1.4rem;
        line-height: 1;

}

/* --- Product Details / Single Product Page --- */

/* Product detail accordion headers styling */
.accordion__summary-text {
    font-family: var(--secondary-font);
    text-transform: uppercase; 
}

/* Media galleries & thumbnail lists */
.media-gallery {
    background: var(--light-grey);
}

.media-gallery__carousel-thumbnails {
    padding: 0 3rem 2rem 3rem;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
}

.media-gallery .media__image {
    object-fit: cover;
    filter: brightness(0.96);
}

.product-media {
    aspect-ratio: 1 / 1;  
}

@media (max-width: 767px) {
    /* Mobile-only optimizations for product layout blocks */
    .product-information__details .group-block {
        padding: 0;
    }
    .skb-accordion-group .title {
        display: none !important;
    }
    .rsAddToCartForm {
        padding-bottom: 10px;
    }
}

@media (min-width: 768px) {
    /* Desktop-only grid sizing and width optimizations for the product detail layout */
    .product-information__grid.product-information__grid--media-left:has(.media-gallery--extend) {
        grid-column: 1 / 4 !important;
    }
    .product-information__details .group-block {
        max-width: 500px;
    }
    .variant-picker__form, 
    .variant-picker {
        width: 80%;
    }
}

.downloads-grid .btn {width: 100%;}

/* ==========================================================================
   8. Pages, Tabs & Custom Elements
   ========================================================================== */

/* Mobile responsive tab switcher columns & grid panel alignments */
@media (max-width: 767px) {
    .product-tabs__grid {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }
    .product-tabs__grid.overview-grid,
    .product-tabs__grid.specs-grid,
    .product-tabs__grid.downloads-grid {
        grid-template-columns: 1fr !important;
    }
    .tabs__panels {
        width: 100% !important;
        padding: 0 !important;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
    }
    .tabs__panel {
        width: 100% !important;
    }
}

/* Off-screen Render Performance Optimization */
.tabs__panels,
.product-tabs__grid {
    content-visibility: auto;
    contain-intrinsic-size: 1px 500px;
}

/* ==========================================================================
   9. Advanced Search Modal and Tabs
   ========================================================================== */

/* Search modal dialog background and positioning */
.search-modal.modal__content.gradient {
    min-height: max-content;
    display: block;
    top: -33px;
    padding: 20px;
    background-color: transparent;
    z-index: 99;
}
.search__input {font-size: 2rem;}
.btn-search {margin-top: 1px;}
.reset__button {display:none;}
/* Search tabs buttons and tab switcher */
.search-tabs .tab-buttons .tab-btn {
    padding: 13px 27px !important;
    background-color: #d9d9d9;
    color: #000;
    font-size: 14px;
    border-radius: 0; /* Keep rectangular theme styling */
    cursor: pointer;
    transition: background .3s;
    text-transform: capitalize;
    min-height: auto;
}

.search-tabs .tab-buttons .tab-btn:hover,
.search-tabs .tab-buttons .tab-btn.active {
    background-color: var(--btn-hover);
    color: var(--text-white);
}

.search-tabs .tab-buttons {
    display: flex;
    gap: 15px;
    margin-bottom: 33px;
    justify-content: center;
}

.search-tabs .tab-btn:last-child {
    border-right: none;
}

.america-made-block {
    text-align: right;
}

.america-made-block h4 {
    font-size: 10px;
    margin-bottom: 0;
}

.america-made-block img {
    height: auto;
}

/* Tab content visibility toggle states */
.search-tabs .tab-content {
    display: none;
}

.search-tabs .tab-content.active {
    display: block;
}

.search-tabs #tab1 {
    margin-bottom: 20px;
}

/* Popular search terms pills */
.search-tab-list a {
    background: transparent;
    color: #5A5A5A;
    border: 1px solid #5A5A5A;
    font-size: 13px;
    text-transform: capitalize;
    display: inline-block;
    padding: 6px 12px;
    text-decoration: none;
    font-family: var(--secondary-font);
    line-height: 1.1;
    border-radius: 0; /* Keep rectangular theme styling */
}

.search-tab-list {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    align-items: start;
}

.search-tab-list a:hover {
    background-color: var(--btn-hover);
    color: var(--text-white);
}

/* Close button and container layout of the search modal */
.search-modal .search-modal__close-button {
    border-radius: 0; /* Keep rectangular theme styling */
    right: 1rem;
    position: absolute;
    top: 1rem;
}

.search-modal .search-modal__close-button:hover {
    background-color: #00000012;
}

.search-modal-body {
    background-color: #fff;
    border-radius: 0; /* Keep rectangular theme styling */
    padding: 20px;
    position: relative;
}

.header__search details[open] .modal-overlay:after {
    top: -4px;
}

.search-modal-body .search-modal__content {
    justify-content: start;
    margin-bottom: 17px;
    padding: 0;
}

.search-modal-body .page-width {
    padding: 0 3rem;
}

/* Grid layout for search item selectors */
.search-modal-body .grid-col-3 {
    display: flex;
    gap: 15px;
    align-items: start;
    justify-content: center;
}

.search-modal-body .grid-col-3 .search-itm {
    width: calc(100% - 40px);
    line-height: 1.3;
}

.search-itm select {
    background-image: url('data:image/svg+xml,<svg width="10" height="6" viewBox="0 0 10 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.800049 0.799805L4.80005 4.7998L8.80005 0.799805" stroke="%231E1E1E" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg>') !important;
    background-position: right 15px center;
    background-repeat: no-repeat;
    background-size: 12px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
}

.search-itm select,
.search-itm input {
    padding: 10px 15px;
    border-radius: 0; /* Keep rectangular theme styling */
    font-size: 18px;
    width: 100%;
    border: 1px solid #e3e3e3;
}

.search-itm select:focus,
.search-itm input:focus {
    border-color: var(--btn-hover);
}

.search-modal-body .search-itm.search-btn {
    width: auto;
}

.search-btn .btn-search {
    min-height: auto;
    padding: 11px 23px;
}

.search-text {
    line-height: 1.3;
}

.size-case {
    display: flex;
    gap: 30px;
    align-items: center;
    margin-top: 10px;
    flex-direction: column;
}

.size-case .size-img {
    min-width: calc(11vw);
}

.size-case .size-img img {
    width: 100%;
}

/* Responsive styles for media viewports */
@media (max-width: 1850px) {
    .search-tabs #tab1 {
        margin-bottom: 20px;
    }
}

@media (max-width: 992px) {
    .search-modal-body .page-width {
        padding: 0;
    }
    
    .search-tabs .tab-buttons .tab-btn {
        padding: 10px 17px !important;
    }
    
    .search-tab-list a {
        padding: 10px 17px;
        font-size: 14px;
    }
    
    .search-tab-list {
        margin-bottom: 20px;
        gap: 7px;
    }
    
    .search-modal.modal__content.gradient {
        top: -15px;
    }
    
    .search-tabs .tab-buttons {
        flex-wrap: wrap;
        justify-content: start;
    }
    
    .search-modal .search-modal__close-button {
        top: 1rem;
        height: 3rem;
        width: 3rem;
    }
}

@media (max-width: 767px) {
    .search-modal.modal__content.gradient {
        padding: 15px;
    }
    
    .search-tabs .tab-buttons {
        gap: 7px;
        width: 100%;
        max-width: 92%;
    }
    
    .search-modal-body {
        padding: 15px;
    }
    
    .america-made-block img {
        max-width: 200px;
    }
    
    .search-modal-body .grid-col-3 {
        flex-wrap: wrap;
        justify-content: space-between;
    }
    
    .search-modal-body .grid-col-3 .search-itm {
        width: 47%;
        gap: 10px;
    }
    
    .size-case {
        margin-top: 50px;
        flex-wrap: wrap;
        gap: 10px;
    }
    
    .size-case .size-img {
        width: 100%;
        max-width: 50%;
        margin: 0 auto;
    }
}

/* ==========================================================================
   Variation Products Swatches (Nanuk Style)
   ========================================================================== */
.variation-products-option {
    margin-bottom: 1.5rem;
}

.variation-products-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.variation-product-swatch {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 68px !important;
    height: 68px !important;
    min-width: 68px !important;
    min-height: 68px !important;
    aspect-ratio: 1 / 1 !important;
    padding: 4px !important;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background-color: #ffffff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
    text-decoration: none;
    overflow: hidden;
    box-sizing: border-box;
}

.variation-product-swatch img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 4px;
}

.variation-product-swatch:hover {
    border-color: #000000;
}

.variation-product-swatch.is-active {
    border: 2px solid #000000;
    box-shadow: 0 0 0 1px #000000;
}

.variation-product-swatch__fallback {
    font-size: 10px;
    text-align: center;
    color: #333;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}