/* ── Picker host (wrapper div rendered by WC Blocks for our field) ─── */
.wc-block-components-address-form .agw-host {
  width: 100% !important;
  flex-basis: 100% !important;
  max-width: 100% !important;
  order: 10;               /* positioned after standard address fields */
  padding-top: 0 !important;
  min-height: 0 !important;
}

/* Hide WC Blocks own floating label on picker host */
.agw-host > label,
.agw-host .wc-block-components-text-input__label,
.agw-host .wc-block-components-input-label {
  display: none !important;
}

/* ── Picker container ────────────────────────────────────────────── */
.agw-picker {
  width: 100%;
  padding: 4px 0 2px;
}

/* 3-column grid for Province / City / District */
.agw-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.agw-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.agw-label {
  display: block !important;
  position: static !important;
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  transform: none !important;
  opacity: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.agw-select {
  width: 100%;
  min-height: 42px;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  background: #fff;
  padding: 10px 12px;
  font-size: 14px;
  line-height: 1.4;
  transition: border-color .2s ease, box-shadow .2s ease;
  cursor: pointer;
}

.agw-select:focus {
  outline: none;
  border-color: #0f766e;
  box-shadow: 0 0 0 3px rgba(15, 118, 110, .15);
}

.agw-select:disabled {
  background: #f3f4f6;
  color: #9ca3af;
  cursor: not-allowed;
}

.agw-error {
  font-size: 12px;
  line-height: 1.5;
  color: #b91c1c;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 8px;
  padding: 8px 10px;
  margin-top: 4px;
}

/* ── WC misc overrides ───────────────────────────────────────────── */
.wc-block-components-text-input,
.wc-block-components-combobox {
  transition: opacity .3s ease, visibility .3s ease;
}

.wc-block-components-address-form__phone {
  flex: 100% !important;
}

/* ── Responsive: single column on small screens ─────────────────── */
@media (max-width: 640px) {
  .agw-grid {
    grid-template-columns: 1fr;
  }
}
