/** Shopify CDN: Minification failed

Line 763:23 Unexpected "{"
Line 763:32 Expected ":"
Line 763:38 Unexpected ","

**/
/* ============================================================
   uniivo-custom.css
   Add to assets/ then link in layout/theme.liquid before </head>:
   {{ 'uniivo-custom.css' | asset_url | stylesheet_tag }}
   ============================================================ */

/* ─────────────────────────────────────────────
   1. ANNOUNCEMENT BAR
───────────────────────────────────────────── */
.announcement-bar { background-color: #0D5B45 !important; }
.announcement-bar__message,
.announcement-bar__link,
.announcement-bar .icon { color: #fff !important; fill: #fff !important; }

/* ─────────────────────────────────────────────
   2. HEADER / NAV
───────────────────────────────────────────── */
.header { background: #fff; border-bottom: 1px solid #f0f0f0; }
.header__heading-link,
.header__menu-item { color: #121212 !important; font-size: 0.9375rem; }
.header__menu-item:hover { color: #0D5B45 !important; }
/* Cart badge */
.cart-count-bubble { background: #D81B60 !important; }

/* ─────────────────────────────────────────────
   3. ALL BUTTONS → DARK PINK
───────────────────────────────────────────── */
/* ─────────────────────────────────────────────
   3. ALL BUTTONS → DARK PINK (BORDERS REMOVED)
───────────────────────────────────────────── */
/* Solid primary, Hero buttons, and Shopify Payment buttons */
.button, 
.button--primary,
.shopify-payment-button__button--unbranded,
.shopify-payment-button__button,
.banner__buttons .button {
  background: #D81B60 !important;
  color: #fff !important;
  border-radius: 50px !important; 
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  padding: 15px 30px !important;
  text-transform: uppercase;
  
  /* CRITICAL: Remove all possible border/shadow layers */
  border: none !important; 
  outline: none !important;
  box-shadow: none !important; 
  appearance: none;
}

/* Kills the Dawn theme "ghost" border layers on all buttons */
.button::before, 
.button::after, 
.button--primary::before, 
.button--primary::after,
.shopify-payment-button__button::before,
.shopify-payment-button__button::after {
  display: none !important;
  content: none !important;
  border: none !important;
  box-shadow: none !important;
}

.button:hover, 
.button--primary:hover,
.shopify-payment-button__button:hover { 
  background: #b01550 !important; 
  border: none !important;
}

/* Outline / secondary */
.button--secondary {
  background: transparent !important;
  border: 2px solid #D81B60 !important;
  color: #D81B60 !important;
  border-radius: 50px !important;
}

.button--secondary:hover { 
  background: #D81B60 !important; 
  color: #fff !important; 
}

/* ─────────────────────────────────────────────
   FIX: Remove focus rings when clicking
───────────────────────────────────────────── */
.button:focus, 
.button:focus-visible,
.product-form__submit:focus, 
.shopify-payment-button__button:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* ─────────────────────────────────────────────
   4. PRODUCT FORM — ADD TO CART
───────────────────────────────────────────── */
.product-form__submit {
  background: #D81B60 !important;
  border: none !important;
  box-shadow: none !important;
  color: #fff !important;
  border-radius: 50px !important;
  height: auto !important; /* Flexible height for larger text */
  padding: 18px !important;
  font-size: 1.3rem !important; /* Increased size */
  font-weight: 700 !important;
  width: 100%;
}

.product-form__submit:hover { background: #b01550 !important; }

/* Add to wishlist outline */
.product-form__buttons .button--secondary {
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

/* ─────────────────────────────────────────────
   5. QUICK ADD (featured collection cards)
───────────────────────────────────────────── */
.quick-add__submit,
.card__footer .button,
.product-card-wrapper .button {
  background: #D81B60 !important;
  border-color: #D81B60 !important;
  color: #fff !important;
  border-radius: 40px !important;
}
.quick-add__submit:hover,
.card__footer .button:hover { background: #b01550 !important; }

/* ─────────────────────────────────────────────
   6. PRODUCT CARD
───────────────────────────────────────────── */
.card--product { border-radius: 16px !important; overflow: hidden; }
.card__media { border-radius: 12px 12px 0 0; }
/* Wishlist / heart icon */
.card__information .card__badge { background: #D81B60; color: #fff; border-radius: 20px; }

/* ─────────────────────────────────────────────
   7. PRICE
───────────────────────────────────────────── */
.price--on-sale .price__sale { color: #D81B60; }
.price--on-sale .price__regular .price-item--regular { color: #aaa; }
.badge--sale, .badge--on-sale {
  background: #D81B60 !important;
  color: #fff !important;
  border-radius: 20px !important;
  font-size: 0.75rem;
  font-weight: 500;
  padding: 4px 10px;
}

/* ─────────────────────────────────────────────
   8. SIZE / VARIANT SELECTORS
───────────────────────────────────────────── */
.swatch-input__input:checked + .swatch-input__label {
  /* Keep the inner swatch color intact — only show a dark selection ring */
  outline: 3px solid #121212 !important;
  outline-offset: 2px !important;
  border-color: transparent !important;
  /* Do NOT override background — swatch background must stay as the product colour */
}
/* Size button style */
fieldset .select-label,
.product-form__input label { font-size: 0.875rem; font-weight: 500; color: #333; }

/* ─────────────────────────────────────────────
   9. PRODUCT PAGE — PRINT/DESIGN SWATCHES
   (circular colour swatches row)
───────────────────────────────────────────── */
.swatch-input__label {
  border-radius: 50% !important;
  width: 48px !important;
  height: 48px !important;
  overflow: visible; /* Must be visible so the outline ring shows outside the circle */
  border: 2px solid transparent;
  transition: border-color 0.15s, outline 0.15s;
}
.swatch-input__label:hover {
  outline: 3px solid #555 !important;
  outline-offset: 2px !important;
  border-color: transparent !important;
}

/* ─────────────────────────────────────────────
   10. BREADCRUMB
───────────────────────────────────────────── */
.breadcrumbs a, .breadcrumb a { color: #555; font-size: 0.8125rem; }
.breadcrumbs a:hover { color: #0D5B45; }
.breadcrumbs__chevron { color: #bbb; }

/* ─────────────────────────────────────────────
   11. STAR RATING (review apps)
───────────────────────────────────────────── */
.rating__star, .spr-icon-star { color: #F5A623 !important; }
.product-reviews .spr-badge-caption { font-size: 0.8125rem; color: #777; }

/* ─────────────────────────────────────────────
   12. BESTSELLER BADGE (custom tag-based)
   Add tag "bestseller" to product in Shopify admin
───────────────────────────────────────────── */
.uniivo-badge-bestseller {
  position: absolute;
  top: 12px;
  left: 12px;
  background: #D81B60;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 20px;
  z-index: 2;
  letter-spacing: 0.01em;
}

/* ─────────────────────────────────────────────
   13. "VIEW ALL" & TEXT LINKS
───────────────────────────────────────────── */
.collection__view-all,
.link,
a.link { color: #D81B60 !important; }
.collection__view-all:hover { color: #b01550 !important; }
/* "View all →" link next to Best sellers heading */
.featured-collection .title-wrapper a { color: #D81B60; font-size: 0.9rem; font-weight: 500; }

/* ─────────────────────────────────────────────
   14. SECTION HEADINGS (global consistency)
───────────────────────────────────────────── */
.collection-list__title,
.featured-collection .collection__title,
h2.title {
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: 500;
  color: #121212;
}

/* ─────────────────────────────────────────────
   15. FOOTER
───────────────────────────────────────────── */
.footer { background: #0D5B45 !important; }
.footer *,
.footer a,
.footer p,
.footer li,
.footer h2,
.footer label { color: #fff !important; }
.footer a:hover { color: #FDECEF !important; text-decoration: none; }
.footer__heading { font-size: 0.875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.7; }
.footer .social-icons a,
.footer .list-social a { color: #fff !important; }
/* Newsletter field */
.footer__newsletter .field { background: rgba(255,255,255,0.1); border-radius: 40px; overflow: hidden; border: 1px solid rgba(255,255,255,0.25); }
.footer__newsletter .field__input { background: transparent; color: #fff !important; border: none !important; }
.footer__newsletter .field__input::placeholder { color: rgba(255,255,255,0.5) !important; }
.footer__newsletter .button {
  background: #D81B60 !important;
  border-color: #D81B60 !important;
  border-radius: 0 40px 40px 0 !important;
  padding: 0 20px;
}
.footer__newsletter .button:hover { background: #b01550 !important; }
/* Copyright bar */
.footer__copyright { border-top: 1px solid rgba(255,255,255,0.15); }
.footer__copyright a,
.footer__copyright p { color: rgba(255,255,255,0.6) !important; font-size: 0.8125rem; }

/* ─────────────────────────────────────────────
   16. PRODUCT PAGE TOP BAR (announcement)
   When used on product template with pink bg
───────────────────────────────────────────── */
.product-template .announcement-bar {
  background: #FDECEF !important;
}
.product-template .announcement-bar__message {
  color: #0D5B45 !important;
  font-size: 0.875rem;
}

/* ─────────────────────────────────────────────
   17. SIZE GUIDE LINK
───────────────────────────────────────────── */
.size-chart-link,
a[href*="size-guide"] {
  color: #D81B60 !important;
  font-size: 0.875rem;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  text-decoration: none;
}
.size-chart-link:hover { text-decoration: underline; }

/* ─────────────────────────────────────────────
   18. PRODUCT RECOMMENDATIONS (You may also like)
───────────────────────────────────────────── */
.product-recommendations .title { font-size: 1.5rem; font-weight: 500; color: #121212; }
.product-recommendations .button {
  background: #D81B60 !important;
  border-color: #D81B60 !important;
  border-radius: 40px !important;
  color: #fff !important;
  font-size: 0.875rem;
  padding: 10px 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

/* ─────────────────────────────────────────────
   19. MOBILE FIXES
───────────────────────────────────────────── */
@media (max-width: 749px) {
  .product-form__submit { height: 58px !important; font-size: 1.125rem !important; font-weight: 700 !important; }
  .uniivo-ptabs__nav { gap: 0; }
  .uniivo-ptabs__tab { padding: 10px 14px; font-size: 0.875rem; }
  .header__heading-logo { max-width: 100px; }
}

/* Product Page CSS */

/* ─────────────────────────────────────────────
   20. PDP — Rating + sold count row
───────────────────────────────────────────── */
.uniivo-pdp-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.uniivo-pdp-rating {
  display: flex;
  align-items: center;
  gap: 6px;
}
.uniivo-pdp-rating svg {
  width: 22px !important;
  height: 22px !important;
}
.uniivo-pdp-rating__score {
  font-size: 1.375;
  font-weight: 700;
  color: #121212;
}
.uniivo-pdp-rating__count {
  font-size: 1.250rem;
  color: #777;
}
.uniivo-pdp-meta__sep { color: #ccc; font-size: 0.875rem; }
.uniivo-pdp-sold {
  font-size: 0.875rem;
  font-weight: 600;
  color: #555;
}

/* ─────────────────────────────────────────────
   21. PDP — % Off badge in price row
───────────────────────────────────────────── */
.uniivo-pdp-discount-badge {
  display: inline-block;
  background: #D81B60;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 20px;
  margin-left: 8px;
  vertical-align: middle;
  letter-spacing: 0.02em;
}

/* ─────────────────────────────────────────────
   20. PDP — % OFF badge
───────────────────────────────────────────── */
.uniivo-off-badge {
  display: inline-block;
  background: #D81B60;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 20px;
  margin-left: 8px;
  vertical-align: middle;
  letter-spacing: 0.02em;
  line-height: 1.6;
}

/* ─────────────────────────────────────────────
   21. PDP — Short description
───────────────────────────────────────────── */
.product__description,
.product__text .rte,
.uniivo-ptabs__content {
  font-size: 1.2rem !important; /* Increased general text size */
  color: #333;
  line-height: 1.6;
}

/* ─────────────────────────────────────────────
   22. PDP — Size Guide link
───────────────────────────────────────────── */
.product__info-container a[href*="size"],
a.uniivo-size-guide {
  color: #D81B60 !important;
  font-size: 0.875rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  text-decoration: none;
  margin-top: 6px;
}
.product__info-container a[href*="size"]:hover,
a.uniivo-size-guide:hover { text-decoration: underline; }

/* ─────────────────────────────────────────────
   23. PDP — Trust strip (below ATC) sizing
───────────────────────────────────────────── */
.uniivo-prod-trust__icon { 
  width: 70px !important; 
  height: 70px !important; 
}
.uniivo-prod-trust__icon img { 
  width: 55px !important; 
  height: 55px !important; 
}
.uniivo-prod-trust__line1 { 
  font-size: 1.1rem !important; 
  margin-top: 5px;
}
.uniivo-prod-trust__line2 { 
  font-size: 0.9rem !important; 
}


/* ─── Wishlist button ─── */
.uniivo-wishlist-btn {
  width: 100%;
  padding: 14px 0;
  background: transparent;
  border: 1.5px solid #D81B60 !important;
  color: #D81B60;
  border-radius: 40px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 12px;
  transition: background 0.2s, color 0.2s;
  font-family: inherit;
  box-shadow: none !important;
  outline: none !important;
}
.uniivo-wishlist-btn:hover { background: #D81B60; color: #fff; }
.uniivo-wishlist-btn:hover svg path { stroke: #fff; }


/* ─── Size Guide link ─── */
.uniivo-size-guide-link {
  color: #D81B60 !important;
  font-size: 0.9rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  text-decoration: none;
  margin-top: 10px;
}
.uniivo-size-guide-link:hover { text-decoration: underline; }

/* ─── % OFF badge ─── */
.uniivo-off-badge {
  display: inline-block;
  background: #D81B60;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 20px;
  margin-left: 8px;
  vertical-align: middle;
  letter-spacing: 0.02em;
  line-height: 1.6;
}

/* ─────────────────────────────────────────────
   20. PDP — Quantity input bigger
───────────────────────────────────────────── */
.quantity {
  height: 48px !important;
  min-height: 48px !important;
  border-radius: 12px !important; /* Curves the outer box corners */
  border: 1px solid #ddd !important;
  overflow: hidden; /* Ensures buttons don't overlap the curves */
}

.quantity__input {
  font-size: 1.4rem !important;
  font-weight: 600 !important;
  min-width: 48px !important;
}

.quantity__button {
  width: 45px !important;
  height: 45px !important;
}

/* ─────────────────────────────────────────────
   22. Remove button focus outlines / borders globally
───────────────────────────────────────────── */
.button:focus, .button:focus-visible,
.product-form__submit:focus, .product-form__submit:focus-visible,
.shopify-payment-button__button:focus,
.shopify-payment-button__button--unbranded:focus {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

/* Buy it now button — Shopify's dynamic checkout button
   wraps in an iframe, target the outer container */
.shopify-payment-button {
  margin-top: 12px;
}
.shopify-payment-button__button {
  overflow: hidden;
  border: 0 !important;
  margin-top: 10px;
}

/* Quick add cards — remove border there too */
.quick-add__submit,
.card__footer .button {
  border: none !important;
  box-shadow: none !important;
}

.product-form__submit,
.product-form__submit::before,
.product-form__submit::after,
.shopify-payment-button__button,
.shopify-payment-button__button::before,
.shopify-payment-button__button::after {
  border: none !important;
  outline: none !important;
  box-shadow: none !important; /* This removes the pink/red outer ring */
  background-image: none !important;
}

/* Change selected variant button to Forest Green */
.product-form__input input[type='radio']:checked + label {
  background-color: #0D5B45 !important;
  color: white !important;
  border-color: #0D5B45 !important;
}

/* Optional: Slight hover effect on unselected buttons */
.product-form__input label:hover {
  border-color: #0D5B45 !important;
}

/* ─────────────────────────────────────────────
   SLIDESHOW — Desktop/Mobile image switching
   + Full bleed hero height + header border fix
─────────────────────────────────────────────── */

/* Remove header bottom border */
.header-wrapper {
  border-bottom: none !important;
  box-shadow: none !important;
}

/* Both image wraps fill the media container */
.slideshow__img-wrap {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.slideshow__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}

/* ── Desktop default: show desktop, hide mobile ── */
.slideshow__img-wrap--mobile {
  display: none !important;
}
.slideshow__img-wrap--desktop {
  display: block !important;
}

/* Hero height — desktop */
.slideshow .banner,
.banner--medium,
.banner--large {
  min-height: 72vh !important;
}

/* ── Mobile: swap to portrait image ── */
@media (max-width: 749px) {
  .slideshow__img-wrap--desktop.hide-mobile {
    display: none !important;
  }
  .slideshow__img-wrap--mobile {
    display: block !important;
  }

  /* 400×410 = 102.5% ratio + ~10% breathing room = ~112% */
  .slideshow .banner,
  .banner--medium,
  .banner--large {
    min-height: 0 !important;
    height: auto !important;
  }

  /* Let the media layer size itself from the aspect-ratio container */
  .slideshow .banner .slideshow__media,
  .slideshow .banner .banner__media {
    position: absolute !important;
    inset: 0 !important;
    height: 100% !important;
  }

  .slideshow__img-wrap--mobile img {
    object-fit: cover !important;
    object-position: center top !important;
  }

  /* Dots/controls sit flush below — no extra space */
  .slideshow__controls {
    margin-top: 0 !important;
  }
}

/* ─────────────────────────────────────────────
   IMAGE BANNER (About Us) — 966×380 ratio
─────────────────────────────────────────────── */
.banner:not(.slideshow) {
  min-height: clamp(280px, 39.4vw, 500px) !important;
  /* 380/966 = 39.3% of viewport width, clamped sensibly */
}
.banner:not(.slideshow) .banner__media img {
  object-fit: cover !important;
  object-position: center center !important;
  width: 100% !important;
  height: 100% !important;
}
@media (max-width: 749px) {
  .banner:not(.slideshow) {
    min-height: 56vw !important; /* slightly taller ratio on narrow screens */
  }
}
/* ─────────────────────────────────────────────
   SLIDESHOW — Remove gap between banner and controls
─────────────────────────────────────────────── */

/* Remove bottom gutter on the slideshow component wrapper */
.slider-mobile-gutter {
  --slider-mobile-gutter: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Remove any top margin/padding on the controls bar below the slide */
.slideshow__controls.slider-buttons {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Dawn adds padding inside the banner grid on mobile */
@media (max-width: 749px) {
  .slideshow.banner {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  /* The grid__item inside the slider adds bottom space */
  .slideshow__slide.grid__item {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Remove bottom padding from the slideshow component itself */
  slideshow-component {
    display: block !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Collapse any ::after pseudo gap */
  .slideshow.banner::after,
  .slideshow__slide::after {
    display: none !important;
    content: none !important;
  }
}
/* ─────────────────────────────────────────────
   SLIDESHOW — Remove gap caused by empty text box padding on mobile
─────────────────────────────────────────────── */
@media (max-width: 749px) {
  .slideshow__text.banner__box.content-container--full-width-mobile {
    padding: 0 !important;
  }

  /* If text box is genuinely empty, collapse it entirely */
  .slideshow__text-wrapper.banner__content:not(:has(h2)):not(:has(p)):not(:has(.banner__buttons)) {
    display: none !important;
  }
}
/* ─────────────────────────────────────────────
   IMAGE BANNER — Desktop/Mobile image swap
   Desktop: 966×380 | Mobile: 400×410
─────────────────────────────────────────────── */

/* Both wraps sit inside the media container */
.banner__img-wrap {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.banner__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}

/* Desktop default — show desktop, hide mobile */
.banner__img-wrap--mobile {
  display: none !important;
}
.banner__img-wrap--desktop {
  display: block !important;
}

/* Desktop height — locked to 966×380 ratio */
.banner--adapt#Banner-{{ section.id }},
.banner.banner--adapt {
  /* 380/966 = 39.3% */
  min-height: clamp(260px, 39.3vw, 480px) !important;
}

/* Mobile — swap to portrait image + lock to 400×410 ratio */
@media (max-width: 749px) {
  .banner__img-wrap--desktop.hide-mobile {
    display: none !important;
  }
  .banner__img-wrap--mobile {
    display: block !important;
  }
  .banner__img-wrap--mobile img {
    object-position: center top !important;
  }

  /* 400×410 = 102.5% ratio + small breathing room */
  .banner.banner--adapt {
    min-height: 0 !important;
    height: auto !important;
    aspect-ratio: 400 / 420 !important;
  }

  /* Media layer must stretch to fill aspect-ratio container */
  .banner.banner--adapt .banner__media {
    position: absolute !important;
    inset: 0 !important;
    height: 100% !important;
  }

  /* Collapse text box padding — no gap below image */
  .banner.banner--adapt .banner__box.content-container--full-width-mobile {
    padding: 0 !important;
  }
}

/* ─────────────────────────────────────────────
   23. MOBILE FOOTER FIX (FORCE 2-COLUMN GRID & LEFT ALIGN)
───────────────────────────────────────────── */
@media (max-width: 749px) {
  /* 1. Force the master container to break Dawn's single column structure */
  .footer__blocks-wrapper.grid {
    display: flex !important;
    flex-wrap: wrap !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    gap: 32px 16px !important; /* Row gap and Column gap */
  }

  /* 2. Brand block (Logo, Tagline, Socials) takes full width row space */
  .footer-block.grid__item:first-child {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    clear: both !important;
  }

  /* 3. Force the Menus (Shop, Help, About) into a rigid 2-Column Grid matrix */
  .footer-block.grid__item.footer-block--menu {
    flex: 0 0 calc(50% - 8px) !important;
    width: calc(50% - 8px) !important;
    max-width: calc(50% - 8px) !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 4. Complete Left Alignment Override across all nested text elements */
  .footer-block.grid__item,
  .footer-block__brand-info,
  .footer-block__heading,
  .footer-block__details-content,
  .list-menu__item,
  .footer-block__image-wrapper {
    text-align: left !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }

  /* Adjust default list menu items block structural padding */
  ul.footer-block__details-content {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
  
  a.list-menu__item--link {
    justify-content: flex-start !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* 5. Keep social media icons cleanly left-aligned with the logo */
  ul.footer__list-social {
    justify-content: flex-start !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
}

/* ─────────────────────────────────────────────
   24. FOOTER COPYRIGHT & POLICIES TEXT SIZE
───────────────────────────────────────────── */
/* Scales up the text size for copyright and links */
.footer__copyright .copyright__content,
.footer__copyright .copyright__content a,
.footer__copyright .policies a {
  font-size: 1.25rem !important; /* Noticeably larger text */
  font-weight: 500 !important;   /* Cleaner readability */
  letter-spacing: 0.02em !important;
}

/* Adjusts the dot separators or list margins if needed */
.footer__copyright .policies li {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Optional mobile adjustment to keep it looking clean on small screens */
@media (max-width: 749px) {
  .footer__copyright .copyright__content,
  .footer__copyright .policies a {
    font-size: 1.1rem !important; /* Slightly smaller on phones so it wraps beautifully */
  }
}

/* ─────────────────────────────────────────────
   26. ENHANCE AND UNDERLINE FOOTER HEADINGS
───────────────────────────────────────────── */
.footer-block__heading {
  font-size: 1.1rem !important;        /* Increased size for better visibility */
  font-weight: 700 !important;         /* Makes the text bolder and crisper */
  text-transform: uppercase !important;/* Keeps the look clean and structured */
  letter-spacing: 0.08em !important;   /* Elegantly spaces out the letters */
  position: relative !important;
  padding-bottom: 8px !important;      /* Creates space between text and underline */
  margin-bottom: 16px !important;      /* Creates space below the underline before links start */
  display: inline-block !important;    /* Keeps the underline exactly the length of the words */
}

/* Creates a clean, custom underline accent bar */
.footer-block__heading::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 40px !important;              /* Width of the accent line (change to 100% for full width) */
  height: 2px !important;              /* Thickness of the line */
  background-color: #D81B60 !important;/* Uses your brand's dark pink color accent */
}

/* Mobile alignment fix to ensure underlines stay left-aligned */
@media (max-width: 749px) {
  .footer-block__heading {
    display: inline-block !important;
    text-align: left !important;
  }
  .footer-block__heading::after {
    left: 0 !important;
  }
}

/* ─────────────────────────────────────────────
   27. GLOBAL PRODUCT INFO LEFT-ALIGNMENT (ALL DEVICES)
───────────────────────────────────────────── */
/* Targets the master product info element and all nested elements */
product-info,
.product__info-container,
.product__info-container > *,
.product__title,
.product__title * {
  text-align: left !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Forces inner flex blocks (like price, variant pickers, quantities) to align left */
.product__info-container .price,
.product__info-container .product-form,
.product__info-container .product-form__input,
.product__info-container .share-button,
.product__info-container .product__accordion,
.product__info-container .inventory-status {
  text-align: left !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  margin-left: 0 !important;
}

/* Ensure variant pills or swatches don't look broken when forced left */
.product__info-container fieldset.product-form__input {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
}

/* Fixes any nested Shopify block alignments on mobile devices specifically */
@media screen and (max-width: 749px) {
  .product__info-container {
    padding-left: 15px !important; /* Adds slight breathing room from screen boundary */
    padding-right: 15px !important;
  }
}

/* ─────────────────────────────────────────────
   28. FOOTER — DESKTOP SINGLE ROW, LEFT ALIGNED
───────────────────────────────────────────── */
@media (min-width: 750px) {

  /* Force all footer blocks into one flex row */
  .footer__blocks-wrapper.grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 40px !important;
  }

  /* Each block: left-aligned, no auto margins pushing them center */
  .footer-block.grid__item {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Brand block (logo + socials): slightly wider than nav columns */
  .footer-block.grid__item:first-child {
    flex: 1.5 1 0 !important;
  }

  /* Headings and links left-aligned */
  .footer-block__heading,
  .footer-block__details-content,
  .list-menu__item,
  .footer-block__brand-info {
    text-align: left !important;
    justify-content: flex-start !important;
    margin-left: 0 !important;
  }

  /* Left-align nav links (Dawn centers them by default) */
  a.list-menu__item--link {
    justify-content: flex-start !important;
    padding-left: 0 !important;
  }

  /* Left-align social icons */
  ul.footer__list-social {
    justify-content: flex-start !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
}

/* ─────────────────────────────────────────────
   29. FIXED & CENTERED SIZE CHART MODAL
───────────────────────────────────────────── */

/* Trigger link beside size label */
.uniivo-sc__trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: none;
  padding: 0;
  font-size: 0.875rem;
  font-weight: 500;
  color: #0D5B45;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.15s;
  margin-left: 12px;
  vertical-align: middle;
}
.uniivo-sc__trigger:hover { 
  color: #094d39; 
}

/* Full-screen frosted glass overlay */
.uniivo-sc__overlay {
  position: fixed !important;
  inset: 0 !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgba(0, 0, 0, 0.6) !important; /* Dark overlay tint */
  backdrop-filter: blur(8px) !important;     /* Frosted glass blur effect */
  -webkit-backdrop-filter: blur(8px) !important;
  z-index: 2147483647 !important;            /* Force it completely to the front layer */
  display: flex !important;
  align-items: center !important;            /* Vertical centering */
  justify-content: center !important;         /* Horizontal centering */
  padding: 24px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}

/* Reveal style when modal is active */
.uniivo-sc__overlay:not([hidden]) {
  opacity: 1 !important;
  pointer-events: all !important;
}

/* Centered Panel Content Window */
.uniivo-sc__panel {
  background: #ffffff;
  border-radius: 12px;
  max-width: 700px;
  width: 100%;
  max-height: 85vh;                           /* Prevents container overflowing screen height */
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
  transform: scale(0.95);
  transition: transform 0.25s ease;
  overflow: hidden;                           /* Keeps header sticky and corners smooth */
}

.uniivo-sc__overlay:not([hidden]) .uniivo-sc__panel {
  transform: scale(1);
}

/* Header Element */
.uniivo-sc__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px;
  border-bottom: 1px solid #efefef;
  background: #ffffff;
}
.uniivo-sc__title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #121212;
  margin: 0;
}
.uniivo-sc__close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background 0.15s;
}
.uniivo-sc__close:hover { 
  background: #f5f5f5; 
}

/* Scrollable Image Area */
.uniivo-sc__body {
  padding: 20px 24px 24px;
  overflow-y: auto;                           /* Forces scrolling if image is vertically long */
  -webkit-overflow-scrolling: touch;          /* Smooth inertia scroll on iOS */
}
.uniivo-sc__img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
}

/* Screen Adaptations */
@media (max-width: 749px) {
  .uniivo-sc__overlay {
    padding: 16px;                            /* Tighter padding on mobile screens */
  }
  .uniivo-sc__panel {
    max-height: 80vh;                         /* Safe area limits on mobile viewports */
  }
}

/* ─────────────────────────────────────────────
   30. SLIDESHOW — FULL BANNER CLICKABLE LINK
───────────────────────────────────────────── */
.slideshow__media-link {
  cursor: pointer;
}

.slideshow__media-link > .slideshow__media {
  width: 100%;
  height: 100%;
}

/* Fix: allow banner link clicks through the text wrapper on desktop */
.slideshow__text-wrapper {
  pointer-events: none;
}