/**
 * Chilexpress storefront experience.
 * Everything is scoped to the public body class added by the plugin.
 * Avoid :has() for broader browser compatibility.
 */

.cxp-storefront-enhanced {
  --cxp-yellow: #fff200;
  --cxp-ink: #000000;
  --cxp-white: #ffffff;
  --cxp-surface: #f5f5f2;
  --cxp-muted: #5a5a55;
  --cxp-radius: 18px;
  --cxp-content-width: 1200px;
}

.cxp-storefront-enhanced .cxp-storefront-topbar {
  position: relative;
  z-index: 20;
  width: 100%;
  margin: 0;
  padding: 9px 24px;
  color: var(--cxp-white);
  background: var(--cxp-ink);
  text-align: center;
}

.cxp-storefront-enhanced .cxp-storefront-topbar p {
  margin: 0;
  color: inherit;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.4;
  text-transform: uppercase;
}

/* Classic, hybrid, and block-theme headers. */
.cxp-storefront-enhanced .site-header,
.cxp-storefront-enhanced .wp-block-template-part > header,
.cxp-storefront-enhanced header.wp-block-template-part,
.cxp-storefront-enhanced header.wp-block-group,
.cxp-storefront-enhanced .woocommerce-store-notice + header,
.cxp-storefront-enhanced .wp-site-blocks > header {
  color: var(--cxp-ink) !important;
  background: var(--cxp-yellow) !important;
}

.cxp-storefront-enhanced .wp-site-blocks > header .wp-block-group,
.cxp-storefront-enhanced .wp-site-blocks > header .wp-block-navigation,
.cxp-storefront-enhanced .site-header .site-branding,
.cxp-storefront-enhanced .site-header .custom-logo-link {
  background-color: transparent !important;
}

/* Hide theme title/logo once the Chilexpress logo is injected. */
.cxp-storefront-enhanced.cxp-storefront-branded .wp-block-site-title,
.cxp-storefront-enhanced.cxp-storefront-branded .wp-block-site-logo,
.cxp-storefront-enhanced.cxp-storefront-branded .site-title,
.cxp-storefront-enhanced.cxp-storefront-branded .custom-logo-link,
.cxp-storefront-enhanced.cxp-storefront-branded .site-branding .custom-logo,
.cxp-storefront-enhanced.cxp-storefront-branded a.wp-block-site-title {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.cxp-storefront-enhanced .cxp-storefront-logo {
  display: inline-flex;
  align-items: center;
  max-width: 200px;
  line-height: 0;
  text-decoration: none;
}

.cxp-storefront-enhanced .cxp-storefront-logo img,
.cxp-storefront-enhanced .cxp-storefront-logo svg {
  display: block;
  width: 180px;
  max-width: 100%;
  height: auto;
}

.cxp-storefront-enhanced .wp-site-blocks > header a,
.cxp-storefront-enhanced .wp-site-blocks > header .wp-block-navigation-item__content,
.cxp-storefront-enhanced .site-header a,
.cxp-storefront-enhanced .site-header .menu-toggle {
  color: var(--cxp-ink) !important;
}

/* Keep block-theme fallbacks out of the footer until JS relocates them. */
.cxp-storefront-enhanced .cxp-catalog-hero[data-cxp-fallback="true"],
.cxp-storefront-enhanced .cxp-catalog-benefits[data-cxp-fallback="true"] {
  display: none !important;
}

/* Catalog hero. */
.cxp-storefront-enhanced .cxp-catalog-hero {
  width: 100%;
  max-width: none;
  margin: 0 0 clamp(36px, 6vw, 72px);
  padding: clamp(52px, 8vw, 104px) 24px;
  color: var(--cxp-ink);
  background: var(--cxp-white);
}

.cxp-storefront-enhanced .cxp-catalog-hero__inner {
  width: min(100%, var(--cxp-content-width));
  margin: 0 auto;
}

.cxp-storefront-enhanced .cxp-catalog-hero h1 {
  max-width: 18ch;
  margin: 0;
  color: var(--cxp-ink);
  font-size: clamp(38px, 6vw, 76px);
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 0.98;
}

.cxp-storefront-enhanced .cxp-catalog-hero__text {
  max-width: 650px;
  margin: 24px 0 30px;
  color: var(--cxp-ink);
  font-size: clamp(17px, 2vw, 20px);
  line-height: 1.55;
}

.cxp-storefront-enhanced .cxp-catalog-hero__cta {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 13px 24px;
  border: 2px solid var(--cxp-ink);
  border-radius: 999px;
  color: var(--cxp-white);
  background: var(--cxp-ink);
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: transform 160ms ease, color 160ms ease, background-color 160ms ease;
}

.cxp-storefront-enhanced .cxp-catalog-hero__cta:hover {
  color: var(--cxp-ink);
  background: var(--cxp-yellow);
  transform: translateY(-2px);
}

/* Avoid duplicate page titles when the catalog hero provides the main h1. */
.cxp-storefront-enhanced.cxp-storefront-catalog .woocommerce-products-header__title,
.cxp-storefront-enhanced.cxp-storefront-catalog h1.page-title,
.cxp-storefront-enhanced.cxp-storefront-catalog .wp-block-query-title {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Product Collection block and classic WooCommerce loops — catalog only. */
.cxp-storefront-enhanced.cxp-storefront-catalog main,
.cxp-storefront-enhanced.cxp-storefront-catalog .site-main {
  scroll-margin-top: 24px;
}

.cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-product-template,
.cxp-storefront-enhanced.cxp-storefront-catalog ul.products {
  gap: clamp(18px, 3vw, 32px);
}

.cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-product-template .wc-block-product,
.cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: clamp(14px, 2vw, 22px);
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: var(--cxp-radius);
  background: var(--cxp-surface);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-product-template .wc-block-product:hover,
.cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-product-template .wc-block-product:focus-within,
.cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product:focus-within,
.cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product:hover {
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.1);
  transform: translateY(-4px);
}

.cxp-storefront-enhanced.cxp-storefront-catalog .woocommerce-info,
.cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-grid__no-products {
  padding: 24px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-left: 6px solid var(--cxp-yellow);
  border-radius: var(--cxp-radius);
  color: var(--cxp-ink);
  background: var(--cxp-surface);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
}

.cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-product-template .wc-block-product img,
.cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product img {
  width: 100%;
  border-radius: calc(var(--cxp-radius) - 7px);
  background: var(--cxp-white);
  object-fit: cover;
  aspect-ratio: 1 / 1;
}

.cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-components-product-title,
.cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product .woocommerce-loop-product__title {
  margin-top: 18px;
  color: var(--cxp-ink);
  font-size: clamp(19px, 2vw, 23px);
  font-weight: 700;
  line-height: 1.2;
}

.cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-components-product-price,
.cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product .price {
  margin-top: 10px;
  color: var(--cxp-ink);
  font-size: 18px;
  font-weight: 800;
}

.cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-product-template .wp-block-button,
.cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product .button {
  margin-top: auto;
}

.cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-product-template .wp-block-button__link,
.cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product .button {
  width: 100%;
  min-height: 46px;
  margin-top: 20px;
  padding: 13px 18px;
  border: 2px solid var(--cxp-ink);
  border-radius: 999px;
  color: var(--cxp-white);
  background: var(--cxp-ink);
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  transition: color 160ms ease, background-color 160ms ease;
}

.cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product .button {
  margin-top: auto;
}

.cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-product-template .wp-block-button__link:hover,
.cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product .button:hover {
  color: var(--cxp-ink);
  background: var(--cxp-yellow);
}

/* Benefits after the catalog. */
.cxp-storefront-enhanced .cxp-catalog-benefits {
  width: 100%;
  max-width: none;
  margin: clamp(48px, 7vw, 88px) 0 0;
  padding: 24px;
  color: var(--cxp-white);
  background: var(--cxp-ink);
}

.cxp-storefront-enhanced .cxp-catalog-benefits__inner {
  display: grid;
  width: min(100%, var(--cxp-content-width));
  margin: 0 auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cxp-storefront-enhanced .cxp-catalog-benefit {
  display: flex;
  min-height: 104px;
  align-items: center;
  gap: 16px;
  padding: 22px clamp(16px, 3vw, 36px);
  border-right: 1px solid rgba(255, 255, 255, 0.25);
}

.cxp-storefront-enhanced .cxp-catalog-benefit:last-child {
  border-right: 0;
}

.cxp-storefront-enhanced .cxp-catalog-benefit__mark {
  display: inline-grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  border-radius: 50%;
  color: var(--cxp-ink);
  background: var(--cxp-yellow);
  font-size: 12px;
  font-weight: 800;
}

.cxp-storefront-enhanced .cxp-catalog-benefit strong {
  color: inherit;
  font-size: clamp(16px, 2vw, 20px);
  line-height: 1.25;
}

/* Preserve the native footer content and links while aligning its presentation. */
.cxp-storefront-enhanced .wp-site-blocks > footer,
.cxp-storefront-enhanced footer.site-footer,
.cxp-storefront-enhanced footer.wp-block-template-part {
  margin-top: 0;
  color: var(--cxp-white);
  background: var(--cxp-ink);
}

.cxp-storefront-enhanced .wp-site-blocks > footer a,
.cxp-storefront-enhanced footer.site-footer a,
.cxp-storefront-enhanced footer.wp-block-template-part a {
  color: var(--cxp-white);
  text-underline-offset: 4px;
}

.cxp-storefront-enhanced .wp-site-blocks > footer a:hover,
.cxp-storefront-enhanced footer.site-footer a:hover,
.cxp-storefront-enhanced footer.wp-block-template-part a:hover {
  color: var(--cxp-yellow);
}

.cxp-storefront-enhanced a:focus-visible,
.cxp-storefront-enhanced button:focus-visible,
.cxp-storefront-enhanced input:focus-visible,
.cxp-storefront-enhanced select:focus-visible {
  outline: 3px solid var(--cxp-yellow);
  outline-offset: 3px;
}

.cxp-storefront-enhanced .cxp-catalog-hero__cta:focus-visible {
  outline-color: var(--cxp-yellow);
}

@media (max-width: 782px) {
  .cxp-storefront-enhanced .cxp-storefront-logo img,
  .cxp-storefront-enhanced .cxp-storefront-logo svg {
    width: 140px;
  }

  .cxp-storefront-enhanced .cxp-catalog-benefits__inner {
    grid-template-columns: 1fr;
  }

  .cxp-storefront-enhanced .cxp-catalog-benefit {
    min-height: 82px;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
  }

  .cxp-storefront-enhanced .cxp-catalog-benefit:last-child {
    border-bottom: 0;
  }
}

@media (max-width: 480px) {
  .cxp-storefront-enhanced .cxp-storefront-topbar {
    padding-inline: 14px;
  }

  .cxp-storefront-enhanced .cxp-storefront-topbar p {
    font-size: 10px;
    letter-spacing: 0.06em;
  }

  .cxp-storefront-enhanced .cxp-catalog-hero {
    padding-inline: 18px;
  }

  .cxp-storefront-enhanced .cxp-catalog-hero__cta {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cxp-storefront-enhanced .cxp-catalog-hero__cta,
  .cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-product-template .wc-block-product,
  .cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product,
  .cxp-storefront-enhanced.cxp-storefront-catalog .wc-block-product-template .wp-block-button__link,
  .cxp-storefront-enhanced.cxp-storefront-catalog ul.products li.product .button {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transform: none !important;
  }
}