.bg-checkout-woo {
  margin: 0 0 1.5rem;
  padding: 1rem;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  background: #F4F4F2;
}

.bg-checkout-woo--cart-preflight {
  margin: 0 0 1rem;
}

.bg-checkout-woo--cart-preflight .country_to_country {
  width: 100%;
  box-sizing: border-box;
}

/* Cart: hide Woo “Shipping to …” under rates (often stale vs newly chosen method). */
body.bg-checkout-woo-cart-shipping .woocommerce-shipping-destination {
  display: none !important;
}

/* Hide BG form until activated by selected shipping method. */
.bg-checkout-woo[hidden] {
  display: none !important;
}

/* Major section: toggle standard Woo fields when BG checkout is active. */
body.bg-checkout-woo-active #customer_details,
body.bg-checkout-woo-active .woocommerce-billing-fields,
body.bg-checkout-woo-active .woocommerce-shipping-fields,
body.bg-checkout-woo-active .woocommerce-additional-fields {
  display: none !important;
}

/* Country field is moved into our form via JS. */
body.bg-checkout-woo-active #billing_country_field {
  display: block !important;
}

/* Keep only one country selector visible. */
body.bg-checkout-woo-active #shipping_country_field {
  display: none !important;
}
 
.bg-checkout-woo__title {
  margin: 0 0 1rem;
  font-size: 1.2rem;
}
 
.bg-checkout-woo__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px 16px;
}
 
/* Major section: force full-width fields (Woo often floats first/last). */
.bg-checkout-woo .form-row,
.bg-checkout-woo .form-row-first,
.bg-checkout-woo .form-row-last,
.bg-checkout-woo .form-row-wide {
  float: none !important;
  width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.bg-checkout-woo input.input-text,
.bg-checkout-woo select,
.bg-checkout-woo textarea {
  width: 100%;
  box-sizing: border-box;
}
 
.bg-checkout-woo__fieldset {
  padding: 0.75rem 1rem;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
}
 
.bg-checkout-woo__choices {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin-top: 0.5rem;
}
 
.bg-checkout-woo__choice {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  padding: 6px 10px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 999px;
  cursor: pointer;
  user-select: none;
}
 
.bg-checkout-woo__choice input {
  margin: 0;
}
 
.bg-checkout-woo__hint {
  display: block;
  margin-top: 6px;
  opacity: 0.75;
}
 
.bg-checkout-woo__spinner {
  margin-top: 12px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.04);
}

/* City dropdown: listbox + inline filter input. */
#bg_city_wrap {
  position: relative;
  overflow: visible;
}

/* Some themes override [hidden]; keep gated rows actually hidden. */
#bg_city_wrap[hidden],
#bg_region_wrap[hidden],
#bg_delivery_type_wrap[hidden],
#bg_courier_wrap[hidden] {
  display: none !important;
}

.bg-checkout-woo__select-filter {
  position: relative;
}

.bg-checkout-woo__select-filter-input[hidden] {
  display: none !important;
}

/* When select is open as listbox, show the filter input above it. */
.bg-checkout-woo__select-filter.is-open .bg-checkout-woo__select-filter-input {
  display: block !important;
  margin-bottom: 6px;
}

/* City: custom scrollable list for all viewports (Safari/iOS multi-row <select> is unreliable). */
.bg-checkout-woo__select-filter.is-open {
  position: relative;
  z-index: 10000;
}

.bg-checkout-woo__city-panel-list {
  list-style: none;
  margin: 0 0 8px;
  padding: 0;
  max-height: min(50vh, 280px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.bg-checkout-woo__city-panel-list[hidden] {
  display: none !important;
}

.bg-checkout-woo__city-panel-item {
  padding: 12px 14px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  cursor: pointer;
}

.bg-checkout-woo__city-panel-item:hover {
  background: rgba(0, 0, 0, 0.04);
}

.bg-checkout-woo__city-panel-item:active {
  background: rgba(0, 0, 0, 0.06);
}

.bg-checkout-woo__city-panel-empty {
  padding: 12px 14px;
  opacity: 0.75;
  font-size: 0.95rem;
}

#bg_city_id {
  background: #fff;
}

/*
 * Touch / iPad: keep city search visible — WebKit often blocks programmatic focus from <select>
 * to the filter input, and the native picker steals the first tap.
 */
@media (pointer: coarse), ((hover: none) and (pointer: fine) and (max-width: 1024px)) {
  #bg_city_wrap:not([hidden]) .bg-checkout-woo__select-filter-input {
    display: block !important;
    margin-bottom: 6px;
    max-width: 100%;
    font-size: 16px; /* limits iOS zoom when focusing the search field */
  }

  #bg_city_wrap:not([hidden]) .bg-checkout-woo__select-filter-input[hidden] {
    display: block !important;
  }
}