/* ─────────────────────────────────────────────────────────────
   HENCHU — Single product: Pickup / Home Delivery toggle
   Ported from the Home Kitchen .hk-fulfillment segmented control.
   Brand tokens (--olive, --cream, etc.) come from the main theme CSS.
───────────────────────────────────────────────────────────── */

.henchu-pf {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 18px;
}
.henchu-pf__label {
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--olive-light);
}
.henchu-pf__options {
  display: inline-flex;
  background: var(--cream-card);
  border: 1px solid var(--cream-dark);
  border-radius: 999px;
  padding: 4px;
  gap: 4px;
}
/* !important + scoped selectors defeat the parent theme's red/berry button
   styling (same pattern as assets/css/src/brand-guard.css). */
.henchu-pf .henchu-pf__option,
.henchu-pf .henchu-pf__option:link,
.henchu-pf .henchu-pf__option:visited {
  appearance: none;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  cursor: pointer;
  font-family: var(--font-sans);
  font-size: 15px;
  font-weight: 600;
  color: var(--olive-dark) !important;
  padding: 12px 24px;
  min-height: 44px;
  border-radius: 999px;
  transition: background-color 200ms ease, color 200ms ease;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: none !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}
.henchu-pf .henchu-pf__option:hover,
.henchu-pf .henchu-pf__option:focus {
  background: rgba(64, 85, 45, 0.10) !important;
  background-color: rgba(64, 85, 45, 0.10) !important;
  color: var(--olive-dark) !important;
  border: 0 !important;
}
.henchu-pf .henchu-pf__option.is-active,
.henchu-pf .henchu-pf__option.is-active:hover,
.henchu-pf .henchu-pf__option.is-active:focus,
.henchu-pf .henchu-pf__option.is-active:active {
  background: var(--olive) !important;
  background-color: var(--olive) !important;
  color: var(--cream) !important;
  border: 0 !important;
}
.henchu-pf .henchu-pf__option svg { color: inherit; }
.henchu-pf__hint {
  font-family: var(--font-sans);
  font-size: 13px;
  color: var(--olive-light);
  margin: 0;
}

/* ── Cart page: cart-wide method choice above the order summary ── */
.henchu-pf--cart {
  margin: 0 0 22px;
  padding: 0 0 18px;
  border-bottom: 1px solid var(--cream-dark);
}
.henchu-pf--cart .henchu-pf {
  margin-bottom: 8px;
}
.henchu-pf__note {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 1.5;
  color: var(--olive-light);
  margin: 0;
}

/* ── Pincode checker gate ──
   The plugin's checker is wrapped in .henchu-pincode-gate (see
   inc/product-fulfillment.php). Hide it unless Delivery is chosen.
   Default page state is Pickup, so it starts hidden. */
body:not(.henchu-fulfill-delivery) .henchu-pincode-gate {
  display: none;
}
/* The plugin injects inside form.cart (display:flex). Force the checker onto
   its own full-width row below the qty/Add-to-cart, and undo plugin floats so
   the "Check Availability At" panel aligns left instead of drifting aside. */
.henchu-sp__cart .henchu-pincode-gate {
  flex: 1 0 100%;
  width: 100%;
  clear: both;
  margin-top: 14px;
}
.henchu-pincode-gate,
.henchu-pincode-gate * {
  float: none !important;
}
.henchu-pincode-gate > * {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}