/** Shopify CDN: Minification failed

Line 301:0 All "@import" rules must come first

**/
/* ════════════════════════════════════════════════════════════
   1. CSS CUSTOM PROPERTIES (Horizon theme root variables)
      Override the theme's own --color-* tokens so every
      component that references them inherits the new palette.
   ════════════════════════════════════════════════════════════ */
:root {
  /* Button / primary action */
  --color-button: #10B981;            /* bg */
  --color-button-text: #FFFFFF;       /* text */
  --color-button-hover: #059669;      /* hover bg */

  /* Secondary / outline */
  --color-secondary-button: transparent;
  --color-secondary-button-text: #10B981;
  --color-secondary-button-border: #10B981;

  /* Links */
  --color-link: #2563EB;
  --color-link-hover: #F59E0B;

  /* Page background */
  --color-background: #FFFFFF;
  --color-background-2: #F8FAFC;      /* subtle section alt */

  /* Text */
  --color-foreground: #334155;
  --color-foreground-title: #0F172A;
  --color-foreground-subtle: #64748B;

  /* Borders */
  --color-border: #E2E8F0;

  /* Accent */
  --color-accent-1: #2563EB;
  --color-accent-2: #10B981;
  --color-accent-3: #F59E0B;

  /* Badge / sale */
  --color-badge-background: #F59E0B;
  --color-badge-foreground: #422006;

  /* Price sale */
  --color-price-sale: #059669;

  /* Cart */
  --color-cart-button: #10B981;
  --color-cart-button-text: #FFFFFF;
}


/* ════════════════════════════════════════════════════════════
   2. GLOBAL PAGE BACKGROUND
   ════════════════════════════════════════════════════════════ */
body {
  background-color: #FFFFFF;
}


/* ════════════════════════════════════════════════════════════
   3. BUTTONS — primary green, white text, black text on hover
      Targets Horizon's common button classes + native inputs.
   ════════════════════════════════════════════════════════════ */

/* --- Base button --- */
.button,
.btn,
button.button,
a.button,
[type="submit"],
[type="button"],
.product-form__cart-submit,
.product-form__submit,
.cart__checkout-button,
.cart-notification__checkout,
.predictive-search__item-heading,
.shopify-payment-button__button--branded,
.shopify-payment-button__button--unbranded {
  background-color: #10B981 !important;
  color: #FFFFFF !important;
  border-color: #10B981 !important;
  border-radius: 10px;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

/* --- Hover: darker green bg, BLACK text --- */
.button:hover,
.btn:hover,
a.button:hover,
[type="submit"]:hover,
[type="button"]:hover,
.product-form__cart-submit:hover,
.product-form__submit:hover,
.cart__checkout-button:hover,
.cart-notification__checkout:hover {
  background-color: #059669 !important;
  color: #000000 !important;
  border-color: #059669 !important;
}

/* --- Horizon button variant: button--secondary (outline) --- */
.button--secondary {
  background-color: transparent !important;
  color: #10B981 !important;
  border: 2px solid #10B981 !important;
}
.button--secondary:hover {
  background-color: #10B981 !important;
  color: #000000 !important;
}

/* --- Disabled state (don't override disabled buttons) --- */
.button[disabled],
[type="submit"][disabled],
.product-form__cart-submit[disabled] {
  background-color: #94A3B8 !important;
  border-color: #94A3B8 !important;
  color: #fff !important;
  cursor: not-allowed;
}


/* ════════════════════════════════════════════════════════════
   4. ADD-TO-CART / PRODUCT FORM BUTTONS
      Horizon uses product-form__buttons, .product-form__cart-submit
   ════════════════════════════════════════════════════════════ */
.product-form__buttons .button,
.product-form__buttons [type="submit"],
.product-form__cart-submit,
.product-form__submit {
  background-color: #10B981 !important;
  color: #FFFFFF !important;
  border-color: #10B981 !important;
}

.product-form__buttons .button:hover,
.product-form__buttons [type="submit"]:hover,
.product-form__cart-submit:hover,
.product-form__submit:hover {
  background-color: #059669 !important;
  color: #000000 !important;
}


/* ════════════════════════════════════════════════════════════
   5. CART BUTTON / CART ICON BUTTON
      Horizon: .cart-icon-bubble, .header__icon, .cart-count-bubble
   ════════════════════════════════════════════════════════════ */
.cart__checkout-button,
.cart-notification__checkout {
  background-color: #10B981 !important;
  color: #FFFFFF !important;
  border-color: #10B981 !important;
}
.cart__checkout-button:hover,
.cart-notification__checkout:hover {
  background-color: #059669 !important;
  color: #000000 !important;
}

/* Cart bubble count pill */
.cart-count-bubble {
  background-color: #10B981 !important;
  color: #FFFFFF !important;
}


/* ════════════════════════════════════════════════════════════
   6. LINKS — hover: orange
   ════════════════════════════════════════════════════════════ */
a {
  color: #2563EB;
  transition: color 0.15s ease;
}
a:hover {
  color: #F59E0B;
}

/* Nav links keep their default colour; only hover changes */
.header__menu-item,
.header__menu-item a,
.link,
.full-unstyled-link {
  transition: color 0.15s ease;
}
.header__menu-item:hover,
.header__menu-item:hover > a,
.link:hover,
.full-unstyled-link:hover {
  color: #F59E0B !important;
}


/* ════════════════════════════════════════════════════════════
   7. SALE BADGES / PRICE BADGES — orange background
      Horizon: .badge, .price__badge-sale, .badge--sale,
      .product-badge, [class*="badge--"], .sale-badge
   ════════════════════════════════════════════════════════════ */
.badge,
.badge--sale,
.badge--on-sale,
.price__badge-sale,
.price__badge,
.product-badge,
.sale-badge,
.label--sale,
[class*="badge--sale"],
[class*="badge--on-sale"] {
  background-color: #F59E0B !important;
  color: #422006 !important;
  border-color: #F59E0B !important;
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
}

/* Sold-out badge: keep a neutral grey, not orange */
.badge--sold-out,
[class*="badge--sold-out"] {
  background-color: #94A3B8 !important;
  color: #FFFFFF !important;
  border-color: #94A3B8 !important;
}

/* Sale price text colour */
.price--on-sale .price__sale,
.price--on-sale,
.price-item--sale {
  color: #059669 !important;
  font-weight: 700;
}


/* ════════════════════════════════════════════════════════════
   8. PROMO BAR / ANNOUNCEMENT BAR — orange
   ════════════════════════════════════════════════════════════ */
.announcement-bar,
.announcement-bar__link,
.shopify-section-announcement-bar {
  background-color: #F59E0B !important;
  color: #422006 !important;
}
.announcement-bar a,
.announcement-bar__link {
  color: #422006 !important;
  font-weight: 700;
}
.announcement-bar a:hover,
.announcement-bar__link:hover {
  color: #0F172A !important;
}


/* ════════════════════════════════════════════════════════════
   9. OPTIONAL BLUE SECTION BACKGROUND
      Add class "section--blue" to any Horizon section in the
      theme customiser (Custom CSS class field) to trigger this.
   ════════════════════════════════════════════════════════════ */
.section--blue,
.color-scheme--blue {
  --color-background: #2563EB !important;
  background-color: #2563EB !important;
  color: #FFFFFF !important;
}
.section--blue h1, .section--blue h2, .section--blue h3,
.section--blue h4, .section--blue p, .section--blue li,
.color-scheme--blue h1, .color-scheme--blue h2, .color-scheme--blue p {
  color: #FFFFFF !important;
}
.section--blue a, .color-scheme--blue a {
  color: #FDE68A !important;
}
.section--blue a:hover, .color-scheme--blue a:hover {
  color: #FFFFFF !important;
}
/* Buttons inside blue sections stay green */
.section--blue .button,
.section--blue [type="submit"],
.color-scheme--blue .button {
  background-color: #10B981 !important;
  color: #FFFFFF !important;
}
.section--blue .button:hover,
.color-scheme--blue .button:hover {
  background-color: #059669 !important;
  color: #000000 !important;
}


/* ════════════════════════════════════════════════════════════
   10. FONTS — Poppins headings, Inter body
       Also fixes the "ugly menu font" Dani flagged.
   ════════════════════════════════════════════════════════════ */

/* Load fonts (safe to include here if not already in theme.liquid) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Poppins:wght@600;700;800&display=swap');

/* Body / base text */
body,
.body-font {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.7;
  color: #334155;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4,
.heading,
.product__title,
.card__heading,
.article__title {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #0F172A;
  line-height: 1.2;
}

/* Header / Nav menu font fix */
.header__menu-item,
.header__menu-item a,
.header__active-menu-item,
.list-menu__item--link,
.mega-menu__link,
.mega-menu__item > a,
.header__submenu a,
nav a,
.site-nav__link {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.01em !important;
  color: #0F172A !important;
  text-transform: none !important;
}

/* Active / current page nav item */
.header__menu-item--active,
.header__active-menu-item {
  color: #2563EB !important;
  font-weight: 700 !important;
}

/* Logo wordmark */
.header__heading-link,
.header__heading {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: #0F172A !important;
}


/* ════════════════════════════════════════════════════════════
   11. INPUT FOCUS — blue ring (matches brand accent)
   ════════════════════════════════════════════════════════════ */
input:focus,
select:focus,
textarea:focus,
.field__input:focus {
  outline: none !important;
  border-color: #2563EB !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,0.18) !important;
}


/* ════════════════════════════════════════════════════════════
   12. PAGINATION / SELECTS — accent colour
   ════════════════════════════════════════════════════════════ */
.pagination__item--current,
.pagination__item:hover {
  background-color: #2563EB !important;
  color: #FFFFFF !important;
  border-color: #2563EB !important;
}

.select__select:focus {
  border-color: #2563EB !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,0.18) !important;
}


/* ════════════════════════════════════════════════════════════
   13. LOADING SPINNER / PROGRESS BAR — green
   ════════════════════════════════════════════════════════════ */
.loading-overlay__spinner {
  color: #10B981 !important;
}


/* ════════════════════════════════════════════════════════════
   14. SWATCHES / COLOUR OPTIONS — selected border accent
   ════════════════════════════════════════════════════════════ */
.swatch--selected,
.color-swatch--active,
.color-swatch.selected {
  border-color: #2563EB !important;
  box-shadow: 0 0 0 2px #2563EB !important;
}


/* ════════════════════════════════════════════════════════════
   15. RESPONSIVE SAFETY — prevent button text from
       going invisible if a theme applies a colour on mobile
   ════════════════════════════════════════════════════════════ */
@media (max-width: 749px) {
  .button,
  .product-form__cart-submit,
  .cart__checkout-button {
    background-color: #10B981 !important;
    color: #FFFFFF !important;
  }
}

/* ════════════════════════════════════════════════════════════
   16. FIX: product-media zoom button must be transparent.
        It is a .button + .button-unstyled, so it inherited the
        green button background and covered the product image.
   ════════════════════════════════════════════════════════════ */
.product-media-container__zoom-button.button.button-unstyled,
.product-media-container__zoom-button.button,
.product-media-container__zoom-button {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
}