/* DLT/82 shop styling.
   The shop archive, cart, checkout and account pages are rendered by
   WooCommerce, not Elementor: Hello Elementor ships no archive template, so
   Elementor's archive location never runs on /shop/, and cart + checkout are
   WooCommerce Blocks (kept deliberately, because the Payfast gateway registers
   a blocks integration and converting to the classic shortcode would risk it).
   These pages therefore take their brand from here. */

:root {
  --dlt-ink:    #293A91;
  --dlt-tomato: #EF3E32;
  --dlt-cream:  #FFF1CD;
  --dlt-sage:   #E7EFDC;
  --dlt-pink:   #EFCBE2;
  --dlt-bone:   #FBF9F4;
  --dlt-cyan:   #16C5D1;
}

/* ---------- shared ---------- */
.woocommerce-page .site-main,
.woocommerce .site-main {
  background: var(--dlt-bone);
}

.woocommerce-page h1, .woocommerce-page h2,
.woocommerce-page h3, .woocommerce h1, .woocommerce h2 {
  font-family: "museo-sans-rounded", sans-serif;
  font-weight: 800;
  letter-spacing: -0.6px;
  color: var(--dlt-ink);
}

.woocommerce-page, .woocommerce {
  font-family: "museo-sans-rounded", sans-serif;
  font-weight: 500;
  color: var(--dlt-ink);
}

/* ---------- shop archive ---------- */
.woocommerce-shop .woocommerce-products-header,
.post-type-archive-product .woocommerce-products-header,
.tax-product_cat .woocommerce-products-header {
  text-align: center;
  padding: 64px 20px 8px;
  background: var(--dlt-cream);
}

.woocommerce-products-header__title {
  font-size: clamp(38px, 5vw, 72px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -1.5px;
  margin: 0;
}

.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering {
  font-size: 13px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  font-weight: 700;
}

.woocommerce ul.products {
  gap: 22px;
  padding: 44px 0 72px;
}

/* Tiles echo the Loop Grid card used on the homepage. */
.woocommerce ul.products li.product {
  background: var(--dlt-bone);
  padding: 30px 22px 28px;
  margin: 0;
  text-align: center;
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}
.woocommerce ul.products li.product:nth-child(6n + 1) { background: var(--dlt-pink); }
.woocommerce ul.products li.product:nth-child(6n + 2) { background: var(--dlt-cream); }
.woocommerce ul.products li.product:nth-child(6n + 3) { background: var(--dlt-bone); }
.woocommerce ul.products li.product:nth-child(6n + 4) { background: var(--dlt-cream); }
.woocommerce ul.products li.product:nth-child(6n + 5) { background: var(--dlt-bone); }
.woocommerce ul.products li.product:nth-child(6n + 6) { background: var(--dlt-pink); }

.woocommerce ul.products li.product:hover { transform: translateY(-4px); }

/* Bottles differ in height; a fixed image row keeps every name on one line. */
.woocommerce ul.products li.product img {
  height: 280px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  margin: 0 auto 14px;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.3px;
  padding: 10px 0 2px;
  color: var(--dlt-ink);
}

.woocommerce ul.products li.product .price {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 1.6px;
  color: var(--dlt-ink);
}

/* ---------- buttons, everywhere ---------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.wc-block-components-button {
  background: var(--dlt-ink) !important;
  color: var(--dlt-cream) !important;
  border-radius: 40px !important;
  font-family: "museo-sans-rounded", sans-serif !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: 1.6px !important;
  text-transform: uppercase !important;
  padding: 16px 34px !important;
  border: 0 !important;
  min-height: 48px;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.wc-block-components-button:hover {
  background: var(--dlt-tomato) !important;
  color: #fff !important;
}

/* ---------- cart & checkout (blocks) ---------- */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
  padding: 56px 20px 80px;
}

.wc-block-components-title,
.wp-block-woocommerce-cart h1,
.wp-block-woocommerce-checkout h1 {
  font-family: "museo-sans-rounded", sans-serif;
  font-weight: 800;
  color: var(--dlt-ink);
  letter-spacing: -0.8px;
}

.wc-block-components-sidebar,
.wc-block-components-totals-wrapper,
.wc-block-cart__totals-title {
  background: var(--dlt-cream);
}
.wc-block-components-sidebar { padding: 26px; }

.wc-block-components-text-input input,
.wc-block-components-textarea,
.wc-block-components-select select {
  font-family: "museo-sans-rounded", sans-serif !important;
  font-size: 16px !important;      /* 16px stops iOS zooming the page on focus */
  border-radius: 6px !important;
  border-color: #CFCBC0 !important;
  color: var(--dlt-ink) !important;
}

.wc-block-components-product-name { color: var(--dlt-ink); font-weight: 700; }

.wc-block-components-notice-banner {
  border-radius: 6px;
  font-family: "museo-sans-rounded", sans-serif;
}

/* ---------- my account ---------- */
.woocommerce-account .woocommerce {
  max-width: 1100px;
  margin: 0 auto;
  padding: 60px 20px 80px;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0 0 24px;
  padding: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 14px 18px;
  background: var(--dlt-cream);
  color: var(--dlt-ink);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.6px;
  margin-bottom: 6px;
  text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
  background: var(--dlt-ink);
  color: var(--dlt-cream);
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-account input[type="text"],
.woocommerce-account input[type="email"],
.woocommerce-account input[type="password"] {
  font-family: "museo-sans-rounded", sans-serif;
  font-size: 16px;
  padding: 13px 15px;
  border: 1px solid #CFCBC0;
  border-radius: 6px;
  color: var(--dlt-ink);
}

.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register {
  background: var(--dlt-bone);
  border: 0;
  border-radius: 0;
  padding: 32px;
}

/* ---------- messages ---------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-top-color: var(--dlt-ink);
  background: var(--dlt-cream);
  font-family: "museo-sans-rounded", sans-serif;
  color: var(--dlt-ink);
}
.woocommerce-message::before,
.woocommerce-info::before { color: var(--dlt-ink); }

/* ---------- small screens ---------- */
@media (max-width: 767px) {
  .woocommerce ul.products { gap: 12px; }
  .woocommerce ul.products li.product { padding: 20px 12px 18px; }
  .woocommerce ul.products li.product img { height: 190px; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 16px; }
  .woocommerce-products-header { padding: 44px 16px 4px; }
  .wp-block-woocommerce-cart,
  .wp-block-woocommerce-checkout { padding: 36px 14px 60px; }
}