/* Zentyde WP theme — additions on top of the compiled zentyde.com stylesheet. */

/* hidden must always win over utility display classes */
[hidden] { display: none !important; }

html { scroll-behavior: smooth; }

/* clickable home product cards (navigation is wired in site.js) */
article[data-zy-link] { cursor: pointer; }

/* gate: agree button once the checkbox is ticked */
#zy-gate button.zy-ready {
  background: linear-gradient(135deg, #1f7cff, #62b6ff) !important;
  color: #fff !important;
  box-shadow: 0 14px 30px rgba(31, 124, 255, 0.28) !important;
  opacity: 1 !important;
  cursor: pointer !important;
}
#zy-gate label span.zy-checked {
  background: #1f7cff !important;
  border-color: #1f7cff !important;
  color: #fff;
}
#zy-gate label span.zy-checked::before { content: "\2713"; font-size: 14px; font-weight: 900; }
#zy-gate label { cursor: pointer; }

/* generic WP page (contact, policies) */
.zy-wp-page {
  max-width: 860px;
  margin: 0 auto;
  padding: 56px 24px 96px;
  color: #31435a;
  font-size: 16px;
  line-height: 1.65;
}
.zy-wp-title {
  font-size: clamp(34px, 5vw, 52px);
  font-weight: 850;
  letter-spacing: -0.045em;
  line-height: 1.02;
  color: #07111f;
  margin-bottom: 28px;
}
.zy-wp-page h2 { font-size: 24px; font-weight: 850; color: #07111f; margin: 32px 0 12px; letter-spacing: -0.03em; }
.zy-wp-page h3 { font-size: 19px; font-weight: 800; color: #07111f; margin: 24px 0 10px; }
.zy-wp-page p { margin: 0 0 14px; }
.zy-wp-page ul, .zy-wp-page ol { margin: 0 0 14px 22px; }
.zy-wp-page ul { list-style: disc; }
.zy-wp-page ol { list-style: decimal; }
.zy-wp-page a { color: #1f7cff; font-weight: 600; }

/* ---------------- shop grid ---------------- */
.zy-shop { max-width: 1200px; }
.zy-shop .woocommerce-result-count,
.zy-shop .woocommerce-ordering { display: none; }
.zy-shop ul.products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 22px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.zy-shop ul.products::before, .zy-shop ul.products::after { content: none; }
.zy-shop ul.products li.product {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  background: #fff;
  border: 1px solid #dde8f3;
  border-radius: 20px;
  box-shadow: 0 10px 24px rgba(7, 17, 31, 0.035);
  padding: 18px;
  display: flex;
  flex-direction: column;
}
.zy-shop ul.products li.product img {
  width: 100%;
  height: 230px;
  object-fit: contain;
  border-radius: 14px;
  background: #f4f9ff;
  margin-bottom: 14px;
}
.zy-shop ul.products li.product .woocommerce-loop-product__title {
  font-size: 17px;
  font-weight: 850;
  color: #07111f;
  letter-spacing: -0.02em;
  padding: 0;
}
.zy-shop ul.products li.product .price {
  color: #1f7cff;
  font-weight: 850;
  font-size: 16px;
  margin: 6px 0 12px;
  display: block;
}
.zy-shop ul.products li.product .button {
  margin-top: auto;
  display: inline-flex;
  justify-content: center;
  border-radius: 999px;
  padding: 11px 18px;
  font-size: 14px;
  font-weight: 850;
  color: #fff;
  background: linear-gradient(135deg, #0da66c, #2fcf7c);
  box-shadow: 0 14px 30px rgba(13, 166, 108, 0.28);
  text-align: center;
}
.zy-shop ul.products li.product .added_to_cart { display: none; }

/* Woo notices, restyled quietly */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
  border-top: none !important;
  border-radius: 14px;
  background: #eef7ff !important;
  color: #07111f !important;
  padding: 14px 18px !important;
  margin-bottom: 20px;
  list-style: none;
}
.woocommerce-message::before, .woocommerce-info::before { color: #1f7cff !important; }
.woocommerce-message .button { border-radius: 999px; }

/* Woo pages: woocommerce-general sets img{height:auto}, which beats the
   Tailwind h-* utilities on the chrome logos — restore them */
.woocommerce-page img.h-9, .woocommerce img.h-9 { height: 2.25rem !important; width: auto !important; }
.woocommerce-page img.h-11, .woocommerce img.h-11 { height: 2.75rem !important; width: auto !important; }
@media (min-width: 768px) {
  .woocommerce-page img.md\:h-9, .woocommerce img.md\:h-9 { height: 2.25rem !important; }
}

/* Carousel pagination dots: WooCommerce/Elementor/Gravity Forms all ship a
   generic button{} reset with real min-height/padding/border, which beats
   these bare <button aria-label="Go to slide N"> / "Go to review N" pills
   (no class to win specificity with) and inflates them into big squares.
   Matches any "Go to <noun> N" pagination control, not just the first
   carousel that got caught — the testimonial carousel uses "Go to review"
   and was still broken after the slide-only fix. */
button[aria-label^="Go to "] {
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
}

/* ---------------- v6 (2026-09-08) ---------------- */
/* footer accordion (phones): the opened list gets its spacing back */
footer ul.zy-open { margin-top: 14px; }
footer button[aria-expanded] svg { transition: transform .2s ease; }

/* sticky add-to-cart bar on product pages (phones/tablets) */
#zy-sticky-atc {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
  display: flex; align-items: center; gap: 12px;
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.94); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-top: 1px solid rgba(7,17,31,.08); box-shadow: 0 -10px 30px rgba(7,17,31,.08);
  animation: zy-sticky-in .22s ease;
}
@keyframes zy-sticky-in { from { transform: translateY(100%); } to { transform: translateY(0); } }
#zy-sticky-atc .zy-sticky-atc__meta { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
#zy-sticky-atc strong { font-size: 13px; font-weight: 800; color: #07132b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -0.01em; }
#zy-sticky-atc span { font-size: 15px; font-weight: 900; color: #07132b; }
#zy-sticky-atc .zy-sticky-atc__btn {
  flex: 0 0 auto; min-height: 46px; padding: 0 20px; border: none; border-radius: 999px;
  background-image: linear-gradient(135deg, rgb(13,166,108), rgb(47,207,124)); color: #fff;
  font-size: 14px; font-weight: 900; box-shadow: 0 10px 24px rgba(13,166,108,.28); cursor: pointer;
}
@media (min-width: 1024px) { #zy-sticky-atc { display: none !important; } }
/* keep the WhatsApp bubble above the sticky bar on phones */
@media (max-width: 1023px) { body:has(#zy-sticky-atc:not([hidden])) a[href*="wa.me"], body:has(#zy-sticky-atc:not([hidden])) a[href*="whatsapp"] { bottom: 86px !important; } }
@media (max-width: 1023px) { footer button[aria-expanded] { min-height: 44px; } }
