:root {
  /* Keep the portalled phone picker above WordPress theme and page-builder layers. */
  --elva-layer-phone-country-picker: 2147483647;
}

.iti.elva-phone-control {
  --iti-border-color: color-mix(in srgb, currentColor 24%, transparent);
  --iti-country-selector-bg: #fff;
  --iti-hover-color: rgba(15, 33, 79, 0.07);
  --iti-icon-color: #344054;
  display: block;
  width: 100%;
}

body > .iti.iti--detached-country-selector {
  z-index: var(--elva-layer-phone-country-picker) !important;
}

.iti.elva-phone-control input.iti__tel-input {
  width: 100%;
}

.iti.elva-phone-control .iti__selected-country {
  min-height: 44px;
}

.iti.elva-phone-control .iti__country-selector {
  color: #101828;
  font-family: inherit;
  font-size: 0.95rem;
}

.iti.elva-phone-control .iti__search-input {
  min-height: 44px;
  color: #101828;
  background: #fff;
}

.iti.elva-phone-control .iti__country {
  min-height: 44px;
}

.iti.elva-phone-control input[aria-invalid="true"] {
  border-color: #b42318 !important;
  box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.12) !important;
}

.elva-phone-error {
  margin: 6px 0 0;
  color: #b42318;
  font-family: inherit;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.4;
}

.elva-phone-error[hidden] {
  display: none;
}

@media (max-width: 767px) {
  .iti.elva-phone-control input.iti__tel-input,
  .iti.elva-phone-control .iti__search-input {
    min-height: 48px;
    font-size: 16px;
  }
}