/* handy-abo · Internationales Telefon-Eingabefeld (HAPhone) */
.haphone {
  display: flex;
  align-items: stretch;
  gap: 8px;
}
.haphone__cc {
  flex: 0 0 auto;
  max-width: 44%;
  min-width: 120px;
  font: inherit;
  font-size: 14px;
  padding: 10px 10px;
  border: 1px solid var(--ha-azure-border, #d5e3ef);
  border-radius: 10px;
  background: var(--ha-white, #fff);
  color: var(--ha-oxford-blue, #0b2540);
  cursor: pointer;
}
.haphone__cc:focus {
  outline: none;
  border-color: var(--ha-bondi-blue, #0093c4);
  box-shadow: 0 0 0 3px rgba(0, 147, 196, .15);
}
.haphone .haphone__num {
  flex: 1 1 auto;
  min-width: 0;
}
.haphone__hint {
  margin: 6px 2px 0;
  font-size: 12.5px;
  line-height: 1.4;
  min-height: 1em;
}
.haphone__hint.is-ok  { color: #1a8a4a; }
.haphone__hint.is-err { color: #c0392b; }

/* Rote Warnung „Nur Ziffern erlaubt." bei einfachen Feldern (ohne Dropdown) */
.haphone__warn {
  margin: 6px 2px 0;
  font-size: 12.5px;
  line-height: 1.4;
  font-weight: 600;
  color: #c0392b;
}

@media (max-width: 480px) {
  .haphone { flex-wrap: wrap; }
  .haphone__cc { max-width: 100%; width: 100%; }
  .haphone .haphone__num { width: 100%; }
}