/* ── intl-tel-input integration with auth-input-wrapper ── */

/* Container inside the auth wrapper */
.iti-auth-wrapper .iti {
  flex: 1;
  min-width: 0;
  direction: ltr;
}

/* Phone input field — blend into wrapper, keep library's inline padding */
.iti-auth-wrapper .iti__tel-input {
  border: none !important;
  background: transparent !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-right: 0 !important;
  font-size: 18px;
  height: auto !important;
  width: 100%;
  outline: none;
  font-family: 'Larken', serif;
  text-align: left;
}

/* Selected country button */
.iti-auth-wrapper .iti__selected-country-primary {
  background: transparent !important;
  padding-inline-start: 0 !important;
  padding-inline-end: 8px !important;
  border-radius: 8px;
}

.iti-auth-wrapper .iti__selected-country-primary:hover {
  background: rgba(0, 0, 0, 0.04) !important;
}

/* Dial code text next to flag */
.iti-auth-wrapper .iti__selected-dial-code {
  font-family: 'Larken', serif;
  font-size: 18px;
  color: #272B3A;
  margin-inline-start: 6px;
}

/* Arrow icon */
.iti-auth-wrapper .iti__arrow {
  border-top-color: #272B3A;
  margin-inline-start: 6px;
}

/* Add a visual separator after the country section */
.iti-auth-wrapper .iti__selected-country {
  padding-inline-end: 12px;
}

.iti-auth-wrapper .iti__selected-country::after {
  content: '';
  display: block;
  width: 1px;
  height: 24px;
  background: #D2D6DB;
  margin-inline-start: 12px;
  flex-shrink: 0;
}

/* ── Dropdown panel ── */
.iti--container {
  z-index: 9999 !important;
}

.iti--container,
.iti--container .iti__dropdown-content,
.iti .iti__dropdown-content,
.iti__dropdown-content {
  direction: ltr !important;
}

.iti--container .iti__dropdown-content,
.iti .iti__dropdown-content,
.iti__dropdown-content {
  border: 1px solid #E5E7EB !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12) !important;
  overflow: hidden !important;
  margin-top: 8px !important;
  background: #fff !important;
  width: 380px !important;
  max-width: 90vw !important;
}

/* Mobile: anchor the dropdown to viewport edges so it never overflows.
   intl-tel-input positions the panel from the flag button's left edge;
   on narrow viewports with an RTL form, that placement pushes the 380px
   panel off-screen. Overriding position to a fixed inset keeps it in view. */
@media (max-width: 640px) {
  .iti--container {
    left: 16px !important;
    right: 16px !important;
    width: auto !important;
  }
  .iti--container .iti__dropdown-content,
  .iti .iti__dropdown-content,
  .iti__dropdown-content {
    width: 100% !important;
    max-width: none !important;
  }
}

/* Search input in dropdown */
.iti__search-input {
  border: none !important;
  border-bottom: 1px solid #E5E7EB !important;
  border-radius: 0 !important;
  padding: 14px 16px 14px 36px !important;
  font-size: 15px !important;
  font-family: 'Larken', serif !important;
  background: #FAFAFA !important;
  color: #272B3A !important;
  outline: none !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.iti__search-input::placeholder {
  color: #A7A8AA !important;
}

.iti__search-input:focus {
  background: #fff !important;
  border-bottom-color: #272B3A !important;
}

/* Country list container */
.iti__country-list {
  max-height: 280px !important;
  overflow-y: auto !important;
  scrollbar-width: thin;
  scrollbar-color: #D2D6DB transparent;
}

.iti__country-list::-webkit-scrollbar {
  width: 5px;
}

.iti__country-list::-webkit-scrollbar-track {
  background: transparent;
}

.iti__country-list::-webkit-scrollbar-thumb {
  background: #D2D6DB;
  border-radius: 10px;
}

/* Individual country rows */
.iti__country {
  padding: 10px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  transition: background 0.15s ease;
  cursor: pointer;
}

.iti__country:hover {
  background: #F3F4F6 !important;
}

.iti__country--highlight {
  background: #EEF2FF !important;
}

/* Remove green active bar from library */
.iti__country--highlight::after,
.iti__country::after {
  display: none !important;
}

.iti__country.iti__highlight,
.iti__country[aria-selected="true"] {
  background: #F0FDF4 !important;
}

/* Country name text */
.iti__country-name {
  font-size: 15px !important;
  color: #272B3A !important;
  font-family: 'Larken', serif;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Dial code in dropdown */
.iti__dial-code {
  font-size: 14px !important;
  color: #9DA4AE !important;
  font-family: 'Larken', serif;
  white-space: nowrap;
}

/* Flag size in dropdown */
.iti__country .iti__flag {
  margin-inline-end: 0 !important;
}

/* Preferred countries divider */
.iti__divider {
  border-bottom: 1px solid #E5E7EB !important;
  margin: 4px 0 !important;
  padding: 0 !important;
}