/* Storefront: never show PageBuilder edit controls unless editor mode is on the body */
body:not(.pagebuilder-mode) .block-edit-pencil,
body:not(.pagebuilder-mode) .block-admin-toggle,
body:not(.pagebuilder-mode) .block-move-up,
body:not(.pagebuilder-mode) .block-move-down,
body:not(.pagebuilder-mode) .block-admin-wrapper > .block-admin-menu,
body:not(.pagebuilder-mode) .block-admin-wrapper > button,
body:not(.pagebuilder-mode) .inline-block-wrapper[data-block-id] > button,
body:not(.pagebuilder-mode) .inline-block-wrapper[data-block-id] > .block-admin-menu {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Hide dashed block wrappers and sample-preview blocks unless PageBuilder edit mode (brush) is on */
body:not(.pagebuilder-mode) .block-admin-wrapper:not([data-qf-has-background="1"]) {
    border: none !important;
    background-color: transparent !important;
}

/* Empty inline blocks: hidden on storefront until PageBuilder mode is toggled on */
body:not(.pagebuilder-mode) .inline-block-wrapper.inline-block-empty,
body:not(.pagebuilder-mode) .page-body-block[data-block-slug="Inline"]:has(.inline-block-empty),
body:not(.pagebuilder-mode) .block-admin-wrapper[data-block-slug="Inline"]:has(.inline-block-empty) {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Hidden blocks: storefront guests never receive this HTML; editors (has-pagebuilder-bar) always see them greyed */
body:not(.has-pagebuilder-bar) .block-admin-wrapper[data-block-visible="0"],
body:not(.has-pagebuilder-bar) .block-admin-wrapper.block-hidden {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
}

/* PageBuilder editors: hidden blocks always visible (greyed), including before the bar is toggled open */
body.has-pagebuilder-bar .block-admin-wrapper.block-hidden,
body.has-pagebuilder-bar .block-admin-wrapper[data-block-visible="0"],
body.has-pagebuilder-bar .page-body-block[data-page-body-block]:has(> .block-admin-wrapper[data-block-visible="0"]),
body.has-pagebuilder-bar .page-body-block[data-page-body-block]:has(> .block-admin-wrapper.block-hidden),
body.has-pagebuilder-bar .page-body-block[data-page-body-block] > .block-admin-wrapper.block-hidden,
body.has-pagebuilder-bar .page-body-block[data-page-body-block] > .block-admin-wrapper[data-block-visible="0"],
html.pagebuilder-bar-open .block-admin-wrapper.block-hidden,
html.pagebuilder-bar-open .block-admin-wrapper[data-block-visible="0"],
html.pagebuilder-bar-open .page-body-block[data-page-body-block]:has(> .block-admin-wrapper[data-block-visible="0"]),
html.pagebuilder-bar-open .page-body-block[data-page-body-block]:has(> .block-admin-wrapper.block-hidden),
html.pagebuilder-bar-open .page-body-block[data-page-body-block] > .block-admin-wrapper.block-hidden,
html.pagebuilder-bar-open .page-body-block[data-page-body-block] > .block-admin-wrapper[data-block-visible="0"],
body.pagebuilder-mode .block-admin-wrapper.block-hidden,
body.pagebuilder-mode .block-admin-wrapper[data-block-visible="0"],
body.pagebuilder-mode .container-column .block-admin-wrapper.block-hidden,
body.pagebuilder-mode .container-column .block-admin-wrapper[data-block-visible="0"],
body.pagebuilder-mode .layout-footer-blocks .block-admin-wrapper.block-hidden,
body.pagebuilder-mode .layout-footer-blocks .block-admin-wrapper[data-block-visible="0"],
body.pagebuilder-mode .layout-header-blocks .block-admin-wrapper.block-hidden,
body.pagebuilder-mode .layout-header-blocks .block-admin-wrapper[data-block-visible="0"],
body.pagebuilder-mode .page-body-block[data-page-body-block]:has(> .block-admin-wrapper[data-block-visible="0"]),
body.pagebuilder-mode .page-body-block[data-page-body-block]:has(> .block-admin-wrapper.block-hidden),
body.pagebuilder-mode .page-body-block[data-page-body-block] > .block-admin-wrapper.block-hidden,
body.pagebuilder-mode .page-body-block[data-page-body-block] > .block-admin-wrapper[data-block-visible="0"] {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}

body.has-pagebuilder-bar .block-admin-wrapper.block-hidden,
body.has-pagebuilder-bar .block-admin-wrapper[data-block-visible="0"] {
    outline: 2px dashed #ffc107;
    outline-offset: -2px;
    position: relative;
}

body.has-pagebuilder-bar .page-body-block[data-page-body-block] > .block-admin-wrapper.block-hidden .page-block-hidden-content,
body.has-pagebuilder-bar .page-body-block[data-page-body-block] > .block-admin-wrapper[data-block-visible="0"] .page-block-hidden-content,
html.pagebuilder-bar-open .page-body-block[data-page-body-block] > .block-admin-wrapper.block-hidden .page-block-hidden-content,
html.pagebuilder-bar-open .page-body-block[data-page-body-block] > .block-admin-wrapper[data-block-visible="0"] .page-block-hidden-content,
body.pagebuilder-mode .page-body-block[data-page-body-block] > .block-admin-wrapper.block-hidden .page-block-hidden-content,
body.pagebuilder-mode .page-body-block[data-page-body-block] > .block-admin-wrapper[data-block-visible="0"] .page-block-hidden-content {
    display: block !important;
    visibility: visible !important;
    position: relative;
    opacity: 0.55;
}

body.has-pagebuilder-bar .page-body-block[data-page-body-block] > .block-admin-wrapper.block-hidden .page-block-hidden-content::before,
body.has-pagebuilder-bar .page-body-block[data-page-body-block] > .block-admin-wrapper[data-block-visible="0"] .page-block-hidden-content::before,
html.pagebuilder-bar-open .page-body-block[data-page-body-block] > .block-admin-wrapper.block-hidden .page-block-hidden-content::before,
html.pagebuilder-bar-open .page-body-block[data-page-body-block] > .block-admin-wrapper[data-block-visible="0"] .page-block-hidden-content::before,
body.pagebuilder-mode .page-body-block[data-page-body-block] > .block-admin-wrapper.block-hidden .page-block-hidden-content::before,
body.pagebuilder-mode .page-body-block[data-page-body-block] > .block-admin-wrapper[data-block-visible="0"] .page-block-hidden-content::before {
    content: 'Hidden';
    position: absolute;
    top: 6px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.65);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 4px;
    letter-spacing: 0.02em;
    z-index: 2;
    pointer-events: none;
}

body:not(.pagebuilder-mode) .service-feature-cards-block--placeholder,
body:not(.pagebuilder-mode) .ifc-section--placeholder,
body:not(.pagebuilder-mode) .editorialgrid-section--placeholder,
body:not(.pagebuilder-mode) .slideshow-information-section--placeholder,
body:not(.pagebuilder-mode) .photo-gallery--placeholder-preview,
body:not(.pagebuilder-mode) .video-gallery--placeholder-preview,
body:not(.pagebuilder-mode) .document-gallery--placeholder-preview,
body:not(.pagebuilder-mode) .instagram-feed--placeholder-preview,
body:not(.pagebuilder-mode) .blog-recent-posts-block--placeholder,
body:not(.pagebuilder-mode) .blog-details-block--placeholder,
body:not(.pagebuilder-mode) .blog-lists-block--placeholder,
body:not(.pagebuilder-mode) .blog-posts-carousel-block--placeholder,
body:not(.pagebuilder-mode) .testimonials-block--placeholder {
    display: none !important;
}

/* Empty Map block: no gap on storefront until PageBuilder edit mode or real map content */
body:not(.pagebuilder-mode) .page-body-block[data-block-slug="Map"]:not(:has([data-has-map-content="1"])),
body:not(.pagebuilder-mode) .block-admin-wrapper[data-block-slug="Map"]:not(:has([data-has-map-content="1"])),
body:not(.pagebuilder-mode) .map-block:not([data-has-map-content="1"]) {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

body.pagebuilder-mode .page-body-block[data-block-slug="Map"],
body.pagebuilder-mode .block-admin-wrapper[data-block-slug="Map"] {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}

/* Catalog sort / per-page dropdowns (Products with Filters toolbar) */
.catalog-sort-controls .dropdown-menu.filter-dropdown {
    animation: none !important;
    transform: none !important;
}

/* Storefront: hide pagebuilder-only hints (Edit menu, Edit form, etc.) unless editor mode is on */
.pagebuilder-only {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
}

body.pagebuilder-mode .pagebuilder-only {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
}

body.pagebuilder-mode .pb-gallery-edit-hint,
body.pagebuilder-mode .pb-form-edit-hint {
    display: inline-flex !important;
    align-items: center;
    height: auto !important;
    overflow: visible !important;
    pointer-events: none;
}

body.pagebuilder-mode .pagebuilder-only.categories-admin-placeholder {
    display: block !important;
}

body.pagebuilder-mode .pagebuilder-only.menuitems-admin-placeholder,
body.pagebuilder-mode .pagebuilder-only.pages-admin-placeholder {
    display: block !important;
    flex-direction: unset;
}

.menuitems-admin-placeholder,
.pages-admin-placeholder {
    border: 2px dashed #ccc;
    padding: 20px;
    text-align: center;
    background: #f9f9f9;
    margin: 20px 0;
    width: 100%;
}

.menuitems-admin-placeholder h3,
.pages-admin-placeholder h3 {
    color: #666;
    margin-bottom: 10px;
    font-size: 1.1rem;
}

.menuitems-admin-placeholder p,
.pages-admin-placeholder p {
    color: #888;
    margin-bottom: 0;
}

body:not(.pagebuilder-mode) .menuitems-block-empty,
body:not(.pagebuilder-mode) .page-body-block[data-block-slug="MenuItems"]:has(.menuitems-block-empty),
body:not(.pagebuilder-mode) .block-admin-wrapper[data-block-slug="MenuItems"]:has(.menuitems-block-empty) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
}

.parallax-img {
    background-image: url('/theme/defaultlaravel/assets/images/HEADER-BACKGROUND.png');
    /* Parallax effect properties */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

    /* Add some minimum height to make the effect visible */
    min-height: 500px;
}

.image-container-zoom {
    overflow: hidden; /* This clips the zoomed image to stay within bounds */
}

.zoom-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
    filter: grayscale(0.3);
}

/* Image block layout settings override generic .zoom-image rules */
.image-block-container.image-width-auto .zoom-image,
.image-block-container.image-width-custom .zoom-image {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    object-fit: contain !important;
    filter: none;
}

.image-block-container.image-width-auto .zoom-image:hover,
.image-block-container.image-width-custom .zoom-image:hover {
    transform: none;
    filter: none;
}

.layout-footer-blocks .image-block-container.image-width-custom .image-container-zoom,
.layout-footer-blocks .image-block-container.image-width-custom .image-link,
.footer-container-content .image-block-container.image-width-custom .image-container-zoom,
.footer-container-content .image-block-container.image-width-custom .image-link,
.layout-footer-blocks .image-block-container.image-width-auto .image-container-zoom,
.layout-footer-blocks .image-block-container.image-width-auto .image-link,
.footer-container-content .image-block-container.image-width-auto .image-container-zoom,
.footer-container-content .image-block-container.image-width-auto .image-link {
    width: var(--image-layout-width, auto) !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
}

.zoom-image:hover {
    transform: scale(1.25);
    filter: grayscale(0);
}

/* Force primary button text to white - only for primary buttons */
.btn.btn-primary,
.btn.btn-primary:hover,
.btn.btn-primary:focus,
.btn.btn-primary:active {
    color: #ffffff !important;
}

.hideOnDesktop {
    display: none;
}

@media (max-width: 767px) {
    .hideOnDesktop {
        display: block;
    }
}

.hideOnMobile {
    display: block;
}

@media (max-width: 767px) {
    .hideOnMobile {
        display: none;
    }
}

/* Wishlist heart icon styles - ONLY controls color and fill */
.heart_filled {
    color: #ff0000 !important;
    fill: #ff0000 !important;
}

/* Make sure heart_filled works with any FontAwesome heart class */
i.heart_filled::before {
    color: #ff0000 !important;
    font-weight: 900 !important; /* Make it solid/filled */
}

/* Block heading margin: apply to all blocks with title (override theme custom CSS) */
.pb-block-heading {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
}
section .section-title,
section[data-block-type] .section-title,
.pb-block-heading .section-title {
    margin-top: 0.75rem !important;
    margin-bottom: 0.75rem !important;
}
.pb-block-heading .section-title {
    margin: 0.75rem 60px !important;
}
@media (max-width: 767px) {
    .pb-block-heading {
        margin-top: 0.85rem;
        margin-bottom: 0.85rem;
    }
    section .section-title,
    section[data-block-type] .section-title,
    .pb-block-heading .section-title {
        margin: 0.6rem 10px !important;
    }
}

/* Block headings & card titles — driven by Setup Wizard → Styling → Block & Card Titles */
section[data-block-type] .section-title,
.pb-block-heading .section-title,
.categories-section-title,
.slideshow-block-header .section-title {
    font-weight: var(--wizard-block-section-title-weight, 400) !important;
    color: var(--wizard-block-section-title-color, var(--wizard-h3-color, #5c5c5c)) !important;
    letter-spacing: var(--wizard-block-section-title-letter-spacing, 0.05em);
    font-size: var(--wizard-block-section-title-size, 1.1rem) !important;
    text-transform: var(--wizard-block-section-title-transform, none);
}
section[data-block-type] .section-title::before,
section[data-block-type] .section-title::after,
.pb-block-heading .section-title::before,
.pb-block-heading .section-title::after,
.categories-section-title::before,
.categories-section-title::after,
.slideshow-block-header .section-title::before,
.slideshow-block-header .section-title::after {
    background: color-mix(in srgb, var(--wizard-block-section-title-color, var(--wizard-h3-color, #5c5c5c)) var(--wizard-block-section-title-line-mix, 30%), transparent) !important;
    height: 1px !important;
}
section[data-block-type] .section-subtitle,
.pb-block-heading .section-subtitle,
.slideshow-block-header .section-subtitle {
    color: color-mix(in srgb, var(--wizard-default-text-color, #6b6560) 75%, transparent) !important;
    font-weight: 400;
}
.entity-card-title-outside h5,
.entity-card-title-outside a,
.category-title h5,
.category-title h6,
.category-title a {
    font-weight: var(--wizard-card-title-weight, 400) !important;
    color: var(--wizard-card-title-color, var(--wizard-default-text-color, #6b6560)) !important;
    font-size: var(--wizard-card-title-size, 0.875rem);
    letter-spacing: var(--wizard-card-title-letter-spacing, 0.05em);
    text-transform: var(--wizard-card-title-transform, none);
}
/* Categories block: do not inherit theme card-title uppercase; block Appearance controls casing */
section[data-block-type="categories"] .entity-card-title-outside,
section[data-block-type="categories"] .entity-card-title-outside h5,
section[data-block-type="categories"] .entity-card-title-outside a,
section[data-block-type="categories"] .category-title,
section[data-block-type="categories"] .category-title h5,
section[data-block-type="categories"] .entity-card-overlay h5 {
    text-transform: none !important;
}
.product-title a.text-dark,
.product-title a.fw-bold,
.product-title a,
.topbar-product-card .product-title a {
    font-weight: var(--wizard-product-card-title-weight, 400) !important;
    color: var(--wizard-product-card-title-color, var(--wizard-default-text-color, #6b6560)) !important;
    font-size: var(--wizard-product-card-title-size, 1rem);
}
.product-title a,
.product-card-title-link {
    font-weight: var(--wizard-product-card-title-weight, 400) !important;
    color: var(--wizard-product-card-title-color, var(--wizard-default-text-color, #6b6560)) !important;
    font-size: var(--wizard-product-card-title-size, 1rem);
}
.product-card-brand-link,
.topbar-product-card .brand a.product-card-brand-link {
    font-weight: var(--wizard-product-brand-title-weight, 700) !important;
    font-size: var(--wizard-product-brand-title-size, 0.8125rem);
    color: var(--wizard-product-card-title-color, var(--wizard-default-text-color, #6b6560));
    letter-spacing: var(--wizard-card-title-letter-spacing, 0.04em);
    text-decoration: none;
}

/* Mobile: full-width layout – no left/right gaps (header, content, carousels) */
@media (max-width: 768px) {
    /* Remove side gaps from all containers – use full width with minimal padding */
    .container,
    .container-fluid:not(.categories-content--full-bleed):not(.options-content--full-bleed),
    .main-content .container,
    body .container,
    body .container-fluid:not(.categories-content--full-bleed):not(.options-content--full-bleed) {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    /* Header/navbar – full width */
    .navbar .container-fluid,
    .header-container .container-fluid,
    nav .container-fluid {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
    [data-block-type] .container,
    section[data-block-type] .container {
        padding-left: 0 !important;
    }
    [data-block-type] .container > .row,
    section[data-block-type] .container > .row,
    .container-block-wrapper.container > .container-block-row,
    .container-block-wrapper.container > .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .container-block-wrapper .container-column section[data-block-type] .container > .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    /* Keep title row with padding for readability */
    [data-block-type] .container > .row.justify-content-center,
    section[data-block-type] .container > .row.justify-content-center {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    /* Carousel rows: first cell no left padding so content starts at edge */
    [data-block-type] .tranding-card > [class*="col-"]:first-child,
    [data-block-type] .slideshow-grid-row > [class*="col-"]:first-child,
    [data-block-type] .slideshow-carousel-row > [class*="col-"]:first-child,
    [data-block-type] .slideshow-carousel-row > div:first-child,
    section[data-block-type] .tranding-card > [class*="col-"]:first-child,
    section[data-block-type] .slideshow-grid-row > [class*="col-"]:first-child,
    section[data-block-type] .slideshow-carousel-row > [class*="col-"]:first-child,
    section[data-block-type] .slideshow-carousel-row > div:first-child {
        padding-left: 0 !important;
    }
    section[data-block-type="categories"] .categories-content--full-bleed .entity-list-grid.row > [class*="col-"]:first-child {
        padding-left: 0 !important;
    }
    section[data-block-type="categories"] .categories-content--full-bleed .entity-list-grid.row > [class*="col-"]:last-child {
        padding-right: 0 !important;
    }
    section[data-block-type="categories"] > .categories-content--full-bleed {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* ========================================
   BLOCK CONTENT – FIX WRONG LEFT PADDING
   Page body blocks (New Arrivals, etc.) use .container; avoid excessive left
   space. Use minimal horizontal padding and no extra left padding on first column.
   ======================================== */
.main-content .block-admin-wrapper .container:not(.categories-content--full-bleed):not(.options-content--full-bleed),
.main-content .block-admin-wrapper .container-fluid:not(.categories-content--full-bleed):not(.options-content--full-bleed) {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    box-sizing: border-box !important;
}
/* First column/cell in carousel/grid rows: no left padding so content starts at block edge */
.main-content .block-admin-wrapper .tranding-card > [class*="col-"]:first-child,
.main-content .block-admin-wrapper .slideshow-grid-row > [class*="col-"]:first-child,
.main-content .block-admin-wrapper .tranding-card > .flickity-cell:first-child,
.main-content .block-admin-wrapper [class*="carousel"] > [class*="col-"]:first-child {
    padding-left: 0 !important;
}
.main-content .block-admin-wrapper .tranding-card.row { margin-left: 0 !important; margin-right: 0 !important; }
.main-content .block-admin-wrapper .tranding-card.flickity-enabled .flickity-viewport { padding-left: 0 !important; }
.main-content .block-admin-wrapper .tranding-card .flickity-cell:first-child { padding-left: 0 !important; }
/* Categories / OptionList carousels: keep slight inset so circle tiles are not clipped at block edges */
.main-content .block-admin-wrapper .categories-carousel-section .tranding-card .flickity-cell:first-child,
.layout-header-blocks .block-admin-wrapper .categories-carousel-section .tranding-card .flickity-cell:first-child,
.layout-footer-blocks .block-admin-wrapper .categories-carousel-section .tranding-card .flickity-cell:first-child,
.main-content .block-admin-wrapper .options-carousel-section:not(.options-carousel-section--contained) .tranding-card .flickity-cell:first-child,
.layout-header-blocks .block-admin-wrapper .options-carousel-section:not(.options-carousel-section--contained) .tranding-card .flickity-cell:first-child,
.layout-footer-blocks .block-admin-wrapper .options-carousel-section:not(.options-carousel-section--contained) .tranding-card .flickity-cell:first-child {
    padding-left: 4px !important;
}
.main-content .block-admin-wrapper .options-carousel-section.options-carousel-section--contained .tranding-card .flickity-cell:first-child,
.main-content .block-admin-wrapper .options-carousel-section.options-carousel-section--contained .tranding-card .option-carousel-cell:first-child {
    padding-left: 0 !important;
}
.main-content .block-admin-wrapper:has(.options-carousel-section--contained) {
    overflow: hidden !important;
}
.layout-header-blocks .block-admin-wrapper .container,
.layout-header-blocks .block-admin-wrapper .container-fluid,
.layout-footer-blocks .block-admin-wrapper .container,
.layout-footer-blocks .block-admin-wrapper .container-fluid {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    box-sizing: border-box !important;
}

/* When heart is filled (in wishlist), make it solid red */
.facl.facl-heart-o.heart_filled,
.facl-heart-o.heart_filled {
    color: #ff0000 !important;
}

.facl.facl-heart-o.heart_filled::before,
.facl-heart-o.heart_filled::before {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important; /* solid/filled */
    content: "\f004" !important; /* heart */
    color: #ff0000 !important;
}

/* Ensure heart icons are visible and properly styled */
.far.fa-heart,
.facl.facl-heart-o,
.facl-heart-o {
    display: inline-block !important;
    font-size: 16px !important;
    color: #333 !important;
    cursor: pointer !important;
    transition: color 0.3s ease !important;
}

/* Heart icon hover effect */
.far.fa-heart:hover,
.facl.facl-heart-o:hover,
.facl-heart-o:hover {
    color: #ff0000 !important;
}

/* Make sure heart icons work in wishlist buttons */
.wishlist-btn i {
    display: inline-block !important;
    font-size: 16px !important;
}

/* Remove grey background and border from wishlist buttons - heart icon only */
.wishlist-btn,
.wishlist-btn:hover {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
}

/* Custom CSS for consistent badge styling */

/* Ensure cart and wishlist count badges have identical styling */
.navbar-custom .topbar-toolbar a .cart-count,
.navbar-custom .topbar-toolbar a .wishlist-count {
    position: absolute;
    top: -5px;
    right: -5px;
    z-index: 1;
    width: 15px;
    height: 15px;
    font-weight: 400;
    font-size: 10px;
    line-height: 15px;
    box-shadow: 1px 1px 3px 0 rgba(var(--bs-dark-rgb), 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: var(--header-badge-bg, #dc3545);
    color: var(--header-badge-text, #fff);
}

/* Mobile responsive adjustments */
@media (max-width: 991.98px) {
    .navbar-custom .topbar-toolbar a .cart-count,
    .navbar-custom .topbar-toolbar a .wishlist-count {
        width: 18px;
        height: 18px;
        font-size: 10px;
        line-height: 18px;
        top: -8px;
        right: -8px;
    }
}

/* Ensure consistent positioning for all badge containers */
.navbar-custom .topbar-toolbar a {
    position: relative;
}

/* Toolbar item display styles (icon, text link, CTA button, icon + text) */
.topbar-toolbar a.toolbar-item--button,
.navbar-custom .topbar-toolbar a.toolbar-item--button,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--button,
.header-menu-logo-left-block .topbar-toolbar a.toolbar-item--button,
.header-menu-search-toolbar-block .topbar-toolbar a.toolbar-item--button,
.header-menu-search-call-block .topbar-toolbar a.toolbar-item--button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1.25rem;
    font-weight: 600;
    font-size: 0.875rem;
    white-space: nowrap;
    text-decoration: none !important;
    line-height: 1.25;
    border: 2px solid var(--toolbar-btn-border, var(--toolbar-btn-bg, var(--header-accent, #6f42c1)));
    background-color: var(--toolbar-btn-bg, var(--header-accent, #6f42c1)) !important;
    color: var(--toolbar-btn-text, #ffffff) !important;
}

.topbar-toolbar a.toolbar-item--button-pill,
.navbar-custom .topbar-toolbar a.toolbar-item--button-pill,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--button-pill {
    border-radius: 999px;
}

.topbar-toolbar a.toolbar-item--button-rounded,
.navbar-custom .topbar-toolbar a.toolbar-item--button-rounded,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--button-rounded {
    border-radius: 0.375rem;
}

.topbar-toolbar a.toolbar-item--button-square,
.navbar-custom .topbar-toolbar a.toolbar-item--button-square,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--button-square {
    border-radius: 0;
}

.topbar-toolbar a.toolbar-item--button-outline,
.navbar-custom .topbar-toolbar a.toolbar-item--button-outline,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--button-outline {
    background-color: transparent !important;
    color: var(--toolbar-btn-text, var(--toolbar-btn-bg, var(--header-accent, #6f42c1))) !important;
}

.topbar-toolbar a.toolbar-item--button:hover,
.navbar-custom .topbar-toolbar a.toolbar-item--button:hover,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--button:hover,
.header-menu-logo-left-block .topbar-toolbar a.toolbar-item--button:hover,
.header-menu-search-toolbar-block .topbar-toolbar a.toolbar-item--button:hover,
.header-menu-search-call-block .topbar-toolbar a.toolbar-item--button:hover {
    opacity: 0.92;
    color: var(--toolbar-btn-text, #ffffff) !important;
}

.topbar-toolbar a.toolbar-item--button-outline:hover,
.navbar-custom .topbar-toolbar a.toolbar-item--button-outline:hover,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--button-outline:hover {
    background-color: var(--toolbar-btn-bg, var(--header-accent, #6f42c1)) !important;
    color: var(--toolbar-btn-text, #ffffff) !important;
}

.topbar-toolbar a.toolbar-item--text,
.navbar-custom .topbar-toolbar a.toolbar-item--text,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--text {
    font-weight: 500;
    text-decoration: none !important;
    white-space: nowrap;
    color: var(--header-main-text, inherit) !important;
}

.topbar-toolbar a.toolbar-item--text:hover,
.navbar-custom .topbar-toolbar a.toolbar-item--text:hover,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--text:hover {
    color: var(--header-link-hover, var(--header-accent, inherit)) !important;
}

.topbar-toolbar a.toolbar-item--info,
.navbar-custom .topbar-toolbar a.toolbar-item--info,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--info {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none !important;
    color: inherit !important;
}

.topbar-toolbar a.toolbar-item--info .toolbar-item__icon-wrap,
.navbar-custom .topbar-toolbar a.toolbar-item--info .toolbar-item__icon-wrap,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--info .toolbar-item__icon-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    background-color: var(--header-call-icon-bg, #f0f0f0);
    color: var(--header-accent, #e85d04) !important;
    flex-shrink: 0;
}

.topbar-toolbar a.toolbar-item--info .toolbar-item__label,
.navbar-custom .topbar-toolbar a.toolbar-item--info .toolbar-item__label,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--info .toolbar-item__label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--header-accent, #e85d04) !important;
    line-height: 1.2;
    display: block;
}

.topbar-toolbar a.toolbar-item--info .toolbar-item__secondary,
.navbar-custom .topbar-toolbar a.toolbar-item--info .toolbar-item__secondary,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--info .toolbar-item__secondary {
    font-size: 1rem;
    font-weight: 700;
    color: var(--header-call-phone, var(--header-main-text, #222)) !important;
    line-height: 1.2;
    display: block;
    white-space: nowrap;
}

.topbar-toolbar a.toolbar-item--info:hover .toolbar-item__secondary,
.navbar-custom .topbar-toolbar a.toolbar-item--info:hover .toolbar-item__secondary,
#kalles-section-header_top .topbar-toolbar a.toolbar-item--info:hover .toolbar-item__secondary {
    color: var(--header-accent, #e85d04) !important;
}

.header-menu-search-toolbar-block .hmst-toolbar-icon.toolbar-item--button,
.header-menu-search-toolbar-block .topbar-toolbar > a.toolbar-item--button {
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0.5rem 1.25rem !important;
    font-size: 0.875rem !important;
}

.header-menu-search-toolbar-block .hmst-toolbar-icon.toolbar-item--info,
.header-menu-search-toolbar-block .topbar-toolbar > a.toolbar-item--info {
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
}

.toolbar-button-preview-wrap {
    min-width: 100%;
    flex-basis: 100%;
}
.toolbar-button-preview-wrap .toolbar-button-preview-label {
    font-size: 0.75rem;
    color: #6c757d;
    margin-bottom: 0.25rem;
}
.toolbar-button-preview {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.45rem 1rem;
    font-weight: 600;
    font-size: 0.8125rem;
    border: 2px solid var(--toolbar-btn-border, var(--toolbar-btn-bg, #6f42c1));
    background-color: var(--toolbar-btn-bg, #6f42c1);
    color: var(--toolbar-btn-text, #ffffff);
    pointer-events: none;
}
.toolbar-button-preview.toolbar-item--button-pill { border-radius: 999px; }
.toolbar-button-preview.toolbar-item--button-rounded { border-radius: 0.375rem; }
.toolbar-button-preview.toolbar-item--button-square { border-radius: 0; }
.toolbar-button-preview.toolbar-item--button-outline {
    background-color: transparent;
    color: var(--toolbar-btn-text, var(--toolbar-btn-bg, #6f42c1));
}

/* Shopping cart quantity control (full cart page + checkout order review) */
.full-page-cart-control,
.cart-quantity-control {
    display: flex;
    align-items: center;
    height: 30px;
    overflow: hidden;
    border: 1px solid #e9ecef;
    border-radius: 4px;
}

.page-minus-btn,
.page-plus-btn,
.qty-minus-btn,
.qty-plus-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f8f9fa;
    border: none;
    padding: 0;
    width: 28px;
    height: 28px;
    font-size: 12px;
}

.full-page-cart-control input[name="quantity"],
.cart-quantity-control input[name="quantity"] {
    width: 32px;
    height: 28px;
    border: none;
    text-align: center;
    font-weight: 500;
    font-size: 13px;
    padding: 0;
    background: transparent;
}

.full-page-cart-control input[type=number]::-webkit-inner-spin-button,
.full-page-cart-control input[type=number]::-webkit-outer-spin-button,
.cart-quantity-control input[type=number]::-webkit-inner-spin-button,
.cart-quantity-control input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Cart table styling */
.quantity-btn {
    transition: all 0.2s ease;
    background-color: #007bff !important;
    border-color: #007bff !important;
    color: white !important;
    border-radius: 50% !important;
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: bold !important;
    font-size: 16px !important;
}

.quantity-btn:hover {
    transform: scale(1.1);
    background-color: #0056b3 !important;
    border-color: #0056b3 !important;
}

.quantity-btn:active {
    transform: scale(0.95);
}

.quantity-input {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    text-align: center;
    font-weight: bold;
    padding: 8px 12px;
    min-width: 60px;
    background-color: #f8f9fa;
}

/* Cart drawer/page qty fields must stay editable (theme sets .quantity input { display:flex } which blocks typing) */
.cart-qty-field,
.cart-quantity-control input[name="quantity"],
#shoppingCartOffcanvas .cart-quantity-control input[name="quantity"] {
    display: block !important;
    pointer-events: auto !important;
    cursor: text !important;
    -webkit-user-select: text !important;
    user-select: text !important;
}

/* Product detail page quantity */
.pdp-quantity-row .input-step {
    display: inline-flex !important;
    align-items: center;
    pointer-events: auto !important;
}

.pdp-quantity-row .input-step input.product-quantity {
    display: block !important;
    cursor: text !important;
    -webkit-user-select: text !important;
    user-select: text !important;
    min-width: 42px;
    pointer-events: auto !important;
}

.cart-service-item {
    background-color: #f8f9fa;
}

.cart-service-item td {
    border-color: #dee2e6;
}

/* Ensure prices are right-aligned */
.table td.text-end {
    text-align: right !important;
}

/* Responsive cart table */
@media (max-width: 768px) {
    .table-responsive {
        font-size: 0.9rem;
    }
    
    .quantity-btn {
        width: 28px !important;
        height: 28px !important;
    }
}

/* Hide badges when count is 0 */
.navbar-custom .topbar-toolbar a .cart-count:empty,
.navbar-custom .topbar-toolbar a .wishlist-count:empty,
.navbar-custom .topbar-toolbar a .cart-count[data-count="0"],
.navbar-custom .topbar-toolbar a .wishlist-count[data-count="0"] {
    display: none;
}

/* Logo consistency - ensure logos maintain same dimensions when scrolling */
.navbar-custom .navbar-brand img {
    max-height: 45px !important;
    max-width: 300px !important;
    width: auto !important;
    height: auto !important;
    transition: all 0.3s ease;
}

/* Ensure logo dimensions are consistent across all layouts */
.navbar-custom .navbar-brand img,
.navbar-custom.navbar-scroll .navbar-brand img {
    max-height: 45px !important;
    max-width: 300px !important;
    width: auto !important;
    height: auto !important;
}

/* Mobile logo consistency */
@media (max-width: 991.98px) {
    .navbar-custom .navbar-brand img {
        max-height: 46px !important;
        max-width: 220px !important;
        width: auto !important;
        height: auto !important;
    }

    .mobile-header-corners-row .mobile-header-logo-col .header-block-logo-link img,
    .mobile-header-corners-row .mobile-header-logo-col .header-block-logo-img,
    .compact-navbar .mobile-header-logo-col .header-block-logo-link img,
    .compact-navbar .mobile-header-logo-col .header-block-logo-img {
        max-height: 46px !important;
        max-width: 100% !important;
        width: auto !important;
        height: auto !important;
    }
    
    .navbar-custom.navbar-scroll .navbar-brand img {
        max-height: 46px !important;
        max-width: 220px !important;
        width: auto !important;
        height: auto !important;
    }
}

/* Extra small mobile devices */
@media (max-width: 576px) {
    .navbar-custom .navbar-brand img,
    .navbar-logo img {
        max-height: 42px !important;
        max-width: 200px !important;
        width: auto !important;
        height: auto !important;
    }

    .mobile-header-corners-row .mobile-header-logo-col .header-block-logo-link img,
    .mobile-header-corners-row .mobile-header-logo-col .header-block-logo-img,
    .compact-navbar .mobile-header-logo-col .header-block-logo-link img,
    .compact-navbar .mobile-header-logo-col .header-block-logo-img {
        max-height: 42px !important;
        max-width: 100% !important;
        width: auto !important;
        height: auto !important;
    }
    
    .navbar-logo span {
        font-size: 18px !important;
    }
}

/* Very small mobile devices */
@media (max-width: 400px) {
    .navbar-custom .navbar-brand img,
    .navbar-logo img {
        max-height: 38px !important;
        max-width: 180px !important;
        width: auto !important;
        height: auto !important;
    }

    .mobile-header-corners-row .mobile-header-logo-col .header-block-logo-link img,
    .mobile-header-corners-row .mobile-header-logo-col .header-block-logo-img,
    .compact-navbar .mobile-header-logo-col .header-block-logo-link img,
    .compact-navbar .mobile-header-logo-col .header-block-logo-img {
        max-height: 38px !important;
        max-width: 100% !important;
        width: auto !important;
        height: auto !important;
    }
    
    .navbar-logo span {
        font-size: 16px !important;
    }
}

/* Reduce logo container spacing on mobile */
@media (max-width: 991.98px) {
    .d-lg-none .row[class*="mb-"],
    .d-lg-none .row[style*="padding"] {
        margin-bottom: 0.5rem !important;
    }
    
    .d-lg-none .navbar-logo {
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .d-lg-none .col-12.d-flex.justify-content-center.align-items-center {
        padding: 0 !important;
    }
    
    /* Reduce container padding on mobile for logo area */
    .navbar-custom .container-fluid {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }
    
    /* Ensure navbar has minimal padding on mobile */
    .navbar-custom.py-0 {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}


/* Fix navigation underline gap between logo and nav links */
.navbar-custom .navbar-brand {
    position: relative;
    display: inline-block;
}

.navbar-custom .navbar-brand::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background-color: var(--bs-body-color);
    opacity: 0.7;
    transition: opacity 0.25s ease;
}

.navbar-custom .navbar-brand:hover::after {
    opacity: 1;
}

/* Ensure navigation links align with logo underline */
.navbar-custom .navbar-nav .nav-item .nav-link {
    position: relative;
    display: inline-block;
    font-size: 16px;
    line-height: 1.6;
    padding-bottom: 8px;
}

.navbar-custom .navbar-nav .nav-item .nav-link::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background-color: var(--bs-body-color);
    opacity: 0;
    transition: opacity 0.25s ease;
}

.navbar-custom .navbar-nav .nav-item .nav-link:hover::before,
.navbar-custom .navbar-nav .nav-item .nav-link.active::before {
    opacity: 1;
}

/* Ensure proper alignment between logo and nav links */
.navbar-custom .d-none.d-lg-block {
    display: flex !important;
    align-items: center;
    width: 100%;
}

.navbar-custom .navbar-brand {
    margin-right: 2rem;
}

.navbar-custom .navbar-nav {
    margin-left: 0;
    padding-left: 0;
}

.navbar-custom .navbar-nav .nav-item {
    margin-right: 1rem;
}

.navbar-custom .navbar-nav .nav-item:last-child {
    margin-right: 0;
}

/* Allow large MenuCenteredIcon menus to flow to a second line on desktop */
[data-block-slug="MenuCenteredIcon"] .navbar-custom .navbar-nav,
[data-block-type="menucenteredicon"] .navbar-custom .navbar-nav {
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 0.35rem;
}

[data-block-slug="MenuCenteredIcon"] .navbar-custom .navbar-nav .nav-item,
[data-block-type="menucenteredicon"] .navbar-custom .navbar-nav .nav-item {
    margin-bottom: 0.35rem;
}

/* MenuCenteredIcon mega menus: no hover gap (global 10px margin breaks submenu hover bridge) */
#kalles-section-header_top:not(.header-menu-logo-left-block) .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu,
#kalles-section-header_top:not(.header-menu-logo-left-block) .compact-navbar .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu {
    margin-top: 0 !important;
}

@media (min-width: 992px) {
    #kalles-section-header_top:not(.header-menu-logo-left-block) .navbar-custom .nav-item.dropdown > .dropdown-menu.show,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .navbar-custom .nav-item.dropdown > .dropdown-menu:hover,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .compact-navbar .navbar-custom .nav-item.dropdown > .dropdown-menu.show,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .compact-navbar .navbar-custom .nav-item.dropdown > .dropdown-menu:hover {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        pointer-events: auto !important;
        transition: none !important;
    }

    #kalles-section-header_top:not(.header-menu-logo-left-block) .navbar-custom .nav-item.dropdown > .dropdown-menu,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .compact-navbar .navbar-custom .nav-item.dropdown > .dropdown-menu {
        transform: none !important;
        transition: none !important;
    }
}

@media (min-width: 992px) {
    /* MenuCenteredIcon: kill global animated dropdown rules from below */
    #kalles-section-header_top:not(.header-menu-logo-left-block) .navbar-custom .navbar-nav .nav-item.dropdown > .dropdown-menu,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown > .dropdown-menu,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .navbar-custom .navbar-nav .nav-item.dropdown:hover > .dropdown-menu,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown:hover > .dropdown-menu,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .navbar-custom .navbar-nav .nav-item.dropdown > .dropdown-menu:hover,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown > .dropdown-menu:hover,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .navbar-custom .navbar-nav .nav-item.dropdown > .dropdown-menu.show,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown > .dropdown-menu.show {
        transition: none !important;
        animation: none !important;
        transform: none !important;
        opacity: 1 !important;
    }

    #kalles-section-header_top:not(.header-menu-logo-left-block) .navbar-custom .navbar-nav .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .navbar-custom .navbar-nav .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:hover,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:hover {
        transform: none !important;
    }
}

/* Fix dropdown menu spacing - add 10px gap (MenuCenteredIcon overrides to margin-top: 0 above) */
.navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu,
.compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu {
    margin-top: 10px !important;
    border-top: none !important;
    border-radius: 0 0 0.375rem 0.375rem !important;
}

/* Ensure dropdown menu appears with proper spacing on hover (main + scrolled compact bar) */
.navbar-custom .navbar-nav .nav-item.dropdown:hover .dropdown-menu,
.compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown:hover .dropdown-menu,
.header-menu-logo-left-block .navbar-nav .nav-item.dropdown:not(.dropdown-mega-xxl):hover > .dropdown-menu,
.header-menu-logo-left-block .navbar-nav .nav-item.dropdown:not(.dropdown-mega-xxl) > .dropdown-menu:hover {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
    transition: all 0.2s ease-in-out !important;
    pointer-events: auto !important;
}
.header-menu-logo-left-block .navbar-nav .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu,
.header-menu-logo-left-block .navbar-nav .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:hover {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out !important;
    pointer-events: auto !important;
}

/* Add padding to dropdown menu to prevent accidental closure */
.navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu::before,
.compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu::before {
    content: '';
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    height: 10px;
    background: transparent;
}

/* Ensure smooth transition for dropdown menus */
.navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu,
.compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.2s ease-in-out;
    display: none;
    pointer-events: none;
    position: absolute !important;
}

.navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu.show,
.compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu.show {
    pointer-events: auto !important;
}

/* Fix for mega menu dropdowns */
.navbar-custom .navbar-nav .nav-item.dropdown-mega .dropdown-menu {
    margin-top: 10px !important;
    border-top: none !important;
}

/* Keep mega-xxl dropdown within viewport – scroll inside panel, not the page */
@media (min-width: 992px) {
    .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu,
    .compact-navbar .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu {
        max-width: min(1200px, calc(100vw - 24px)) !important;
        max-height: min(70vh, calc(100vh - 120px)) !important;
        max-height: min(70dvh, calc(100dvh - 120px)) !important;
        box-sizing: border-box !important;
        overflow-x: visible !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        z-index: 1100 !important;
        background-color: var(--header-mega-bg, #ffffff) !important;
        padding: 16px 14px !important;
    }
}

/* Ensure dropdown menu stays open when hovering over it */
.navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu:hover,
.navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu.show,
.compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu:hover,
.compact-navbar .navbar-custom .navbar-nav .nav-item.dropdown .dropdown-menu.show {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* Fix for FIXED navigation bar dropdown gap issue */
.navbar-custom.fixed-top .navbar-nav .nav-item.dropdown .dropdown-menu {
    margin-top: 10px !important;
    border-top: none !important;
    border-radius: 0 0 0.375rem 0.375rem !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 1050 !important;
}

/* Ensure fixed navbar dropdowns have no gap */
.navbar-custom.fixed-top .navbar-nav .nav-item.dropdown:hover .dropdown-menu {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
    transition: all 0.2s ease-in-out !important;
}

/* Add invisible bridge for fixed navbar dropdowns */
.navbar-custom.fixed-top .navbar-nav .nav-item.dropdown .dropdown-menu::before {
    content: '';
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    height: 10px;
    background: transparent;
    z-index: 1049;
}

/* Fix for sticky navbar as well */
.navbar-custom.sticky-top .navbar-nav .nav-item.dropdown .dropdown-menu {
    margin-top: 10px !important;
    border-top: none !important;
    border-radius: 0 0 0.375rem 0.375rem !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 1050 !important;
}

.navbar-custom.sticky-top .navbar-nav .nav-item.dropdown:hover .dropdown-menu {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
    transition: all 0.2s ease-in-out !important;
}

.navbar-custom.sticky-top .navbar-nav .nav-item.dropdown .dropdown-menu::before {
    content: '';
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    height: 10px;
    background: transparent;
    z-index: 1049;
}

/* Ensure fixed navbar has proper positioning */
.navbar-custom.fixed-top,
.navbar-custom.sticky-top {
    position: relative;
}

.navbar-custom.fixed-top .navbar-nav .nav-item.dropdown,
.navbar-custom.sticky-top .navbar-nav .nav-item.dropdown {
    position: relative;
}

/* Fix for any navbar with position fixed */
.navbar-custom[style*="position: fixed"] .navbar-nav .nav-item.dropdown .dropdown-menu {
    margin-top: 10px !important;
    border-top: none !important;
    border-radius: 0 0 0.375rem 0.375rem !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 1050 !important;
}

.navbar-custom[style*="position: fixed"] .navbar-nav .nav-item.dropdown .dropdown-menu::before {
    content: '';
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    height: 10px;
    background: transparent;
    z-index: 1049;
}

/* Fix for dropdown parent links - ensure they remain clickable */
.navbar-custom .navbar-nav .nav-item.dropdown .nav-link {
    pointer-events: auto !important;
    cursor: pointer !important;
}

/* Ensure dropdown parent links can be clicked to navigate */
.navbar-custom .navbar-nav .nav-item.dropdown .nav-link[href]:not([href="#"]):not([href=""]):not([href="javascript:void(0)"]):not([href="javascript:;"]) {
    pointer-events: auto !important;
    cursor: pointer !important;
}

/* Add visual indicator for clickable parent links */
.navbar-custom .navbar-nav .nav-item.dropdown .nav-link[href]:not([href="#"]):not([href=""]):not([href="javascript:void(0)"]):not([href="javascript:;"]) {
    position: relative;
}

/* Ensure dropdown toggle doesn't prevent parent link clicks */
.navbar-custom .navbar-nav .nav-item.dropdown .nav-link.dropdown-toggle {
    pointer-events: auto !important;
}

/* Fix for Bootstrap dropdown behavior - allow parent link clicks */
.navbar-custom .navbar-nav .nav-item.dropdown .nav-link.dropdown-toggle[data-bs-toggle="dropdown"] {
    pointer-events: auto !important;
}

/* Ensure parent links work on both hover and click */
.navbar-custom .navbar-nav .nav-item.dropdown .nav-link:hover,
.navbar-custom .navbar-nav .nav-item.dropdown .nav-link:focus {
    pointer-events: auto !important;
    cursor: pointer !important;
}

/* ========================================
   HEADER POSITIONING FIXES
   ======================================== */

/* Remove any top spacing from header and body */
html, body {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Ensure header has no top margin/padding */
#kalles-section-header_top {
    margin-top: 0 !important;
    padding-top: 0 !important;
    position: relative !important;
}

/* Top bar (unfixed) same as fixed: full width, no clipping – "make both to be like the fixed" */
.layout-header-blocks {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}
/* Secondary top bar (blue bar) full width so it is not cut off */
.layout-header-blocks .h__top,
.layout-header-blocks [data-block-slug="HeaderSecondaryBar"],
[data-block-slug="HeaderSecondaryBar"].block-admin-wrapper {
    width: 100% !important;
    max-width: 100% !important;
}
#kalles-section-header_top,
.header-container,
#kalles-section-header_top .header-container {
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    box-sizing: border-box !important;
}
/* Match fixed header appearance when at top (same shadow so both states look identical) */
.header-container {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

/* Keep search, logo, and icons on ONE line when at top – same as fixed header (icons not on a different line) */
#kalles-section-header_top #header-banner-below-menu .container-fluid > .row.d-none.d-lg-flex {
    flex-wrap: nowrap !important;
}
#kalles-section-header_top #header-banner-below-menu .container-fluid > .row.d-none.d-lg-flex .col-lg-4 {
    flex: 0 0 33.333333% !important;
    max-width: 33.333333% !important;
    min-width: 0 !important;
}
#kalles-section-header_top #header-banner-below-menu .topbar-toolbar {
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
}

/* Header container positioning - starts in normal flow */
.header-container {
    margin-top: 0 !important;
    padding-top: 0 !important;
    position: relative !important;
    transition: box-shadow 0.3s ease-in-out, background-color 0.3s ease-in-out !important;
}

/* Unfixed header: end a bit to the left so megamenu and icons stay inside the page (not outside) */
#kalles-section-header_top .header-container:not(.headerFixed) {
    padding-right: 1rem !important;
    box-sizing: border-box !important;
}
#kalles-section-header_top .header-container:not(.headerFixed) .container-fluid {
    padding-right: 0.5rem !important;
}

@media (max-width: 991.98px) {
    /* Mobile header: full-bleed background, but inset content like the fixed compact bar */
    #kalles-section-header_top .header-container,
    #kalles-section-header_top .header-container:not(.headerFixed),
    #kalles-section-header_top .navbar-wrapper,
    .layout-header-blocks .block-admin-wrapper[data-block-slug="HeaderMenuSearchToolbarBlock"],
    .layout-header-blocks .block-admin-wrapper[data-block-type="headermenusearchtoolbarblock"],
    .layout-header-blocks .block-admin-wrapper[data-block-slug="HeaderMenuLogoLeftBlock"],
    .layout-header-blocks .block-admin-wrapper[data-block-type="headermenulogoleftblock"],
    .layout-header-blocks .block-admin-wrapper[data-block-slug="HeaderMenuSearchCallBlock"],
    .layout-header-blocks .block-admin-wrapper[data-block-type="headermenusearchcallblock"],
    .layout-header-blocks .block-admin-wrapper[data-block-slug="HeaderMenuBlock"],
    .layout-header-blocks .block-admin-wrapper[data-block-type="headermenublock"],
    .layout-header-blocks .block-admin-wrapper[data-block-slug="MenuCenteredIcon"],
    .layout-header-blocks .block-admin-wrapper[data-block-type="menucenteredicon"] {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    /* Match fixed compact-navbar .container-fluid inset (12px) so hamburger/icons are not flush to the screen edge */
    #kalles-section-header_top .header-container:not(.headerFixed) .container-fluid,
    #kalles-section-header_top .header-container:not(.headerFixed) .navbar-custom > .container-fluid {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    /* Mobile header: languages on top row; hamburger left, logo + icons right */
    .mobile-header-stack {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 100% !important;
        max-width: 100% !important;
    }

    .mobile-header-languages-row {
        display: flex !important;
        justify-content: flex-end;
        align-items: center;
        flex-wrap: wrap;
        gap: 0.35rem;
        width: 100%;
        padding: 0.25rem 0 0.75rem;
        margin-bottom: 0.15rem;
        box-sizing: border-box;
    }

    .mobile-header-corners-row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100%;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .mobile-header-corners-row .mobile-header-menu-btn {
        order: 0 !important;
        flex: 0 0 auto;
    }

    .mobile-header-corners-row .mobile-header-right-cluster {
        order: 1 !important;
        flex: 1 1 auto;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        min-width: 0;
    }
}

/* HeaderMenuLogoLeftBlock only: megamenu left-aligned by default; .mega-clamp-right anchors from the right */
#kalles-section-header_top .header-container:not(.headerFixed) .header-menu-logo-left-block .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu,
#kalles-section-header_top.header-menu-logo-left-block .header-container:not(.headerFixed) .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu {
    max-width: min(1200px, calc(100vw - 24px)) !important;
    width: auto !important;
    box-sizing: border-box !important;
    left: 0;
    right: auto;
    margin-left: 0 !important;
    transform: none !important;
}
#kalles-section-header_top .header-menu-logo-left-block .nav-item.dropdown.dropdown-mega-xxl.mega-clamp-right > .dropdown-menu,
#kalles-section-header_top.header-menu-logo-left-block .nav-item.dropdown.dropdown-mega-xxl.mega-clamp-right > .dropdown-menu,
.header-menu-block .nav-item.dropdown.dropdown-mega-xxl.mega-clamp-right > .dropdown-menu,
.header-menu-search-call-block .nav-item.dropdown.dropdown-mega-xxl.mega-clamp-right > .dropdown-menu {
    left: auto !important;
    right: 0 !important;
    transform: none !important;
}

/* MenuCenteredIcon / compact bar: JS sets fixed viewport position on .mega-menu-viewport-fixed */
#kalles-section-header_top .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu.mega-menu-viewport-fixed,
#kalles-section-header_top .compact-navbar .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu.mega-menu-viewport-fixed {
    position: fixed !important;
    transform: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow-x: auto !important;
}
#kalles-section-header_top.header-menu-logo-left-block .header-container:not(.headerFixed) .navbar-custom .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu,
#kalles-section-header_top.header-menu-logo-left-block .header-container:not(.headerFixed) .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:hover {
    transform: none !important;
}

/* HeaderMenuLogoLeftBlock fixed menu: same mega-xxl dropdown width constraints */
.header-menu-logo-left-block .header-container.headerFixed .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu,
#kalles-section-header_top.header-menu-logo-left-block .header-container.headerFixed .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu {
    max-width: min(1200px, calc(100vw - 24px)) !important;
    width: auto !important;
    box-sizing: border-box !important;
}

/* MenuCenteredIcon: megamenu sizes to columns — do not inherit HeaderMenuLogoLeft narrow panel rules */
@media (min-width: 992px) {
    #kalles-section-header_top:not(.header-menu-logo-left-block) .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu,
    #kalles-section-header_top:not(.header-menu-logo-left-block) .compact-navbar .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu {
        max-width: min(1400px, calc(100vw - 24px)) !important;
        width: max-content !important;
        min-width: 0 !important;
        max-height: min(70vh, calc(100vh - 120px)) !important;
        max-height: min(70dvh, calc(100dvh - 120px)) !important;
        overflow-x: visible !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        padding: 14px 18px 14px 10px !important;
        box-sizing: border-box !important;
    }

}

/* Megamenus: CSS grid columns hug content (2–5 cols) — never collapse to trigger width */
@media (min-width: 992px) {
    .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col),
    .compact-navbar .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col),
    #kalles-section-header_top .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col),
    #kalles-section-header_top .compact-navbar .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col),
    #kalles-section-header_top .header-container .header-menu-logo-left-block .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col),
    #kalles-section-header_top.header-menu-logo-left-block .header-container .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col),
    .header-menu-logo-left-block .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col),
    .header-menu-block .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col),
    .header-menu-search-call-block .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col),
    .header-menu-search-toolbar-block .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col),
    .header-menu-search-toolbar-block .dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col) {
        flex-direction: column;
        align-items: flex-start;
        width: max-content !important;
        min-width: 0 !important;
        max-width: min(1400px, calc(100vw - 24px)) !important;
        padding: 14px 18px 14px 10px !important;
        overflow-x: visible !important;
        box-sizing: border-box !important;
    }

    /* Only show as flex when open — never force all megamenus visible */
    .navbar-custom .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu:has(.megamenu-link-col),
    .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col):hover,
    .compact-navbar .navbar-custom .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu:has(.megamenu-link-col),
    .compact-navbar .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col):hover,
    #kalles-section-header_top .navbar-custom .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu:has(.megamenu-link-col),
    #kalles-section-header_top .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col):hover,
    #kalles-section-header_top .compact-navbar .navbar-custom .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu:has(.megamenu-link-col),
    #kalles-section-header_top .compact-navbar .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col):hover,
    .header-menu-logo-left-block .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu:has(.megamenu-link-col),
    .header-menu-logo-left-block .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col):hover,
    .header-menu-block .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu:has(.megamenu-link-col),
    .header-menu-block .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col):hover,
    .header-menu-search-call-block .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu:has(.megamenu-link-col),
    .header-menu-search-call-block .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col):hover,
    .header-menu-search-toolbar-block .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu:has(.megamenu-link-col),
    .header-menu-search-toolbar-block .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col):hover,
    .header-menu-search-toolbar-block .dropdown-mega-xxl:hover > .dropdown-menu:has(.megamenu-link-col),
    .header-menu-search-toolbar-block .dropdown-mega-xxl > .dropdown-menu:has(.megamenu-link-col):hover {
        display: flex !important;
    }

    /* "All / View All" stretches to columns width only (never forces 90vw / col-12 gap) */
    .dropdown-mega-xxl > .dropdown-menu .megamenu-all-row {
        display: block;
        align-self: stretch;
        width: auto;
        box-sizing: border-box;
        margin: 0 0 0.5rem;
        padding: 0 0 0.5rem;
        border-bottom: 1px solid var(--bs-border-color, #dee2e6);
    }

    .dropdown-mega-xxl > .dropdown-menu .megamenu-all-row .btn {
        display: inline-block;
        width: auto;
        max-width: 100%;
    }

    /* Legacy All-button rows still using Bootstrap col-12 */
    .dropdown-mega-xxl > .dropdown-menu > .row.mb-2,
    .dropdown-mega-xxl > .dropdown-menu > .row.mb-2 > .col-12 {
        width: auto !important;
        max-width: none !important;
        flex: 0 0 auto !important;
    }

    .dropdown-mega-xxl > .dropdown-menu .row.megamenu-columns-row,
    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-link-col) {
        display: grid !important;
        gap: 0 1rem;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: max-content !important;
        max-width: none !important;
        --bs-gutter-x: 0;
        grid-auto-flow: column;
        grid-auto-columns: max-content;
    }

    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-link-col.megamenu-cols-2) {
        grid-template-columns: repeat(2, max-content) !important;
    }
    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-link-col.megamenu-cols-3) {
        grid-template-columns: repeat(3, max-content) !important;
    }
    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-link-col.megamenu-cols-4) {
        grid-template-columns: repeat(4, max-content) !important;
    }
    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-link-col.megamenu-cols-5) {
        grid-template-columns: repeat(5, max-content) !important;
    }
    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-link-col.megamenu-cols-6) {
        grid-template-columns: repeat(6, max-content) !important;
    }

    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-image-col):has(> .megamenu-link-col.megamenu-cols-2) {
        grid-template-columns: max-content repeat(2, max-content) !important;
    }
    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-image-col):has(> .megamenu-link-col.megamenu-cols-3) {
        grid-template-columns: max-content repeat(3, max-content) !important;
    }
    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-image-col):has(> .megamenu-link-col.megamenu-cols-4) {
        grid-template-columns: max-content repeat(4, max-content) !important;
    }
    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-image-col):has(> .megamenu-link-col.megamenu-cols-5) {
        grid-template-columns: max-content repeat(5, max-content) !important;
    }
    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-image-col):has(> .megamenu-link-col.megamenu-cols-6) {
        grid-template-columns: max-content repeat(6, max-content) !important;
    }

    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-link-col) > .megamenu-link-col,
    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-link-col) > .megamenu-image-col {
        width: max-content !important;
        max-width: none !important;
        min-width: 0 !important;
        flex: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow: visible !important;
    }

    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-link-col) > .megamenu-link-col a,
    .dropdown-mega-xxl > .dropdown-menu .row:has(> .megamenu-link-col) .dropdown-menu-title {
        white-space: nowrap;
    }
}

/* Header menu blocks must not clip absolutely positioned megamenu panels (incl. pagebuilder mode) */
.layout-header-blocks .block-admin-wrapper[data-block-slug="MenuCenteredIcon"],
.layout-header-blocks .block-admin-wrapper[data-block-type="menucenteredicon"],
.layout-header-blocks .block-admin-wrapper[data-block-slug="HeaderMenuLogoLeftBlock"],
.layout-header-blocks .block-admin-wrapper[data-block-type="headermenulogoleftblock"],
#kalles-section-header_top {
    overflow: visible !important;
}

/* Fixed header (header-container.headerFixed): megamenu white panel + clickable parent links */
#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown {
    position: relative !important;
}
#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown:hover {
    z-index: 1101 !important;
}
#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown .dropdown-menu:not(.mega-menu-viewport-fixed) {
    background-color: var(--header-mega-bg, #fff) !important;
    margin-top: 0 !important;
    border-top: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 1100 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}
#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown:hover > .dropdown-menu,
#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown .dropdown-menu.mega-menu-viewport-fixed {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}
#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown .dropdown-menu.mega-menu-viewport-fixed {
    background-color: var(--header-mega-bg, #fff) !important;
    z-index: 1100 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}
#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown .dropdown-menu::before {
    content: '';
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    height: 8px;
    background: transparent;
}
#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown .nav-link,
#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown .nav-link.has-mega-dropdown {
    position: relative !important;
    z-index: 2 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
}
#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown .nav-link::before {
    pointer-events: none !important;
}

#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown .dropdown-menu a,
#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown .dropdown-menu.show a,
#kalles-section-header_top .compact-navbar .nav-item.dropdown .dropdown-menu a,
#kalles-section-header_top .compact-navbar .nav-item.dropdown .dropdown-menu.show a,
body.scrolled #kalles-section-header_top .compact-navbar .dropdown-menu a {
    pointer-events: auto !important;
    cursor: pointer !important;
}

/* MenuCenteredIcon compact / scrolled header: above page content, below modals (1055) */
body.scrolled #kalles-section-header_top {
    z-index: 1040 !important;
    position: relative !important;
}

body.scrolled #kalles-section-header_top .compact-navbar {
    position: fixed !important;
    z-index: 1040 !important;
}

body.scrolled #kalles-section-header_top .compact-navbar .nav-item.dropdown {
    position: relative !important;
    z-index: 1041 !important;
}

body.scrolled #kalles-section-header_top .compact-navbar .nav-item.dropdown .dropdown-menu,
body.scrolled #kalles-section-header_top .compact-navbar .nav-item.dropdown .dropdown-menu.show {
    z-index: 1050 !important;
    pointer-events: auto !important;
}

#kalles-section-header_top .header-container.headerFixed .navbar-custom .nav-item.dropdown .dropdown-menu.show {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* Main content area - remove top spacing */
.main-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
    position: relative !important;
    z-index: 1 !important;
}

/* Ensure content starts immediately after header */
.main-content > *:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Fix for any content that might have top margins */
.main-content .container,
.main-content .container-fluid,
.main-content .row,
.main-content .col,
.main-content .col-12 {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Specific fix for category pages and product listings */
.category-page .main-content,
.product-listing .main-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Fix for any banner or hero sections that might have top margins */
.main-content .banner,
.main-content .hero-section,
.main-content .page-header,
.main-content > .page-body-block:first-child[data-block-slug="PageHeaderBar"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* PageHeaderBar band: only flush margin — padding comes from block settings (inline style) */
.main-content .page-header-bar-block {
    margin-top: 0 !important;
}

/* Ensure navbar doesn't overlap content */
.navbar-custom {
    position: relative !important;
}

/* Fixed header state - when scrolled */
/* Header z-index must be below Tier 2 modals (1055) so modals appear on top */
/* Using lower z-index to ensure modals are always on top */
/* Use CSS variables when set by Block Formatting (e.g. menu fixed background); fallback to #fff */
.headerFixed,
.header-container.headerFixed,
header.headerFixed,
.header.headerFixed {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
    z-index: 100 !important; /* Much lower than Tier 2 modals (1055) to ensure modals are on top */
    transition: box-shadow 0.3s ease-in-out, background-color 0.3s ease-in-out !important;
}

/* Ensure all header elements are below Tier 2 modals */
/* These rules must come AFTER modal rules to ensure proper stacking */
header,
.header,
.header-container,
.header-container.headerFixed,
#kalles-section-header_top,
.navbar-custom,
.header-wrapper,
.header-section,
.headerFixed,
.headerFixed.header-container {
    z-index: 100 !important; /* Much lower than Tier 2 modals (1055) */
    position: relative; /* Ensure z-index applies */
}

/* Force header below when any modal is open */
body:has(.modal.show) .headerFixed,
body:has(.modal.show) .header-container,
body:has(.modal.show) header,
body:has(.modal.show) .header,
body:has(.modal.show) #kalles-section-header_top,
body:has(.modal.show) .navbar-custom {
    z-index: 100 !important;
}

/* When header is fixed, add top padding to body to prevent content jump */
body.has-fixed-header {
    padding-top: 0 !important; /* Will be set dynamically by JavaScript */
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
    .main-content {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    
    .headerFixed {
        position: fixed !important;
        top: 0 !important;
        width: 100% !important;
    }
}

/* Ensure no conflicts with Bootstrap or other frameworks */
.container,
.container-fluid,
.row,
.col,
.col-12 {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Fix for any page builder content */
.pagebuilder-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Fix for any dynamic content */
.dynamic-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ========================================
   ADDITIONAL HEADER POSITIONING FIXES
   ======================================== */

/* Force remove any margins from the very top of the page */
body > *:first-child,
html > body > *:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Ensure the header section has no top spacing */
#kalles-section-header_top,
.kalles-section-header_top,
.header-section,
.header-wrapper {
    margin-top: 0 !important;
    padding-top: 0 !important;
    position: relative !important;
}

/* Fix for any top banner or announcement bars */
.t_header,
.top-banner,
.announcement-bar,
.promo-banner {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Ensure main content wrapper has no top spacing */
.main-content,
.content-wrapper,
.page-content,
.site-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
    position: relative !important;
}

/* Fix for any page-specific content */
.category-page,
.product-page,
.home-page,
.shop-page {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Fix for any grid systems that might add top margins */
.row:first-child,
.container:first-child,
.container-fluid:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Ensure no Bootstrap or other framework conflicts for main content */
.main-content *[class*="mt-"],
.main-content *[class*="pt-"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Specific fix for the first element in main content */
.main-content > *:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Fix for any hero sections or banners */
.hero-section,
.banner-section,
.page-banner,
.content-banner {
    margin-top: 0 !important;
    padding-top: 0 !important;
}


.main-content {
    position: relative !important;
}

/* Ensure header elements don't have any top spacing */
header,
.header,
.navbar,
.navbar-custom {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ========================================
   DRAG & DROP BLOCK SYSTEM SUPPORT
   ======================================== */

/* Handle any drag-and-drop block system menus */
.pagebuilder-menu,
.block-menu,
.drag-drop-menu,
.pagebuilder-header,
.block-header,
.dynamic-header {
    margin-top: 0 !important;
    padding-top: 0 !important;
    position: relative !important;
}

/* Ensure content starts immediately after any header type */
.pagebuilder-menu + .main-content,
.block-menu + .main-content,
.drag-drop-menu + .main-content,
.pagebuilder-header + .main-content,
.block-header + .main-content,
.dynamic-header + .main-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Handle any wrapper containers that might add spacing */
.pagebuilder-wrapper,
.block-wrapper,
.drag-drop-wrapper {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Ensure first element in any content area has no top spacing */
.pagebuilder-content > *:first-child,
.block-content > *:first-child,
.drag-drop-content > *:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Handle any page builder specific classes */
.pb-container,
.pb-row,
.pb-column,
.pb-block {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Ensure page builder content starts immediately after header */
.pb-container:first-child,
.pb-row:first-child,
.pb-column:first-child,
.pb-block:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Handle any potential gaps between header and content */
.header-container + *,
#kalles-section-header_top + *,
header + *,
.header + *,
.navbar + *,
.navbar-custom + * {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Ensure no gaps regardless of header height */
body > *:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Handle any wrapper divs that might add spacing */
body > div:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Ensure main content wrapper has no top spacing */
.main-content,
.content-wrapper,
.page-content,
.page-wrapper {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Handle any section elements that might add spacing */
section:first-child,
.section:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ========================================
   DEBUGGING & VISUALIZATION
   ======================================== */



/* Red border removed – was taking space without reason on search/category pages */
/* .headerFixed { border-color: #dc3545 !important; } */

/* Visual indicator for body padding */
body.has-fixed-header::before {
    content: "Header is FIXED - Body padding: " attr(style);
    position: fixed;
    top: 10px;
    right: 10px;
    background: rgba(220, 53, 69, 0.9);
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    z-index: 9999;
    display: none; /* Set to 'block' to see debugging info */
}

/* Visual indicator for normal flow */
body:not(.has-fixed-header)::before {
    content: "Header is in NORMAL FLOW";
    position: fixed;
    top: 10px;
    right: 10px;
    background: rgba(40, 167, 69, 0.9);
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    z-index: 9999;
    display: none; /* Set to 'block' to see debugging info */
}

/* ========================================
   CENTRALIZED MODAL Z-INDEX SYSTEM
   ========================================
   Simple 3-tier z-index system for consistent layering:
   
   TIER 1: PageBuilder Access Bar (fixed bar)
   - z-index: 10000 (defined in pagebuilder styles)
   - Content starts below this, so no z-index needed
   
   TIER 2: Standard Modals (Bootstrap default)
   - Modal: 1055
   - Backdrop: 1050
   - Used for: Edit product/brand, settings modal, orders modal, etc.
   
   TIER 3: Modals on Top of Modals
   - Modal: 1065
   - Backdrop: 1060
   - Used for: Advanced slide editor, etc.
   
   TIER 4: Selector Modals (on top of settings modals)
   - Modal: 1000000100
   - Backdrop: 1000000095
   - Used for: Category selector, brand selector, option selector, colour-group selector, collection selector, season selector
   
   ======================================== */

/* TIER 2: Standard Bootstrap Modals */
/* Used for: Edit product/brand, settings, orders, quickview, etc. */
.modal {
    z-index: 1055 !important;
}

.modal.show {
    z-index: 1055 !important;
}

.modal-dialog {
    z-index: 1056 !important;
    position: relative;
}

.modal-content {
    z-index: 1056 !important;
    position: relative;
}

/* Standard Modal Backdrop */
.modal-backdrop {
    z-index: 1050 !important;
}

.modal-backdrop.show {
    z-index: 1050 !important;
}

.modal-backdrop.fade {
    z-index: 1050 !important;
}

.modal-backdrop.fade.show {
    z-index: 1050 !important;
}

/* Product Video Modal - same z-index logic as quickview */
#productVideoModal,
#productVideoModal.modal,
#productVideoModal.modal.show,
#productVideoModal.show {
    z-index: 1000000200 !important;
    position: fixed !important;
}

#productVideoModal .modal-dialog {
    z-index: 1000000201 !important;
    position: relative;
}

#productVideoModal .modal-content {
    z-index: 1000000201 !important;
    position: relative;
}

/* Product Video Modal backdrop - remove backdrop completely */
#productVideoModal ~ .modal-backdrop,
#productVideoModal + .modal-backdrop,
#productVideoModal.show ~ .modal-backdrop,
#productVideoModal.show + .modal-backdrop,
body.modal-open:has(#productVideoModal.show) .modal-backdrop,
body.modal-open:has(#productVideoModal.show) .modal-backdrop:last-child,
body:has(#productVideoModal.show) .modal-backdrop,
body:has(#productVideoModal.show) .modal-backdrop.show,
body:has(#productVideoModal.show) .modal-backdrop.fade,
body:has(#productVideoModal.show) .modal-backdrop.fade.show {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    z-index: -1 !important;
}

/* Support for dynamic modal IDs (productDetailsWithImageGrid) - same z-index logic as quickview */
[id^="productVideoModal-"],
[id^="productVideoModal-"].modal,
[id^="productVideoModal-"].modal.show,
[id^="productVideoModal-"].show {
    z-index: 1000000200 !important;
    position: fixed !important;
}

[id^="productVideoModal-"] .modal-dialog {
    z-index: 1000000201 !important;
    position: relative;
}

[id^="productVideoModal-"] .modal-content {
    z-index: 1000000201 !important;
    position: relative;
}

[id^="productVideoModal-"] ~ .modal-backdrop,
[id^="productVideoModal-"] + .modal-backdrop,
[id^="productVideoModal-"].show ~ .modal-backdrop,
[id^="productVideoModal-"].show + .modal-backdrop,
body.modal-open:has([id^="productVideoModal-"].show) .modal-backdrop,
body.modal-open:has([id^="productVideoModal-"].show) .modal-backdrop:last-child,
body:has([id^="productVideoModal-"].show) .modal-backdrop,
body:has([id^="productVideoModal-"].show) .modal-backdrop.show,
body:has([id^="productVideoModal-"].show) .modal-backdrop.fade,
body:has([id^="productVideoModal-"].show) .modal-backdrop.fade.show {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    z-index: -1 !important;
}

/* Quick View Modal - elevated above PageBuilder bar */
#quickViewModel,
body.pagebuilder-mode #quickViewModel,
#quickViewModel.modal,
#quickViewModel.modal.show,
#quickViewModel.show {
    z-index: 1000000200 !important;
    position: fixed !important;
}

#quickViewModel .modal-dialog {
    z-index: 1000000201 !important;
    position: relative;
}

#quickViewModel .modal-content {
    z-index: 1000000201 !important;
    position: relative;
}

/* Quickview backdrop - keep paired just below modal */
#quickViewModel ~ .modal-backdrop,
#quickViewModel + .modal-backdrop,
#quickViewModel.show ~ .modal-backdrop,
#quickViewModel.show + .modal-backdrop,
body:has(#quickViewModel) .modal-backdrop,
body:has(#quickViewModel.show) .modal-backdrop,
body:has(#quickViewModel.show) .modal-backdrop.show,
body:has(#quickViewModel.show) .modal-backdrop.fade.show {
    z-index: 1000000195 !important;
    position: fixed !important;
}

/* Checkout: T&C link inside checkbox label — Reboot uses --bs-link-color (blue); inherit label/body text */
#confirm-order-form .form-check-label,
#confirm-order-form #termsLink {
    font-family: var(--wizard-body-font) !important;
}
#confirm-order-form .gdpr-form-consent-notice,
#confirm-order-form .gdpr-form-consent-notice a,
.newsletter-signup-gdpr,
.newsletter-signup-gdpr a,
.partial-contact-column,
.partial-contact-column-content,
.partial-contact-column-item,
.partial-contact-column-link,
.partial-menu-column,
.partial-menu-column-list,
.partial-menu-column-link,
.partial-newsletter-column,
.partial-newsletter-column-description {
    font-family: var(--wizard-body-font) !important;
}
/* Checkout wizard buttons: keep Back/Primary on same font family */
.checkout-step1-customer .btn,
#accordion .card .btn.btn-primary,
#accordion .card .btn.btn-secondary,
#confirm-order-form .btn.btn-primary,
#confirm-order-form .btn.btn-secondary {
    font-family: var(--wizard-body-font) !important;
}
#confirm-order-form #termsLink {
    color: inherit !important;
}
#confirm-order-form #termsLink:hover,
#confirm-order-form #termsLink:focus {
    color: inherit !important;
    opacity: 0.85;
}

/* Terms & Conditions Modal - Same z-index as myorders modal */
/* Must be above fixed header - Maximum specificity */
#termsModal,
#termsModal.pagebuilder-modal,
#termsModal.modal,
#termsModal.modal.pagebuilder-modal,
#termsModal.modal.fade,
#termsModal.modal.fade.pagebuilder-modal,
body #termsModal,
body #termsModal.pagebuilder-modal,
body #termsModal.modal,
html body #termsModal,
html body #termsModal.modal {
    z-index: 9999999 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

#termsModal.show,
#termsModal.pagebuilder-modal.show,
#termsModal.modal.show,
#termsModal.modal.pagebuilder-modal.show,
#termsModal.modal.fade.show,
#termsModal.modal.fade.pagebuilder-modal.show,
body #termsModal.show,
body #termsModal.modal.show,
html body #termsModal.show,
html body #termsModal.modal.show {
    z-index: 9999999 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

#termsModal .modal-dialog,
#termsModal.show .modal-dialog,
#termsModal.pagebuilder-modal .modal-dialog {
    z-index: 10000000 !important;
    position: relative !important;
    margin: 1.75rem auto !important;
    pointer-events: none !important;
}

#termsModal .modal-content,
#termsModal.show .modal-content,
#termsModal.pagebuilder-modal .modal-content {
    z-index: 10000000 !important;
    position: relative !important;
    pointer-events: auto !important;
}

/*
 * Checkout Terms modal: keep readable width (~80%) but center in the modal
 * (legacy markup uses .inline-block-wrapper and Bootstrap grids that sit left).
 */
#termsModal #termsContent .inline-block-wrapper,
#termsModal #termsContent .inline-content {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box;
}

#termsModal #termsContent .container,
#termsModal #termsContent .container-fluid {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
}

#termsModal #termsContent .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    justify-content: center !important;
    --bs-gutter-x: 1.5rem;
}

#termsModal #termsContent [class*="col-"] {
    max-width: 100% !important;
    flex: 0 1 auto !important;
    width: 100% !important;
}

/* Full-page policy pages only: 80% measure, centered (see body.page-policy-content in master layout) */
body.page-policy-content .main-content .inline-block-wrapper {
    max-width: 80%;
    margin-left: auto;
    margin-right: auto;
}

/* -------------------------------------------------------------------------
   Block isolation: user/pasted content must not float into or overlap other blocks
   ------------------------------------------------------------------------- */
.main-content {
    display: flow-root;
    width: 100%;
    clear: both;
}

.layout-footer,
.layout-footer-blocks,
footer.footer-container-outer {
    clear: both !important;
    width: 100% !important;
    display: block;
    position: relative;
    z-index: 1;
}

/* Page builder: do not trap block menus in a low z-index footer/header stacking context */
body.pagebuilder-mode .layout-footer,
body.pagebuilder-mode .layout-footer-blocks,
body.pagebuilder-mode .layout-header,
body.pagebuilder-mode .layout-header-blocks,
body.pagebuilder-mode footer.footer-container-outer {
    z-index: auto;
}

.main-content .inline-block-wrapper,
.main-content section[data-block-type],
.main-content .container-block-wrapper,
.main-content > .banner-block-container,
.main-content .page-body-block,
.main-content > .page-body-block {
    display: flow-root;
    clear: both;
    max-width: 100%;
    width: 100%;
    position: relative;
    box-sizing: border-box;
    float: none;
}

/* Container/Footer grid: columns share one Bootstrap row — never force width:100% on .container-column */
.container-block-wrapper {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.container-block-wrapper .container-block-row {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.container-block-wrapper .container-block-row > .container-column {
    display: flow-root;
    clear: none;
    min-width: 0;
    position: relative;
    box-sizing: border-box;
    float: none;
    /* width/flex/max-width: leave to Bootstrap col-* (do not use width:auto — columns size to content) */
}

/* Each page block starts on a new row at the left edge of .main-content */
.main-content > .page-body-block {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    clear: both !important;
    float: none !important;
    flex: 0 0 auto !important;
}

.main-content .page-body-block .block-admin-wrapper {
    display: flow-root;
    width: 100%;
    max-width: 100%;
    clear: both;
    float: none;
}

/* Quick Formatting horizontal margins: width:auto so 100% + margin does not overflow the row */
.main-content .page-body-block .block-admin-wrapper[data-qf-has-horizontal-margin="1"],
.main-content .page-body-block[data-qf-has-horizontal-margin="1"] {
    width: auto !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

.main-content .page-body-block .block-admin-wrapper[data-qf-has-horizontal-margin="1"] > [data-block-type],
.main-content .page-body-block[data-qf-has-horizontal-margin="1"] > [data-block-type] {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Promo / information carousel: full row width (no empty left column beside prior banner) */
.main-content .slideshow-information-section,
.main-content .slideshow-information-section .slideshow-information-container,
.main-content .slideshow-information-section .slideshow-carousel-row,
.main-content .slideshow-information-section .slideshow-carousel-row.flickity-enabled,
.main-content .slideshow-information-section .flickity-viewport,
.main-content .image-feature-cards-section.ifc-section--carousel.ifc-section--content-fluid,
.main-content .image-feature-cards-section.ifc-section--carousel.ifc-section--content-fluid .ifc-inner,
.main-content .image-feature-cards-section.ifc-section--carousel.ifc-section--content-fluid .ifc-carousel,
.main-content .image-feature-cards-section.ifc-section--carousel.ifc-section--content-fluid .ifc-carousel.flickity-enabled,
.main-content .image-feature-cards-section.ifc-section--carousel.ifc-section--content-fluid .flickity-viewport {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.main-content .slideshow-information-section .slideshow-carousel-row.flickity-enabled .flickity-slider {
    left: 0 !important;
}

/* Page-builder shells: no isolation — it traps block menus behind sibling blocks */
body.pagebuilder-mode .block-admin-wrapper,
body.pagebuilder-mode .inline-block-wrapper[data-block-id] {
    display: flow-root;
    clear: both;
    max-width: 100%;
    position: relative;
    box-sizing: border-box;
}

body.pagebuilder-mode .block-admin-wrapper.block-admin-menu-host-open,
body.pagebuilder-mode .inline-block-wrapper.block-admin-menu-host-open {
    z-index: 100500 !important;
}

body.pagebuilder-mode .block-admin-wrapper > .block-admin-menu,
body.pagebuilder-mode .inline-block-wrapper[data-block-id] > .block-admin-menu,
body.pagebuilder-mode .block-admin-menu.block-admin-menu--fixed-open {
    z-index: 100600 !important;
}

.inline-content .inline-rich-button-wrap,
.inline-column-content .inline-rich-button-wrap,
.banner-text-content .inline-rich-button-wrap,
.theme-user-content-appearance .inline-rich-button-wrap,
.slideshow-simple .slide-overlay-extra-rich .inline-rich-button-wrap,
.inline-rich-button-wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 0.5em;
    align-items: center;
    margin: 0.5em 0;
    width: max-content;
    max-width: 100%;
}

.inline-content .inline-rich-button-wrap.inline-rich-align-center,
.inline-column-content .inline-rich-button-wrap.inline-rich-align-center,
.banner-text-content .inline-rich-button-wrap.inline-rich-align-center,
.theme-user-content-appearance .inline-rich-button-wrap.inline-rich-align-center {
    margin-left: auto;
    margin-right: auto;
}

.inline-content .inline-rich-button-wrap.inline-rich-align-right,
.inline-column-content .inline-rich-button-wrap.inline-rich-align-right,
.banner-text-content .inline-rich-button-wrap.inline-rich-align-right,
.theme-user-content-appearance .inline-rich-button-wrap.inline-rich-align-right {
    margin-left: auto;
    margin-right: 0;
}

.inline-content .inline-rich-button-wrap.inline-rich-align-left,
.inline-column-content .inline-rich-button-wrap.inline-rich-align-left,
.banner-text-content .inline-rich-button-wrap.inline-rich-align-left,
.theme-user-content-appearance .inline-rich-button-wrap.inline-rich-align-left {
    margin-left: 0;
    margin-right: auto;
}

.inline-content .inline-rich-button-wrap .inline-rich-button,
.inline-column-content .inline-rich-button-wrap .inline-rich-button,
.banner-text-content .inline-rich-button-wrap .inline-rich-button,
.theme-user-content-appearance .inline-rich-button-wrap .inline-rich-button,
.slideshow-simple .slide-overlay-extra-rich .inline-rich-button-wrap .inline-rich-button,
.slideshow-simple .slide-overlay-extra-rich .inline-rich-button-wrap a.btn {
    display: inline-flex;
    align-items: center;
    width: auto;
    max-width: none;
    flex: 0 0 auto;
    text-decoration: none;
    text-shadow: none;
    box-shadow: none;
}

.inline-rich-button-wrap.inline-rich-button-wrap-full {
    width: 100%;
}

.inline-content .inline-rich-button-wrap .inline-rich-button.inline-rich-button-full,
.inline-column-content .inline-rich-button-wrap .inline-rich-button.inline-rich-button-full,
.banner-text-content .inline-rich-button-wrap .inline-rich-button.inline-rich-button-full,
.theme-user-content-appearance .inline-rich-button-wrap .inline-rich-button.inline-rich-button-full {
    flex: 1 1 100%;
    width: 100%;
    display: block;
    text-align: center;
}

a.inline-rich-button.inline-rich-button-custom,
.inline-content a.inline-rich-button.inline-rich-button-custom,
.inline-column-content a.inline-rich-button.inline-rich-button-custom,
.banner-text-content a.inline-rich-button.inline-rich-button-custom,
.theme-user-content-appearance a.inline-rich-button.inline-rich-button-custom,
.slideshow-simple .slide-overlay-extra-rich a.inline-rich-button.inline-rich-button-custom {
    background-color: var(--inline-btn-bg, #0d6efd) !important;
    color: var(--inline-btn-text, #ffffff) !important;
    border-color: var(--inline-btn-border, var(--inline-btn-bg, #0d6efd)) !important;
    text-decoration: none;
}

a.inline-rich-button.inline-rich-button-custom:hover,
a.inline-rich-button.inline-rich-button-custom:focus,
.inline-content a.inline-rich-button.inline-rich-button-custom:hover,
.inline-content a.inline-rich-button.inline-rich-button-custom:focus,
.inline-column-content a.inline-rich-button.inline-rich-button-custom:hover,
.inline-column-content a.inline-rich-button.inline-rich-button-custom:focus,
.banner-text-content a.inline-rich-button.inline-rich-button-custom:hover,
.banner-text-content a.inline-rich-button.inline-rich-button-custom:focus,
.theme-user-content-appearance a.inline-rich-button.inline-rich-button-custom:hover,
.theme-user-content-appearance a.inline-rich-button.inline-rich-button-custom:focus,
.slideshow-simple .slide-overlay-extra-rich a.inline-rich-button.inline-rich-button-custom:hover,
.slideshow-simple .slide-overlay-extra-rich a.inline-rich-button.inline-rich-button-custom:focus {
    background-color: var(--inline-btn-hover-bg, var(--inline-btn-bg, #0b5ed7)) !important;
    color: var(--inline-btn-hover-text, var(--inline-btn-text, #ffffff)) !important;
    border-color: var(--inline-btn-hover-border, var(--inline-btn-hover-bg, var(--inline-btn-bg, #0b5ed7))) !important;
}

.inline-content,
.theme-user-content-appearance {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Pasted rich text: strip white line backgrounds from paragraphs and headings */
.inline-content p,
.inline-content div,
.inline-content li,
.inline-content td,
.inline-content th,
.inline-content h1,
.inline-content h2,
.inline-content h3,
.inline-content h4,
.inline-content h5,
.inline-content h6,
.inline-content h1 span,
.inline-content h2 span,
.inline-content h3 span,
.inline-content h4 span,
.inline-content h5 span,
.inline-content h6 span,
.inline-column-content p,
.inline-column-content div,
.inline-column-content li,
.inline-column-content td,
.inline-column-content th,
.inline-column-content h1,
.inline-column-content h2,
.inline-column-content h3,
.inline-column-content h4,
.inline-column-content h5,
.inline-column-content h6,
.inline-column-content h1 span,
.inline-column-content h2 span,
.inline-column-content h3 span,
.inline-column-content h4 span,
.inline-column-content h5 span,
.inline-column-content h6 span,
.banner-text-content p,
.banner-text-content div,
.banner-text-content li,
.banner-text-content td,
.banner-text-content th,
.banner-text-content h1,
.banner-text-content h2,
.banner-text-content h3,
.banner-text-content h4,
.banner-text-content h5,
.banner-text-content h6,
.banner-text-content h1 span,
.banner-text-content h2 span,
.banner-text-content h3 span,
.banner-text-content h4 span,
.banner-text-content h5 span,
.banner-text-content h6 span {
    background-color: transparent !important;
    background-image: none !important;
}

body.pagebuilder-mode .inline-block-wrapper.inline-block-empty .inline-content .inline-empty-placeholder:only-child,
body.pagebuilder-mode .inline-block-wrapper.inline-block-empty .inline-column-content .inline-empty-placeholder:only-child {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    color: inherit !important;
    opacity: 0.45;
    font-style: italic;
}

body.pagebuilder-mode .inline-block-wrapper:not(.inline-block-empty) .inline-content,
body.pagebuilder-mode .inline-block-wrapper:not(.inline-block-empty) .inline-column-content,
body.pagebuilder-mode .inline-block-wrapper:not(.inline-block-empty) .inline-content p,
body.pagebuilder-mode .inline-block-wrapper:not(.inline-block-empty) .inline-column-content p {
    color: inherit;
}

.inline-content img,
.inline-content video,
.inline-content iframe,
.inline-content embed,
.inline-content object,
.inline-content svg {
    max-width: 100% !important;
    height: auto;
}

/* Inline resized media — public view (PageBuilder-only rules live in inline-content-editor) */
.inline-content .inline-embed-media.inline-embed-inline,
.inline-column-content .inline-embed-media.inline-embed-inline {
    display: inline-block;
    vertical-align: middle;
    max-width: 100%;
    line-height: normal;
}

.inline-content .inline-embed-inline img,
.inline-column-content .inline-embed-inline img {
    display: inline-block;
    vertical-align: middle;
    max-width: 100%;
    height: auto;
    width: 100%;
}

.inline-content .inline-embed-media.inline-embed-block,
.inline-content .inline-embed-media.inline-embed-image:not(.inline-embed-inline):not(.inline-embed-video),
.inline-column-content .inline-embed-media.inline-embed-block,
.inline-column-content .inline-embed-media.inline-embed-image:not(.inline-embed-inline):not(.inline-embed-video) {
    display: block;
    max-width: 100%;
}

.inline-content .inline-embed-media.inline-embed-video,
.inline-column-content .inline-embed-media.inline-embed-video {
    display: block;
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
}

.inline-content .inline-embed-media.inline-embed-video.ratio,
.inline-column-content .inline-embed-media.inline-embed-video.ratio {
    max-width: 100%;
}

.inline-content .inline-embed-media.inline-rich-align-center,
.inline-column-content .inline-embed-media.inline-rich-align-center {
    margin-left: auto;
    margin-right: auto;
}

.inline-content .inline-embed-media.inline-rich-align-right,
.inline-column-content .inline-embed-media.inline-rich-align-right {
    margin-left: auto;
    margin-right: 0;
}

.inline-content .inline-embed-media.inline-rich-align-left,
.inline-column-content .inline-embed-media.inline-rich-align-left {
    margin-left: 0;
    margin-right: auto;
}

.inline-content .inline-rich-text-shade,
.inline-column-content .inline-rich-text-shade {
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    padding: 0.08em 0.25em;
    border-radius: 2px;
}

.inline-content table {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto;
}

/* Pasted Word/Bootstrap markup must not pull footer or sibling columns beside this block */
.inline-content [style*="float:"],
.inline-content [style*="float: left"],
.inline-content [style*="float:left"],
.inline-content [style*="float: right"],
.inline-content [style*="float:right"],
.inline-content .float-start,
.inline-content .float-end,
.inline-content .float-left,
.inline-content .float-right {
    float: none !important;
}

.inline-content [class*="col-"] {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}

.inline-content [style*="position:absolute"],
.inline-content [style*="position: absolute"],
.inline-content [style*="position:fixed"],
.inline-content [style*="position: fixed"] {
    position: static !important;
}

.footer-container-content .container-block-row {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
}

.footer-container-content .container-block-row > .container-column,
.footer-container-content .partial-menu-column,
.footer-container-content .partial-contact-column,
.footer-container-content .partial-social-column,
.footer-container-content .partial-stores-column,
.footer-container-content .partial-newsletter-column {
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Grids/carousels inside container columns must fit the column (avoid 4×100% row overflow) */
.container-column .ifc-section .ifc-grid,
.container-column .ifc-section .ifc-carousel,
.container-column .promo-offers-block,
.container-column .categories-carousel-section,
.container-column section[data-block-type] .container,
.container-column section[data-block-type] .container-fluid {
    max-width: 100%;
    box-sizing: border-box;
}

/* Terms & Conditions backdrop - same z-index as myorders modal */
#termsModal ~ .modal-backdrop,
#termsModal + .modal-backdrop,
#termsModal.show ~ .modal-backdrop,
#termsModal.show + .modal-backdrop,
#termsModal.pagebuilder-modal ~ .modal-backdrop,
#termsModal.pagebuilder-modal + .modal-backdrop,
body:has(#termsModal) .modal-backdrop,
body:has(#termsModal.show) .modal-backdrop,
body:has(#termsModal.show) .modal-backdrop.show,
body:has(#termsModal.show) .modal-backdrop.fade.show {
    z-index: 9999998 !important;
    position: fixed !important;
    background-color: rgba(0, 0, 0, 0.5) !important;
}

/* Ensure header is below Terms & Conditions modal when modal is open */
/* Use maximum specificity to override any other CSS */
body:has(#termsModal.show) .headerFixed,
body:has(#termsModal.show) .header-container.headerFixed,
body:has(#termsModal.show) header,
body:has(#termsModal.show) .header,
body:has(#termsModal.show) #kalles-section-header_top,
body:has(#termsModal.show) .navbar-custom,
html body:has(#termsModal.show) .headerFixed,
html body:has(#termsModal.show) .header-container,
html body:has(#termsModal.show) header,
#termsModal.show ~ .headerFixed,
#termsModal.show ~ .header-container,
#termsModal.show ~ header,
#termsModal.show ~ .header,
body #termsModal.show ~ .headerFixed,
html body #termsModal.show ~ .headerFixed,
#termsModal.terms-modal-active ~ .headerFixed,
#termsModal.terms-modal-active ~ .header-container,
#termsModal.terms-modal-active ~ header,
#termsModal.terms-modal-active ~ .header,
body:has(#termsModal.terms-modal-active) .headerFixed,
body:has(#termsModal.terms-modal-active) .header-container,
body:has(#termsModal.terms-modal-active) header,
body:has(#termsModal.terms-modal-active) .header,
body:has(#termsModal.terms-modal-active) #kalles-section-header_top {
    z-index: 100 !important; /* Much lower than modal (9999999) and backdrop (9999998) */
}

/* TIER 3: Modals on Top of Modals */
/* Used for: Advanced slide editor, etc. */
#advancedSlideEditorModal {
    z-index: 1065 !important;
}

#advancedSlideEditorModal.show {
    z-index: 1065 !important;
}

#advancedSlideEditorModal .modal-dialog {
    z-index: 1066 !important;
    position: relative;
}

#advancedSlideEditorModal .modal-content {
    z-index: 1066 !important;
    position: relative;
}

/* Backdrop for tier 3 modals - below modal but above tier 2 */
#advancedSlideEditorModal ~ .modal-backdrop,
#advancedSlideEditorModal + .modal-backdrop,
body:has(#advancedSlideEditorModal.show) .modal-backdrop {
    z-index: 1060 !important;
}

/* Override: when marked topmost, take the highest tier */
#advancedSlideEditorModal.modal-topmost,
#advancedSlideEditorModal.modal-topmost.show {
    z-index: 1000000300 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}
#advancedSlideEditorModal.modal-topmost .modal-dialog,
#advancedSlideEditorModal.modal-topmost.show .modal-dialog,
#advancedSlideEditorModal.modal-topmost .modal-content,
#advancedSlideEditorModal.modal-topmost.show .modal-content {
    z-index: 1000000301 !important;
    position: relative !important;
}
body:has(#advancedSlideEditorModal.modal-topmost.show) .modal-backdrop,
#advancedSlideEditorModal.modal-topmost ~ .modal-backdrop,
#advancedSlideEditorModal.modal-topmost + .modal-backdrop {
    z-index: 1000000299 !important;
}

/* TIER 4: Selector Modals (on top of settings modals) */
/* Used for: Category selector, brand selector, option selector, colour-group selector, collection selector, season selector */
/* Must be HIGHER than pagebuilder-modal (1000000100) to appear above settings modals */
#categorySelectorModal,
#brandSelectorModal,
#parentCategorySelectorModal,
#colourSelectorModal,
#optionSelectorModal,
#colourGroupSelectorModal,
#collectionSelectorModal,
#seasonSelectorModal,
.modal-tier-4 {
    z-index: 1000000200 !important;
}

#categorySelectorModal.show,
#brandSelectorModal.show,
#parentCategorySelectorModal.show,
#colourSelectorModal.show,
#optionSelectorModal.show,
#colourGroupSelectorModal.show,
#collectionSelectorModal.show,
#seasonSelectorModal.show,
.modal-tier-4.show {
    z-index: 1000000200 !important;
}

#categorySelectorModal .modal-dialog,
#brandSelectorModal .modal-dialog,
#parentCategorySelectorModal .modal-dialog,
#colourSelectorModal .modal-dialog,
#optionSelectorModal .modal-dialog,
#colourGroupSelectorModal .modal-dialog,
#collectionSelectorModal .modal-dialog,
#seasonSelectorModal .modal-dialog,
.modal-tier-4 .modal-dialog {
    z-index: 1000000201 !important;
    position: relative;
}

#categorySelectorModal .modal-content,
#brandSelectorModal .modal-content,
#parentCategorySelectorModal .modal-content,
#colourSelectorModal .modal-content,
#optionSelectorModal .modal-content,
#colourGroupSelectorModal .modal-content,
#collectionSelectorModal .modal-content,
#seasonSelectorModal .modal-content,
.modal-tier-4 .modal-content {
    z-index: 1000000201 !important;
    position: relative;
}

/* Topmost modal helper (use for advanced editors that must float above all) */
.modal-topmost {
    z-index: 1000000300 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}
.modal-topmost .modal-dialog,
.modal-topmost .modal-content {
    z-index: 1000000301 !important;
    position: relative;
}
.modal-topmost + .modal-backdrop,
.modal-topmost ~ .modal-backdrop,
body:has(.modal-topmost.show) .modal-backdrop {
    z-index: 1000000299 !important;
}

#categorySelectorModal,
#brandSelectorModal,
#parentCategorySelectorModal,
#colourSelectorModal,
#optionSelectorModal,
#colourGroupSelectorModal,
#collectionSelectorModal,
#seasonSelectorModal {
    z-index: 1000000200 !important;
}

#categorySelectorModal.show,
#brandSelectorModal.show,
#parentCategorySelectorModal.show,
#colourSelectorModal.show,
#optionSelectorModal.show,
#colourGroupSelectorModal.show,
#collectionSelectorModal.show,
#seasonSelectorModal.show {
    z-index: 1000000200 !important;
}

#categorySelectorModal .modal-dialog,
#brandSelectorModal .modal-dialog,
#parentCategorySelectorModal .modal-dialog,
#colourSelectorModal .modal-dialog,
#optionSelectorModal .modal-dialog,
#colourGroupSelectorModal .modal-dialog,
#collectionSelectorModal .modal-dialog,
#seasonSelectorModal .modal-dialog,
.modal-tier-4 .modal-dialog {
    z-index: 1000000201 !important;
    position: relative;
}

#categorySelectorModal .modal-content,
#brandSelectorModal .modal-content,
#parentCategorySelectorModal .modal-content,
#colourSelectorModal .modal-content,
#optionSelectorModal .modal-content,
#colourGroupSelectorModal .modal-content,
#collectionSelectorModal .modal-content,
#seasonSelectorModal .modal-content,
.modal-tier-4 .modal-content {
    z-index: 1000000201 !important;
    position: relative;
}

/* Backdrop for tier 4 selector modals - below modal but above pagebuilder-modal */
#categorySelectorModal ~ .modal-backdrop,
#categorySelectorModal + .modal-backdrop,
#brandSelectorModal ~ .modal-backdrop,
#brandSelectorModal + .modal-backdrop,
#parentCategorySelectorModal ~ .modal-backdrop,
#parentCategorySelectorModal + .modal-backdrop,
#colourSelectorModal ~ .modal-backdrop,
#colourSelectorModal + .modal-backdrop,
#optionSelectorModal ~ .modal-backdrop,
#optionSelectorModal + .modal-backdrop,
#colourGroupSelectorModal ~ .modal-backdrop,
#colourGroupSelectorModal + .modal-backdrop,
#collectionSelectorModal ~ .modal-backdrop,
#collectionSelectorModal + .modal-backdrop,
#seasonSelectorModal ~ .modal-backdrop,
#seasonSelectorModal + .modal-backdrop,
body:has(#categorySelectorModal.show) .modal-backdrop,
body:has(#brandSelectorModal.show) .modal-backdrop,
body:has(#parentCategorySelectorModal.show) .modal-backdrop,
body:has(#colourSelectorModal.show) .modal-backdrop,
body:has(#optionSelectorModal.show) .modal-backdrop,
body:has(#colourGroupSelectorModal.show) .modal-backdrop,
body:has(#collectionSelectorModal.show) .modal-backdrop,
body:has(#seasonSelectorModal.show) .modal-backdrop {
    z-index: 1000000195 !important;
}

/* CRITICAL: Override .pagebuilder-modal z-index for selector modals */
/* These must appear ABOVE pagebuilder-modal (1000000100) */
body #categorySelectorModal,
body #brandSelectorModal,
body #parentCategorySelectorModal,
body #colourSelectorModal,
body #optionSelectorModal,
body #colourGroupSelectorModal,
body #collectionSelectorModal,
body #seasonSelectorModal {
    z-index: 1000000200 !important;
    position: fixed !important;
}

body #categorySelectorModal.show,
body #brandSelectorModal.show,
body #parentCategorySelectorModal.show,
body #colourSelectorModal.show,
body #optionSelectorModal.show,
body #colourGroupSelectorModal.show,
body #collectionSelectorModal.show,
body #seasonSelectorModal.show {
    z-index: 1000000200 !important;
}

body #categorySelectorModal .modal-dialog,
body #brandSelectorModal .modal-dialog,
body #parentCategorySelectorModal .modal-dialog,
body #colourSelectorModal .modal-dialog,
body #optionSelectorModal .modal-dialog,
body #colourGroupSelectorModal .modal-dialog,
body #collectionSelectorModal .modal-dialog,
body #seasonSelectorModal .modal-dialog {
    z-index: 1000000201 !important;
}

body #categorySelectorModal .modal-content,
body #brandSelectorModal .modal-content,
body #parentCategorySelectorModal .modal-content,
body #colourSelectorModal .modal-content,
body #optionSelectorModal .modal-content,
body #colourGroupSelectorModal .modal-content,
body #collectionSelectorModal .modal-content,
body #seasonSelectorModal .modal-content {
    z-index: 1000000201 !important;
}

/* Order Modal - Uses standard modal z-index (Tier 2) */
#orderModal {
    z-index: 1055 !important;
    position: fixed !important;
}

#orderModal.show {
    z-index: 1055 !important;
}

#orderModal > div {
    z-index: 1056 !important;
    position: relative !important;
}

/* Hidden filters modal (CategoryWithFilters layout "filters_hidden") — above sticky headers + dimmed backdrop */
#hiddenFiltersModal {
    z-index: 999999 !important;
    position: fixed !important;
}

#hiddenFiltersModal.show {
    z-index: 999999 !important;
}

#hiddenFiltersModal .modal-dialog {
    z-index: 1000000 !important;
    position: relative !important;
}

#hiddenFiltersModal .modal-content {
    z-index: 1000000 !important;
    position: relative !important;
}

body.filters-hidden-modal-open .modal-backdrop.show,
body:has(#hiddenFiltersModal.show) .modal-backdrop.show {
    z-index: 999998 !important;
    display: block !important;
    opacity: 0.5 !important;
    background-color: rgba(0, 0, 0, 0.5) !important;
}

/* File Upload Modal - Must be above settings modals (TIER 4) */
/* Used for: Image browser/selector when browsing images in maps, slides, etc. */
#fileUploadModal {
    z-index: 1000000200 !important;
    position: fixed !important;
}

#fileUploadModal.show {
    z-index: 1000000200 !important;
    display: block !important;
}

#fileUploadModal .modal-dialog {
    z-index: 1000000201 !important;
    position: relative !important;
}

#fileUploadModal .modal-content {
    z-index: 1000000201 !important;
    position: relative !important;
}

/* File Upload Modal backdrop - below modal but above settings modal */
#fileUploadModal ~ .modal-backdrop,
#fileUploadModal + .modal-backdrop,
body:has(#fileUploadModal.show) .modal-backdrop {
    z-index: 1000000195 !important;
}

/* Map Settings Modal - Uses pagebuilder modal z-index (TIER 4) */
#mapSettingsModal {
    z-index: 1000000100 !important;
    position: fixed !important;
}

#mapSettingsModal.show {
    z-index: 1000000100 !important;
}

#mapSettingsModal .modal-dialog {
    z-index: 1000000101 !important;
    position: relative !important;
}

#mapSettingsModal .modal-content {
    z-index: 1000000101 !important;
    position: relative !important;
}

/* Map Settings Modal backdrop */
#mapSettingsModal ~ .modal-backdrop,
#mapSettingsModal + .modal-backdrop,
body:has(#mapSettingsModal.show) .modal-backdrop {
    z-index: 1000000095 !important;
}

/* Coordinate Picker Modal - Must be above map settings AND above custom settings modal (Manage Blocks) */
/* Used for: Picking coordinates from map when editing locations */
/* z-index 1000000210+ so it appears on top when opened from #customSettingsModal (1000000200) or #mapSettingsModal (1000000100) */
#coordinatePickerModal {
    z-index: 1000000210 !important;
    position: fixed !important;
}

#coordinatePickerModal.show {
    z-index: 1000000210 !important;
    display: block !important;
}

#coordinatePickerModal .modal-dialog {
    z-index: 1000000211 !important;
    position: relative !important;
}

#coordinatePickerModal .modal-content {
    z-index: 1000000211 !important;
    position: relative !important;
}

/* Coordinate Picker Modal backdrop - below picker modal but above custom/map settings modals */
#coordinatePickerModal ~ .modal-backdrop,
#coordinatePickerModal + .modal-backdrop,
body:has(#coordinatePickerModal.show) .modal-backdrop {
    z-index: 1000000205 !important;
}

/* Ensure coordinate picker is above map settings when both are open (standalone map modal) */
body:has(#coordinatePickerModal.show) #mapSettingsModal,
body:has(#coordinatePickerModal.show) #mapSettingsModal.show {
    z-index: 1000000100 !important;
}

/* Map Container Sizing - Ensure maps fill their containers properly */
#coordinatePickerMapShell,
#mapSettingsMap {
    width: 100% !important;
}

#coordinatePickerMapShell {
    height: 400px !important;
    min-height: 400px !important;
    max-height: 400px !important;
    position: relative !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

#coordinatePickerMap {
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    display: block !important;
    position: relative !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

#mapSettingsMap {
    height: 400px !important;
    min-height: 400px !important;
    max-height: 400px !important;
    display: block !important;
    position: relative !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* Ensure Leaflet map container fills the parent and is contained */
#coordinatePickerMap .leaflet-container,
#mapSettingsMap .leaflet-container {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* Ensure Leaflet's internal elements are contained */
#coordinatePickerMap .leaflet-pane,
#mapSettingsMap .leaflet-pane {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
}

/* Fix for maps inside modals - ensure they're visible and sized */
.modal.show #coordinatePickerMap,
.modal.show #mapSettingsMap {
    width: 100% !important;
    height: 400px !important;
    min-height: 400px !important;
    max-height: 400px !important;
    visibility: visible !important;
    display: block !important;
    overflow: hidden !important;
}

/* Ensure modal body doesn't interfere with map sizing */
.modal-body #coordinatePickerMap,
.modal-body #mapSettingsMap {
    width: 100% !important;
    height: 400px !important;
    position: relative !important;
    overflow: hidden !important;
}

/* ========================================
   DEFAULT BLOCK MARGINS
   ========================================
   Only blocks with bullet/slide navigation get a bottom gap (so carousel bullets/separator
   don’t overlap the next block). Other blocks have no default gap; use Quick Formatting
   (margin_top/margin_bottom) if you need spacing.
   ======================================== */

/* Gap only after blocks that have bullet/slide navigation (slideshows, carousels with dots) */
.layout-header-blocks .block-admin-wrapper[data-block-slug="Slideshow"],
.layout-header-blocks .block-admin-wrapper[data-block-type="slideshow"],
.layout-header-blocks .block-admin-wrapper[data-block-slug="SlideshowGrid"],
.layout-header-blocks .block-admin-wrapper[data-block-type="slideshowgrid"],
.layout-header-blocks .block-admin-wrapper[data-block-slug="SlideshowInformationCarousel"],
.layout-header-blocks .block-admin-wrapper[data-block-type="slideshowinformationcarousel"],
.layout-header-blocks .block-admin-wrapper[data-block-slug="SlideshowInformationGrid"],
.layout-header-blocks .block-admin-wrapper[data-block-type="slideshowinformationgrid"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="Slideshow"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="slideshow"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="SlideshowGrid"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="slideshowgrid"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="SlideshowInformationCarousel"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="slideshowinformationcarousel"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="SlideshowInformationGrid"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="slideshowinformationgrid"] {
    margin-bottom: 2rem;
}

/* Prevent slides/slideshow grid/carousel from being cut off – allow overflow so content is fully visible */
.layout-header-blocks .block-admin-wrapper[data-block-slug="SlideshowGrid"],
.layout-header-blocks .block-admin-wrapper[data-block-type="slideshowgrid"],
.layout-header-blocks .block-admin-wrapper[data-block-slug="SlideshowInformationCarousel"],
.layout-header-blocks .block-admin-wrapper[data-block-type="slideshowinformationcarousel"],
.layout-header-blocks .block-admin-wrapper[data-block-slug="PromoBanner"],
.layout-header-blocks .block-admin-wrapper[data-block-type="promobanner"],
.layout-header-blocks .block-admin-wrapper[data-block-slug="PromoOffersBanner"],
.layout-header-blocks .block-admin-wrapper[data-block-type="promooffersbanner"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="SlideshowGrid"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="slideshowgrid"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="SlideshowInformationCarousel"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="slideshowinformationcarousel"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="PromoBanner"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="promobanner"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="PromoOffersBanner"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="promooffersbanner"],
.layout-header-blocks .block-admin-wrapper[data-block-slug="Categories"],
.layout-header-blocks .block-admin-wrapper[data-block-type="categories"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="Categories"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="categories"],
.main-content .block-admin-wrapper[data-block-slug="Categories"],
.main-content .block-admin-wrapper[data-block-type="categories"],
.layout-header-blocks .block-admin-wrapper[data-block-slug="OptionList"],
.layout-header-blocks .block-admin-wrapper[data-block-type="optionlist"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="OptionList"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="optionlist"],
.main-content .block-admin-wrapper[data-block-slug="OptionList"],
.main-content .block-admin-wrapper[data-block-type="optionlist"] {
    overflow: visible !important;
}
.slideshow-grid-section,
.slideshow-grid-section .slideshow-grid-container,
.slideshow-grid-section .slideshow-grid-row,
.slideshow-information-section,
.slideshow-information-section .slideshow-information-container,
.slideshow-information-section .slideshow-carousel-row,
.promo-offers-block,
.promo-banner-wrapper {
    overflow: visible !important;
}

/* Flickity carousels: content starts after left arrow, ends before right arrow (symmetric) */
.slideshow-information-section .flickity-viewport,
.editorialcarousel-carousel .flickity-viewport {
    padding-left: 54px !important;
    padding-right: 54px !important;
    box-sizing: border-box !important;
}

/* Main Slideshow block in header: full viewport width, no side clipping */
.layout-header-blocks .block-admin-wrapper[data-block-slug="Slideshow"],
.layout-header-blocks .block-admin-wrapper[data-block-type="slideshow"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="Slideshow"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="slideshow"] {
    overflow: visible !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
}
.layout-header-blocks .block-admin-wrapper[data-block-slug="Slideshow"] .slideshow-simple,
.layout-header-blocks .block-admin-wrapper[data-block-type="slideshow"] .slideshow-simple,
.layout-footer-blocks .block-admin-wrapper[data-block-slug="Slideshow"] .slideshow-simple,
.layout-footer-blocks .block-admin-wrapper[data-block-type="slideshow"] .slideshow-simple {
    width: 100% !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: calc(50vw - 50%) !important;
    padding-right: calc(50vw - 50%) !important;
    box-sizing: border-box !important;
}

/* ImageFeatureCards: full-width background band; grid/carousel inside .container */
.layout-header-blocks .block-admin-wrapper[data-block-slug="ImageFeatureCards"],
.layout-header-blocks .block-admin-wrapper[data-block-type="imagefeaturecards"],
.layout-footer-blocks .block-admin-wrapper[data-block-slug="ImageFeatureCards"],
.layout-footer-blocks .block-admin-wrapper[data-block-type="imagefeaturecards"] {
    overflow: visible !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
}
.layout-header-blocks .block-admin-wrapper[data-block-slug="ImageFeatureCards"] .image-feature-cards-section,
.layout-header-blocks .block-admin-wrapper[data-block-type="imagefeaturecards"] .image-feature-cards-section,
.layout-footer-blocks .block-admin-wrapper[data-block-slug="ImageFeatureCards"] .image-feature-cards-section,
.layout-footer-blocks .block-admin-wrapper[data-block-type="imagefeaturecards"] .image-feature-cards-section {
    width: 100% !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: calc(50vw - 50%) !important;
    padding-right: calc(50vw - 50%) !important;
    box-sizing: border-box !important;
}

/* In container columns use 100% (not 100vw) — vw breakout + overflow-x:clip leaves a white strip on the right */
.main-content .container-column .image-feature-cards-section.ifc-section,
.container-column .image-feature-cards-section.ifc-section {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

/* Slideshow in page body (main-content is edge-to-edge — no negative margin hack) */
.main-content > .block-admin-wrapper[data-block-slug="Slideshow"],
.main-content > .block-admin-wrapper[data-block-type="slideshow"],
.main-content .block-admin-wrapper[data-block-slug="Slideshow"],
.main-content .block-admin-wrapper[data-block-type="slideshow"] {
    overflow: visible !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
}

.main-content > .slideshow-simple,
.main-content > .block-admin-wrapper[data-block-slug="Slideshow"] .slideshow-simple,
.main-content > .block-admin-wrapper[data-block-type="slideshow"] .slideshow-simple,
.main-content .block-admin-wrapper[data-block-slug="Slideshow"] .slideshow-simple,
.main-content .block-admin-wrapper[data-block-type="slideshow"] .slideshow-simple,
.main-content .page-body-block[data-block-slug="Slideshow"] .slideshow-simple {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

/* PromoOffersBanner carousel: equal-height tiles (grid stretch) */
.promo-offers-carousel .promo-offers-scroll-viewport {
    display: block;
}
.promo-offers-carousel .promo-offers-scroll-track {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: calc((100cqw - (var(--promo-visible-cols) - 1) * var(--promo-offers-column-gap)) / var(--promo-visible-cols)) !important;
    align-items: stretch !important;
    gap: var(--promo-offers-column-gap, 8px);
    width: max-content;
    min-width: 100%;
}
.promo-offers-carousel .promo-offers-scroll-track > .promo-offers-bs-col,
.promo-offers-carousel .promo-offers-scroll-track > a.promo-offers-column-link {
    flex: unset !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0;
    align-self: stretch !important;
    min-height: 100%;
    height: auto !important;
}
.promo-offers-carousel a.promo-offers-column-link {
    align-self: stretch !important;
    height: auto !important;
}
.main-content > .promo-offers-block:has(~ .page-body-block[data-block-slug="Slideshow"]),
.main-content > .promo-offers-carousel:has(~ .page-body-block[data-block-slug="Slideshow"]) {
    margin-bottom: 0 !important;
}
.main-content > .promo-offers-block ~ .page-body-block[data-block-slug="Slideshow"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Edge-to-edge page bands: promo strips, banners, fluid containers (no side gaps) */
.main-content > .block-admin-wrapper[data-block-slug="ImageFeatureCards"],
.main-content > .block-admin-wrapper[data-block-type="imagefeaturecards"],
.main-content > .page-body-block[data-block-slug="ImageFeatureCards"],
.main-content > .block-admin-wrapper[data-block-slug="InfoStrip"],
.main-content > .block-admin-wrapper[data-block-type="infostrip"],
.main-content > .block-admin-wrapper[data-block-slug="PromoBanner"],
.main-content > .block-admin-wrapper[data-block-type="promobanner"],
.main-content > .block-admin-wrapper[data-block-slug="PromoOffersBanner"],
.main-content > .block-admin-wrapper[data-block-type="promooffersbanner"],
.main-content > .block-admin-wrapper[data-block-slug="OfferExpiryCounter"],
.main-content > .block-admin-wrapper[data-block-type="offerexpirycounter"],
.main-content > .block-admin-wrapper[data-block-slug="Banner"],
.main-content > .block-admin-wrapper[data-block-type="banner"],
.main-content > .block-admin-wrapper[data-block-slug="SlideshowInformationCarousel"],
.main-content > .block-admin-wrapper[data-block-type="slideshowinformationcarousel"],
.main-content > .block-admin-wrapper[data-block-slug="EditorialCarousel"],
.main-content > .block-admin-wrapper[data-block-type="editorialcarousel"],
.main-content > .block-admin-wrapper[data-block-slug="EditorialGrid"],
.main-content > .block-admin-wrapper[data-block-type="editorialgrid"],
.main-content > .block-admin-wrapper[data-block-slug="CounterStrip"],
.main-content > .block-admin-wrapper[data-block-type="counterstrip"],
.main-content > .block-admin-wrapper[data-block-slug="Container"],
.main-content > .block-admin-wrapper[data-block-type="container"],
.main-content > .block-admin-wrapper[data-block-slug="OptionList"],
.main-content > .block-admin-wrapper[data-block-type="optionlist"],
.main-content > .block-admin-wrapper[data-block-slug="Categories"],
.main-content > .block-admin-wrapper[data-block-type="categories"],
.main-content > .page-body-block[data-block-slug="Categories"],
.main-content > .page-body-block[data-block-type="categories"],
.main-content > .block-admin-wrapper[data-block-slug="NewsletterSignup"],
.main-content > .block-admin-wrapper[data-block-type="newslettersignup"],
.main-content > .page-body-block[data-block-slug="ImageTextSplit"],
.main-content > .page-body-block[data-block-slug="PageHeaderBar"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
}

.main-content .page-body-block[data-block-slug="ImageTextSplit"] .block-admin-wrapper,
.main-content .page-body-block[data-block-slug="PageHeaderBar"] .block-admin-wrapper,
.main-content .imagetextsplit-section {
    overflow: visible !important;
}

.main-content .info-strip,
.main-content .promo-banner-wrapper,
.main-content .promo-banner-block,
.main-content .promo-offers-block,
.main-content .offer-expiry-counter-block,
.main-content .banner-block-container,
.main-content .slideshow-information-section,
.main-content .image-feature-cards-section.ifc-section,
.main-content .image-feature-cards-section.ifc-section--band-bg,
.main-content .categories-block-section--fluid {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* Categories edge-bleed: Quick Formatting horizontal margins must not inset the grid */
.main-content .block-admin-wrapper[data-block-slug="Categories"]:has(.categories-block-section--fluid),
.main-content .block-admin-wrapper[data-block-type="categories"]:has(.categories-block-section--fluid),
.main-content .page-body-block[data-block-slug="Categories"]:has(.categories-block-section--fluid) {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* ImageFeatureCards: full-width background band (box-shadow bleed — no 100vw layout gap) */
.main-content .image-feature-cards-section.ifc-section--band-bg,
.layout-header-blocks .image-feature-cards-section.ifc-section--band-bg,
.layout-footer-blocks .image-feature-cards-section.ifc-section--band-bg,
.container-column .image-feature-cards-section.ifc-section--band-bg {
    box-shadow: 0 0 0 100vmax var(--ifc-section-bg, #ffffff);
    clip-path: inset(0 -100vmax);
    overflow-x: visible !important;
}

/* ImageFeatureCards edge-bleed: section background must span the full row (no QF horizontal inset) */
.main-content .block-admin-wrapper[data-block-slug="ImageFeatureCards"],
.main-content .block-admin-wrapper[data-block-type="imagefeaturecards"],
.main-content .page-body-block[data-block-slug="ImageFeatureCards"],
.main-content .page-body-block[data-block-type="imagefeaturecards"] {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Inline Rich Text: full-width background band; text may sit in inner .qf-content-container */
.main-content .inline-block-wrapper.inline-block-band-bg,
.layout-header-blocks .inline-block-wrapper.inline-block-band-bg,
.layout-footer-blocks .inline-block-wrapper.inline-block-band-bg,
.container-column .inline-block-wrapper.inline-block-band-bg {
    box-shadow: 0 0 0 100vmax var(--inline-block-bg, transparent);
    clip-path: inset(0 -100vmax);
    overflow-x: visible !important;
}

.main-content .block-admin-wrapper[data-block-slug="Inline"]:has(.inline-block-band-bg),
.main-content .block-admin-wrapper[data-block-slug="inline"]:has(.inline-block-band-bg),
.main-content .block-admin-wrapper[data-block-type="inline"]:has(.inline-block-band-bg),
.main-content .page-body-block[data-block-slug="Inline"]:has(.inline-block-band-bg),
.main-content .page-body-block[data-block-type="inline"]:has(.inline-block-band-bg) {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.inline-block-wrapper.inline-block-band-bg {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.inline-block-wrapper.inline-block-band-bg > .qf-content-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

.main-content .image-feature-cards-section.ifc-section--content-fluid,
.main-content .image-feature-cards-section.ifc-section--content-fluid .ifc-inner,
.main-content .image-feature-cards-section.ifc-section--content-fluid .ifc-carousel,
.main-content .image-feature-cards-section.ifc-section--content-fluid .ifc-carousel .flickity-viewport,
.main-content .editorialcarousel-section,
.main-content .editorialgrid-section,
.main-content .counter-strip,
.main-content .container-block-wrapper.container-fluid,
.main-content .container-block-wrapper.container,
.main-content section[data-block-type="optionlist"]:not(.options-carousel-section--contained) > .container-fluid,
.main-content .container-column section[data-block-type="optionlist"],
.main-content .container-column section[data-block-type="optionlist"] .container,
.main-content .container-column section[data-block-type="optionlist"] .container-fluid {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}
.main-content section[data-block-type="optionlist"].options-carousel-section--contained {
    overflow-x: clip !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}
.main-content section[data-block-type="optionlist"].options-carousel-section--contained > .qf-content-container {
    margin-left: auto !important;
    margin-right: auto !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.main-content .block-admin-wrapper section[data-block-type="categories"] > .categories-content--full-bleed,
.main-content .block-admin-wrapper .categories-carousel-section > .categories-content--full-bleed,
.main-content .page-body-block[data-block-slug="Categories"] section[data-block-type="categories"] > .categories-content--full-bleed {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}
.main-content .block-admin-wrapper section[data-block-type="categories"] .categories-content--full-bleed .entity-list-grid.row,
.main-content .page-body-block[data-block-slug="Categories"] section[data-block-type="categories"] .categories-content--full-bleed .entity-list-grid.row,
.main-content section[data-block-type="categories"] .categories-content--full-bleed .entity-list-grid.row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.main-content .block-admin-wrapper section[data-block-type="categories"] .categories-content--full-bleed .entity-list-grid.row > [class*="col-"]:first-child,
.main-content .page-body-block[data-block-slug="Categories"] section[data-block-type="categories"] .categories-content--full-bleed .entity-list-grid.row > [class*="col-"]:first-child,
.main-content section[data-block-type="categories"] .categories-content--full-bleed .entity-list-grid.row > [class*="col-"]:first-child {
    padding-left: 0 !important;
}
.main-content .block-admin-wrapper section[data-block-type="categories"] .categories-content--full-bleed .entity-list-grid.row > [class*="col-"]:last-child,
.main-content .page-body-block[data-block-slug="Categories"] section[data-block-type="categories"] .categories-content--full-bleed .entity-list-grid.row > [class*="col-"]:last-child,
.main-content section[data-block-type="categories"] .categories-content--full-bleed .entity-list-grid.row > [class*="col-"]:last-child {
    padding-right: 0 !important;
}
.main-content .block-admin-wrapper section[data-block-type="categories"] .categories-content--full-bleed .entity-masonry-grid,
.main-content .page-body-block[data-block-slug="Categories"] section[data-block-type="categories"] .categories-content--full-bleed .entity-masonry-grid,
.main-content section[data-block-type="categories"] .categories-content--full-bleed .entity-masonry-grid {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.main-content .newsletter-signup-block {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-top: var(--newsletter-signup-padding-y, 20px) !important;
    padding-bottom: var(--newsletter-signup-padding-y, 20px) !important;
    padding-left: var(--newsletter-signup-padding-x, 24px) !important;
    padding-right: var(--newsletter-signup-padding-x, 24px) !important;
    box-sizing: border-box !important;
}

/* Banner block: user-defined outer margins (override full-bleed reset above) */
.main-content .banner-block-container.banner-block-container--user-margins {
    margin-top: var(--banner-margin-top, 0) !important;
    margin-right: var(--banner-margin-right, 0) !important;
    margin-bottom: var(--banner-margin-bottom, 0) !important;
    margin-left: var(--banner-margin-left, 0) !important;
    width: calc(100% - var(--banner-margin-left, 0px) - var(--banner-margin-right, 0px)) !important;
    max-width: calc(100% - var(--banner-margin-left, 0px) - var(--banner-margin-right, 0px)) !important;
}

/* Banner block: gap only between columns/rows (CSS grid), never on outer edges */
.banner-block-container .row {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: var(--banner-col-gap, 0px);
    row-gap: var(--banner-row-gap, 0px);
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
    height: auto;
}

.banner-block-container .row > [class*="col-"] {
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0;
    grid-column: span 12;
}

.banner-block-container .row > .col-12 {
    grid-column: span 12;
}

@media (min-width: 769px) {
    .banner-block-container .row > .col-6:not(.banner-col-wrapper) {
        grid-column: span 6;
    }

    .banner-block-container .row > .banner-col-wrapper[data-banner-grid-span] {
        grid-column: span var(--banner-grid-span, 12) !important;
    }
}

/* Universal mobile banner layouts — all pages, all height modes (grid mode only; carousel uses banner.css) */
@media (max-width: 768px) {
    /* Default / 1 per row: stack full width */
    .banner-block-container:not([data-mobile-layout="carousel"]):not([data-mobile-columns]) .row.banner-block-row:not(.banner-split-row),
    .banner-block-container:not([data-mobile-layout="carousel"])[data-mobile-columns="1"] .row.banner-block-row:not(.banner-split-row) {
        display: flex !important;
        flex-direction: column !important;
        aspect-ratio: auto !important;
        height: auto !important;
        align-items: stretch !important;
    }

    .banner-block-container:not([data-mobile-layout="carousel"]):not([data-mobile-columns]) .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container:not([data-mobile-layout="carousel"]):not([data-mobile-columns]) .row.banner-block-row:not(.banner-split-row) > [class*="col-"],
    .banner-block-container:not([data-mobile-layout="carousel"]):not([data-mobile-columns]) .banner-col-wrapper[data-banner-grid-span],
    .banner-block-container:not([data-mobile-layout="carousel"])[data-mobile-columns="1"] .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container:not([data-mobile-layout="carousel"])[data-mobile-columns="1"] .row.banner-block-row:not(.banner-split-row) > [class*="col-"],
    .banner-block-container:not([data-mobile-layout="carousel"])[data-mobile-columns="1"] .banner-col-wrapper[data-banner-grid-span] {
        grid-column: span 12 !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        flex: 0 0 auto !important;
        align-self: stretch !important;
    }

    /* 2/3/4 per row: sit side-by-side (grid wrap only) */
    .banner-block-container[data-mobile-layout="grid"][data-mobile-columns="2"] > .row.banner-block-row:not(.banner-split-row),
    .banner-block-container[data-mobile-layout="grid"][data-mobile-columns="3"] > .row.banner-block-row:not(.banner-split-row),
    .banner-block-container[data-mobile-layout="grid"][data-mobile-columns="4"] > .row.banner-block-row:not(.banner-split-row),
    .banner-block-container:not([data-mobile-layout])[data-mobile-columns="2"] > .row.banner-block-row:not(.banner-split-row),
    .banner-block-container:not([data-mobile-layout])[data-mobile-columns="3"] > .row.banner-block-row:not(.banner-split-row),
    .banner-block-container:not([data-mobile-layout])[data-mobile-columns="4"] > .row.banner-block-row:not(.banner-split-row) {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        aspect-ratio: auto !important;
        height: auto !important;
        align-items: stretch !important;
        column-gap: var(--banner-col-gap, 0px);
        row-gap: var(--banner-row-gap, 0px);
    }

    .banner-block-container[data-mobile-layout="grid"][data-mobile-columns="2"] > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="grid"][data-mobile-columns="2"] > .row.banner-block-row:not(.banner-split-row) > [class*="col-"],
    .banner-block-container:not([data-mobile-layout])[data-mobile-columns="2"] > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container:not([data-mobile-layout])[data-mobile-columns="2"] > .row.banner-block-row:not(.banner-split-row) > [class*="col-"] {
        flex: 0 0 calc((100% - var(--banner-col-gap, 0px)) / 2) !important;
        width: calc((100% - var(--banner-col-gap, 0px)) / 2) !important;
        max-width: calc((100% - var(--banner-col-gap, 0px)) / 2) !important;
        grid-column: auto !important;
        height: auto !important;
        align-self: stretch !important;
    }

    .banner-block-container[data-mobile-layout="grid"][data-mobile-columns="3"] > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="grid"][data-mobile-columns="3"] > .row.banner-block-row:not(.banner-split-row) > [class*="col-"],
    .banner-block-container:not([data-mobile-layout])[data-mobile-columns="3"] > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container:not([data-mobile-layout])[data-mobile-columns="3"] > .row.banner-block-row:not(.banner-split-row) > [class*="col-"] {
        flex: 0 0 calc((100% - (2 * var(--banner-col-gap, 0px))) / 3) !important;
        width: calc((100% - (2 * var(--banner-col-gap, 0px))) / 3) !important;
        max-width: calc((100% - (2 * var(--banner-col-gap, 0px))) / 3) !important;
        grid-column: auto !important;
        height: auto !important;
        align-self: stretch !important;
    }

    .banner-block-container[data-mobile-layout="grid"][data-mobile-columns="4"] > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="grid"][data-mobile-columns="4"] > .row.banner-block-row:not(.banner-split-row) > [class*="col-"],
    .banner-block-container:not([data-mobile-layout])[data-mobile-columns="4"] > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container:not([data-mobile-layout])[data-mobile-columns="4"] > .row.banner-block-row:not(.banner-split-row) > [class*="col-"] {
        flex: 0 0 calc((100% - (3 * var(--banner-col-gap, 0px))) / 4) !important;
        width: calc((100% - (3 * var(--banner-col-gap, 0px))) / 4) !important;
        max-width: calc((100% - (3 * var(--banner-col-gap, 0px))) / 4) !important;
        grid-column: auto !important;
        height: auto !important;
        align-self: stretch !important;
    }

    /* Mobile carousel — overrides .banner-block-container .row { display: grid } above */
    .banner-block-container[data-mobile-layout="carousel"] > .row.banner-block-row:not(.banner-split-row),
    .banner-block-container[data-mobile-layout="carousel"] > .banner-block-row:not(.banner-split-row) {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        overscroll-behavior-x: contain;
        touch-action: pan-x pan-y;
        grid-template-columns: none !important;
    }
    .banner-block-container[data-mobile-layout="carousel"] > .row.banner-block-row:not(.banner-split-row)::-webkit-scrollbar,
    .banner-block-container[data-mobile-layout="carousel"] > .banner-block-row:not(.banner-split-row)::-webkit-scrollbar {
        display: none;
    }
    .banner-block-container[data-mobile-layout="carousel"] > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="carousel"] > .row.banner-block-row:not(.banner-split-row) > [class*="col-"],
    .banner-block-container[data-mobile-layout="carousel"] > .banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="carousel"] > .banner-block-row:not(.banner-split-row) > [class*="col-"] {
        flex-grow: 0 !important;
        flex-shrink: 0 !important;
        grid-column: auto !important;
        scroll-snap-align: start;
        scroll-snap-stop: always;
        min-width: 0 !important;
    }
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="1"] > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="1"] > .row.banner-block-row:not(.banner-split-row) > [class*="col-"],
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="1"] > .banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="1"] > .banner-block-row:not(.banner-split-row) > [class*="col-"] {
        flex-basis: 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="2"] > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="2"] > .row.banner-block-row:not(.banner-split-row) > [class*="col-"],
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="2"] > .banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="2"] > .banner-block-row:not(.banner-split-row) > [class*="col-"] {
        flex-basis: calc((100% - var(--banner-col-gap, 0px)) / 2) !important;
        width: calc((100% - var(--banner-col-gap, 0px)) / 2) !important;
        max-width: calc((100% - var(--banner-col-gap, 0px)) / 2) !important;
    }
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="3"] > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="3"] > .row.banner-block-row:not(.banner-split-row) > [class*="col-"],
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="3"] > .banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="3"] > .banner-block-row:not(.banner-split-row) > [class*="col-"] {
        flex-basis: calc((100% - (2 * var(--banner-col-gap, 0px))) / 3) !important;
        width: calc((100% - (2 * var(--banner-col-gap, 0px))) / 3) !important;
        max-width: calc((100% - (2 * var(--banner-col-gap, 0px))) / 3) !important;
    }
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="4"] > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="4"] > .row.banner-block-row:not(.banner-split-row) > [class*="col-"],
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="4"] > .banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container[data-mobile-layout="carousel"][data-mobile-columns="4"] > .banner-block-row:not(.banner-split-row) > [class*="col-"] {
        flex-basis: calc((100% - (3 * var(--banner-col-gap, 0px))) / 4) !important;
        width: calc((100% - (3 * var(--banner-col-gap, 0px))) / 4) !important;
        max-width: calc((100% - (3 * var(--banner-col-gap, 0px))) / 4) !important;
    }
    .banner-block-container[data-mobile-layout="carousel"] .banner-cell:hover {
        transform: none;
    }

    .banner-block-container .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper .banner-cell,
    .banner-block-container .row.banner-block-row:not(.banner-split-row) > [class*="col-"] .banner-cell {
        width: 100% !important;
        height: auto !important;
        flex: 0 0 auto !important;
    }

    .banner-block-container .row.banner-split-row--1-2,
    .banner-block-container .row.banner-split-row--2-1 {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: none !important;
        aspect-ratio: auto !important;
        height: auto !important;
        align-items: stretch !important;
    }

    .banner-block-container .row.banner-split-row--1-2 > .banner-col-wrapper,
    .banner-block-container .row.banner-split-row--2-1 > .banner-col-wrapper,
    .banner-block-container .row.banner-split-row--1-2 > .col-md-8,
    .banner-block-container .row.banner-split-row--1-2 > .col-md-4,
    .banner-block-container .row.banner-split-row--2-1 > .col-md-8,
    .banner-block-container .row.banner-split-row--2-1 > .col-md-4 {
        display: flex !important;
        flex-direction: column !important;
        grid-column: span 12 !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 auto !important;
        height: auto !important;
        min-height: 0 !important;
        align-self: stretch !important;
    }

    .banner-block-container .row.banner-split-row .banner-stack-rows,
    .banner-block-container .row.banner-split-row .banner-right-column,
    .banner-block-container .row.banner-split-row .banner-left-column {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        height: auto !important;
        flex: 0 0 auto !important;
        gap: var(--banner-row-gap, 0px);
    }

    .banner-block-container .row.banner-split-row .banner-stack-rows > [class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 auto !important;
        display: flex !important;
        flex-direction: column !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .banner-block-container .row.banner-split-row .banner-cell,
    .banner-block-container .row.banner-split-row .banner-full-height,
    .banner-block-container .row.banner-split-row .banner-half-height,
    .banner-block-container .row.banner-split-row .banner-large {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        flex: 0 0 auto !important;
    }

    .banner-block-container .row.banner-split-row .banner-fit-cover .banner-inner,
    .banner-block-container .banner-layout-1-2 .banner-fit-cover .banner-inner,
    .banner-block-container .banner-layout-2-1 .banner-fit-cover .banner-inner,
    .banner-block-container .row.banner-block-row:not(.banner-split-row) .banner-fit-cover .banner-inner {
        aspect-ratio: 16 / 9 !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: hidden;
    }

    .banner-block-container .row.banner-split-row .banner-fit-cover .banner-inner img,
    .banner-block-container .row.banner-split-row .banner-fit-cover .banner-base-image,
    .banner-block-container .row.banner-block-row:not(.banner-split-row) .banner-fit-cover .banner-inner img,
    .banner-block-container .row.banner-block-row:not(.banner-split-row) .banner-fit-cover .banner-base-image {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center;
    }

    .banner-block-container > .banner-block-row {
        aspect-ratio: auto !important;
    }

    .banner-block-container .banner-video-overlay {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: 100% !important;
        height: auto !important;
        display: block !important;
        background: transparent;
    }

    .banner-block-container .banner-inner--video-auto,
    .banner-block-container .banner-cell .banner-inner:has(.banner-video-overlay) {
        aspect-ratio: 16 / 9 !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: hidden;
    }

    .banner-block-container .banner-video-overlay iframe,
    .banner-block-container .banner-video-overlay video,
    .banner-block-container .banner-video-player {
        width: 100% !important;
        height: 100% !important;
        aspect-ratio: 16 / 9;
        object-fit: cover;
        display: block;
        border: 0;
    }

    .banner-block-container--fixed-height-mobile .banner-cell,
    .banner-block-container--fixed-height-mobile .banner-full-height,
    .banner-block-container--fixed-height-mobile .banner-half-height,
    .banner-block-container--fixed-height-mobile .banner-large {
        height: auto !important;
        min-height: 0 !important;
    }

    .banner-block-container--height-auto-mobile > .banner-block-row:not(.banner-split-row) {
        align-items: stretch !important;
    }

    .banner-block-container--height-auto-mobile > .banner-block-row:not(.banner-split-row) > [class*="col-"]:not(.col-12),
    .banner-block-container--height-auto-mobile > .banner-block-row:not(.banner-split-row) > .banner-col-wrapper {
        align-self: stretch !important;
        display: flex;
        flex-direction: column;
    }

    .banner-block-container--height-auto-mobile > .banner-block-row:not(.banner-split-row) > [class*="col-"]:not(.col-12) .banner-cell--text,
    .banner-block-container--height-auto-mobile > .banner-block-row:not(.banner-split-row) > .banner-col-wrapper .banner-cell--text {
        flex: 1 1 auto;
        height: 100% !important;
        min-height: 100%;
    }

    .banner-block-container--height-auto-mobile > .banner-block-row:not(.banner-split-row) > [class*="col-"]:not(.col-12) .banner-cell--text .banner-inner--text,
    .banner-block-container--height-auto-mobile > .banner-block-row:not(.banner-split-row) > .banner-col-wrapper .banner-cell--text .banner-inner--text {
        height: 100% !important;
        min-height: 100%;
        box-sizing: border-box;
    }
}

@media (min-width: 769px) {
    .banner-block-container.banner-layout-6x1 > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper {
        grid-column: span var(--banner-grid-span, 2) !important;
    }

    .banner-block-container.banner-layout-6x1.banner-block-container--height-auto-desktop > .row.banner-block-row:not(.banner-split-row) {
        aspect-ratio: auto !important;
        height: auto !important;
        align-items: start;
    }

    .banner-block-container.banner-layout-6x1.banner-block-container--height-auto-desktop > .row.banner-block-row:not(.banner-split-row) > .banner-col-wrapper,
    .banner-block-container.banner-layout-6x1.banner-block-container--height-auto-desktop > .row.banner-block-row:not(.banner-split-row) > [class*="col-"] {
        height: auto !important;
        align-self: start !important;
    }

    .banner-block-container .row > .col-md-2 {
        grid-column: span 2;
    }

    .banner-block-container .row > .col-md-3 {
        grid-column: span 3;
    }

    .banner-block-container .row > .col-md-4 {
        grid-column: span 4;
    }

    .banner-block-container .row > .col-md-6 {
        grid-column: span 6;
    }

    .banner-block-container .row > .col-md-8 {
        grid-column: span 8;
    }
}

@media (max-width: 768px) {
    .banner-block-container .row.banner-split-row--1-2 > .col-md-8,
    .banner-block-container .row.banner-split-row--1-2 > .col-md-4,
    .banner-block-container .row.banner-split-row--2-1 > .col-md-8,
    .banner-block-container .row.banner-split-row--2-1 > .col-md-4,
    .banner-block-container .row.banner-split-row--1-2 > .banner-col-wrapper,
    .banner-block-container .row.banner-split-row--2-1 > .banner-col-wrapper {
        grid-column: span 12 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

.banner-block-container .row.banner-right-column {
    display: flex !important;
    flex-direction: column;
    grid-template-columns: unset;
    justify-content: flex-start;
    gap: var(--banner-row-gap, 0px);
}

.banner-block-container .banner-inner {
    margin: 0 !important;
}

/* Footer: full viewport width, background edge-to-edge */
.footer-container-block-wrapper,
.layout-footer-blocks > .block-admin-wrapper[data-block-slug="Footer"],
.layout-footer-blocks > .block-admin-wrapper[data-block-type="footer"] {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

.layout-footer-blocks,
.layout-footer-blocks .footer-container-block-wrapper,
footer.footer-container-outer,
.footer-container-block-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

.footer-container-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.footer-container-content > .container-fluid.container-block-wrapper,
.footer-container-content > .container.container-block-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
    box-sizing: border-box !important;
}

.footer-container-outer .footer-bar-block,
footer.footer-container-outer .footer-bar-block,
.layout-footer-blocks .footer-bar-block {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: auto !important;
    right: auto !important;
    box-sizing: border-box !important;
}

.footer-container-outer .footer-bar-inner,
footer.footer-container-outer .footer-bar-inner {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* Copyright bar: keep "Created with … by" on the same colour as copyright + fosetico link */
.footer-bar-block .footer-bar-copyright,
.footer-bar-block .footer-bar-copyright-text,
.footer-bar-block .footer-bar-love {
    color: var(--footer-bar-text, #6b7280);
}
.footer-bar-block a.footer-bar-link,
.footer-bar-block a.footer-bar-link:visited {
    color: var(--footer-bar-link, var(--footer-bar-text, #6b7280));
}

/* Prevent 100vw full-bleed hacks from causing a white strip beside the scrollbar.
   Clip only on body — setting overflow-x on both html AND body locks vertical
   scrolling on iOS Safari (page appears stuck / cannot scroll on mobile). */
html {
    overflow-x: visible;
}

body {
    max-width: 100%;
    overflow-x: clip;
}

/* Carousel/banner blocks in header: full width and centered (not 95% starting from left) */
.layout-header-blocks .block-admin-wrapper[data-block-slug="SlideshowInformationCarousel"] .slideshow-information-section,
.layout-header-blocks .block-admin-wrapper[data-block-type="slideshowinformationcarousel"] .slideshow-information-section,
.layout-header-blocks .block-admin-wrapper[data-block-slug="PromoOffersBanner"] .promo-offers-block,
.layout-header-blocks .block-admin-wrapper[data-block-type="promooffersbanner"] .promo-offers-block,
.layout-header-blocks .block-admin-wrapper[data-block-slug="PromoBanner"] .promo-banner-wrapper,
.layout-header-blocks .block-admin-wrapper[data-block-type="promobanner"] .promo-banner-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
.layout-header-blocks .block-admin-wrapper[data-block-slug="SlideshowInformationCarousel"] .slideshow-information-container,
.layout-header-blocks .block-admin-wrapper[data-block-type="slideshowinformationcarousel"] .slideshow-information-container {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Block roots: no default margin/padding here to avoid unwanted spacing on nested elements.
   Use Quick Formatting (margin_top/margin_bottom) or wrapper-level spacing for block gaps. */
section[data-block-type],
div[data-block-type],
[data-block-type] {
    margin: 0;
    padding: 0;
}

/* Blocks that should have zero margin by default */
/* These are typically layout/navigation blocks that should be flush */
section[data-block-type="footer"],
div[data-block-type="footer"],
[data-block-type="footer"],
section[data-block-type="headersecondarybar"],
div[data-block-type="headersecondarybar"],
[data-block-type="headersecondarybar"],
section[data-block-type="menucenteredicon"],
div[data-block-type="menucenteredicon"],
[data-block-type="menucenteredicon"],
section[data-block-type="menu"],
div[data-block-type="menu"],
[data-block-type="menu"],
section[data-block-type="slideshow"],
div[data-block-type="slideshow"],
[data-block-type="slideshow"],
section[data-block-type="header"],
div[data-block-type="header"],
[data-block-type="header"],
section[data-block-type="inline"],
div[data-block-type="inline"],
[data-block-type="inline"],
section[data-block-type="Inline"],
div[data-block-type="Inline"],
[data-block-type="Inline"] {
    margin-top: 0;
    margin-bottom: 0;
}

/* Also handle case variations and block slug variations */
section[data-block-slug="Footer"],
div[data-block-slug="Footer"],
[data-block-slug="Footer"],
section[data-block-slug="HeaderSecondaryBar"],
div[data-block-slug="HeaderSecondaryBar"],
[data-block-slug="HeaderSecondaryBar"],
section[data-block-slug="MenuCenteredIcon"],
div[data-block-slug="MenuCenteredIcon"],
[data-block-slug="MenuCenteredIcon"],
section[data-block-slug="Slideshow"],
div[data-block-slug="Slideshow"],
[data-block-slug="Slideshow"],
section[data-block-slug="Header"],
div[data-block-slug="Header"],
[data-block-slug="Header"],
section[data-block-slug="Inline"],
div[data-block-slug="Inline"],
[data-block-slug="Inline"],
section[data-block-slug="inline"],
div[data-block-slug="inline"],
[data-block-slug="inline"],
section[data-block-slug="HeaderMenuSearchCallBlock"],
div[data-block-slug="HeaderMenuSearchCallBlock"],
[data-block-slug="HeaderMenuSearchCallBlock"],
section[data-block-slug="PageHeaderBar"],
div[data-block-slug="PageHeaderBar"],
[data-block-slug="PageHeaderBar"],
.page-header-bar-block,
.main-content > .page-body-block:first-child[data-block-slug="PageHeaderBar"] {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.layout-header-blocks {
    margin-bottom: 0 !important;
}

#kalles-section-header_top.header-menu-search-call-block {
    margin-bottom: 0 !important;
}

/* PageHeaderBar under site header: remove white strip (works when language bar or other UI precedes the block) */
body:has(.main-content .page-body-block[data-block-slug="PageHeaderBar"]) #kalles-section-header_top,
body:has(.main-content .page-body-block[data-block-slug="PageHeaderBar"]) #kalles-section-header_top .header-container,
body:has(.main-content .page-body-block[data-block-slug="PageHeaderBar"]) #kalles-section-header_top .navbar-wrapper,
body:has(.main-content .page-body-block[data-block-slug="PageHeaderBar"]) #kalles-section-header_top .navbar-custom,
body:has(.main-content .page-body-block[data-block-slug="PageHeaderBar"]) .header-menu-search-call-block,
body:has(.main-content .page-body-block[data-block-slug="PageHeaderBar"]) .header-menu-logo-left-block,
body:has(.main-content .page-body-block[data-block-slug="PageHeaderBar"]) .layout-header-blocks,
body:has(.main-content .page-body-block[data-block-slug="PageHeaderBar"]) .layout-header {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

body:has(.main-content .page-body-block[data-block-slug="PageHeaderBar"]) .main-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
    clear: none !important;
}

.main-content > .page-body-block[data-block-slug="PageHeaderBar"],
.main-content .page-body-block[data-block-slug="PageHeaderBar"] .block-admin-wrapper,
.block-admin-wrapper[data-block-slug="PageHeaderBar"],
.block-admin-wrapper[data-block-type="pageheaderbar"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Legacy: first-child-only rules kept for older markup */
body:has(.main-content > .page-body-block:first-child[data-block-slug="PageHeaderBar"]) #kalles-section-header_top.header-menu-search-call-block .header-container,
body:has(.main-content > .page-body-block:first-child[data-block-slug="PageHeaderBar"]) #kalles-section-header_top.header-menu-search-call-block .navbar-wrapper,
body:has(.main-content > .page-body-block:first-child[data-block-slug="PageHeaderBar"]) #kalles-section-header_top.header-menu-search-call-block .navbar-custom,
body:has(.main-content > .page-body-block:first-child[data-block-slug="PageHeaderBar"]) #kalles-section-header_top.header-menu-search-call-block,
body:has(.main-content > .page-body-block:first-child[data-block-slug="PageHeaderBar"]) .header-menu-search-call-block {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

body:has(.main-content > .page-body-block:first-child[data-block-slug="PageHeaderBar"]) .main-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
    clear: none !important;
}

body:has(.main-content > .page-body-block:first-child[data-block-slug="PageHeaderBar"]) .main-content > .page-body-block:first-child[data-block-slug="PageHeaderBar"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* First block on page should not have top margin */
section[data-block-type]:first-child,
div[data-block-type]:first-child,
[data-block-type]:first-child {
    margin-top: 0;
}

/* Note: Inline styles from Quick Formatting modal will automatically override 
   these defaults due to higher specificity. Setting margin_top/margin_bottom 
   to 0px in Quick Formatting will remove the default margins. */

/* PromoBanner, PromoOffersBanner, InfoStrip, OfferExpiryCounter, EditorialCarousel, CounterStrip, CounterProgressCards: no margins (flush banners/strips) */
.block-admin-wrapper[data-block-slug="PromoBanner"],
.block-admin-wrapper[data-block-type="promobanner"],
.block-admin-wrapper[data-block-slug="PromoOffersBanner"],
.block-admin-wrapper[data-block-type="promooffersbanner"],
.block-admin-wrapper[data-block-slug="InfoStrip"],
.block-admin-wrapper[data-block-type="infostrip"],
.block-admin-wrapper[data-block-slug="OfferExpiryCounter"],
.block-admin-wrapper[data-block-type="offerexpirycounter"],
.block-admin-wrapper[data-block-slug="EditorialCarousel"],
.block-admin-wrapper[data-block-type="editorialcarousel"],
.block-admin-wrapper[data-block-slug="EditorialGrid"],
.block-admin-wrapper[data-block-type="editorialgrid"],
.block-admin-wrapper[data-block-slug="CounterStrip"],
.block-admin-wrapper[data-block-type="counterstrip"],
.block-admin-wrapper[data-block-slug="CounterProgressCards"],
.block-admin-wrapper[data-block-type="counterprogresscards"],
.block-admin-wrapper[data-block-slug="MembersClubBanner"],
.block-admin-wrapper[data-block-type="membersclubbanner"],
.block-admin-wrapper[data-block-slug="NewsletterSignup"],
.block-admin-wrapper[data-block-type="newslettersignup"],
.block-admin-wrapper[data-block-slug="PageHeaderBar"],
.block-admin-wrapper[data-block-type="pageheaderbar"] {
    margin: 0 !important;
    padding: 0 !important;
}
.block-admin-wrapper[data-block-slug="PromoOffersBanner"] .promo-offers-block,
.block-admin-wrapper[data-block-type="promooffersbanner"] .promo-offers-block {
    margin: 0 !important;
}

/* Search / utility pages: minimal gap between site header and filters grid */
.main-content > .header-block--compact {
    margin-bottom: 0 !important;
}
.main-content > .header-block--compact + section[data-block-type="productswithfilters"],
.main-content > .header-block--compact + [data-block-type="productswithfilters"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
.main-content > .header-block--compact .header-content {
    padding-top: 0.35rem !important;
    padding-bottom: 0.35rem !important;
}
.main-content > .header-block--compact .header-dynamic-title,
.main-content > .header-block--compact .header-title {
    font-size: clamp(1.35rem, 3vw, 1.75rem) !important;
}

/* Block root elements (when no wrapper on public pages) - remove margins */
.promo-banner-wrapper,
.promo-banner-block,
.promo-offers-carousel,
.promo-offers-block,
.info-strip,
.offer-expiry-counter-block,
.editorialcarousel-section,
.editorialgrid-section,
.counter-strip,
.counter-progress-cards-block {
    margin: 0 !important;
}

/* No top margin on block that immediately follows these promo-type blocks */
.promo-banner-wrapper + *,
.promo-banner-block + *,
.promo-offers-carousel + *,
.promo-offers-block + *,
.promo-offers-block ~ .page-body-block[data-block-slug="Slideshow"],
.promo-offers-carousel ~ .page-body-block[data-block-slug="Slideshow"],
.main-content > .promo-offers-block ~ .page-body-block[data-block-slug="Slideshow"] .slideshow-simple,
.main-content > .promo-offers-carousel ~ .page-body-block[data-block-slug="Slideshow"] .slideshow-simple,
.info-strip + *,
.offer-expiry-counter-block + *,
.editorialcarousel-section + *,
.editorialgrid-section + *,
.counter-strip + *,
.counter-progress-cards-block + *,
.block-admin-wrapper[data-block-slug="PromoBanner"] + .block-admin-wrapper,
.block-admin-wrapper[data-block-slug="PromoOffersBanner"] + .block-admin-wrapper,
.block-admin-wrapper[data-block-slug="InfoStrip"] + .block-admin-wrapper,
.block-admin-wrapper[data-block-slug="OfferExpiryCounter"] + .block-admin-wrapper,
.block-admin-wrapper[data-block-slug="EditorialCarousel"] + .block-admin-wrapper,
.block-admin-wrapper[data-block-slug="EditorialGrid"] + .block-admin-wrapper,
.block-admin-wrapper[data-block-slug="CounterStrip"] + .block-admin-wrapper,
.block-admin-wrapper[data-block-slug="CounterProgressCards"] + .block-admin-wrapper,
.block-admin-wrapper[data-block-slug="NewsletterSignup"] + .block-admin-wrapper,
.block-admin-wrapper[data-block-type="newslettersignup"] + .block-admin-wrapper {
    margin-top: 0 !important;
}

/* NewsletterSignup: no dead gap from preceding block bottom margin */
.main-content > .page-body-block:has(+ .page-body-block[data-block-slug="NewsletterSignup"]) .block-admin-wrapper,
.main-content > .page-body-block:has(+ .page-body-block[data-block-slug="NewsletterSignup"]) [data-block-type],
.main-content > .page-body-block:has(+ .page-body-block[data-block-slug="NewsletterSignup"]) {
    margin-bottom: 0 !important;
}

.main-content > .page-body-block[data-block-slug="NewsletterSignup"] {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* NewsletterSignup: user margins beat master [data-block-type] default 2rem bottom gap */
.main-content .newsletter-signup-block[data-block-type],
.main-content .block-admin-wrapper[data-block-slug="NewsletterSignup"] .newsletter-signup-block,
.main-content .block-admin-wrapper[data-block-type="newslettersignup"] .newsletter-signup-block {
    margin-top: var(--newsletter-signup-margin-top, 0px) !important;
    margin-bottom: var(--newsletter-signup-margin-bottom, 0px) !important;
}

/* ServiceFeatureCards: outer margin from block Appearance settings (not global 2rem) */
.main-content .service-feature-cards-block[data-block-type="servicefeaturecards"],
.main-content .block-admin-wrapper[data-block-slug="ServiceFeatureCards"] .service-feature-cards-block {
    margin-top: var(--sfc-block-margin-top, 0) !important;
    margin-bottom: var(--sfc-block-margin-bottom, 0) !important;
}

/* ImageFeatureCards: outer margin from block Appearance settings */
.main-content .image-feature-cards-section[data-block-type="imagefeaturecards"],
.main-content .block-admin-wrapper[data-block-slug="ImageFeatureCards"] .image-feature-cards-section,
.layout-header-blocks .block-admin-wrapper[data-block-slug="ImageFeatureCards"] .image-feature-cards-section,
.layout-footer-blocks .block-admin-wrapper[data-block-slug="ImageFeatureCards"] .image-feature-cards-section {
    margin-top: var(--ifc-block-margin-top, 0) !important;
    margin-bottom: var(--ifc-block-margin-bottom, 0) !important;
}

.block-admin-wrapper[data-block-slug="ImageFeatureCards"],
.block-admin-wrapper[data-block-type="imagefeaturecards"] {
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Page builder: compact horizontal form — keep Edit form on the form row, not in dead space below */
body.pagebuilder-mode .block-admin-wrapper[data-block-slug="NewsletterSignup"] .newsletter-signup-form-wrap .pb-form-edit-hint,
body.pagebuilder-mode .block-admin-wrapper[data-block-type="newslettersignup"] .newsletter-signup-form-wrap .pb-form-edit-hint {
    top: 4px;
    bottom: auto;
    transform: none;
}

body.pagebuilder-mode .block-admin-wrapper[data-block-slug="NewsletterSignup"] .newsletter-signup-form-wrap,
body.pagebuilder-mode .block-admin-wrapper[data-block-type="newslettersignup"] .newsletter-signup-form-wrap {
    overflow: visible;
}

/* When Quick Formatting sets margin to 0, also zero the inner block content
   (block views often output section/div with data-block-type which gets the
   default 40px margin; the wrapper has inline style but inner element needs this) */
.block-admin-wrapper[data-qf-margin-top="0px"] [data-block-type],
.block-admin-wrapper[data-qf-margin-top="0"] [data-block-type] {
    margin-top: 0 !important;
}
.block-admin-wrapper[data-qf-margin-bottom="0px"] [data-block-type],
.block-admin-wrapper[data-qf-margin-bottom="0"] [data-block-type] {
    margin-bottom: 0 !important;
}

/* Inline rich-text: no default block bottom gap (Quick Formatting margin_bottom sets wrapper inline style) */
.main-content .block-admin-wrapper[data-block-type="inline"] [data-block-type],
.main-content .block-admin-wrapper[data-block-type="Inline"] [data-block-type],
.main-content .block-admin-wrapper[data-block-slug="Inline"] [data-block-type],
.main-content .inline-block-wrapper[data-block-type="inline"],
.main-content .inline-content[data-block-type="inline"],
.main-content .inline-column-content[data-block-type="inline"] {
    margin-bottom: 0 !important;
}

/* Quick Formatting Modal Styles */
#quick-formatting-modal {
    z-index: 100000 !important;
}

#quick-formatting-modal.show {
    z-index: 100000 !important;
}

#quick-formatting-modal .modal-dialog {
    max-width: 900px;
    z-index: 100001 !important;
}

#quick-formatting-modal .modal-content {
    z-index: 100002 !important;
}

#quick-formatting-modal .modal-body {
    max-height: 60vh;
    overflow-y: auto;
    padding: 1.5rem;
}

/* Ensure backdrop is behind Quick Formatting modal */
#quick-formatting-modal.show ~ .modal-backdrop,
#quick-formatting-modal.show + .modal-backdrop {
    z-index: 99999 !important;
}

/* When Quick Formatting modal is shown, ensure its backdrop is lower */
body:has(#quick-formatting-modal.show) .modal-backdrop {
    z-index: 99999 !important;
}

#quick-formatting-modal .modal-body::-webkit-scrollbar {
    width: 6px;
}

#quick-formatting-modal .modal-body::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

#quick-formatting-modal .modal-body::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

#quick-formatting-modal .modal-body::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

#quick-formatting-modal .form-label {
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
}

#quick-formatting-modal .form-control,
#quick-formatting-modal .form-select {
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    padding: 0.5rem 0.75rem;
}

#quick-formatting-modal .form-control:focus,
#quick-formatting-modal .form-select:focus {
    border-color: #86b7fe;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

#quick-formatting-modal h6 {
    color: #6c757d;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e9ecef;
}

/* Quick Formatting in-modal preview panel */
#quick-formatting-modal .quick-format-preview-panel {
    position: sticky;
    top: 0;
}
#quick-formatting-modal .quick-format-preview-sample {
    display: block;
    margin-top: 2px;
}
#quick-formatting-modal .quick-format-preview-sample[data-class-key="link"] {
    text-decoration: underline;
    cursor: pointer;
}

/* Quick View Size Buttons Styling */
#product-sizes .size-options .square-rg,
.product-sizes-quickview .size-options .square-rg {
    display: inline-block;
    min-width: 45px;
    height: 45px;
    padding: 8px 12px;
    margin: 4px;
    text-align: center;
    text-decoration: none;
    color: #333;
    background-color: #fff;
    border: 2px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    cursor: pointer;
    transition: all 0.3s ease;
    user-select: none;
}

#product-sizes .size-options .square-rg:hover,
.product-sizes-quickview .size-options .square-rg:hover {
    background-color: #f8f9fa;
    border-color: #007bff;
    color: #007bff;
    transform: translateY(-2px);
    box-shadow: 0 2px 4px rgba(0, 123, 255, 0.2);
}

#product-sizes .size-options .square-rg.active-size,
.product-sizes-quickview .size-options .square-rg.active-size {
    background-color: #007bff;
    border-color: #007bff;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.3);
}

#product-sizes .size-options .square-rg.active-size:hover,
.product-sizes-quickview .size-options .square-rg.active-size:hover {
    background-color: #0056b3;
    border-color: #0056b3;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 123, 255, 0.4);
}

/* Disabled state for out of stock sizes */
#product-sizes .size-options .square-rg.disabled,
.product-sizes-quickview .size-options .square-rg.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    background-color: #f5f5f5;
    border-color: #ccc;
    color: #999;
}

#product-sizes .size-options .square-rg.disabled:hover,
.product-sizes-quickview .size-options .square-rg.disabled:hover {
    transform: none;
    box-shadow: none;
    border-color: #ccc;
    background-color: #f5f5f5;
    color: #999;
}

/* Quick View Carousel Arrow Controls - Fixed Position and Light Grey Background */
#quickViewModel .carousel-control-prev,
#quickViewModel .carousel-control-next,
.modal .carousel-control-prev,
.modal .carousel-control-next {
    width: 40px !important;
    height: 40px !important;
    background-color: #e9ecef !important; /* Light grey background */
    border: 1px solid #dee2e6 !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    opacity: 1 !important;
    transition: background-color 0.2s ease !important; /* Only allow background color transitions */
    margin: 0 !important;
    padding: 0 !important;
    will-change: auto !important; /* Prevent browser optimization that might cause movement */
}

/* Prevent any transforms during carousel slide transitions */
#quickViewModel .carousel.slide .carousel-control-prev,
#quickViewModel .carousel.slide .carousel-control-next,
#quickViewModel .carousel.sliding .carousel-control-prev,
#quickViewModel .carousel.sliding .carousel-control-next,
.modal .carousel.slide .carousel-control-prev,
.modal .carousel.slide .carousel-control-next,
.modal .carousel.sliding .carousel-control-prev,
.modal .carousel.sliding .carousel-control-next {
    transform: translateY(-50%) !important;
    transition: background-color 0.2s ease !important;
}

/* Ensure arrows stay fixed even when carousel is transitioning */
#quickViewModel .carousel[data-bs-ride] .carousel-control-prev,
#quickViewModel .carousel[data-bs-ride] .carousel-control-next,
.modal .carousel[data-bs-ride] .carousel-control-prev,
.modal .carousel[data-bs-ride] .carousel-control-next {
    transform: translateY(-50%) !important;
}

/* Override any Bootstrap carousel transitions that might affect controls */
#quickViewModel .carousel .carousel-control-prev,
#quickViewModel .carousel .carousel-control-next,
#quickViewModel .carousel-item .carousel-control-prev,
#quickViewModel .carousel-item .carousel-control-next,
.modal .carousel .carousel-control-prev,
.modal .carousel .carousel-control-next,
.modal .carousel-item .carousel-control-prev,
.modal .carousel-item .carousel-control-next {
    transform: translateY(-50%) !important;
    transition: background-color 0.2s ease !important;
}

/* Prevent any movement during carousel animation states */
#quickViewModel .carousel.carousel-slide .carousel-control-prev,
#quickViewModel .carousel.carousel-slide .carousel-control-next,
#quickViewModel .carousel.carousel-fade .carousel-control-prev,
#quickViewModel .carousel.carousel-fade .carousel-control-next,
.modal .carousel.carousel-slide .carousel-control-prev,
.modal .carousel.carousel-slide .carousel-control-next,
.modal .carousel.carousel-fade .carousel-control-prev,
.modal .carousel.carousel-fade .carousel-control-next {
    transform: translateY(-50%) !important;
}

#quickViewModel .carousel-control-prev,
.modal .carousel-control-prev {
    left: 10px !important;
}

#quickViewModel .carousel-control-next,
.modal .carousel-control-next {
    right: 10px !important;
}

#quickViewModel .carousel-control-prev:hover,
#quickViewModel .carousel-control-next:hover,
.modal .carousel-control-prev:hover,
.modal .carousel-control-next:hover {
    background-color: #d0d4d8 !important; /* Slightly darker grey on hover */
    transform: translateY(-50%) !important; /* Keep position fixed on hover */
}

#quickViewModel .carousel-control-prev:active,
#quickViewModel .carousel-control-next:active,
.modal .carousel-control-prev:active,
.modal .carousel-control-next:active {
    transform: translateY(-50%) !important; /* Keep position fixed on click */
    background-color: #c6cbd0 !important; /* Slightly darker on click */
}

#quickViewModel .carousel-control-prev-icon,
#quickViewModel .carousel-control-next-icon,
.modal .carousel-control-prev-icon,
.modal .carousel-control-next-icon {
    width: 20px !important;
    height: 20px !important;
    background-size: 100% 100% !important;
    filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0%) contrast(100%) !important; /* Black icon */
}

#quickViewModel .carousel-control-prev:hover .carousel-control-prev-icon,
#quickViewModel .carousel-control-next:hover .carousel-control-next-icon,
.modal .carousel-control-prev:hover .carousel-control-prev-icon,
.modal .carousel-control-next:hover .carousel-control-next-icon {
    filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0%) contrast(100%) !important; /* Keep black on hover */
}

/* Footer column partials (moved out of partials to avoid encoded <style> output) */
.partial-contact-column { margin-bottom: 1rem; }
.partial-contact-column-heading {
    font-size: 0.95rem;
    font-weight: bold;
    margin: 0 0 0.75rem 0;
    color: inherit;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.partial-contact-column-content { font-size: 0.9rem; color: inherit; }
.partial-contact-column-item {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin: 0 0 0.5rem 0;
}
.partial-contact-column-icon {
    flex-shrink: 0;
    width: 1.25rem;
    font-size: 0.95rem;
    line-height: 1.3;
    text-align: center;
}
.partial-contact-column-link {
    color: inherit;
    text-decoration: none;
}
.partial-contact-column-link:hover { text-decoration: underline; }
.partial-contact-column-subheading {
    margin: 0 0 0.75rem 0;
    font-size: 0.9rem;
    font-weight: 400;
    color: inherit;
}
.partial-contact-column--compact .partial-contact-column-value--phone,
.partial-contact-column--compact .partial-contact-column-item--phone .partial-contact-column-link,
.partial-contact-column--compact .partial-contact-column-item--phone span {
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.3;
}
.partial-contact-column--compact .partial-contact-column-item--phone .partial-contact-column-icon {
    margin-top: 0.15rem;
}
.partial-blog-teaser-column { margin-top: 1.5rem; }
.partial-blog-teaser-column-heading {
    font-size: 0.95rem;
    font-weight: bold;
    margin: 0 0 0.75rem 0;
    color: inherit;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.partial-blog-teaser-column-text {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.5;
    color: inherit;
}
.partial-blog-teaser-column-link {
    display: inline-block;
    color: inherit;
    text-decoration: none;
}
.partial-blog-teaser-column-link:hover { text-decoration: underline; }

.partial-menu-column { margin-bottom: 1rem; }
.partial-menu-column-heading {
    font-size: 0.95rem;
    font-weight: bold;
    margin: 0 0 0.75rem 0;
    color: inherit;
    text-transform: var(--pmc-text-transform, uppercase);
    letter-spacing: 0.02em;
}
.partial-menu-column--regular {
    --pmc-text-transform: none;
}
.partial-menu-column--regular .partial-menu-column-heading {
    letter-spacing: normal;
}
.partial-menu-column--uppercase {
    --pmc-text-transform: uppercase;
}
.partial-menu-column-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.partial-menu-column-list li { margin-bottom: 0.5rem; }
.partial-menu-column-link {
    color: inherit;
    text-decoration: none;
    text-transform: var(--pmc-text-transform, none);
}
.partial-menu-column--uppercase .partial-menu-column-link {
    text-transform: uppercase;
}
.partial-menu-column-link:hover { text-decoration: underline; }

.partial-social-column { margin-bottom: 1rem; }
.partial-social-column-heading {
    font-size: 0.95rem;
    font-weight: bold;
    margin: 0 0 0.75rem 0;
    color: inherit;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.partial-social-column-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.partial-social-column-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
    text-decoration: none;
    transition: opacity 0.2s, background 0.2s, color 0.2s;
}
.partial-social-column--plain .partial-social-column-links {
    gap: 1rem;
}
.partial-social-column--plain .partial-social-column-link {
    width: auto;
    height: auto;
    border: none;
    border-radius: 0;
    font-size: 1.25rem;
    padding: 0;
}
.partial-social-column--plain .partial-social-column-link:hover {
    background: transparent;
    opacity: 0.75;
}
.partial-social-column--boxed .partial-social-column-link {
    width: 36px;
    height: 36px;
    border: 1px solid currentColor;
    border-radius: 4px;
    opacity: 0.85;
}
.partial-social-column--boxed .partial-social-column-link:hover {
    opacity: 1;
    background: currentColor;
    color: #fff;
}

.partial-newsletter-column { margin-bottom: 1rem; }
.partial-newsletter-column-heading {
    font-size: 0.95rem;
    font-weight: bold;
    margin: 0 0 0.75rem 0;
    color: #000;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.partial-newsletter-column-description {
    font-size: 0.9rem;
    color: #555;
    margin: 0 0 1rem 0;
    line-height: 1.4;
}
.partial-newsletter-column-row {
    display: flex;
    align-items: stretch;
    margin-bottom: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 50rem;
    overflow: hidden;
    background: #fff;
}
.partial-newsletter-column-input {
    flex: 1;
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 50rem 0 0 50rem;
    font-size: 0.9rem;
    min-width: 0;
    background: var(--partial-newsletter-input-bg, #f3f4f6);
    color: var(--partial-newsletter-input-text, #111827);
    -webkit-text-fill-color: var(--partial-newsletter-input-text, #111827);
    caret-color: var(--partial-newsletter-input-text, #111827);
}
.partial-newsletter-column-input:focus {
    outline: none;
}
.partial-newsletter-column-input::placeholder {
    color: var(--partial-newsletter-placeholder-color, #6b7280) !important;
    opacity: 1;
}
/* Footer text colour must not override newsletter input contrast */
.footer-container-content .partial-newsletter-column-input,
.footer-container-content .newsletter-signup-email {
    color: var(--partial-newsletter-input-text, #111827) !important;
    -webkit-text-fill-color: var(--partial-newsletter-input-text, #111827) !important;
    background-color: var(--partial-newsletter-input-bg, #f3f4f6) !important;
}
.footer-container-content .partial-newsletter-column-input::placeholder,
.footer-container-content .newsletter-signup-email::placeholder {
    color: var(--partial-newsletter-placeholder-color, #6b7280) !important;
    opacity: 1 !important;
}
.partial-newsletter-column-btn {
    padding: 0.5rem 1.25rem;
    border: none;
    border-radius: 0 50rem 50rem 0;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
}
.partial-newsletter-column-btn-square {
    border-radius: 0 !important;
}
.partial-newsletter-column-btn:hover { opacity: 0.9; }
.partial-newsletter-column-message {
    font-size: 0.85rem;
    margin-top: 0.5rem;
    padding: 0.5rem;
    border-radius: 4px;
}
.partial-newsletter-column-message.success { background: #d4edda; color: #155724; }
.partial-newsletter-column-message.error { background: #f8d7da; color: #721c24; }
/* GDPR consent copy under contact / newsletter / checkout forms */
.gdpr-form-consent-notice {
    font-size: 0.8125rem;
    line-height: 1.45;
    max-width: 52rem;
}
.gdpr-form-consent-notice a {
    text-decoration: underline;
}
.partial-newsletter-column-gdpr {
    margin-top: 0.5rem;
}
.newsletter-signup-gdpr {
    margin-top: 0.5rem;
    color: #4b5563;
}

/* Newsletter Signup block — horizontal banner */
.newsletter-signup-block {
    width: 100%;
    box-sizing: border-box;
    background: var(--newsletter-signup-bg, #eeeeee);
    color: var(--newsletter-signup-text, #222);
    padding: var(--newsletter-signup-padding-y, 20px) var(--newsletter-signup-padding-x, 24px) !important;
    margin-top: var(--newsletter-signup-margin-top, 0px) !important;
    margin-bottom: var(--newsletter-signup-margin-bottom, 0px) !important;
    margin-left: var(--newsletter-signup-margin-x, 0px) !important;
    margin-right: var(--newsletter-signup-margin-x, 0px) !important;
}

.newsletter-signup-banner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem 2rem;
    flex-wrap: wrap;
}

.newsletter-signup-cta {
    flex: 0 1 auto;
    min-width: 200px;
    text-align: left;
}

.newsletter-signup-heading,
.newsletter-signup-body {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
    color: var(--newsletter-signup-text, #222);
}

.newsletter-signup-form-wrap {
    flex: 1 1 420px;
    max-width: 620px;
    min-width: 260px;
}

.newsletter-signup-row {
    display: flex;
    align-items: stretch;
    gap: 0.75rem;
    margin-bottom: 0;
}

.newsletter-signup-email {
    flex: 1;
    min-width: 0;
    padding: 0.75rem 1rem;
    border: 1px solid var(--newsletter-signup-input-border, #dddddd);
    border-radius: 0;
    background: var(--newsletter-signup-input-bg, #fff);
    font-size: 0.95rem;
    color: var(--newsletter-signup-input-text, #111);
}

.newsletter-signup-email::placeholder {
    color: var(--newsletter-signup-placeholder, #9ca3af);
    opacity: 1;
}

.newsletter-signup-email:focus {
    outline: none;
    border-color: #9ca3af;
    background: var(--newsletter-signup-input-bg, #fff);
}

.newsletter-signup-submit {
    flex: 0 0 auto;
    padding: 0.75rem 1.5rem;
    border: 1px solid var(--newsletter-signup-input-border, #dddddd);
    border-radius: 0;
    background: #fff;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
    color: #111;
}

.newsletter-signup-submit:hover {
    opacity: 0.92;
}

.newsletter-signup-message {
    margin-top: 0.5rem;
    padding: 0.5rem;
    border-radius: 4px;
    font-size: 0.9rem;
}

.newsletter-signup-message.success {
    background: #d1fae5;
    color: #065f46;
}

.newsletter-signup-message.error {
    background: #fee2e2;
    color: #991b1b;
}

.newsletter-signup-no-form {
    color: #92400e;
    background: #fef3c7;
    padding: 0.75rem;
    border-radius: 4px;
    margin: 0;
}

@media (max-width: 991px) {
    .newsletter-signup-banner {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
        gap: 0.75rem;
    }

    .newsletter-signup-cta {
        flex: 0 0 auto;
        min-width: 0;
        text-align: center;
    }

    .newsletter-signup-form-wrap {
        flex: 0 0 auto;
        max-width: none;
        width: 100%;
        min-width: 0;
    }

    .newsletter-signup-row {
        flex-direction: column;
        gap: 0.5rem;
    }

    .newsletter-signup-submit {
        width: 100%;
    }

    /* Home / PDP: no dead flex gap between product carousel and newsletter block */
    .main-content > .page-body-block[data-block-slug="ProductList"] + .page-body-block[data-block-slug="NewsletterSignup"],
    .main-content > .page-body-block + .page-body-block[data-block-slug="NewsletterSignup"] {
        margin-top: 0 !important;
    }

    .main-content > .page-body-block[data-block-slug="ProductList"] section[data-block-type="product_carousel"] .tranding-card.my-4 {
        margin-bottom: 0.5rem !important;
    }
}

.partial-newsletter-column-no-form {
    font-size: 0.85rem;
    color: #856404;
    background: #fff3cd;
    padding: 0.5rem;
    border-radius: 4px;
}

.partial-stores-column { margin-bottom: 1rem; }
.partial-stores-column-heading {
    font-size: 0.95rem;
    font-weight: bold;
    margin: 0 0 0.75rem 0;
    color: #000;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.partial-stores-column-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.partial-stores-column-item {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    font-size: 0.9rem;
    color: #555;
}
.partial-stores-column-icon {
    flex-shrink: 0;
    width: 1.25rem;
}
.partial-stores-column-name {
    display: block;
    font-weight: 600;
    color: #000;
}
.partial-stores-column-address,
.partial-stores-column-tel,
.partial-stores-column-email {
    display: block;
}
.partial-stores-column-item a {
    color: inherit;
    text-decoration: none;
}
.partial-stores-column-item a:hover { text-decoration: underline; }

/* Auth/checkout forms: uniform body copy, links, hints, and password toggles */
.gdpr-form-consent-notice {
    color: var(--bs-secondary-color);
}
.gdpr-form-consent-notice a {
    color: var(--bs-body-color);
    text-decoration: underline;
}
.gdpr-form-consent-notice a:hover {
    color: var(--wizard-primary-bg, var(--bs-primary));
}

.register-consents .gdpr-form-consent-notice,
.register-consents .form-check-label {
    color: var(--bs-secondary-color);
    font-size: 0.875rem;
    line-height: 1.5;
    font-weight: 400;
}
.register-consents .form-check-label a {
    color: var(--bs-body-color);
    text-decoration: underline;
}
.register-consents .form-check-label a:hover {
    color: var(--wizard-primary-bg, var(--bs-primary));
}

.phone-field-hint,
.password-field-hint,
[data-phone-country-root] .phone-field-hint {
    color: var(--bs-secondary-color);
    font-size: 0.875rem;
}

.btn-password-toggle {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--bs-secondary-color) !important;
    text-decoration: none !important;
}
.btn-password-toggle:hover,
.btn-password-toggle:focus {
    color: var(--bs-body-color) !important;
}
.btn-password-toggle i {
    color: inherit !important;
}

.checkout-step1-customer .btn-primary.rounded-pill {
    font-weight: 500 !important;
    text-transform: none !important;
}
.checkout-step1-customer .form-label {
    font-weight: 500;
    color: var(--bs-body-color);
}
.checkout-step1-customer .checkout-forgot-password-link {
    color: var(--bs-body-color);
    text-decoration: underline;
}
.checkout-step1-customer .checkout-forgot-password-link:hover {
    color: var(--wizard-primary-bg, var(--bs-primary));
}

.checkout-step1-branch-inactive {
    opacity: 0.55;
    pointer-events: none;
}

/* Step 1 mobile: sticky checkout type picker (register / guest / returning) */
.checkout-step1-mobile-picker {
    position: sticky;
    top: 0;
    z-index: 20;
    background: var(--bs-body-bg, #fff);
    padding-top: 0.25rem;
    padding-bottom: 0.75rem;
    margin-bottom: 0.75rem;
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
}

.checkout-step1-mobile-type-options {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.checkout-step1-mobile-type-option {
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
    margin: 0;
    background: var(--bs-body-bg, #fff);
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.checkout-step1-mobile-type-option:has(.form-check-input:checked) {
    border-color: var(--wizard-primary-bg, var(--bs-primary));
    background: rgba(var(--bs-primary-rgb, 13, 110, 253), 0.06);
}

.checkout-step1-mobile-type-option .form-check-input {
    margin-top: 0.2rem;
}

.checkout-step1-mobile-type-option .form-check-label {
    font-weight: 500;
    cursor: pointer;
}

.checkout-step1-mobile-type-option .form-check-input:checked + .form-check-label {
    font-weight: 600;
}

.checkout-step1-panel-mobile-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

@media (max-width: 767.98px) {
    .checkout-step1-new-customer-col > h4,
    .checkout-step1-new-customer-col > p:first-of-type {
        display: none;
    }

    .checkout-step1-new-customer-col .checkout-register-panel > .form-check.mb-0 {
        display: none !important;
    }

    .checkout-step1-returning-col > p {
        display: none;
    }
}

/* Product tabs (Featured/New/Best Sellers): clean underline style */
.tab_header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border-bottom: none !important;
}

.tab_header .nav-link,
.tab_header a {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    padding: 0.2rem 0.55rem 0.45rem !important;
    margin: 0 0.3rem !important;
    color: #666 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    position: relative;
    transition: color 0.2s ease;
}

.tab_header .nav-link::after,
.tab_header a::after {
    content: "";
    position: absolute;
    left: 0.55rem;
    right: 0.55rem;
    bottom: 0.1rem;
    height: 1px;
    background-color: #b08a57;
    opacity: 0;
    transform: scaleX(0.65);
    transform-origin: center;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.tab_header .nav-link:hover,
.tab_header .nav-link.active,
.tab_header a:hover,
.tab_header a.active {
    color: #1f1f1f !important;
}

.tab_header .nav-link:hover::after,
.tab_header .nav-link.active::after,
.tab_header a:hover::after,
.tab_header a.active::after {
    opacity: 1;
    transform: scaleX(1);
}

/* Hide duplicate legacy menu.blade.php header when layout uses HeaderMenuLogoLeftBlock */
body:has(#kalles-section-header_top.header-menu-logo-left-block) #kalles-section-header_top:not(.header-menu-logo-left-block),
.header-block .header-menu #kalles-section-header_top {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
}

/* MenuCenteredIcon / header megamenu: one divider line per category title */
#kalles-section-header_top .navbar-custom .dropdown-menu .dropdown-sub-column-item,
#kalles-section-header_top .compact-navbar .dropdown-menu .dropdown-sub-column-item {
    border-bottom: none !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

#kalles-section-header_top .navbar-custom .dropdown-menu .dropdown-sub-column-item > .dropdown-menu-title,
#kalles-section-header_top .compact-navbar .dropdown-menu .dropdown-sub-column-item > .dropdown-menu-title,
.header-menu-logo-left-block .dropdown-menu .dropdown-sub-column-item > .dropdown-menu-title {
    border-bottom: 1px solid var(--bs-border-color, #dee2e6) !important;
    /* Uppercase is applied in PHP (tonos-safe); avoid browser text-transform on Greek */
    text-transform: none !important;
}

/* Megamenu hierarchy: parent category titles (with subcategories) vs sub-items and leaf links */
@media (min-width: 992px) {
    #kalles-section-header_top .navbar-custom .dropdown-menu .dropdown-sub-column-item:has(.sub-column-menu) > .dropdown-menu-title,
    #kalles-section-header_top .compact-navbar .dropdown-menu .dropdown-sub-column-item:has(.sub-column-menu) > .dropdown-menu-title {
        font-size: 0.875rem !important;
        font-weight: 700 !important;
        color: var(--header-mega-heading, #111111) !important;
        letter-spacing: 0.06em;
        text-transform: none;
        line-height: 1.35;
        padding-top: 12px !important;
        padding-bottom: 8px !important;
    }

    #kalles-section-header_top .navbar-custom .dropdown-menu .dropdown-sub-column-item:not(:has(.sub-column-menu)) > .dropdown-menu-title,
    #kalles-section-header_top .compact-navbar .dropdown-menu .dropdown-sub-column-item:not(:has(.sub-column-menu)) > .dropdown-menu-title,
    .header-menu-logo-left-block .dropdown-menu .dropdown-sub-column-item:not(:has(.sub-column-menu)) > .dropdown-menu-title {
        font-weight: 600 !important;
        font-size: 0.8125rem !important;
        color: var(--header-mega-link, #333333) !important;
        letter-spacing: 0.06em;
        text-transform: none !important;
    }

    #kalles-section-header_top .navbar-custom .dropdown-menu .dropdown-sub-column-item > .sub-column-menu.megamenu-depth-1,
    #kalles-section-header_top .compact-navbar .dropdown-menu .dropdown-sub-column-item > .sub-column-menu.megamenu-depth-1 {
        margin-top: 2px !important;
        margin-bottom: 4px !important;
        padding-left: 0 !important;
    }

    #kalles-section-header_top .navbar-custom .dropdown-menu .sub-column-menu.megamenu-depth-1 > li > a.text-muted,
    #kalles-section-header_top .compact-navbar .dropdown-menu .sub-column-menu.megamenu-depth-1 > li > a.text-muted {
        font-size: 0.875rem !important;
        font-weight: 400 !important;
        text-transform: none !important;
        letter-spacing: normal !important;
        padding: 5px 0 !important;
        color: var(--header-mega-link, #555555) !important;
    }

    /* Megamenu depth 2–4: nested branches (e.g. Boys > Shoes > Sport Specific > Tennis) */
    #kalles-section-header_top .navbar-custom .dropdown-menu .sub-column-menu--nested,
    #kalles-section-header_top .compact-navbar .dropdown-menu .sub-column-menu--nested,
    .header-menu-logo-left-block .dropdown-menu .sub-column-menu--nested,
    .header-menu-search-toolbar-block .dropdown-menu .sub-column-menu--nested {
        list-style: none;
        margin: 0.15rem 0 0.35rem;
        padding: 0 0 0 0.85rem !important;
        border-left: 1px solid rgba(0, 0, 0, 0.12);
    }

    #kalles-section-header_top .navbar-custom .dropdown-menu .sub-column-menu--nested .sub-column-menu--nested,
    #kalles-section-header_top .compact-navbar .dropdown-menu .sub-column-menu--nested .sub-column-menu--nested,
    .header-menu-logo-left-block .dropdown-menu .sub-column-menu--nested .sub-column-menu--nested,
    .header-menu-search-toolbar-block .dropdown-menu .sub-column-menu--nested .sub-column-menu--nested {
        padding-left: 1rem !important;
        border-left-color: rgba(0, 0, 0, 0.08);
    }

    #kalles-section-header_top .navbar-custom .dropdown-menu a.megamenu-branch-heading,
    #kalles-section-header_top .compact-navbar .dropdown-menu a.megamenu-branch-heading,
    .header-menu-logo-left-block .dropdown-menu a.megamenu-branch-heading,
    .header-menu-search-toolbar-block .dropdown-menu a.megamenu-branch-heading {
        display: block;
        font-weight: 600 !important;
        font-size: 0.84rem !important;
        line-height: 1.35;
        padding: 0.2rem 0 !important;
        color: var(--header-mega-heading, #333333) !important;
        text-decoration: none;
    }

    #kalles-section-header_top .navbar-custom .dropdown-menu .sub-column-menu--nested li a.text-muted,
    #kalles-section-header_top .compact-navbar .dropdown-menu .sub-column-menu--nested li a.text-muted,
    .header-menu-logo-left-block .dropdown-menu .sub-column-menu--nested li a.text-muted,
    .header-menu-search-toolbar-block .dropdown-menu .sub-column-menu--nested li a.text-muted {
        font-size: 0.8125rem !important;
        line-height: 1.35;
        padding: 0.12rem 0 !important;
        opacity: 0.95;
    }

    #kalles-section-header_top .navbar-custom .dropdown-menu .sub-column-menu--nested .sub-column-menu--nested li a.text-muted,
    #kalles-section-header_top .compact-navbar .dropdown-menu .sub-column-menu--nested .sub-column-menu--nested li a.text-muted,
    .header-menu-logo-left-block .dropdown-menu .sub-column-menu--nested .sub-column-menu--nested li a.text-muted,
    .header-menu-search-toolbar-block .dropdown-menu .sub-column-menu--nested .sub-column-menu--nested li a.text-muted {
        font-size: 0.78rem !important;
        opacity: 0.9;
    }

    /* Override app.min.css flattening nested megamenu lists */
    #kalles-section-header_top .navbar-custom .navbar-nav .nav-item .dropdown-menu .dropdown-sub-column-item .sub-column-menu.sub-column-menu--nested,
    #kalles-section-header_top .compact-navbar .dropdown-menu .dropdown-sub-column-item .sub-column-menu.sub-column-menu--nested,
    .header-menu-logo-left-block .navbar-custom .navbar-nav .nav-item .dropdown-menu .dropdown-sub-column-item .sub-column-menu.sub-column-menu--nested,
    .header-menu-search-toolbar-block .navbar-custom .navbar-nav .nav-item .dropdown-menu .dropdown-sub-column-item .sub-column-menu.sub-column-menu--nested {
        padding-left: 0.85rem !important;
    }

    #kalles-section-header_top .navbar-custom .navbar-nav .nav-item .dropdown-menu .dropdown-sub-column-item .sub-column-menu--nested a,
    #kalles-section-header_top .compact-navbar .dropdown-menu .dropdown-sub-column-item .sub-column-menu--nested a,
    .header-menu-logo-left-block .dropdown-menu .dropdown-sub-column-item .sub-column-menu--nested a,
    .header-menu-search-toolbar-block .dropdown-menu .dropdown-sub-column-item .sub-column-menu--nested a {
        padding: 0.15rem 0 !important;
        font-size: 0.8125rem !important;
        line-height: 1.35 !important;
    }
}

/* HeaderMenuLogoLeftBlock: flush megamenu + hover bridge (no gap between trigger and panel) */
.header-menu-logo-left-block .navbar-nav .nav-item.dropdown > .dropdown-menu,
#kalles-section-header_top.header-menu-logo-left-block .navbar-custom .nav-item.dropdown > .dropdown-menu {
    margin-top: 0 !important;
    transform: none !important;
    border-top: none !important;
}
.header-menu-logo-left-block .navbar-nav .nav-item.dropdown::after,
#kalles-section-header_top.header-menu-logo-left-block .navbar-custom .nav-item.dropdown::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 14px;
    background: transparent;
    z-index: 1099;
    pointer-events: auto;
}
.header-menu-logo-left-block .navbar-nav .nav-item.dropdown > .dropdown-menu::before,
#kalles-section-header_top.header-menu-logo-left-block .navbar-custom .nav-item.dropdown > .dropdown-menu::before {
    content: '';
    position: absolute;
    top: -14px;
    left: 0;
    right: 0;
    height: 14px;
    background: transparent;
    pointer-events: auto;
}

/* HeaderMenuLogoLeftBlock: mega panel left edge at parent start; .mega-clamp-right grows from the right */
@media (min-width: 992px) {
    #kalles-section-header_top.header-menu-logo-left-block .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu,
    .header-menu-logo-left-block .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu {
        left: 0;
        right: auto;
        margin-left: 0 !important;
        margin-top: 0 !important;
        transform: none !important;
    }
    #kalles-section-header_top.header-menu-logo-left-block .navbar-custom .nav-item.dropdown.dropdown-mega-xxl.mega-clamp-right > .dropdown-menu,
    .header-menu-logo-left-block .navbar-custom .nav-item.dropdown.dropdown-mega-xxl.mega-clamp-right > .dropdown-menu {
        left: auto !important;
        right: 0 !important;
    }
    #kalles-section-header_top.header-menu-logo-left-block .navbar-custom .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu,
    #kalles-section-header_top.header-menu-logo-left-block .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:hover,
    .header-menu-logo-left-block .navbar-custom .nav-item.dropdown.dropdown-mega-xxl:hover > .dropdown-menu,
    .header-menu-logo-left-block .navbar-custom .nav-item.dropdown.dropdown-mega-xxl > .dropdown-menu:hover {
        transform: none !important;
    }
}

/* Quick Formatting: full-bleed blocks (100% — not 100vw, avoids scrollbar strip on the right) */
.block-admin-wrapper.qf-full-bleed,
.block-admin-wrapper[data-qf-full-width="1"] {
    width: 100% !important;
    max-width: 100% !important;
    position: relative;
    left: auto !important;
    right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box;
}

.block-admin-wrapper.qf-full-bleed:not([data-qf-has-horizontal-margin="1"]),
.block-admin-wrapper[data-qf-full-width="1"]:not([data-qf-has-horizontal-margin="1"]) {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.layout-header-blocks .block-admin-wrapper.qf-full-bleed,
.layout-header-blocks .block-admin-wrapper[data-qf-full-width="1"],
.layout-footer-blocks .block-admin-wrapper.qf-full-bleed,
.layout-footer-blocks .block-admin-wrapper[data-qf-full-width="1"],
.layout-footer .layout-footer-blocks .block-admin-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: auto !important;
    right: auto !important;
}

.block-admin-wrapper.qf-full-bleed > .inline-block-wrapper,
.block-admin-wrapper[data-qf-full-width="1"] > .inline-block-wrapper {
    width: 100%;
    max-width: none;
}

/* Quick Formatting: inner content container (max-width per breakpoint) */
.qf-content-container,
.block-admin-wrapper > .qf-content-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    display: block;
    visibility: visible;
    min-height: 0;
}

/* Image block layout: qf wrapper must not stretch to full width when image uses auto/custom sizing */
.image-block-container.image-width-auto .qf-content-container,
.image-block-container.image-width-custom .qf-content-container,
.block-admin-wrapper .image-block-container.image-width-auto .qf-content-container,
.block-admin-wrapper .image-block-container.image-width-custom .qf-content-container,
.container-column .image-block-container.image-width-auto .qf-content-container,
.container-column .image-block-container.image-width-custom .qf-content-container {
    width: auto !important;
    max-width: 100% !important;
}

/* Offer/discount badge: allow theme + pagebuilder resize (override legacy fixed 60×60 / 52×52). */
.topbar-product-card .product-image-container > .new-label.offer-tag,
.topbar-product-card .product-image-container > .offer-tag[data-pb-product-badge],
.topbar-product-card .product-image-container > [data-pb-product-badge] {
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
}

/* Product discount badge: larger on tablets/phones (legacy app.min.css used 30px — too small). */
@media (max-width: 1024px) {
    .topbar-product-card .new-label {
        width: 52px !important;
        min-width: 52px !important;
        height: 52px !important;
        min-height: 52px !important;
        font-size: 13px !important;
        padding: 6px 8px !important;
    }
    .topbar-product-card .product-image-container > .new-label.offer-tag,
    .topbar-product-card .product-image-container > [data-pb-product-badge] {
        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
    }
}

@media (max-width: 576px) {
    .topbar-product-card .new-label {
        width: 58px !important;
        min-width: 58px !important;
        height: 58px !important;
        min-height: 58px !important;
        font-size: 14px !important;
        padding: 8px 10px !important;
    }
    .topbar-product-card .product-image-container > .new-label.offer-tag,
    .topbar-product-card .product-image-container > [data-pb-product-badge] {
        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
    }
}

/* Language switcher: never inherit megamenu dropdown opacity / transparency */
#kalles-section-header_top .site-language-switcher__menu,
.site-language-switcher--dropdown .site-language-switcher__menu {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
    background-color: #ffffff !important;
    background: #ffffff !important;
    z-index: 10050 !important;
}

#kalles-section-header_top .site-language-switcher__menu.show,
.site-language-switcher--dropdown.is-open .site-language-switcher__menu {
    display: block !important;
}

#kalles-section-header_top .site-language-switcher__menu-item,
.site-language-switcher--dropdown .site-language-switcher__menu-item {
    background-color: #ffffff !important;
}

/* Product card badges/stickers: allow overflow so left/right labels are not clipped */
.topbar-product-card .product-image-container {
    overflow: visible !important;
}
.topbar-product-card .product-image-container .custom-sticker,
.topbar-product-card .product-image-container > .new-label,
.topbar-product-card .product-image-container > .product-tag,
.topbar-product-card .product-image-container > .offer-tag {
    max-width: calc(100% - 8px);
}
.topbar-product-card .product-image-container .custom-sticker.category-sticker,
.topbar-product-card .product-image-container .custom-sticker.offer-sticker,
.topbar-product-card .product-image-container .custom-sticker.last-pieces-sticker {
    max-width: none;
    width: max-content;
}
.topbar-product-card .product-image-container .custom-sticker span {
    white-space: normal;
    text-align: center;
    overflow-wrap: break-word;
    line-height: 1.2;
}
.topbar-product-card .product-image-container .custom-sticker.last-pieces-sticker span,
.topbar-product-card .product-image-container .custom-sticker .last-pieces-sticker-text {
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
    text-align: center;
    line-height: 1.2;
}
.topbar-product-card .product-image-container > .new-label,
.topbar-product-card .product-image-container > .product-tag,
.topbar-product-card .product-image-container > .offer-tag {
    white-space: nowrap;
}
.topbar-product-card .product-image-container > .new-label[data-max-width],
.topbar-product-card .product-image-container > .product-tag[data-max-width] {
    white-space: normal;
    overflow-wrap: break-word;
    text-align: center;
}
.topbar-product-card .product-image-container > .offer-tag[data-max-width],
.topbar-product-card .product-image-container > .new-label.offer-tag[data-max-width] {
    white-space: nowrap;
    text-align: center;
}
@media (max-width: 576px) {
    .topbar-product-card .product-image-container .custom-sticker.last-pieces-sticker span,
    .topbar-product-card .product-image-container .custom-sticker .last-pieces-sticker-text,
    .topbar-product-card .product-image-container > .product-tag.new-tag {
        font-size: 10px !important;
        padding: 3px 6px !important;
    }
    .topbar-product-card .product-image-container > .product-tag.new-tag {
        max-width: calc(100% - 4px);
    }
}

.product-item .product-hover-available {
    display: none;
    width: 100%;
    margin-top: 0.5rem;
    text-align: center;
}

.topbar-product-card .product-image,
.product-item .product-image {
    transition: opacity 0.25s ease, transform 0.3s ease;
}

@media (hover: hover) and (pointer: fine) {
    .topbar-product-card:hover .product-image {
        transform: scale(1.03);
    }
}

@media (hover: hover) and (pointer: fine) {
    .topbar-product-card:hover .product-hover-available,
    .product-item:hover .product-hover-available {
        display: block;
    }
}

@media (hover: none), (pointer: coarse) {
    .topbar-product-card .product-hover-available,
    .product-item .product-hover-available {
        display: block;
    }
}

.product-hover-available__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.35rem 0.5rem;
    font-size: 0.8125rem;
    line-height: 1.4;
    color: #6c757d;
    margin-bottom: 0;
    text-align: center;
}

.product-hover-available__row:last-child {
    margin-bottom: 0;
}

.product-hover-available__label {
    white-space: nowrap;
}

.product-hover-available__swatches {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.product-hover-available__swatch {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.12);
    flex-shrink: 0;
}

.product-hover-available__sizes {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem;
    letter-spacing: 0.02em;
}

.product-list-catalogue-style .product-hover-available__row {
    text-align: left;
}

/* Map store locator — sidebar stretches to map column height; store list scrolls when long */
.map-block[data-has-map-content="1"],
.map-block[data-has-map-content="1"] .map-block-inner,
.page-body-block[data-block-slug="Map"],
.page-body-block[data-block-slug="Map"] .map-block,
body.pagebuilder-mode .page-body-block[data-block-slug="Map"] .map-block {
    overflow: visible !important;
}

.map-position-left .map-block-inner,
.map-position-right .map-block-inner {
    align-items: flex-start !important;
}

.map-position-left .map-block-stores,
.map-position-right .map-block-stores {
    min-height: var(--map-block-height, 400px) !important;
    height: var(--map-sidebar-max-height, var(--map-block-height, 400px)) !important;
    max-height: var(--map-sidebar-max-height, var(--map-block-height, 400px)) !important;
    align-self: flex-start !important;
    overflow: hidden !important;
}

.map-position-left .map-locator,
.map-position-right .map-locator {
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
}

.map-position-left .map-locator-list,
.map-position-right .map-locator-list {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
}

.map-position-left .map-container,
.map-position-right .map-container {
    height: var(--map-block-height, 400px) !important;
    min-height: var(--map-block-height, 400px) !important;
    max-height: var(--map-block-height, 400px) !important;
}