/**
 * PARIWA_INTERNATIONAL_PHONE_CAPTURE_IMPLEMENTATION_R1 FIX1.
 *
 * intl-tel-input's own stylesheet makes .iti an inline-block with no
 * explicit width, and positions the country selector absolutely inside
 * the input's own padding (a "flag inset in the input" look). That
 * collapses .iti to its intrinsic content width instead of filling the
 * form column every sibling field uses, and on pages with tighter
 * surrounding CSS (e.g. the takeDeal modal) shrank the whole field to a
 * sliver. This turns it into what the rest of this site's forms already
 * expect: a full-width row, country selector fixed-width on the left,
 * phone input filling the remainder via flex.
 *
 * .iti is exclusively intl-tel-input's own wrapper class on this site --
 * safe to target directly. Every property below is !important-guarded
 * because the country-selector button is a real <button> element, and
 * this site has generic, ancestor-scoped rules like ".login_container
 * button" (style.css) that target ANY <button> regardless of its own
 * class and win on selector specificity alone (one class + one type
 * beats one class) -- observed live setting a blue background, white
 * text, 46px height and, worst, "margin-top: 18px" that visibly shoved
 * the selector 18px below the phone input. Different real forms on this
 * site use different wrapper container classes, so rather than chase
 * each one individually this insulates the widget's internal chrome
 * unconditionally.
 *
 * Deliberately no explicit height anywhere below: different real forms
 * already give their own inputs different heights (34px on /register's
 * own input rule, 40px on takeDeal's .input_modal input), and that's
 * pre-existing, not something this fix should flatten. The phone text
 * input keeps inheriting whatever height its page's own input rule
 * gives it; the selector button is left height:auto and relies on
 * align-items:stretch to match whatever that resolves to, on every page.
 */
.iti {
  display: flex !important;
  align-items: stretch;
  width: 100%;
}

.iti__country-container {
  position: static !important;
  flex: 0 0 auto;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: stretch;
}

.iti__selected-country {
  min-width: 92px;
  width: 92px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 1px solid #ced4da !important;
  border-right: none !important;
  border-radius: 4px 0 0 4px !important;
  background-color: #f8f9fa !important;
  color: #212529 !important;
  font-size: 12px !important;
  box-sizing: border-box !important;
}

.iti input[data-phone-input] {
  position: static !important;
  flex: 1 1 auto;
  width: 100% !important;
  margin: 0 !important;
  min-width: 0;
  padding-left: 12px !important;
  padding-right: 12px !important;
  border-radius: 0 4px 4px 0 !important;
}