@charset "UTF-8";
/* =========================================================
   1. GLOBAL VARIABLES (Squarespace Synced)
   ========================================================= */
:root {
  /* Typography Variables */
  --shinshu-font-heading: var(--heading-font-font-family, 'NeuzeitS-Book', sans-serif);
  --shinshu-font-paragraph: var(--content-link-block-title-font-font-family, 'Kazimir-Light', serif);
  --shinshu-font-button: var(--primary-button-font-font-family, 'DIN30640 STD', sans-serif);
  /* ── FINE-TUNING VARIABLES ── adjust these to taste ── */
  --shinshu-category-font-size: 8px;
  /* Category grid pill items */
  --shinshu-menu-font-size: 13px;
  /* Horizontal top nav menu items */
  /* Color Variables */
  --shinshu-white: #FFFFFF;
  --shinshu-light-gray: #EAEAEE;
  --shinshu-gray: #BDBDBD;
  --shinshu-blueish: #306788;
  --shinshu-dark-blue: #00253B;
}

/* =========================================================
   2. TYPOGRAPHY & GLOBAL STYLES
   ========================================================= */
/* Base paragraphs and standard text */
.ec-size .ec-store {
  font-family: var(--shinshu-font-paragraph) !important;
  color: var(--shinshu-dark-blue) !important;
}

/* Headings & Product Titles */
.ec-size .ec-store .ec-header-h1,
.ec-size .ec-store .ec-header-h2,
.ec-size .ec-store .ec-header-h3,
.ec-size .ec-store .ec-header-h4,
.ec-size .ec-store .grid-product__title,
.ec-size .ec-store .product-details__product-title {
  font-family: var(--shinshu-font-heading) !important;
  font-weight: 600 !important;
  color: var(--shinshu-dark-blue) !important;
}

/* =========================================================
   3. BUTTONS & PRODUCT GRID
   ========================================================= */
/* Primary & Secondary Buttons */
.ec-size .ec-store .form-control--primary button,
.ec-size .ec-store .ec-btn--primary,
.ec-size .ec-store .form-control--secondary button {
  font-family: var(--shinshu-font-button) !important;
  background-color: var(--shinshu-blueish) !important;
  color: var(--shinshu-white) !important;
  border: 1px solid var(--shinshu-blueish) !important;
  border-radius: 0px !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  transition: all 0.3s ease !important;
}

/* Button Hover State */
.ec-size .ec-store .form-control--primary button:hover,
.ec-size .ec-store .form-control--secondary button:hover {
  background-color: transparent !important;
  color: var(--shinshu-blueish) !important;
}

/* Product Pricing */
.ec-size .ec-store .grid-product__price-value {
  color: var(--shinshu-blueish) !important;
  font-weight: 500 !important;
}

/* Remove default Ecwid product card styling */
.ec-size .ec-store .grid-product,
.ec-size .ec-store .grid-product__wrap-inner {
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* Spacing between product cards */
.ec-size .ec-store .grid-product {
  padding: 12px !important;
}

/* =========================================================
   3B. SORT DROPDOWN
   ========================================================= */
.ec-size .ec-store .grid__sort {
  margin-bottom: 8px !important;
}

/* Outer container: single clean dark blue border, white fill, no radius */
.ec-size .ec-store .grid-sort__item--sortby {
  background-color: var(--shinshu-white) !important;
  border: 1px solid var(--shinshu-dark-blue) !important;
  border-radius: 0px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: stretch !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Kill ALL Ecwid default borders/separators on every child */
.ec-size .ec-store .grid-sort__item--sortby *,
.ec-size .ec-store .grid-sort__item--sortby label {
  border: none !important;
  outline: none !important;
}

/* "Sorteer op" label — high specificity to beat Ecwid */
.ec-size .ec-store .grid__sort .form-control.form-control--select-inline.grid-sort__item--sortby .form-control__select-text,
.ec-size .ec-store .grid-sort__item.grid-sort__item--sortby .form-control__select-text {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--shinshu-dark-blue) !important;
  background-color: var(--shinshu-white) !important;
  padding: 12px 8px 12px 16px !important;
  white-space: nowrap !important;
  border: none !important;
}

/* Select element */
.ec-size .ec-store .grid-sort__item--sortby .form-control__select {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--shinshu-dark-blue) !important;
  background-color: var(--shinshu-white) !important;
  border: none !important;
  border-radius: 0px !important;
  padding: 12px 48px 12px 8px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
  outline: none !important;
  min-width: 180px !important;
}

/* Chevron — vertically centered, right-aligned */
.ec-size .ec-store .grid-sort__item--sortby .form-control__arrow {
  position: absolute !important;
  right: 10px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  pointer-events: none !important;
  display: flex !important;
  align-items: center !important;
  border: none !important;
}

.ec-size .ec-store .grid-sort__item--sortby .form-control__arrow svg {
  stroke: var(--shinshu-dark-blue) !important;
  fill: none !important;
}

/* =========================================================
   3C. PRODUCT CARD — WHITE INFO BOX
   ========================================================= */
/* Clip the card so the white box never overflows the image area */
.ec-size .ec-store .grid-product__wrap-inner {
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  border: 1px solid var(--shinshu-light-gray) !important;
}

/* White background on every text element so they form one seamless box */
.ec-size .ec-store .grid-product__title,
.ec-size .ec-store .grid-product__subtitle,
.ec-size .ec-store .grid-product__price,
.ec-size .ec-store .grid-product__button {
  background-color: var(--shinshu-white) !important;
}

/* Title: starts the white box — top border accent + padding */
.ec-size .ec-store .grid-product__title {
  padding: 14px 16px 4px 16px !important;
  margin: 0 !important;
  border-top: 4px solid var(--shinshu-dark-blue) !important;
}

/* Subtitle */
.ec-size .ec-store .grid-product__subtitle {
  padding: 2px 16px 6px 16px !important;
  margin: 0 !important;
}

/* Price row */
.ec-size .ec-store .grid-product__price {
  padding: 4px 16px 10px 16px !important;
  margin: 0 !important;
}

/* Buy button: full width, closes the white box — bottom padding seals it */
.ec-size .ec-store .grid-product__button {
  padding: 0 16px 16px 16px !important;
  margin: 0 !important;
}

.ec-size .ec-store .grid-product__button .form-control,
.ec-size .ec-store .grid-product__button .form-control__button {
  width: 100% !important;
}

/* Outlined dark blue style — transparent fill, dark blue border + text */
.ec-size .ec-store .grid-product__button .form-control__button {
  background-color: transparent !important;
  border: 1px solid var(--shinshu-dark-blue) !important;
  color: var(--shinshu-dark-blue) !important;
  transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* Hover: fill with dark blue, white text */
.ec-size .ec-store .grid-product__button .form-control__button:hover {
  background-color: var(--shinshu-dark-blue) !important;
  color: var(--shinshu-white) !important;
}

/* =========================================================
   3D. ECWID FOOTER NAVIGATION
   ========================================================= */
/* Footer link text in blueish */
.ec-size .ec-store .ec-footer__link {
  color: var(--shinshu-blueish) !important;
}

/* Footer icons in dark blue */
.ec-size .ec-store .ec-footer__link .svg-icon svg {
  fill: var(--shinshu-dark-blue) !important;
  color: var(--shinshu-dark-blue) !important;
}

/* Hover: both darken to dark blue */
.ec-size .ec-store .ec-footer__link:hover {
  color: var(--shinshu-dark-blue) !important;
}

.ec-size .ec-store .ec-footer__link:hover .svg-icon svg {
  fill: var(--shinshu-dark-blue) !important;
}

/* =========================================================
   4. FIXED CATEGORY MENU (TOP LEVEL BEAM)
   ========================================================= */
/* Aggressively remove border-radius from all parent and list elements */
.horizontal-menu-container,
.horizontal-menu,
.horizontal-menu-parent,
.horizontal-menu-item,
.horizontal-menu-item--levelTop,
.horizontal-menu-item--active {
  background-color: var(--shinshu-white) !important;
  border-radius: 0px !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Base top-level link formatting */
.horizontal-menu-item--levelTop > a {
  font-family: var(--shinshu-font-heading) !important;
  font-size: var(--shinshu-menu-font-size) !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--shinshu-dark-blue) !important;
  background-color: transparent !important;
  padding: 18px 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  transition: background-color 0.2s ease, color 0.2s ease !important;
  text-decoration: none !important;
  border-radius: 0px !important;
}

/* Chevron Alignment & Animation Setup */
.horizontal-menu-item--levelTop > a svg {
  fill: var(--shinshu-dark-blue) !important;
  margin: 0 !important;
  position: relative !important;
  top: -2px !important;
  transition: transform 0.3s ease, fill 0.2s ease !important;
  transform-origin: center !important;
}

/* Hover State: Light Gray background, Dark Blue text, Chevron points UP */
.horizontal-menu-item--levelTop:hover > a {
  background-color: var(--shinshu-light-gray) !important;
  color: var(--shinshu-dark-blue) !important;
}

.horizontal-menu-item--levelTop:hover > a svg {
  fill: var(--shinshu-dark-blue) !important;
  transform: rotate(180deg) !important;
}

/* Active State (or when a sub-category inside it is active): Dark Blue background, White text */
.horizontal-menu-item--levelTop.horizontal-menu-item--active > a,
.horizontal-menu-item--levelTop:has(.horizontal-menu-item--active) > a {
  background-color: var(--shinshu-dark-blue) !important;
  color: var(--shinshu-white) !important;
}

.horizontal-menu-item--levelTop.horizontal-menu-item--active > a svg,
.horizontal-menu-item--levelTop:has(.horizontal-menu-item--active) > a svg {
  fill: var(--shinshu-white) !important;
}

/* Keep chevron flipped up if hovered while active */
.horizontal-menu-item--levelTop.horizontal-menu-item--active:hover > a svg,
.horizontal-menu-item--levelTop:has(.horizontal-menu-item--active):hover > a svg {
  transform: rotate(180deg) !important;
}

/* Vertical divider between top-level items — desktop/tablet only, not mobile */
@media (min-width: 769px) {
  .horizontal-menu-item--levelTop:not(:last-child) {
    border-right: 1px solid var(--shinshu-light-gray) !important;
  }
}

/* =========================================================
   5. FIXED CATEGORY MENU (DROPDOWN BOX)
   ========================================================= */
/* Dropdown Container */
.horizontal-menu-subParent {
  background-color: var(--shinshu-white) !important;
  border: 1px solid var(--shinshu-light-gray) !important;
  border-radius: 0px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.07) !important;
  padding: 8px 0 !important;
  margin-top: 0px !important;
}

/* Links inside the dropdown */
.horizontal-menu-item--levelChild > a {
  color: var(--shinshu-dark-blue) !important;
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  padding: 12px 24px !important;
  background-color: transparent !important;
  border-bottom: 1px solid var(--shinshu-light-gray) !important;
  display: block !important;
  border-radius: 0px !important;
  transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* Dropdown Link Hover State */
.horizontal-menu-item--levelChild > a:hover {
  background-color: var(--shinshu-light-gray) !important;
  color: var(--shinshu-dark-blue) !important;
}

/* Remove bottom border from the last dropdown item */
.horizontal-menu-subParent > .horizontal-menu-item--levelChild:last-child > a {
  border-bottom: none !important;
}

/* =========================================================
   6. DROPDOWN ACTIVE LINK INDICATOR
   ========================================================= */
/* Subcategory currently being viewed (Highly visible solid block) */
.horizontal-menu-item--levelChild.horizontal-menu-item--active > a {
  background-color: var(--shinshu-dark-blue) !important;
  font-weight: 500 !important;
  color: var(--shinshu-white) !important;
  border-left: none !important;
  padding-left: 24px !important;
}

/* Optional hover state for the active subcategory */
.horizontal-menu-item--levelChild.horizontal-menu-item--active > a:hover {
  background-color: var(--shinshu-blueish) !important;
  color: var(--shinshu-white) !important;
}

/* =========================================================
   7. PRODUCT DETAIL PAGE
   ========================================================= */
/* Remove ALL left/right spacing on product detail page — wrapper chain only */
/* Gallery and image elements are deliberately excluded to preserve sizing */
.ecwid-productBrowser-ProductPage,
.ecwid-productBrowser-ProductPage > div,
.ecwid-productBrowser-ProductPage > div > div,
.ecwid-productBrowser-ProductPage > div > div > div,
.ecwid-productBrowser-ProductPage .ec-wrapper,
.ecwid-productBrowser-ProductPage .ec-store,
.ecwid-productBrowser-ProductPage .ec-store__content-wrapper,
.ecwid-productBrowser-ProductPage .ec-store__content-wrapper > div,
.ecwid-productBrowser-ProductPage .product-details__top,
.ecwid-productBrowser-ProductPage .product-details {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Product title */
.ec-size .ec-store .product-details__product-title {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  color: var(--shinshu-dark-blue) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  margin-bottom: 10px !important;
}

/* Breadcrumbs */
.ec-size .ec-store .breadcrumbs__link {
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 12px !important;
  color: var(--shinshu-blueish) !important;
}

.ec-size .ec-store .breadcrumbs__delimiter {
  color: var(--shinshu-gray) !important;
}

/* SKU */
.ec-size .ec-store .product-details__product-sku {
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 12px !important;
  color: var(--shinshu-blueish) !important;
  margin-bottom: 12px !important;
}

/* Price */
.ec-size .ec-store .details-product-price__value {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 26px !important;
  font-weight: 600 !important;
  color: var(--shinshu-blueish) !important;
}

/* Tax line */
.ec-size .ec-store .product-details__product-price-taxes {
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 11px !important;
  color: var(--shinshu-blueish) !important;
}

/* Stock status */
.ec-size .ec-store .details-product-purchase__place {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--shinshu-blueish) !important;
}

/* Product subtitle */
.ec-size .ec-store .product-details__subtitle .product-details-module__content {
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 14px !important;
  color: var(--shinshu-dark-blue) !important;
  font-style: italic !important;
}

/* Size selector buttons */
/* Hide the native radio input */
.ec-size .ec-store .form-control--checkbox-button .form-control__radio {
  display: none !important;
}

/* The label button — outlined dark blue */
.ec-size .ec-store .form-control--checkbox-button .form-control__inline-label label {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--shinshu-dark-blue) !important;
  background-color: var(--shinshu-white) !important;
  border: 1px solid var(--shinshu-dark-blue) !important;
  border-radius: 0 !important;
  padding: 10px 24px !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* Hover state */
.ec-size .ec-store .form-control--checkbox-button .form-control__inline-label label:hover {
  background-color: var(--shinshu-dark-blue) !important;
  color: var(--shinshu-white) !important;
}

/* Selected/checked state — filled dark blue */
.ec-size .ec-store .form-control--checkbox-button .form-control__radio:checked + .form-control__inline-label label {
  background-color: var(--shinshu-dark-blue) !important;
  color: var(--shinshu-white) !important;
}

/* Size option label */
.ec-size .ec-store .details-product-option__title {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--shinshu-dark-blue) !important;
}

/* Add more button - outlined */
.ec-size .ec-store .details-product-purchase__add-more .form-control__button {
  background-color: transparent !important;
  border: 1px solid var(--shinshu-dark-blue) !important;
  color: var(--shinshu-dark-blue) !important;
  font-family: var(--shinshu-font-button) !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  border-radius: 0 !important;
  transition: background-color 0.2s ease, color 0.2s ease !important;
}

.ec-size .ec-store .details-product-purchase__add-more .form-control__button:hover {
  background-color: var(--shinshu-dark-blue) !important;
  color: var(--shinshu-white) !important;
}

/* Add to cart - outlined dark blue (matches product grid buy buttons) */
.ec-size .ec-store .details-product-purchase__add-to-bag .form-control__button {
  background-color: transparent !important;
  border: 1px solid var(--shinshu-dark-blue) !important;
  color: var(--shinshu-dark-blue) !important;
  font-family: var(--shinshu-font-button) !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  border-radius: 0 !important;
  transition: background-color 0.2s ease, color 0.2s ease !important;
}

.ec-size .ec-store .details-product-purchase__add-to-bag .form-control__button:hover {
  background-color: var(--shinshu-dark-blue) !important;
  color: var(--shinshu-white) !important;
}

/* Checkout - filled dark blue */
.ec-size .ec-store .details-product-purchase__checkout .form-control__button {
  background-color: var(--shinshu-dark-blue) !important;
  border: 1px solid var(--shinshu-dark-blue) !important;
  color: var(--shinshu-white) !important;
  font-family: var(--shinshu-font-button) !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  border-radius: 0 !important;
  transition: background-color 0.2s ease !important;
}

.ec-size .ec-store .details-product-purchase__checkout .form-control__button:hover {
  background-color: var(--shinshu-blueish) !important;
  border-color: var(--shinshu-blueish) !important;
  color: var(--shinshu-white) !important;
}

/* Productgegevens section title */
.ec-size .ec-store .product-details__general-info .product-details-module__title {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--shinshu-dark-blue) !important;
  padding-bottom: 10px !important;
  margin-bottom: 8px !important;
}

/* Attribute rows */
.ec-size .ec-store .details-product-attribute {
  padding: 8px 0 !important;
  display: flex !important;
  gap: 8px !important;
}

.ec-size .ec-store .details-product-attribute__title {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--shinshu-blueish) !important;
  min-width: 140px !important;
  flex-shrink: 0 !important;
}

.ec-size .ec-store .details-product-attribute__value {
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 13px !important;
  color: var(--shinshu-dark-blue) !important;
}

/* ---------------------------------------------------------
   PRODUCT DETAIL — SPECS + DESCRIPTION TWO-COLUMN LAYOUT
   1/3 attributes left | 2/3 description right
   --------------------------------------------------------- */
/* Grid container */
.ec-size .ec-store .product-details__general-info .product-details-module__content {
  display: grid !important;
  grid-template-columns: 1fr 2fr !important;
  gap: 40px !important;
  align-items: start !important;
}

/* Attributes — column 1, row 1 */
.ec-size .ec-store .product-details__product-attributes {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

/* Weight — column 1, row 2 (sits below attributes) */
.ec-size .ec-store .product-details__product-weight {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

/* Description — column 2, spans both rows */
.ec-size .ec-store .product-details__product-description {
  grid-column: 2 !important;
  grid-row: 1 / 3 !important;
}

/* Mobile: stack everything */
@media (max-width: 768px) {
  .ec-size .ec-store .product-details__general-info .product-details-module__content {
    display: block !important;
  }
  .ec-size .ec-store .product-details__product-attributes,
.ec-size .ec-store .product-details__product-weight,
.ec-size .ec-store .product-details__product-description {
    grid-column: auto !important;
    grid-row: auto !important;
  }
}

/* Full-width white box for the description section below the image+sidebar row */
.ec-size .ec-store .product-details__description {
  background-color: var(--shinshu-white) !important;
  border: 1px solid var(--shinshu-light-gray) !important;
  padding: 32px !important;
  margin-top: 16px !important;
  box-sizing: border-box !important;
  /* Force full width — clears any floated image/sidebar columns */
  clear: both !important;
  width: 100% !important;
  display: block !important;
  float: none !important;
}

/* Hide the repeated title and breadcrumbs in the description section */
.ec-size .ec-store .product-details__description > .product-details__product-title,
.ec-size .ec-store .product-details__description > .ec-breadcrumbs {
  display: none !important;
}

/* Description area — 1/3 specs + 2/3 description two-column layout */
.ec-size .ec-store .product-details__general-info .product-details-module__content {
  display: grid !important;
  grid-template-columns: 1fr 2fr !important;
  gap: 40px !important;
  align-items: start !important;
}

/* Attributes (specs) — left column, row 1 */
.ec-size .ec-store .product-details__product-attributes {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

/* Weight — left column, row 2 */
.ec-size .ec-store .product-details__product-weight {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

/* Description — right column, spans all rows */
.ec-size .ec-store .product-details__product-description {
  grid-column: 2 !important;
  grid-row: 1 / span 3 !important;
}

/* Mobile: stack all columns */
@media (max-width: 768px) {
  .ec-size .ec-store .product-details__general-info .product-details-module__content {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  .ec-size .ec-store .product-details__product-attributes,
.ec-size .ec-store .product-details__product-weight,
.ec-size .ec-store .product-details__product-description {
    grid-column: 1 !important;
    grid-row: auto !important;
  }
}

/* Social share buttons */
.ec-size .ec-store .ec-likely__wrapper {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

/* Base button style — outlined dark blue */
.ec-size .ec-store .ec-likely__widget {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 14px !important;
  border: 1px solid var(--shinshu-dark-blue) !important;
  background-color: var(--shinshu-white) !important;
  color: var(--shinshu-dark-blue) !important;
  text-decoration: none !important;
  border-radius: 0 !important;
  transition: background-color 0.2s ease, color 0.2s ease !important;
  cursor: pointer !important;
}

/* Icon SVG */
.ec-size .ec-store .ec-likely__icon svg {
  fill: var(--shinshu-dark-blue) !important;
  display: block !important;
  transition: fill 0.2s ease !important;
}

/* Label text */
.ec-size .ec-store .ec-likely__button {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--shinshu-dark-blue) !important;
  transition: color 0.2s ease !important;
}

/* Hover — keep white background, just slightly deepen border */
.ec-size .ec-store .ec-likely__widget:hover {
  background-color: var(--shinshu-white) !important;
  opacity: 0.85 !important;
}

/* Facebook — brand blue */
.ec-size .ec-store .ec-likely__widget--facebook {
  border-color: #3b5998 !important;
}

.ec-size .ec-store .ec-likely__widget--facebook .ec-likely__icon svg {
  fill: #3b5998 !important;
}

.ec-size .ec-store .ec-likely__widget--facebook .ec-likely__button {
  color: #3b5998 !important;
}

/* Twitter / X — black */
.ec-size .ec-store .ec-likely__widget--twitter {
  border-color: #000000 !important;
}

.ec-size .ec-store .ec-likely__widget--twitter .ec-likely__icon svg {
  fill: #000000 !important;
}

.ec-size .ec-store .ec-likely__widget--twitter .ec-likely__button {
  color: #000000 !important;
}

/* Pinterest — brand red */
.ec-size .ec-store .ec-likely__widget--pinterest {
  border-color: #E60023 !important;
}

.ec-size .ec-store .ec-likely__widget--pinterest .ec-likely__icon svg {
  fill: #E60023 !important;
}

.ec-size .ec-store .ec-likely__widget--pinterest .ec-likely__button {
  color: #E60023 !important;
}

/* Social share title */
.ec-size .ec-store .details-product-share__title {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--shinshu-gray) !important;
}

/* ---------------------------------------------------------
   PRODUCT DETAIL — SIDEBAR WHITE BOX
   The entire sidebar sits in one white bordered box.
   --------------------------------------------------------- */
.ec-size .ec-store .product-details__sidebar {
  background-color: var(--shinshu-white) !important;
  border: 1px solid var(--shinshu-light-gray) !important;
  padding: 24px !important;
  box-sizing: border-box !important;
}

/* =========================================================
   8. CART PAGE
   ========================================================= */
/* Cart page wrapper — remove outer padding, full chain */
.ecwid-productBrowser-CartPage,
.ecwid-productBrowser-CartPage > div,
.ecwid-productBrowser-CartPage > div > div,
.ecwid-productBrowser-CartPage > div > div > div,
.ecwid-productBrowser-CartPage > div > div > div > div,
.ecwid-productBrowser-CartPage .ec-wrapper,
.ecwid-productBrowser-CartPage .ec-store,
.ecwid-productBrowser-CartPage .ec-store__content-wrapper,
.ecwid-productBrowser-CartPage .ec-store__content-wrapper > div,
.ecwid-productBrowser-CartPage .ec-cart {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Cart container — flex row, full width */
.ec-size .ec-store .ec-cart {
  display: flex !important;
  gap: 16px !important;
  align-items: flex-start !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* LEFT: Cart items + summary white box */
.ec-size .ec-store .ec-cart__sidebar {
  background-color: var(--shinshu-white) !important;
  border: 1px solid var(--shinshu-light-gray) !important;
  padding: 28px !important;
  box-sizing: border-box !important;
  flex: 1 1 55% !important;
}

/* RIGHT: Checkout form white box */
.ec-size .ec-store .ec-cart__body {
  background-color: var(--shinshu-white) !important;
  border: 1px solid var(--shinshu-light-gray) !important;
  padding: 28px !important;
  box-sizing: border-box !important;
  flex: 1 1 40% !important;
}

/* Cart page title */
.ec-size .ec-store .ec-cart .ec-page-title .page-title__name {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--shinshu-dark-blue) !important;
  margin-bottom: 16px !important;
}

/* Cart breadcrumbs */
.ec-size .ec-store .ec-cart .breadcrumbs__link {
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 12px !important;
  color: var(--shinshu-blueish) !important;
}

/* Product title in cart */
.ec-size .ec-store .ec-cart-item__title {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--shinshu-dark-blue) !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
}

/* Cart item option (Size: 720) */
.ec-size .ec-store .ec-cart-option {
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 12px !important;
  color: var(--shinshu-blueish) !important;
}

/* Cart item price */
.ec-size .ec-store .ec-cart-item__price-inner {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--shinshu-blueish) !important;
}

/* Cart summary table */
.ec-size .ec-store .ec-cart-summary__title {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
  color: var(--shinshu-dark-blue) !important;
}

.ec-size .ec-store .ec-cart-summary__price {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 12px !important;
  color: var(--shinshu-dark-blue) !important;
}

/* Total row — bigger and blueish */
.ec-size .ec-store .ec-cart-summary__row--total .ec-cart-summary__title,
.ec-size .ec-store .ec-cart-summary__total {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--shinshu-blueish) !important;
}

/* Summary note (Incl. BTW) */
.ec-size .ec-store .ec-cart-summary__note {
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 11px !important;
  color: var(--shinshu-blueish) !important;
}

/* "Doorgaan met winkelen" link */
.ec-size .ec-store .ec-cart-shopping .ec-link {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
  color: var(--shinshu-blueish) !important;
}

/* Checkout email input */
.ec-size .ec-store .ec-cart-email__text {
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 13px !important;
  color: var(--shinshu-dark-blue) !important;
  margin-bottom: 12px !important;
}

/* "Bestellen" checkout button — filled dark blue */
.ec-size .ec-store .ec-cart__button--checkout .form-control__button {
  background-color: var(--shinshu-dark-blue) !important;
  border: 1px solid var(--shinshu-dark-blue) !important;
  color: var(--shinshu-white) !important;
  font-family: var(--shinshu-font-button) !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  border-radius: 0 !important;
  transition: background-color 0.2s ease, color 0.2s ease !important;
}

.ec-size .ec-store .ec-cart__button--checkout .form-control__button:hover {
  background-color: var(--shinshu-blueish) !important;
  border-color: var(--shinshu-blueish) !important;
  color: var(--shinshu-white) !important;
}

/* Next steps section */
.ec-size .ec-store .ec-cart-next__header {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--shinshu-dark-blue) !important;
  margin-top: 24px !important;
  margin-bottom: 12px !important;
}

.ec-size .ec-store .ec-cart-next__title {
  font-family: var(--shinshu-font-heading) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--shinshu-dark-blue) !important;
}

.ec-size .ec-store .ec-cart-next__text {
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 12px !important;
  color: var(--shinshu-blueish) !important;
}

/* Security notice */
.ec-size .ec-store .ec-cart__cert {
  font-family: var(--shinshu-font-paragraph) !important;
  font-size: 11px !important;
  color: var(--shinshu-gray) !important;
  margin-bottom: 16px !important;
}

/* Mobile: stack cart columns */
@media (max-width: 768px) {
  .ec-size .ec-store .ec-cart {
    flex-direction: column !important;
  }
  .ec-size .ec-store .ec-cart__sidebar,
.ec-size .ec-store .ec-cart__body {
    flex: 1 1 100% !important;
    width: 100% !important;
  }
}

/* =========================================================
   9. SHOP SECTION OVERLAY
   ========================================================= */
/* Pull the entire shop fluid-engine section upward so it
   overlaps the hero image above it. The :has() selector
   scopes this only to the section containing the shop blocks. */
[data-fluid-engine="true"]:has(#block-yui_3_17_2_1_1772202620022_3853) {
  margin-top: -25px !important;
  position: relative !important;
  z-index: 5 !important;
}

@media (max-width: 767px) {
  [data-fluid-engine="true"]:has(#block-yui_3_17_2_1_1772202620022_3853) {
    margin-top: 0px;
  }
}

/* =========================================================
   10. CATEGORY GRID ITEMS
   ========================================================= */
/* Category grid — flex wrap so items always fill full width evenly */
.ec-size .ec-store .grid__categories {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

/* Each category item grows equally to fill the row */
.ec-size .ec-store .grid-category {
  flex: 1 1 auto !important;
  min-width: 80px !important;
  max-width: 260px !important;
}

/* Card styling */
.ec-size .ec-store .grid-category__wrap-inner {
  background-color: var(--shinshu-white) !important;
  border: 1px solid var(--shinshu-light-gray) !important;
  border-bottom: 3px solid var(--shinshu-dark-blue) !important;
  box-shadow: none !important;
  transition: background-color 0.2s ease, border-color 0.2s ease !important;
  height: 100% !important;
}

.ec-size .ec-store .grid-category__wrap-inner:hover {
  background-color: var(--shinshu-dark-blue) !important;
  border-color: var(--shinshu-dark-blue) !important;
}

/* Category title link — compact pill */
.ec-size .ec-store .grid-category__title {
  font-family: var(--shinshu-font-heading) !important;
  font-size: var(--shinshu-category-font-size) !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--shinshu-dark-blue) !important;
  text-decoration: none !important;
  padding: 7px 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  transition: color 0.2s ease !important;
  min-height: 30px !important;
}

.ec-size .ec-store .grid-category__wrap-inner:hover .grid-category__title,
.ec-size .ec-store .grid-category__wrap-inner:hover .grid-category__title-inner {
  color: var(--shinshu-white) !important;
}

.ec-size .ec-store .grid-category__title-inner {
  line-height: 1.25 !important;
  font-size: 1.95em !important;
}

/* Mobile: slightly wider min-width so text stays readable */
@media (max-width: 768px) {
  .ec-size .ec-store .grid-category {
    min-width: 80px !important;
    max-width: none !important;
  }
}

/* =========================================================
   11. MOBILE PRODUCT GRID — 1 COLUMN
   ========================================================= */
@media (max-width: 768px) {
  /* Force single column product grid on mobile */
  .ec-size .ec-store .grid__products {
    grid-template-columns: 1fr !important;
  }
  .ec-size .ec-store .grid-product {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }
}

/* =========================================================
   11. MOBILE MENU OVERRIDES
   ========================================================= */
@media (max-width: 768px) {
  /* 7A. THE CLOSED "MENU" TRIGGER BUTTON (THICKER BEAM) */
  .horizontal-menu-container.horizontal-mobile {
    background-color: var(--shinshu-white) !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    width: 100% !important;
  }
  .horizontal-menu-container.horizontal-mobile .horizontal-menu-button {
    font-family: var(--shinshu-font-heading) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: var(--shinshu-dark-blue) !important;
    background-color: var(--shinshu-white) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    padding: 24px 24px !important;
    border: none !important;
    border-bottom: 1px solid var(--shinshu-light-gray) !important;
    width: 100% !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
  }
  .horizontal-menu-container.horizontal-mobile .horizontal-menu-button svg {
    fill: var(--shinshu-dark-blue) !important;
    width: 22px !important;
    height: auto !important;
    margin: 0 !important;
    display: block !important;
  }
  .horizontal-menu-container.horizontal-mobile .horizontal-menu-button-text {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
  }
  /* 7B. THE OPEN MOBILE MENU DRAWER (OVERLAY STYLING) */
  /* Force the overlay drawer to be full width */
  .ec-size .ec-store .ec-panel {
    width: 100% !important;
    max-width: 100% !important;
    background-color: rgba(255, 255, 255, 0.95) !important;
    border-radius: 0px !important;
    box-shadow: none !important;
  }
  /* Strip default backgrounds and CRUSH ALL BORDER RADIUS BLEEDS */
  /* The nav container itself gets rgba so the empty space below the last
     menu item shows through — 0.95 = 5% transparent */
  .horizontal-menu--mobile {
    background-color: rgba(255, 255, 255, 0.95) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0px !important;
    box-shadow: none !important;
    width: 100% !important;
  }
  /* Children stay fully opaque solid white */
  .horizontal-menu--mobile .horizontal-menu-parent,
.horizontal-menu--mobile .horizontal-subview,
.horizontal-menu--mobile .horizontal-menu-item {
    background-color: var(--shinshu-white) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0px !important;
    box-shadow: none !important;
    width: 100% !important;
  }
  /* Target the sub-menu container WITHOUT breaking Ecwid's native display:none logic */
  .horizontal-menu--mobile .horizontal-menu-subParent {
    background-color: var(--shinshu-white) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0px !important;
    box-shadow: none !important;
    width: 100% !important;
  }
  /* Convert the submenu to a flex column in TWO states:
     A) In-session: Ecwid adds .horizontal-subviewopen to the parent <li> when tapped
     B) Page-load: Ecwid never adds .horizontal-subviewopen on the parent <li> —
        detected via :has(), checking if the parent's subParent contains an active child.
     Flex is required for order:-1 (title to top) and order:999 (back to bottom) to work.
     gap:0 prevents any Ecwid default gap between flex children causing white-space. */
  .horizontal-menu--mobile .horizontal-menu-item.horizontal-subviewopen > .horizontal-menu-subParent,
.horizontal-menu--mobile .horizontal-menu-item--parent:has(> .horizontal-menu-subParent .horizontal-menu-item--active) > .horizontal-menu-subParent {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
  }
  /* In the page-load state Ecwid only renders the active child visible by default.
     Force ALL level-child items to show so the full sub-category list appears.
     Reset any height/max-height/overflow Ecwid may have set on the previously
     hidden items — without this they can render as display:block but with
     zero or collapsed height, creating the large white-space gap. */
  .horizontal-menu--mobile .horizontal-menu-item--parent:has(> .horizontal-menu-subParent .horizontal-menu-item--active) > .horizontal-menu-subParent > .horizontal-menu-item--levelChild {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  /* Ensure the <a> links inside the forced-visible items are fully rendered */
  .horizontal-menu--mobile .horizontal-menu-item--parent:has(> .horizontal-menu-subParent .horizontal-menu-item--active) > .horizontal-menu-subParent > .horizontal-menu-item--levelChild > a {
    display: flex !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    opacity: 1 !important;
  }
  /* Base styling for all mobile menu links */
  .horizontal-menu--mobile .horizontal-menu-item > a {
    font-family: var(--shinshu-font-heading) !important;
    color: var(--shinshu-dark-blue) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: 0.5px !important;
    padding: 18px 24px !important;
    border-bottom: 1px solid var(--shinshu-light-gray) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    text-align: left !important;
    background-color: var(--shinshu-white) !important;
    border-radius: 0px !important;
  }
  /* Forces the text span to stretch, ensuring perfect left alignment */
  .horizontal-menu--mobile .horizontal-menu-item > a span {
    flex-grow: 1 !important;
    text-align: left !important;
  }
  /* SVG Chevrons in the open mobile menu */
  .horizontal-menu--mobile .horizontal-menu-item > a svg {
    fill: var(--shinshu-dark-blue) !important;
    width: 12px !important;
    height: 12px !important;
    margin: 0 !important;
  }
  /* Specific typography for child/sub-items */
  .horizontal-menu--mobile .horizontal-menu-item--levelChild > a {
    font-family: var(--shinshu-font-paragraph) !important;
    font-weight: 400 !important;
    font-size: 13px !important;
    letter-spacing: normal !important;
    padding: 16px 24px !important;
  }
  /* Active sub-category item highlighted in dark blue */
  .horizontal-menu--mobile .horizontal-menu-item--active > a {
    background-color: var(--shinshu-dark-blue) !important;
    color: var(--shinshu-white) !important;
  }
  .horizontal-menu--mobile .horizontal-menu-item--active > a svg {
    fill: var(--shinshu-white) !important;
  }
  /* ---------------------------------------------------------
     MOBILE SUB-MENU FIXES (Dead-Clicks & Headers)
     --------------------------------------------------------- */
  /* 1. Hide the duplicate top-level parent <a> link.
        Covers both states:
        A) In-session tap  → .horizontal-subviewopen is on the <li>
        B) Page-load auto  → detected via :has() (active child inside the subParent) */
  .horizontal-menu--mobile .horizontal-menu-item--parent.horizontal-subviewopen > a,
.horizontal-menu--mobile .horizontal-menu-item--parent:has(> .horizontal-menu-subParent .horizontal-menu-item--active) > a {
    display: none !important;
  }
  /* 2. Back button — styled and pinned to the bottom of the sub-menu list */
  .horizontal-menu--mobile .horizontal-menu-item--back {
    order: 999 !important;
    display: block !important;
  }
  .horizontal-menu--mobile .horizontal-menu-item--back > a {
    background-color: var(--shinshu-light-gray) !important;
    color: var(--shinshu-dark-blue) !important;
    font-family: var(--shinshu-font-heading) !important;
    font-weight: 600 !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    padding: 20px 24px !important;
    border-radius: 0px !important;
    border-top: 1px solid var(--shinshu-gray) !important;
    border-bottom: none !important;
  }
  /* Hide the back button's category-name text span — only show the arrow */
  .horizontal-menu--mobile .horizontal-menu-item--back > a span {
    display: none !important;
  }
  /* 3. Pin the Submenu Title as the blue Main Category Header at the top */
  .horizontal-menu--mobile .horizontal-menu-item--title {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    order: -1 !important;
  }
  .horizontal-menu--mobile .horizontal-menu-item--title > a {
    font-family: var(--shinshu-font-heading) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: var(--shinshu-white) !important;
    background-color: var(--shinshu-blueish) !important;
    border: none !important;
    padding: 20px 24px !important;
    border-radius: 0px !important;
    display: flex !important;
    align-items: center !important;
    pointer-events: auto !important;
  }
  /* 4. Destroy Phantom Menus — the inner ul.horizontal-menu-subParent nested inside
        each levelChild must ALWAYS stay hidden. These contain a duplicate back button
        and title for that child and create the white-space gap when shown.
        Uses higher specificity than the flex trigger rule (3 classes = 030):
        - First selector matches all levelChild subParents (030, after flex rule = wins)
        - Second selector also covers when Ecwid adds .horizontal-subviewopen to the
          active levelChild (4 classes = 040, always beats the flex trigger) */
  .horizontal-menu--mobile .horizontal-menu-item.horizontal-menu-item--levelChild > .horizontal-menu-subParent,
.horizontal-menu--mobile .horizontal-menu-item.horizontal-menu-item--levelChild.horizontal-subviewopen > .horizontal-menu-subParent {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}