/* ZGO 1.8.1–1.8.2 — design review fixes (D5–D24). Loaded last, site-wide. */

/* ---------- D5/D6: accessible brand tokens ---------- */
:root {
  --z-pink: #dc0f5f;          /* buttons + small text, 4.9:1 on white */
  --z-pink-600: #c00d52;
  --z-pink-ink: #c8105a;      /* pink text on #fff0f5 */
  --z-pink-deco: #ff2d78;     /* decorative only (stripes, glows) */
  --z-teal-600: #007f6a;      /* teal text / teal fills with white text */
  --z-teal-deco: #00c9a7;
  --zgo-pink: #dc0f5f;         /* legacy storefront token */
}
/* Decorative stripe keeps the bright brand pink */
.zf::before { background: linear-gradient(90deg, var(--z-pink-deco) 0 25%, var(--z-yellow) 25% 50%, var(--z-teal-deco) 50% 75%, var(--z-pink-deco) 75% 100%); }
/* Pink text sitting on light pink */
.zh__ddlink:hover, .zh__ddlink:focus-visible, .zh__ddlink[aria-current="page"],
.zh-drawer__link:hover, .zh-drawer__link:active, .zh-drawer__link[aria-current="page"],
.zf__list a:hover, .zf__list a[aria-current="page"],
.zst-toc a:hover { color: var(--z-pink-ink) !important; }
.zh-drawer__link:hover .zi, .zh-drawer__link[aria-current="page"] .zi { color: var(--z-pink-ink); }
@media (min-width: 1024px) {
  .zh__link:hover, .zh__ddbtn[aria-expanded="true"], .zh__link[aria-current="page"] { color: var(--z-pink-ink) !important; }
}
.zes-checks li::before, .zp-card.is-selected .zp-card__price { color: var(--z-pink-ink); }
/* Teal used as text or behind white text */
.zf__mail:hover, .zst-btn--ghost:hover { color: var(--z-teal-600) !important; }
.zh-slogan--find { background: var(--z-teal-600); }
.zh-slogan--touch { background: #d92b2b; }
.zst-step--device .zst-step__num { background: var(--z-teal-600); box-shadow: 0 8px 18px -8px rgba(0, 127, 106, .7); }
.zty-hero__badge { background: var(--z-teal-600); }
.zdest__unl { font-size: 13px; }

/* ---------- D7: home CTA ---------- */
.zcta {
  background: linear-gradient(90deg, #dc0f5f 0%, #d6383d 100%);
  box-shadow: 0 20px 40px -16px rgba(220, 15, 95, .5);
}
.zcta__sub { font-size: 16px; font-weight: 500; color: #fff; }

/* ---------- D8: cart badge clear of the icon ---------- */
.zh-cart-count {
  top: 0; right: -4px;
  min-width: 20px; height: 20px; padding: 0 4px;
  box-sizing: border-box; border: 2px solid #fff;
  background: var(--z-pink); font: 700 12px/16px var(--z-font);
}

/* ---------- D9: express payment ---------- */
.wc-block-components-express-payment__content { overflow: visible !important; border: 0 !important; box-shadow: none !important; }
/* Stripe iframes sit at margin:-4px — give them room instead of clipping (stray edge line) */
.wc-block-components-express-payment__event-buttons > li { overflow: visible !important; padding: 0 4px !important; box-sizing: border-box !important; }
body.zq-noexp .wc-block-components-express-payment,
body.zq-noexp .wc-block-components-express-payment-continue-rule,
body.zq-noexp .wc-block-checkout__express-payment-continue-rule { display: none !important; }
.wc-block-cart__payment-options:empty { display: none; }

/* ---------- D10: cart / checkout layout ---------- */
body.woocommerce-checkout h1.zcart__title {
  margin: 28px auto 8px !important; font-size: 28px; line-height: 1.15; font-weight: 800; letter-spacing: -.03em; color: var(--z-ink);
}
@media (min-width: 768px) { body.woocommerce-checkout h1.zcart__title { font-size: 36px; margin-top: 36px !important; } }
body.woocommerce-checkout .wp-block-post-title.alignwide {
  box-sizing: border-box; width: 100% !important;
  max-width: calc(var(--z-max) + 2 * var(--z-gutter)) !important;
  margin-left: auto !important; margin-right: auto !important;
  padding-left: var(--z-gutter) !important; padding-right: var(--z-gutter) !important;
}
@media (min-width: 960px) {
  body.woocommerce-cart .wc-block-components-sidebar-layout.is-large,
  body.woocommerce-checkout .wc-block-components-sidebar-layout.is-large {
    display: grid !important; grid-template-columns: minmax(0, 1fr) 360px; gap: 32px; align-items: start;
    margin: 0 !important;
  }
  body.woocommerce-cart .wc-block-components-sidebar-layout.is-large > .wc-block-components-main,
  body.woocommerce-checkout .wc-block-components-sidebar-layout.is-large > .wc-block-components-main,
  body.woocommerce-cart .wc-block-components-sidebar-layout.is-large > .wc-block-components-sidebar,
  body.woocommerce-checkout .wc-block-components-sidebar-layout.is-large > .wc-block-components-sidebar {
    width: auto !important; max-width: none !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important;
  }
  body.woocommerce-cart .wc-block-components-sidebar-layout.is-large > .wc-block-components-sidebar,
  body.woocommerce-checkout .wc-block-components-sidebar-layout.is-large > .wc-block-components-sidebar { padding: 20px !important; }
  body.woocommerce-checkout .wc-block-components-sidebar-layout.is-large > .wc-block-components-sidebar { padding: 0 !important; }
}
body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block { border: 0 !important; border-radius: 0 !important; }
.wp-block-woocommerce-cart-order-summary-block > div.wc-block-components-totals-wrapper:first-of-type { border-top: 0 !important; }
.wp-block-woocommerce-cart-order-summary-block .wc-block-components-totals-coupon.wc-block-components-panel { border-top: 0 !important; }

/* ---------- D11/D12: shop hub on mobile ---------- */
.zs-region__name, .zs-region__meta { white-space: normal; overflow: visible; text-overflow: clip; }
.zs-region__meta { line-height: 1.35; }
/* 1.8.3: phone AND tablet (<1024) keep only the chip rows */
@media (max-width: 1023px) {
  .zshop .zs-plans, .zshop .zs-hub__kicker, .zshop .zs-regions { display: none; }
}
@media (max-width: 767px) {
  .zs-filters__row {
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 32px), transparent 100%);
            mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 32px), transparent 100%);
    padding-right: 28px; scroll-padding-inline: 0 28px;
  }
}

/* ---------- D13: account forms ---------- */
.woocommerce-account .woocommerce-form p:not(.form-row):not(.woocommerce-LostPassword),
.woocommerce-account .woocommerce-privacy-policy-text p { font-size: 14px !important; line-height: 1.55; color: var(--z-g600); }
.woocommerce-account .woocommerce-form .form-row:has(> button)::before,
.woocommerce-account .woocommerce-form .form-row:has(> button)::after { display: none !important; content: none !important; }
.woocommerce-account .woocommerce-form .form-row:has(> button) {
  display: flex !important; flex-direction: column; align-items: stretch; gap: 12px; padding: 0 !important; margin-left: 0 !important;
}
.woocommerce-account .woocommerce-form .form-row:has(> button) > button {
  order: 2; width: 100% !important; min-height: 48px; margin: 0 !important; justify-content: center;
}
.woocommerce-account .woocommerce-form-login__rememberme {
  order: 1; align-self: flex-start; display: inline-flex !important; align-items: center; gap: 10px; min-height: 44px; margin: 0 !important; font-size: 14px !important; cursor: pointer;
}
.woocommerce-account .woocommerce-form input[type="checkbox"] { width: 20px; height: 20px; margin: 0 !important; flex: none; accent-color: var(--z-pink); }
.woocommerce-account .woocommerce-LostPassword a { display: inline-flex; align-items: center; min-height: 44px; }
.woocommerce-account .show-password-input { width: 44px !important; height: 44px !important; }
@media (min-width: 768px) {
  .woocommerce-account .u-columns.col2-set { align-items: stretch !important; }
  .woocommerce-account .u-columns.col2-set > .u-column1,
  .woocommerce-account .u-columns.col2-set > .u-column2 { height: auto !important; align-self: stretch; }
}

/* ---------- D14: reading pages centred ---------- */
@media (min-width: 1024px) {
  .zst:not(.zst--policy) .zst-head,
  .zst:not(.zst--policy) .zst-article,
  .zst:not(.zst--policy) .zst-cta { margin-left: auto !important; margin-right: auto !important; }
}

/* ---------- D15: touch targets >= 44px ---------- */
.zchip, .zchip:visited { min-height: 44px; }
@media (max-width: 767px) {
  .zf__list a, .zf__list a:visited, footer.wp-block-template-part .zf .zf__list a { min-height: 44px; }
}
.wc-block-components-quantity-selector { min-height: 44px; }
.wc-block-components-quantity-selector__button { min-width: 44px !important; min-height: 44px !important; }
.wc-block-cart-item__remove-link { position: relative; }
.wc-block-cart-item__remove-link::after { content: ""; position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; transform: translate(-50%, -50%); }
.wc-block-components-checkbox label { display: inline-flex !important; align-items: center; min-height: 44px; }
.wc-block-checkout__login-prompt { display: inline-flex; align-items: center; min-height: 44px; padding: 0 8px; margin-right: -8px; }
.wc-block-components-address-form__address_2-toggle { display: inline-flex !important; align-items: center; min-height: 44px; }

/* ================= 1.8.2 — batch 3 (D16–D24) ================= */
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* D16: hero flows into the slogan row (one background, no seam, card shadow not cut) */
.zh-hero {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0) 55%, #fff 100%),
    radial-gradient(600px 360px at 85% 0%, rgba(0, 201, 167, .14), transparent 70%),
    radial-gradient(520px 380px at 0% 20%, rgba(255, 45, 120, .12), transparent 70%),
    #fff;
}
.zh-slogans { position: relative; margin-top: -1px; background: transparent; }
.zh-hero__visual { position: relative; z-index: 1; }

/* D17: destination cards — two-line names, price pinned to the bottom */
.zdest__card { height: 100%; }
.zdest__name, .zs-grid .zdest__name {
  white-space: normal; overflow: hidden; text-overflow: clip;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2;
}
.zdest__price { margin-top: auto; }
@media (min-width: 1024px) {
  .zdest__card { align-items: flex-start; align-content: space-between; }
  .zdest__flag { margin-top: 1px; }
}

/* D18: one button standard — 48px pill, 700 15px Inter */
.zsearch__btn { border-radius: 999px; }
.wc-block-components-quantity-selector__button, .wc-block-components-quantity-selector input { font-family: var(--z-font) !important; }
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
.zp-form .single_add_to_cart_button,
.zp-side__buy, .zp-sticky__btn {
  min-height: 48px !important; border-radius: 999px !important;
  font-family: var(--z-font) !important; font-weight: 700 !important; font-size: 15px !important;
}
.wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button, .zp-form .single_add_to_cart_button { height: auto !important; padding-top: 0 !important; padding-bottom: 0 !important; }

/* D19: nothing under 12px */
.zdest__price small, .zplan__price small { font-size: 12px; letter-spacing: .06em; }
.zs-region__meta { font-size: 12px; }
.woocommerce-orders-table th, .zgo-order-card__label, .zty-meta__k { font-size: 12px !important; letter-spacing: .06em; }

/* D20: same-level H2s share one size (22 mobile / 28 desktop) */
.zp-panel__title, .zp-related .zsec__title { font-size: 22px; line-height: 1.2; }
body.woocommerce-cart .wc-block-cart__totals-title {
  font: 800 22px/1.2 var(--z-font) !important; text-transform: none !important; letter-spacing: -.02em !important; color: var(--z-ink) !important;
}
@media (min-width: 1024px) {
  .zp-panel__title, .zp-related .zsec__title { font-size: 28px; }
}
.zs-hub__kicker { font-size: 13px; line-height: 1.4; }

/* D21: symmetric breadcrumb separators */
.zs-crumbs li, .zst .zs-crumbs li, .zprod .zs-crumbs li { gap: 0 !important; }
.zs-crumbs li:not(:last-child)::after,
.zst .zs-crumbs li:not(:last-child)::after,
.zprod .zs-crumbs li:not(:last-child)::after { content: "/" !important; margin: 0 8px !important; color: #94a3b8 !important; }

/* D22: footer current page = text colour only, keeps the column edge */
.zf__list a[aria-current="page"] { background: transparent !important; color: var(--z-pink-ink) !important; font-weight: 600; }
.zf__list a, .zf__list a:visited, footer.wp-block-template-part .zf .zf__list a { margin-left: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
.zf__list a:hover { background: transparent !important; color: var(--z-pink-ink) !important; }

/* D23: SVG icons on the ESTK cards */
.zes-card__ico svg { display: block; width: 20px; height: 20px; }

/* D24: mobile menu scrim + panel shadow */
.zh-scrim { display: none; }
@media (max-width: 1023px) {
  .zh-scrim.is-on {
    display: block; position: fixed; left: 0; right: 0; bottom: 0; top: 64px; z-index: -1;
    background: rgba(8, 12, 28, .35); -webkit-tap-highlight-color: transparent;
  }
  .zh.is-open .zh-drawer { box-shadow: 0 12px 24px rgba(8, 12, 28, .12); }
}

/* D15 follow-up: remaining small tap targets */
.zf__mail, .zf__mail:visited { min-height: 44px; }
.zst-toc a { display: flex !important; align-items: center; min-height: 44px; }

/* ================= 1.8.3 — design recheck follow-up ================= */

/* D9: express checkout — skeleton until a Stripe wallet button has really rendered.
   zgo-cart.js adds body.zq-exp-wait on load and swaps it for .zq-exp-ready once a wallet iframe
   reaches button height (ResizeObserver, no polling), or sets .zq-noexp (whole card + "or" rule
   hidden) when the Stripe plugin's ready handler removed every wallet (availablePaymentMethods).
   Note: Stripe only paints the button while its iframe box is laid out un-clipped, so the card
   cannot be collapsed to 0 while loading — the wallet slots show a neutral skeleton instead.
   No JS = 1.8.2 behaviour. */
body.zq-noexp .wc-block-cart__payment-options { display: none !important; }
body.zq-exp-wait .wc-block-components-express-payment__event-buttons > li { position: relative; }
body.zq-exp-wait .wc-block-components-express-payment__event-buttons > li > * { opacity: 0; }
body.zq-exp-wait .wc-block-components-express-payment__event-buttons > li::before {
  content: ""; position: absolute; left: 4px; right: 4px; top: 0; height: 48px; border-radius: 10px;
  background: linear-gradient(90deg, #eef1f6 25%, #e2e6ee 50%, #eef1f6 75%) 0 0 / 200% 100%;
  animation: zqSkel 1.2s linear infinite;
}
@keyframes zqSkel { from { background-position: 100% 0; } to { background-position: -100% 0; } }
body.zq-exp-ready .wc-block-components-express-payment__event-buttons > li > * { animation: zqExpIn .25s ease-out both; }
@keyframes zqExpIn { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  body.zq-exp-wait .wc-block-components-express-payment__event-buttons > li::before,
  body.zq-exp-ready .wc-block-components-express-payment__event-buttons > li > * { animation: none; }
}

/* R1: desktop cart — 40px between the cart and the footer (matches checkout) */
@media (min-width: 960px) {
  body.woocommerce-cart .wp-site-blocks > main.zcart.wp-block-group { padding-bottom: 40px !important; }
}

/* D14: policy pages — one 1080 grid: TOC left, body fills to the right edge (180–1260 @1440) */
@media (min-width: 1024px) {
  .zst--policy .zst-grid { grid-template-columns: 240px minmax(0, 1fr); }
  .zst--policy .zst-article { max-width: none; }
  .zst--policy .zst-head { margin-left: 0 !important; margin-right: 0 !important; }
}

/* R2: ESTK — title column uses the same 860 container as the hero and cards */
.zst--estk .zst-head, .zst--estk .zst-cta { max-width: 860px; }

/* D18: primary buttons — 48px, 700 15px Inter, 999px pill (high specificity beats page CSS) */
html body .wc-block-cart .wc-block-components-button.wc-block-cart__submit-button:not(.is-link),
html body .wp-block-woocommerce-proceed-to-checkout-block .wc-block-components-button:not(.is-link),
html body .wc-block-checkout .wc-block-components-button.wc-block-components-checkout-place-order-button,
html body .zp-form button.single_add_to_cart_button.button,
html body .zp-form .single_add_to_cart_button,
html body .zp-side .zp-side__buy,
html body .zp-sticky .zp-sticky__btn,
html body.woocommerce-account .woocommerce-form button.woocommerce-form-login__submit,
html body.woocommerce-account .woocommerce-form button.woocommerce-form-register__submit,
html body.woocommerce-account button.woocommerce-Button,
html body .zst-article .zes-btn,
html body .zst .zst-btn,
html body .wp-block-woocommerce-empty-cart-block a[href*="/shop"] {
  min-height: 48px !important; height: auto !important;
  padding-top: 0 !important; padding-bottom: 0 !important;
  border-radius: 999px !important; box-sizing: border-box !important;
  font-family: var(--z-font) !important; font-weight: 700 !important; font-size: 15px !important; line-height: 1.2 !important;
}
html body .wc-block-cart__submit-button .wc-block-components-button__text,
html body .wc-block-components-checkout-place-order-button .wc-block-components-button__text {
  font-family: inherit !important; font-weight: inherit !important; font-size: inherit !important; line-height: inherit !important;
}
@media (min-width: 1024px) { .zst--policy .zst-head { max-width: none; } }