/* packages/core/src/css/flag-offsets.css */
:root {
  --iti-flag-width: 20px;
  --iti-flag-count: 244;
}
.iti__ac {
  --iti-flag-offset: 0;
}
.iti__ad {
  --iti-flag-offset: -1;
}
.iti__ae {
  --iti-flag-offset: -2;
}
.iti__af {
  --iti-flag-offset: -3;
}
.iti__ag {
  --iti-flag-offset: -4;
}
.iti__ai {
  --iti-flag-offset: -5;
}
.iti__al {
  --iti-flag-offset: -6;
}
.iti__am {
  --iti-flag-offset: -7;
}
.iti__ao {
  --iti-flag-offset: -8;
}
.iti__ar {
  --iti-flag-offset: -9;
}
.iti__as {
  --iti-flag-offset: -10;
}
.iti__at {
  --iti-flag-offset: -11;
}
.iti__au {
  --iti-flag-offset: -12;
}
.iti__aw {
  --iti-flag-offset: -13;
}
.iti__ax {
  --iti-flag-offset: -14;
}
.iti__az {
  --iti-flag-offset: -15;
}
.iti__ba {
  --iti-flag-offset: -16;
}
.iti__bb {
  --iti-flag-offset: -17;
}
.iti__bd {
  --iti-flag-offset: -18;
}
.iti__be {
  --iti-flag-offset: -19;
}
.iti__bf {
  --iti-flag-offset: -20;
}
.iti__bg {
  --iti-flag-offset: -21;
}
.iti__bh {
  --iti-flag-offset: -22;
}
.iti__bi {
  --iti-flag-offset: -23;
}
.iti__bj {
  --iti-flag-offset: -24;
}
.iti__bl {
  --iti-flag-offset: -25;
}
.iti__bm {
  --iti-flag-offset: -26;
}
.iti__bn {
  --iti-flag-offset: -27;
}
.iti__bo {
  --iti-flag-offset: -28;
}
.iti__bq {
  --iti-flag-offset: -29;
}
.iti__br {
  --iti-flag-offset: -30;
}
.iti__bs {
  --iti-flag-offset: -31;
}
.iti__bt {
  --iti-flag-offset: -32;
}
.iti__bw {
  --iti-flag-offset: -33;
}
.iti__by {
  --iti-flag-offset: -34;
}
.iti__bz {
  --iti-flag-offset: -35;
}
.iti__ca {
  --iti-flag-offset: -36;
}
.iti__cc {
  --iti-flag-offset: -37;
}
.iti__cd {
  --iti-flag-offset: -38;
}
.iti__cf {
  --iti-flag-offset: -39;
}
.iti__cg {
  --iti-flag-offset: -40;
}
.iti__ch {
  --iti-flag-offset: -41;
}
.iti__ci {
  --iti-flag-offset: -42;
}
.iti__ck {
  --iti-flag-offset: -43;
}
.iti__cl {
  --iti-flag-offset: -44;
}
.iti__cm {
  --iti-flag-offset: -45;
}
.iti__cn {
  --iti-flag-offset: -46;
}
.iti__co {
  --iti-flag-offset: -47;
}
.iti__cr {
  --iti-flag-offset: -48;
}
.iti__cu {
  --iti-flag-offset: -49;
}
.iti__cv {
  --iti-flag-offset: -50;
}
.iti__cw {
  --iti-flag-offset: -51;
}
.iti__cx {
  --iti-flag-offset: -52;
}
.iti__cy {
  --iti-flag-offset: -53;
}
.iti__cz {
  --iti-flag-offset: -54;
}
.iti__de {
  --iti-flag-offset: -55;
}
.iti__dj {
  --iti-flag-offset: -56;
}
.iti__dk {
  --iti-flag-offset: -57;
}
.iti__dm {
  --iti-flag-offset: -58;
}
.iti__do {
  --iti-flag-offset: -59;
}
.iti__dz {
  --iti-flag-offset: -60;
}
.iti__ec {
  --iti-flag-offset: -61;
}
.iti__ee {
  --iti-flag-offset: -62;
}
.iti__eg {
  --iti-flag-offset: -63;
}
.iti__eh {
  --iti-flag-offset: -64;
}
.iti__er {
  --iti-flag-offset: -65;
}
.iti__es {
  --iti-flag-offset: -66;
}
.iti__et {
  --iti-flag-offset: -67;
}
.iti__fi {
  --iti-flag-offset: -68;
}
.iti__fj {
  --iti-flag-offset: -69;
}
.iti__fk {
  --iti-flag-offset: -70;
}
.iti__fm {
  --iti-flag-offset: -71;
}
.iti__fo {
  --iti-flag-offset: -72;
}
.iti__fr {
  --iti-flag-offset: -73;
}
.iti__ga {
  --iti-flag-offset: -74;
}
.iti__gb {
  --iti-flag-offset: -75;
}
.iti__gd {
  --iti-flag-offset: -76;
}
.iti__ge {
  --iti-flag-offset: -77;
}
.iti__gf {
  --iti-flag-offset: -78;
}
.iti__gg {
  --iti-flag-offset: -79;
}
.iti__gh {
  --iti-flag-offset: -80;
}
.iti__gi {
  --iti-flag-offset: -81;
}
.iti__gl {
  --iti-flag-offset: -82;
}
.iti__gm {
  --iti-flag-offset: -83;
}
.iti__gn {
  --iti-flag-offset: -84;
}
.iti__gp {
  --iti-flag-offset: -85;
}
.iti__gq {
  --iti-flag-offset: -86;
}
.iti__gr {
  --iti-flag-offset: -87;
}
.iti__gt {
  --iti-flag-offset: -88;
}
.iti__gu {
  --iti-flag-offset: -89;
}
.iti__gw {
  --iti-flag-offset: -90;
}
.iti__gy {
  --iti-flag-offset: -91;
}
.iti__hk {
  --iti-flag-offset: -92;
}
.iti__hn {
  --iti-flag-offset: -93;
}
.iti__hr {
  --iti-flag-offset: -94;
}
.iti__ht {
  --iti-flag-offset: -95;
}
.iti__hu {
  --iti-flag-offset: -96;
}
.iti__id {
  --iti-flag-offset: -97;
}
.iti__ie {
  --iti-flag-offset: -98;
}
.iti__il {
  --iti-flag-offset: -99;
}
.iti__im {
  --iti-flag-offset: -100;
}
.iti__in {
  --iti-flag-offset: -101;
}
.iti__io {
  --iti-flag-offset: -102;
}
.iti__iq {
  --iti-flag-offset: -103;
}
.iti__ir {
  --iti-flag-offset: -104;
}
.iti__is {
  --iti-flag-offset: -105;
}
.iti__it {
  --iti-flag-offset: -106;
}
.iti__je {
  --iti-flag-offset: -107;
}
.iti__jm {
  --iti-flag-offset: -108;
}
.iti__jo {
  --iti-flag-offset: -109;
}
.iti__jp {
  --iti-flag-offset: -110;
}
.iti__ke {
  --iti-flag-offset: -111;
}
.iti__kg {
  --iti-flag-offset: -112;
}
.iti__kh {
  --iti-flag-offset: -113;
}
.iti__ki {
  --iti-flag-offset: -114;
}
.iti__km {
  --iti-flag-offset: -115;
}
.iti__kn {
  --iti-flag-offset: -116;
}
.iti__kp {
  --iti-flag-offset: -117;
}
.iti__kr {
  --iti-flag-offset: -118;
}
.iti__kw {
  --iti-flag-offset: -119;
}
.iti__ky {
  --iti-flag-offset: -120;
}
.iti__kz {
  --iti-flag-offset: -121;
}
.iti__la {
  --iti-flag-offset: -122;
}
.iti__lb {
  --iti-flag-offset: -123;
}
.iti__lc {
  --iti-flag-offset: -124;
}
.iti__li {
  --iti-flag-offset: -125;
}
.iti__lk {
  --iti-flag-offset: -126;
}
.iti__lr {
  --iti-flag-offset: -127;
}
.iti__ls {
  --iti-flag-offset: -128;
}
.iti__lt {
  --iti-flag-offset: -129;
}
.iti__lu {
  --iti-flag-offset: -130;
}
.iti__lv {
  --iti-flag-offset: -131;
}
.iti__ly {
  --iti-flag-offset: -132;
}
.iti__ma {
  --iti-flag-offset: -133;
}
.iti__mc {
  --iti-flag-offset: -134;
}
.iti__md {
  --iti-flag-offset: -135;
}
.iti__me {
  --iti-flag-offset: -136;
}
.iti__mf {
  --iti-flag-offset: -137;
}
.iti__mg {
  --iti-flag-offset: -138;
}
.iti__mh {
  --iti-flag-offset: -139;
}
.iti__mk {
  --iti-flag-offset: -140;
}
.iti__ml {
  --iti-flag-offset: -141;
}
.iti__mm {
  --iti-flag-offset: -142;
}
.iti__mn {
  --iti-flag-offset: -143;
}
.iti__mo {
  --iti-flag-offset: -144;
}
.iti__mp {
  --iti-flag-offset: -145;
}
.iti__mq {
  --iti-flag-offset: -146;
}
.iti__mr {
  --iti-flag-offset: -147;
}
.iti__ms {
  --iti-flag-offset: -148;
}
.iti__mt {
  --iti-flag-offset: -149;
}
.iti__mu {
  --iti-flag-offset: -150;
}
.iti__mv {
  --iti-flag-offset: -151;
}
.iti__mw {
  --iti-flag-offset: -152;
}
.iti__mx {
  --iti-flag-offset: -153;
}
.iti__my {
  --iti-flag-offset: -154;
}
.iti__mz {
  --iti-flag-offset: -155;
}
.iti__na {
  --iti-flag-offset: -156;
}
.iti__nc {
  --iti-flag-offset: -157;
}
.iti__ne {
  --iti-flag-offset: -158;
}
.iti__nf {
  --iti-flag-offset: -159;
}
.iti__ng {
  --iti-flag-offset: -160;
}
.iti__ni {
  --iti-flag-offset: -161;
}
.iti__nl {
  --iti-flag-offset: -162;
}
.iti__no {
  --iti-flag-offset: -163;
}
.iti__np {
  --iti-flag-offset: -164;
}
.iti__nr {
  --iti-flag-offset: -165;
}
.iti__nu {
  --iti-flag-offset: -166;
}
.iti__nz {
  --iti-flag-offset: -167;
}
.iti__om {
  --iti-flag-offset: -168;
}
.iti__pa {
  --iti-flag-offset: -169;
}
.iti__pe {
  --iti-flag-offset: -170;
}
.iti__pf {
  --iti-flag-offset: -171;
}
.iti__pg {
  --iti-flag-offset: -172;
}
.iti__ph {
  --iti-flag-offset: -173;
}
.iti__pk {
  --iti-flag-offset: -174;
}
.iti__pl {
  --iti-flag-offset: -175;
}
.iti__pm {
  --iti-flag-offset: -176;
}
.iti__pr {
  --iti-flag-offset: -177;
}
.iti__ps {
  --iti-flag-offset: -178;
}
.iti__pt {
  --iti-flag-offset: -179;
}
.iti__pw {
  --iti-flag-offset: -180;
}
.iti__py {
  --iti-flag-offset: -181;
}
.iti__qa {
  --iti-flag-offset: -182;
}
.iti__re {
  --iti-flag-offset: -183;
}
.iti__ro {
  --iti-flag-offset: -184;
}
.iti__rs {
  --iti-flag-offset: -185;
}
.iti__ru {
  --iti-flag-offset: -186;
}
.iti__rw {
  --iti-flag-offset: -187;
}
.iti__sa {
  --iti-flag-offset: -188;
}
.iti__sb {
  --iti-flag-offset: -189;
}
.iti__sc {
  --iti-flag-offset: -190;
}
.iti__sd {
  --iti-flag-offset: -191;
}
.iti__se {
  --iti-flag-offset: -192;
}
.iti__sg {
  --iti-flag-offset: -193;
}
.iti__sh {
  --iti-flag-offset: -194;
}
.iti__si {
  --iti-flag-offset: -195;
}
.iti__sj {
  --iti-flag-offset: -196;
}
.iti__sk {
  --iti-flag-offset: -197;
}
.iti__sl {
  --iti-flag-offset: -198;
}
.iti__sm {
  --iti-flag-offset: -199;
}
.iti__sn {
  --iti-flag-offset: -200;
}
.iti__so {
  --iti-flag-offset: -201;
}
.iti__sr {
  --iti-flag-offset: -202;
}
.iti__ss {
  --iti-flag-offset: -203;
}
.iti__st {
  --iti-flag-offset: -204;
}
.iti__sv {
  --iti-flag-offset: -205;
}
.iti__sx {
  --iti-flag-offset: -206;
}
.iti__sy {
  --iti-flag-offset: -207;
}
.iti__sz {
  --iti-flag-offset: -208;
}
.iti__tc {
  --iti-flag-offset: -209;
}
.iti__td {
  --iti-flag-offset: -210;
}
.iti__tg {
  --iti-flag-offset: -211;
}
.iti__th {
  --iti-flag-offset: -212;
}
.iti__tj {
  --iti-flag-offset: -213;
}
.iti__tk {
  --iti-flag-offset: -214;
}
.iti__tl {
  --iti-flag-offset: -215;
}
.iti__tm {
  --iti-flag-offset: -216;
}
.iti__tn {
  --iti-flag-offset: -217;
}
.iti__to {
  --iti-flag-offset: -218;
}
.iti__tr {
  --iti-flag-offset: -219;
}
.iti__tt {
  --iti-flag-offset: -220;
}
.iti__tv {
  --iti-flag-offset: -221;
}
.iti__tw {
  --iti-flag-offset: -222;
}
.iti__tz {
  --iti-flag-offset: -223;
}
.iti__ua {
  --iti-flag-offset: -224;
}
.iti__ug {
  --iti-flag-offset: -225;
}
.iti__us {
  --iti-flag-offset: -226;
}
.iti__uy {
  --iti-flag-offset: -227;
}
.iti__uz {
  --iti-flag-offset: -228;
}
.iti__va {
  --iti-flag-offset: -229;
}
.iti__vc {
  --iti-flag-offset: -230;
}
.iti__ve {
  --iti-flag-offset: -231;
}
.iti__vg {
  --iti-flag-offset: -232;
}
.iti__vi {
  --iti-flag-offset: -233;
}
.iti__vn {
  --iti-flag-offset: -234;
}
.iti__vu {
  --iti-flag-offset: -235;
}
.iti__wf {
  --iti-flag-offset: -236;
}
.iti__ws {
  --iti-flag-offset: -237;
}
.iti__xk {
  --iti-flag-offset: -238;
}
.iti__ye {
  --iti-flag-offset: -239;
}
.iti__yt {
  --iti-flag-offset: -240;
}
.iti__za {
  --iti-flag-offset: -241;
}
.iti__zm {
  --iti-flag-offset: -242;
}
.iti__zw {
  --iti-flag-offset: -243;
}
/* packages/core/src/css/intlTelInput.css */
:root {
  --iti-hover-color: rgba(0, 0, 0, 0.05);
  --iti-border-color: #ccc;
  --iti-country-selector-bg: white;
  --iti-icon-color: #555;
  --iti-spacer-horizontal: 10px;
  --iti-flag-height: calc(var(--iti-flag-width) * 3 / 4);
  --iti-globe-icon-size: 17px;
  --iti-clear-icon-size: 15px;
  --iti-border-width: 1px;
  --iti-arrow-size: 5px;
  --iti-arrow-width: 1.5px;
  --iti-arrow-padding: 7px;
  --iti-mobile-popup-margin: 30px;
  --iti-strict-reject-flash-color: rgba(255, 0, 0, 0.12);
}
.iti {
  position: relative;
  display: inline-block;
  * {
    box-sizing: border-box;
  }
  input.iti__tel-input,
  input.iti__tel-input[type=text],
  input.iti__tel-input[type=tel] {
    position: relative;
    z-index: 0;
    display: block;
    min-width: 100%;
    margin: 0 !important;
  }
}
.iti__a11y-text {
  width: 1px;
  height: 1px;
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  position: absolute;
}
.iti__country-container {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  padding: var(--iti-border-width);
}
.iti__selected-country {
  z-index: 1;
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  border-radius: 0;
  font-weight: inherit;
  line-height: inherit;
  text-decoration: none;
}
.iti__selected-country-primary {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 var(--iti-arrow-padding) 0 var(--iti-spacer-horizontal);
}
.iti__selected-dial-code {
  margin-left: 4px;
}
.iti__arrow {
  margin-left: var(--iti-arrow-padding);
  margin-top: -2px;
  width: var(--iti-arrow-size);
  height: var(--iti-arrow-size);
  box-sizing: border-box;
  border-right: var(--iti-arrow-width) solid var(--iti-icon-color);
  border-bottom: var(--iti-arrow-width) solid var(--iti-icon-color);
  transform: rotate(45deg);
}
.iti__arrow--up {
  margin-top: 4px;
  transform: rotate(-135deg);
}
.iti__country-selector {
  border-radius: 3px;
  background-color: var(--iti-country-selector-bg);
  .iti--inline-country-selector & {
    border: var(--iti-border-width) solid var(--iti-border-color);
    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
  }
  .iti--inline-country-selector:not(.iti--detached-country-selector) & {
    position: absolute;
    z-index: 2;
    left: 0;
  }
}
.iti__search-input {
  width: 100%;
  border-width: 0;
  border-radius: 3px;
  padding-left: calc(var(--iti-spacer-horizontal) + var(--iti-globe-icon-size) + var(--iti-spacer-horizontal));
  padding-right: calc(var(--iti-spacer-horizontal) + var(--iti-clear-icon-size) + var(--iti-spacer-horizontal));
  [dir=rtl] & {
    padding-left: inherit;
    padding-right: 30px;
    background-position: right 8px center;
  }
  &::-webkit-search-cancel-button {
    -webkit-appearance: none;
            appearance: none;
  }
}
.iti__search-input,
.iti__country {
  padding-top: 8px;
  padding-bottom: 8px;
}
.iti__search-input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--iti-border-color);
}
.iti__search-icon {
  position: absolute;
  left: var(--iti-spacer-horizontal);
  display: flex;
  pointer-events: none;
  [dir=rtl] & {
    left: auto;
    right: var(--iti-spacer-horizontal);
  }
}
.iti__search-icon-svg {
  width: var(--iti-globe-icon-size);
  height: var(--iti-globe-icon-size);
  display: block;
  stroke: var(--iti-icon-color);
  fill: none;
  stroke-width: 3;
}
.iti__search-clear {
  position: absolute;
  right: calc(var(--iti-spacer-horizontal) / 2);
  background: transparent;
  border: 0;
  border-radius: 3px;
  cursor: pointer;
  padding: calc(var(--iti-spacer-horizontal) / 2);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.15s ease;
  .iti__search-clear-x {
    stroke-width: 2;
  }
  .iti__search-clear-bg {
    fill: var(--iti-icon-color);
  }
  [dir=rtl] & {
    right: auto;
    left: var(--iti-spacer-horizontal);
  }
  &:hover,
  &:focus-visible {
    background: var(--iti-hover-color);
    outline: none;
  }
}
.iti__search-clear-svg {
  width: var(--iti-clear-icon-size);
  height: var(--iti-clear-icon-size);
  display: block;
}
.iti__no-results {
  text-align: center;
  padding: 30px 0;
}
.iti__country-list {
  list-style: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  .iti--inline-country-selector & {
    max-height: 185px;
  }
}
.iti--flexible-dropdown-width .iti__country-list {
  white-space: nowrap;
  @media (max-width: 500px) {
    white-space: normal;
  }
}
.iti__country {
  display: flex;
  align-items: center;
  padding-left: var(--iti-spacer-horizontal);
  padding-right: var(--iti-spacer-horizontal);
  outline: none;
  &.iti__highlight {
    background-color: var(--iti-hover-color);
  }
}
.iti__country-name {
  flex-grow: 1;
}
.iti__country-check {
  margin-left: var(--iti-spacer-horizontal);
  display: flex;
  align-items: center;
  color: var(--iti-icon-color);
}
.iti__country-check-svg {
  width: var(--iti-clear-icon-size);
  height: var(--iti-clear-icon-size);
  display: block;
}
.iti__country-list .iti__flag {
  margin-right: var(--iti-spacer-horizontal);
  flex-shrink: 0;
  [dir=rtl] & {
    margin-right: 0;
    margin-left: var(--iti-spacer-horizontal);
  }
}
.iti--has-country-selector {
  .iti__country-container:has(+ input[disabled]),
  .iti__country-container:has(+ input[readonly]) {
    button.iti__selected-country {
      cursor: not-allowed;
      .iti__arrow {
        visibility: hidden;
      }
    }
  }
  .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])) {
    .iti__selected-country-primary:hover,
    .iti__selected-country[aria-expanded=true] .iti__selected-country-primary {
      background-color: var(--iti-hover-color);
    }
  }
}
.iti--detached-country-selector {
  position: fixed;
  top: -1000px;
  left: -1000px;
  z-index: 1060;
  &:hover {
    cursor: pointer;
  }
  top: calc(anchor(bottom) + 3px);
  left: anchor(left);
  position-try-fallbacks: --iti-flip-above
}
@position-try --iti-flip-above {
  top: auto;
  bottom: calc(anchor(top) + 3px);
}
.iti__hide {
  display: none;
}
.iti__v-hide {
  visibility: hidden;
}
.iti--fullscreen-popup {
  &.iti--detached-country-selector {
    background-color: rgba(0, 0, 0, 0.5);
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    position: fixed;
    padding: var(--iti-mobile-popup-margin);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }
  .iti__country-selector {
    display: flex;
    flex-direction: column;
    max-height: 100%;
    position: relative;
  }
  .iti__country,
  .iti__search-input {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .iti__country {
    padding-left: 10px;
    padding-right: 10px;
    line-height: 1.5em;
  }
}
.iti__flag {
  height: var(--iti-flag-height);
  width: var(--iti-flag-width);
  border-radius: 1px;
  box-shadow: 0px 0px 1px 0px #888;
  background-image: -webkit-image-set(var(--iti-path-flags-1x) 1x, var(--iti-path-flags-2x) 2x);
  background-image: image-set(var(--iti-path-flags-1x) 1x, var(--iti-path-flags-2x) 2x);
  background-repeat: no-repeat;
  background-position: calc(var(--iti-flag-offset, 100) * var(--iti-flag-width)) 0;
  background-size: calc(var(--iti-flag-count) * var(--iti-flag-width)) var(--iti-flag-height);
}
.iti__loading {
  position: relative;
  background: none;
  box-shadow: none;
  &::after {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    width: var(--iti-flag-height);
    height: var(--iti-flag-height);
    box-sizing: border-box;
    border: 2px solid var(--iti-icon-color);
    border-right-color: transparent;
    border-radius: 50%;
    animation: iti-spinner 1s linear infinite;
  }
}
@keyframes iti-spinner {
  to {
    transform: rotate(360deg);
  }
}
.iti__strict-reject-animation {
  .iti__tel-input,
  .iti__selected-country {
    animation: iti-strict-reject-shake 0.3s cubic-bezier(0.36, 0.07, 0.19, 0.97);
  }
  @media (prefers-reduced-motion: reduce) {
    .iti__tel-input {
      animation: iti-strict-reject-flash 0.3s ease-out both;
    }
    .iti__selected-country {
      animation: none;
    }
  }
}
@keyframes iti-strict-reject-shake {
  10%, 90% {
    transform: translateX(-1px);
  }
  20%, 80% {
    transform: translateX(2px);
  }
  30%, 50%, 70% {
    transform: translateX(-3px);
  }
  40%, 60% {
    transform: translateX(3px);
  }
}
@keyframes iti-strict-reject-flash {
  40% {
    background-color: var(--iti-strict-reject-flash-color);
  }
}
.iti__globe {
  background: none;
  box-shadow: none;
  height: var(--iti-globe-icon-size);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  .iti__globe-svg {
    width: 100%;
    height: 100%;
    fill: var(--iti-icon-color);
  }
}
@supports (-webkit-appearance: none) and (not (background: -webkit-canvas(foo))) {
  .iti__tel-input:focus {
    outline-offset: 1px;
  }
}
/* packages/core/src/css/intlTelInputWithAssets.css */
:root {
  --iti-path-flags-1x: url(images/flags.dc848804.webp);
  --iti-path-flags-2x: url(images/flags@2x.c7a5f533.webp);
}

/* Safari Brief wizard — ALE theme tokens (warm neutrals and orange accent).
 *
 * Composition: on desktop the card is a two-region layout — a charcoal rail
 * carrying the framing and a vertical step list, and a white panel carrying
 * the questions. The card fills the page's own 980px container so its edges
 * align with the site grid. On mobile the rail collapses to a compact header
 * and the actions become a sticky bottom bar.
 *
 * Motion: one easing family throughout. Steps exit softly, enter with a
 * direction-aware slide, and fields stagger in. Everything respects
 * prefers-reduced-motion.
 */

/* App shell: the document never scrolls. The wizard owns the viewport below
   the site header; the step body is the only region allowed to scroll, and
   only when a step genuinely cannot fit. */

html.ale-sb-page,
html.ale-sb-page body {
	height: 100%;
	overflow: hidden;
	/* clip forbids programmatic scrolling too (scrollIntoView from focus or
	   automation can still scroll an overflow:hidden container). */
	overflow: clip;
	overscroll-behavior: none;
}

body.ale-sb-page-body {
	margin: 0;
	background: #faf9f7;
	font-family: Arial, Helvetica, sans-serif;
}

.ale-sb-route-main {
	height: 100%;
}

.ale-sb-skip {
	position: fixed;
	top: 8px;
	left: 8px;
	z-index: 100;
	transform: translateY(-160%);
	background: #ffffff;
	color: #2d2d2d;
	border-radius: 6px;
	padding: 10px 14px;
	font-weight: 700;
}

.ale-sb-skip:focus {
	transform: translateY(0);
}

/* The footer is unreachable in an unscrollable shell; rendering it only
   gives programmatic scroll somewhere to go. */

html.ale-sb-page body > footer,
html.ale-sb-page main + footer {
	display: none;
}

/* Focused funnel: no site chrome, nothing to navigate away to. The brand
   block below replaces the header. */

html.ale-sb-page body > header {
	display: none;
}

/* Brand sizing is inlined by the shortcode as critical CSS so the logo
   never paints unsized; nothing to add here. */

.ale-safari-brief {
	--sb-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--sb-pop: cubic-bezier(0.34, 1.4, 0.64, 1);
	width: 100%;
	margin: 0 auto;
}

.ale-safari-brief[data-fullscreen='1'] {
	height: calc(100dvh - var(--sb-top, 0px) - var(--sb-brand, 64px));
	display: grid;
	padding: 8px 12px 12px;
}

@media (min-width: 960px) {
	.ale-safari-brief[data-fullscreen='1'] {
		padding: 8px 32px 24px;
	}
}

.ale-safari-brief[data-fullscreen='1'] .ale-sb {
	width: 100%;
	max-width: 980px;
	height: 100%;
	max-height: 960px;
	margin: auto;
}

.ale-sb-loading {
	padding: 48px 0;
	color: #686461;
	text-align: center;
}

.ale-sb-skeleton .ale-sb-card:disabled,
.ale-sb-skeleton .ale-sb-next:disabled {
	opacity: 1;
}

.ale-sb-skeleton .ale-sb-card-placeholder {
	display: block;
	aspect-ratio: 4 / 3;
	background: linear-gradient(110deg, #e8e5e1 25%, #f5f3ef 42%, #e8e5e1 60%);
	background-size: 220% 100%;
	animation: ale-sb-skeleton 1.4s ease-in-out infinite;
}

@keyframes ale-sb-skeleton {
	from {
		background-position: 100% 0;
	}
	to {
		background-position: -120% 0;
	}
}

.ale-sb {
	display: grid;
	background: #ffffff;
	color: #343434;
	border-radius: 16px;
	box-shadow: 0 1px 2px rgba(45, 45, 45, 0.04),
		0 10px 30px -6px rgba(45, 45, 45, 0.08),
		0 32px 64px -24px rgba(45, 45, 45, 0.22);
	overflow: hidden;
	font-size: 17px;
	line-height: 1.6;
}

@media (min-width: 960px) {
	.ale-sb {
		grid-template-columns: 304px minmax(0, 1fr);
	}
}

/* ------------------------------------------------------------------ rail */

.ale-sb-rail {
	display: none;
}

@media (min-width: 960px) {
	.ale-sb-rail {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		gap: 32px;
		background: #2f353b;
		color: #ffffff;
		padding: 40px 32px 32px;
	}
}

.ale-sb-kicker {
	font-size: 12px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	font-weight: 700;
	color: #e8a33d;
	margin: 0;
}

.ale-sb-rail .ale-sb-title {
	color: #ffffff;
	font-size: 26px;
	font-weight: 300;
	line-height: 1.25;
	margin: 10px 0 0;
}

.ale-sb-rail .ale-sb-title,
.ale-sb-mhead .ale-sb-title {
	letter-spacing: -0.01em;
}

.ale-sb-rail .ale-sb-meta {
	margin: 14px 0 0;
	font-size: 13px;
	color: rgba(255, 255, 255, 0.6);
	display: grid;
	gap: 6px;
}

.ale-sb-rail .ale-sb-meta span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.ale-sb-rail .ale-sb-meta span::before {
	content: '';
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #e8a33d;
}

/* The page template styles content ol/li with high-specificity utilities;
   force the reset so the step list never picks up document list styling. */

.ale-sb .ale-sb-rail-steps {
	list-style: none !important;
	padding-left: 0 !important;
	margin: 28px 0 0;
}

.ale-sb .ale-sb-rail-steps li {
	list-style: none !important;
	padding-left: 0 !important;
	margin: 0;
}

.ale-sb .ale-sb-rail-steps li::marker {
	content: none;
}

.ale-sb-rail-steps {
	margin: 32px 0 0;
	padding: 0;
	display: grid;
	gap: 0;
}

/* Connector line between badges. In a linear wizard, a step being current or
   done implies the previous one is done, so each item colors its own inbound
   connector: track by default, amber fill drawing downward once reached. */

.ale-sb .ale-sb-rail-steps li:not(:first-child)::before {
	content: '';
	display: block;
	width: 2px;
	height: 14px;
	margin-left: 13px;
	background-color: rgba(255, 255, 255, 0.16);
	background-image: linear-gradient(#e8a33d, #e8a33d);
	background-repeat: no-repeat;
	background-size: 100% 0%;
	transition: background-size 0.45s var(--sb-ease);
}

.ale-sb .ale-sb-rail-steps li[data-state='done']:not(:first-child)::before,
.ale-sb .ale-sb-rail-steps li[data-state='current']:not(:first-child)::before {
	background-size: 100% 100%;
}

.ale-sb-rail-steps button {
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	background: none;
	border: 0;
	border-radius: 8px;
	padding: 10px 12px;
	margin: 0 -12px;
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.45);
	cursor: default;
	text-align: left;
	transition: color 0.25s var(--sb-ease), background 0.25s var(--sb-ease);
}

.ale-sb-rail-steps button:not(:disabled) {
	cursor: pointer;
}

.ale-sb-rail-steps button:not(:disabled):hover {
	background: rgba(255, 255, 255, 0.06);
	color: rgba(255, 255, 255, 0.85);
}

.ale-sb-rail-steps i {
	font-style: normal;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: 1.5px solid rgba(255, 255, 255, 0.25);
	display: grid;
	place-items: center;
	font-size: 12.5px;
	font-weight: 700;
	flex: 0 0 auto;
	transition: background 0.3s var(--sb-ease), border-color 0.3s var(--sb-ease),
		color 0.3s var(--sb-ease), transform 0.3s var(--sb-pop);
}

.ale-sb-rail-steps li[data-state='current'] button {
	color: #ffffff;
}

.ale-sb-rail-steps li[data-state='current'] i {
	background: #f14f04;
	border-color: #f14f04;
	color: #ffffff;
	transform: scale(1.08);
}

.ale-sb-rail-steps li[data-state='done'] button {
	color: rgba(255, 255, 255, 0.75);
}

.ale-sb-rail-steps li[data-state='done'] i {
	background: rgba(232, 163, 61, 0.16);
	border-color: rgba(232, 163, 61, 0.5);
	color: #e8a33d;
}

/* The check draws itself in as a step completes. */

.ale-sb-rail-steps li[data-state='done'] i svg path {
	stroke-dasharray: 24;
	stroke-dashoffset: 24;
	animation: sb-check-draw 0.4s var(--sb-ease) 0.1s forwards;
}

@keyframes sb-check-draw {
	to {
		stroke-dashoffset: 0;
	}
}

/* A soft breathing halo marks where you are. */

.ale-sb-rail-steps li[data-state='current'] i {
	animation: sb-step-pulse 2.6s ease-in-out infinite;
}

@keyframes sb-step-pulse {
	0%,
	100% {
		box-shadow: 0 0 0 0 rgba(241, 79, 4, 0.4);
	}
	55% {
		box-shadow: 0 0 0 9px rgba(241, 79, 4, 0);
	}
}

.ale-sb-rail-trust {
	display: grid;
	gap: 4px;
}

.ale-sb-iata {
	display: block;
	width: 64px;
	color: rgba(255, 255, 255, 0.7);
}

.ale-sb-iata svg {
	width: 100%;
	height: auto;
	display: block;
}

.ale-sb-iata-no {
	font-size: 11px;
	letter-spacing: 0.14em;
	color: rgba(255, 255, 255, 0.4);
}

.ale-sb-rail-trust p {
	margin: 10px 0 0;
	font-size: 12px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.45);
}

.ale-sb-rail-trust a {
	color: rgba(255, 255, 255, 0.7);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.ale-sb-rail-trust a:hover {
	color: #ffffff;
}

/* ------------------------------------------------------------------ main */

.ale-sb-main {
	display: grid;
	grid-template-rows: auto minmax(0, 1fr) auto;
	min-width: 0;
	min-height: 0;
	height: 100%;
}

.ale-sb-mhead {
	padding: 16px 20px 0;
}

@media (max-width: 959px) {
	.ale-sb-mhead .ale-sb-kicker {
		display: none;
	}
}

@media (min-width: 960px) {
	.ale-sb-mhead {
		padding: 0;
	}

	.ale-sb-mhead .ale-sb-kicker,
	.ale-sb-mhead .ale-sb-title {
		display: none;
	}
}

.ale-sb-mhead .ale-sb-title {
	font-size: 20px;
	font-weight: 300;
	color: #2d2d2d;
	margin: 0;
}

.ale-sb-progress {
	margin-top: 12px;
}

@media (min-width: 960px) {
	.ale-sb-progress {
		margin: 0;
		padding: 24px 48px 0;
	}
}

.ale-sb-steplabel {
	display: flex;
	justify-content: space-between;
	font-size: 12.5px;
	font-weight: 700;
	color: #9a958f;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0;
}

.ale-sb-steplabel span:last-child {
	color: #bc3800;
}

.ale-sb-bar {
	margin-top: 10px;
	height: 3px;
	border-radius: 2px;
	background: #f4f3f1;
	overflow: hidden;
}

@media (min-width: 960px) {
	.ale-sb-bar {
		display: none;
	}

	.ale-sb-steplabel {
		border-bottom: 1px solid #f4f3f1;
		padding-bottom: 20px;
	}
}

.ale-sb-bar i {
	display: block;
	height: 100%;
	background: #f14f04;
	border-radius: 2px;
	transition: width 0.5s var(--sb-ease);
}

/* ------------------------------------------------------------------ body */

.ale-sb-body {
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	padding: 18px 20px 20px;
}

@media (min-width: 960px) {
	.ale-sb-body {
		padding: 28px 48px 24px;
	}
}

/* Step transitions: exit softly against the travel direction, enter with a
   direction-aware slide. Fields stagger in behind the pane. */

.ale-sb-body.is-out {
	animation: sb-pane-out 0.19s ease-in both;
}

.ale-sb-body.is-in {
	animation: sb-pane-in 0.42s var(--sb-ease) both;
}

.ale-sb-body.is-out.dir-back {
	animation-name: sb-pane-out-back;
}

.ale-sb-body.is-in.dir-back {
	animation-name: sb-pane-in-back;
}

@keyframes sb-pane-out {
	to {
		opacity: 0;
		transform: translateX(-14px);
	}
}

@keyframes sb-pane-out-back {
	to {
		opacity: 0;
		transform: translateX(14px);
	}
}

@keyframes sb-pane-in {
	from {
		opacity: 0;
		transform: translateX(22px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes sb-pane-in-back {
	from {
		opacity: 0;
		transform: translateX(-22px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.ale-sb-body.is-in > * {
	animation: sb-field-in 0.5s var(--sb-ease) both;
}

.ale-sb-body.is-in > *:nth-child(2) {
	animation-delay: 0.05s;
}

.ale-sb-body.is-in > *:nth-child(3) {
	animation-delay: 0.1s;
}

.ale-sb-body.is-in > *:nth-child(4) {
	animation-delay: 0.15s;
}

.ale-sb-body.is-in > *:nth-child(n + 5) {
	animation-delay: 0.2s;
}

@keyframes sb-field-in {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ale-sb *,
	.ale-sb *::before,
	.ale-sb *::after {
		animation: none !important;
		transition: none !important;
	}
}

/* Step rhythm applies between top-level blocks only. Without the child
   combinator these also matched fields paired side by side, pushing the
   second column down by a full step gap. */

.ale-sb-body > .ale-sb-field + .ale-sb-field {
	margin-top: 26px;
}

@media (min-width: 960px) {
	.ale-sb-body > .ale-sb-field + .ale-sb-field {
		margin-top: 34px;
	}
}

/* A question that follows another block gets air above its title. */

.ale-sb-body > .ale-sb-pair + .ale-sb-field,
.ale-sb-body > .ale-sb-field.is-conditional + .ale-sb-field {
	margin-top: 30px;
}

@media (min-width: 960px) {
	.ale-sb-body > .ale-sb-pair + .ale-sb-field,
	.ale-sb-body > .ale-sb-field.is-conditional + .ale-sb-field {
		margin-top: 38px;
	}
}

.ale-sb-field.is-conditional {
	margin-top: 16px;
	padding: 16px;
	background: #faf9f7;
	border: 1px solid #f0eeea;
	border-radius: 8px;
}

.ale-sb-q {
	font-size: 19px;
	font-weight: 900;
	color: #2d2d2d;
	line-height: 1.35;
	margin: 0;
	letter-spacing: -0.005em;
}

.ale-sb-field.is-conditional .ale-sb-q {
	font-size: 15px;
	font-weight: 700;
	color: #686461;
}

.ale-sb-hint {
	margin: 6px 0 0;
	font-size: 14.5px;
	color: #686461;
}

.ale-sb-form-error {
	margin: 0 0 16px;
	padding: 12px 16px;
	background: #f8efec;
	border: 1px solid #ecd5cb;
	border-radius: 8px;
	color: #a3341c;
	font-size: 14.5px;
	font-weight: 700;
}

.ale-sb-error {
	margin: 6px 0 0;
	font-size: 13.5px;
	color: #a3341c;
	font-weight: 700;
}

/* --------------------------------------------------------- destination cards */

.ale-sb-cards {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
	margin-top: 20px;
}

@media (min-width: 700px) {
	.ale-sb-cards {
		grid-template-columns: repeat(3, 1fr);
	}
}

.ale-sb-card {
	position: relative;
	border: 0;
	border-radius: 10px;
	background: #ffffff;
	cursor: pointer;
	padding: 0;
	text-align: left;
	overflow: hidden;
	font-family: inherit;
	box-shadow: 0 0 0 1.5px #e8e5e1;
	transition: box-shadow 0.2s var(--sb-ease), transform 0.2s var(--sb-ease);
}

.ale-sb-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 0 0 1.5px #cfcac4, 0 10px 24px -12px rgba(45, 45, 45, 0.3);
}

.ale-sb-card:active {
	transform: scale(0.985);
}

.ale-sb-card-media {
	display: block;
	position: relative;
	aspect-ratio: 4 / 3;
	background: #e8e5e1;
}

.ale-sb-card-media img {
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	width: 100%;
	display: block;
	opacity: 0;
	transition: opacity 0.2s ease, transform 0.6s var(--sb-ease);
}

.ale-sb-card-media img.is-loaded {
	opacity: 1;
}

.ale-sb-card:hover .ale-sb-card-media img {
	transform: scale(1.04);
}

/* Gradient anchored to the label edge so the photo stays vibrant. */

.ale-sb-card-media::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to top,
		rgba(17, 17, 17, 0.72) 0%,
		rgba(17, 17, 17, 0.24) 42%,
		transparent 68%
	);
	pointer-events: none;
}

.ale-sb-card .ale-sb-card-label {
	position: absolute;
	left: 12px;
	right: 12px;
	bottom: 10px;
	font-size: 15px;
	font-weight: 700;
	color: #ffffff;
	text-shadow: 0 1px 2px rgba(17, 17, 17, 0.35);
	pointer-events: none;
}

.ale-sb-card.is-plain {
	grid-column: 1 / -1;
	min-height: 56px;
	display: flex;
	align-items: center;
	padding: 14px 16px;
}

.ale-sb-card.is-plain .ale-sb-card-label {
	position: static;
	color: #2d2d2d;
	text-shadow: none;
	pointer-events: auto;
}

.ale-sb-card[aria-pressed='true'] {
	box-shadow: 0 0 0 2px #d13e00, 0 10px 24px -12px rgba(209, 62, 0, 0.35);
}

.ale-sb-card[aria-pressed='true']::after {
	content: '';
	position: absolute;
	top: 10px;
	right: 10px;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background-color: #d13e00;
	background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27white%27 stroke-width=%273.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M20 6 9 17l-5-5%27/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 13px;
	box-shadow: 0 2px 6px rgba(17, 17, 17, 0.25);
	animation: sb-check-pop 0.3s var(--sb-pop) both;
	z-index: 1;
}

.ale-sb-card.is-plain[aria-pressed='true']::after {
	top: 50%;
	margin-top: -13px;
}

@keyframes sb-check-pop {
	from {
		transform: scale(0.5);
		opacity: 0;
	}
	to {
		transform: scale(1);
		opacity: 1;
	}
}

/* On phones the image cards become compact rows: 44px thumb + label + check.
   Halves the scroll depth of the destination step and reads native. */

@media (max-width: 699px) {
	.ale-sb-cards {
		gap: 8px;
		margin-top: 14px;
	}

	.ale-sb-card {
		display: flex;
		align-items: center;
		gap: 12px;
		padding: 8px 12px 8px 8px;
		min-height: 60px;
	}

	.ale-sb-card:hover {
		transform: none;
	}

	.ale-sb-card-media {
		width: 44px;
		height: 44px;
		flex: 0 0 auto;
		border-radius: 8px;
		overflow: hidden;
	}

	.ale-sb-card-media img,
	.ale-sb-card:hover .ale-sb-card-media img {
		width: 100%;
		height: 100%;
		aspect-ratio: auto;
		-o-object-fit: cover;
		   object-fit: cover;
		transform: none;
	}

	.ale-sb-card-media::after {
		display: none;
	}

	.ale-sb-card .ale-sb-card-label {
		position: static;
		color: #2d2d2d;
		text-shadow: none;
		font-size: 14.5px;
		line-height: 1.3;
		flex: 1;
	}

	.ale-sb-card[aria-pressed='true']::after {
		position: static;
		margin-left: auto;
		flex: 0 0 auto;
		width: 22px;
		height: 22px;
		font-size: 12px;
	}

	.ale-sb-card.is-plain {
		min-height: 52px;
		padding: 8px 12px;
	}

	.ale-sb-card.is-plain[aria-pressed='true']::after {
		margin-top: 0;
	}
}

/* ------------------------------------------------------------- radio options */

.ale-sb-opts {
	display: grid;
	gap: 10px;
	margin-top: 20px;
}

.ale-sb-opt {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	border: 1.5px solid #e8e5e1;
	border-radius: 10px;
	padding: 14px 16px;
	cursor: pointer;
	background: #ffffff;
	transition: border-color 0.2s var(--sb-ease),
		background 0.2s var(--sb-ease), transform 0.2s var(--sb-ease);
	margin: 0;
}

.ale-sb-opt:hover {
	border-color: #cfcac4;
	transform: translateY(-1px);
}

.ale-sb-opt input {
	margin-top: 4px;
	accent-color: #d13e00;
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
}

.ale-sb-opt-label {
	display: block;
	font-weight: 700;
	color: #2d2d2d;
	font-size: 15.5px;
}

.ale-sb-opt-hint {
	display: block;
	font-size: 13.5px;
	color: #686461;
}

.ale-sb-opt.is-selected {
	border-color: #d13e00;
	background: #fff7f3;
}

/* ------------------------------------------------------------------- chips */

.ale-sb-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 16px;
}

.ale-sb-chip {
	border: 1.5px solid #e8e5e1;
	background: #ffffff;
	border-radius: 999px;
	padding: 10px 18px;
	font-size: 14.5px;
	font-weight: 700;
	color: #343434;
	cursor: pointer;
	font-family: inherit;
	min-height: 44px;
	transition: border-color 0.2s var(--sb-ease),
		background 0.2s var(--sb-ease), color 0.2s var(--sb-ease),
		transform 0.2s var(--sb-ease);
}

.ale-sb-chip:hover {
	border-color: #cfcac4;
	transform: translateY(-1px);
}

.ale-sb-chip:active {
	transform: scale(0.97);
}

.ale-sb-chip[aria-pressed='true'] {
	border-color: #d13e00;
	background: #fff7f3;
	color: #bc3800;
}

/* ---------------------------------------------------------------- steppers */

.ale-sb-pair {
	display: flex;
	gap: 24px;
	flex-wrap: wrap;
	margin-top: 26px;
}

.ale-sb-pair:first-child {
	margin-top: 4px;
}

.ale-sb-body > .ale-sb-field + .ale-sb-pair,
.ale-sb-body > .ale-sb-pair + .ale-sb-pair {
	margin-top: 30px;
}

@media (min-width: 960px) {
	.ale-sb-body > .ale-sb-field + .ale-sb-pair,
	.ale-sb-body > .ale-sb-pair + .ale-sb-pair {
		margin-top: 38px;
	}
}

.ale-sb-pair .ale-sb-field {
	flex: 1 1 140px;
	margin-top: 0 !important;
}

.ale-sb-pair .ale-sb-q {
	font-size: 15px;
	font-weight: 700;
}

.ale-sb-stepper {
	display: flex;
	align-items: center;
	border: 1.5px solid #e8e5e1;
	border-radius: 10px;
	overflow: hidden;
	width: -moz-max-content;
	width: max-content;
	margin-top: 10px;
}

.ale-sb-stepper button {
	width: 48px;
	height: 48px;
	border: 0;
	background: #faf9f7;
	font-size: 22px;
	font-weight: 400;
	color: #2d2d2d;
	cursor: pointer;
	font-family: inherit;
	transition: background 0.15s var(--sb-ease);
}

.ale-sb-stepper button:hover {
	background: #f4f3f1;
}

.ale-sb-stepper button:active {
	background: #eceae6;
}

.ale-sb-stepper button:disabled {
	cursor: not-allowed;
}

.ale-sb-stepper output {
	min-width: 64px;
	text-align: center;
	font-weight: 900;
	font-size: 17px;
	color: #2d2d2d;
}

.ale-sb-nights-row {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
	margin-top: 10px;
}

.ale-sb-nights-row .ale-sb-stepper {
	margin-top: 0;
	transition: opacity 0.2s var(--sb-ease), filter 0.2s var(--sb-ease);
}

.ale-sb-nights-row .ale-sb-check {
	align-items: center;
	min-height: 48px;
}

.ale-sb-nights-row .ale-sb-check input {
	margin-top: 0;
}

.ale-sb-nights-field.is-unsure .ale-sb-stepper {
	opacity: 0.38;
	filter: grayscale(1);
}

@media (max-width: 959px) {
	.ale-sb-nights-row {
		flex-wrap: nowrap;
		gap: 10px;
	}

	.ale-sb-nights-row .ale-sb-stepper button {
		width: 42px;
	}

	.ale-sb-nights-row .ale-sb-stepper output {
		min-width: 48px;
	}

	.ale-sb-nights-row > [data-field-key] {
		min-width: 0;
	}

	.ale-sb-nights-row .ale-sb-check {
		gap: 8px;
		font-size: 13.5px;
		white-space: nowrap;
	}
}

/* ---------------------------------------------------------------- checkbox */

.ale-sb-check {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 14.5px;
	color: #343434;
	cursor: pointer;
	margin: 0;
	min-height: 44px;
}

.ale-sb-check input {
	width: 18px;
	height: 18px;
	margin-top: 3px;
	accent-color: #d13e00;
	flex: 0 0 auto;
}

/* ------------------------------------------------- currency + inclusion note */

.ale-sb-ccy {
	display: flex;
	gap: 6px;
	margin: 16px 0 4px;
}

.ale-sb-ccy button {
	border: 1.5px solid #e8e5e1;
	background: #ffffff;
	border-radius: 8px;
	padding: 6px 14px;
	font-size: 13px;
	font-weight: 700;
	color: #686461;
	cursor: pointer;
	font-family: inherit;
	min-height: 36px;
	transition: border-color 0.2s var(--sb-ease), color 0.2s var(--sb-ease),
		background 0.2s var(--sb-ease);
}

.ale-sb-ccy button:hover {
	border-color: #cfcac4;
}

.ale-sb-ccy button[aria-pressed='true'] {
	border-color: #d13e00;
	color: #bc3800;
	background: #fff7f3;
}

.ale-sb-flag {
	font-size: 15px;
	margin-right: 7px;
	vertical-align: -1px;
}

.ale-sb-inc {
	margin: 14px 0 0;
	font-size: 13.5px;
	color: #686461;
	background: #faf9f7;
	border: 1px solid #f0eeea;
	border-radius: 8px;
	padding: 12px 14px;
}

/* ------------------------------------------------------------------ inputs */

.ale-sb-label {
	display: block;
	font-weight: 700;
	font-size: 15px;
	color: #2d2d2d;
	margin-bottom: 6px;
}

.ale-sb-label small {
	font-weight: 400;
	color: #686461;
}

.ale-sb input[type='text'],
.ale-sb input[type='email'],
.ale-sb input[type='tel'],
.ale-sb input[type='number'],
.ale-sb input[type='date'],
.ale-sb select {
	font-family: inherit;
	font-size: 16px;
	color: #2d2d2d;
	padding: 12px 14px;
	border: 1.5px solid #d8d4cf;
	border-radius: 8px;
	background: #ffffff;
	width: 100%;
	box-sizing: border-box;
	/* Explicit height: a select's intrinsic height differs from a text
	   input's, so min-height alone leaves paired controls uneven. */
	height: 48px;
	transition: border-color 0.2s var(--sb-ease),
		box-shadow 0.2s var(--sb-ease);
}

.ale-sb input[type='text']:hover,
.ale-sb input[type='email']:hover,
.ale-sb input[type='tel']:hover,
.ale-sb input[type='number']:hover,
.ale-sb input[type='date']:hover,
.ale-sb select:hover {
	border-color: #bcb7b0;
}

/* Text-ish controls only: radios, checkboxes and the range slider carry
   their own affordances and must not get a box ring. */

.ale-sb input[type='text']:focus,
.ale-sb input[type='email']:focus,
.ale-sb input[type='tel']:focus,
.ale-sb input[type='number']:focus,
.ale-sb input[type='date']:focus,
.ale-sb select:focus {
	outline: none;
	border-color: #d13e00;
	box-shadow: 0 0 0 3px rgba(209, 62, 0, 0.12);
}

.ale-sb button:focus-visible,
.ale-sb .ale-sb-card:focus-visible,
.ale-sb .ale-sb-chip:focus-visible {
	outline: 2px solid #d13e00;
	outline-offset: 2px;
}

.ale-sb-field.has-error input,
.ale-sb-field.has-error select {
	border-color: #a3341c;
}

.ale-sb-fh {
	font-size: 13px;
	color: #686461;
	margin: 6px 0 0;
}

/* ------------------------------------------------------------------ review */

.ale-sb-review dl {
	margin: 20px 0 0;
	border: 1px solid #eceae6;
	border-radius: 10px;
	overflow: hidden;
}

.ale-sb-rrow {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 14px 18px;
	border-bottom: 1px solid #f0eeea;
	background: #ffffff;
	transition: background 0.15s var(--sb-ease);
}

.ale-sb-rrow:hover {
	background: #faf9f7;
}

.ale-sb-rrow:last-child {
	border-bottom: 0;
}

.ale-sb-rrow dt {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #9a958f;
	flex: 0 0 96px;
	padding-top: 3px;
	margin: 0;
}

.ale-sb-rrow dd {
	flex: 1;
	font-size: 15px;
	color: #2d2d2d;
	font-weight: 700;
	margin: 0;
}

.ale-sb-rrow button {
	flex: 0 0 auto;
	font-size: 13.5px;
	font-weight: 700;
	color: #bc3800;
	background: none;
	border: 0;
	cursor: pointer;
	text-decoration: underline;
	text-underline-offset: 3px;
	font-family: inherit;
	align-self: flex-start;
	padding: 2px 0;
}

.ale-sb-vh {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ------------------------------------------------------------------ footer */

.ale-sb-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 20px;
	background: #ffffff;
	border-top: 1px solid #f0eeea;
	padding-bottom: calc(12px + env(safe-area-inset-bottom));
}

@media (min-width: 960px) {
	.ale-sb-foot {
		background: none;
		border-top: 0;
		padding: 12px 48px 28px;
	}
}

.ale-sb-back {
	background: none;
	border: 0;
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	color: #686461;
	cursor: pointer;
	text-decoration: underline;
	text-underline-offset: 3px;
	padding: 12px 0;
	transition: color 0.15s var(--sb-ease);
}

.ale-sb-back:hover {
	color: #2d2d2d;
}

.ale-sb-next {
	background: #d13e00;
	color: #ffffff;
	border: 0;
	border-radius: 10px;
	font-family: inherit;
	font-size: 16.5px;
	font-weight: 900;
	padding: 16px 32px;
	cursor: pointer;
	box-shadow: 0 2px 4px rgba(188, 56, 0, 0.12),
		0 12px 28px -12px rgba(188, 56, 0, 0.45);
	transition: background 0.2s var(--sb-ease), transform 0.2s var(--sb-ease),
		box-shadow 0.2s var(--sb-ease);
	flex: 1;
	max-width: 100%;
}

@media (min-width: 960px) {
	.ale-sb-next {
		flex: 0 0 auto;
	}
}

.ale-sb-next:hover {
	background: #bc3800;
	transform: translateY(-1px);
	box-shadow: 0 2px 4px rgba(188, 56, 0, 0.14),
		0 16px 32px -12px rgba(188, 56, 0, 0.5);
}

.ale-sb-next:active {
	transform: scale(0.98);
}

.ale-sb-next:disabled {
	opacity: 0.7;
	cursor: default;
	transform: none;
}

/* ---------------------------------------------------------------- honeypot */

.ale-sb-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	opacity: 0;
}

/* ------------------------------------------------------------ confirmation */

.ale-sb-done {
	max-width: 560px;
}

.ale-sb-done-badge {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #eaf4ec;
	display: grid;
	place-items: center;
	margin-bottom: 20px;
	animation: sb-check-pop 0.4s var(--sb-pop) both;
}

.ale-sb-done-badge::before {
	content: '';
	width: 22px;
	height: 12px;
	border-left: 3px solid #3e7d4e;
	border-bottom: 3px solid #3e7d4e;
	transform: rotate(-45deg) translate(1px, -2px);
}

.ale-sb-ref {
	display: inline-block;
	margin-top: 12px;
	background: #faf9f7;
	border: 1px solid #f0eeea;
	border-radius: 8px;
	padding: 6px 14px;
	font-weight: 900;
	letter-spacing: 0.06em;
	color: #2d2d2d;
	font-size: 14px;
}

.ale-sb-done-links {
	margin-top: 24px;
	display: grid;
	gap: 10px;
	padding-bottom: 32px;
}

.ale-sb-done-links a {
	display: flex;
	align-items: center;
	gap: 14px;
	border: 1.5px solid #e8e5e1;
	border-radius: 10px;
	padding: 14px 18px;
	text-decoration: none;
	color: #2d2d2d;
	font-weight: 700;
	font-size: 15.5px;
	transition: border-color 0.2s var(--sb-ease),
		transform 0.2s var(--sb-ease), box-shadow 0.2s var(--sb-ease);
}

.ale-sb-done-links a:hover {
	border-color: #d13e00;
	transform: translateY(-1px);
	box-shadow: 0 10px 24px -14px rgba(45, 45, 45, 0.25);
}

.ale-sb-done-links em {
	display: block;
	font-style: normal;
	font-weight: 400;
	font-size: 13px;
	color: #686461;
}

/* ------------------------------------------------------------- small phones */

@media (max-width: 400px) {
	.ale-sb-body {
		padding: 20px 18px 8px;
	}

	.ale-sb-mhead {
		padding: 20px 18px 0;
	}

	.ale-sb-foot {
		padding-left: 18px;
		padding-right: 18px;
	}

	.ale-sb-cards {
		gap: 10px;
	}
}

/* ------------------------------------------------------------ travel dates */

.ale-sb-datetrigger {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	min-height: 48px;
	padding: 12px 14px;
	border: 1.5px solid #d8d4cf;
	border-radius: 8px;
	background: #ffffff;
	font-family: inherit;
	font-size: 15.5px;
	font-weight: 700;
	color: #9a958f;
	cursor: pointer;
	text-align: left;
	transition: border-color 0.2s var(--sb-ease), box-shadow 0.2s var(--sb-ease);
}

.ale-sb-datetrigger svg {
	flex: 0 0 auto;
	color: #bc3800;
}

.ale-sb-datetrigger:hover {
	border-color: #bcb7b0;
}

.ale-sb-datetrigger.has-value {
	color: #2d2d2d;
}

/* Calendar (react-day-picker), ALE tokens */

.ale-sb-cal {
	padding: 8px 16px 14px;
}

.ale-sb-cal .rdp {
	--rdp-cell-size: 40px;
	--rdp-accent-color: #d13e00;
	--rdp-background-color: #fff7f3;
	margin: 8px 0 0;
}

.ale-sb-cal .rdp-months {
	justify-content: center;
	gap: 28px;
}

.ale-sb-cal .rdp-caption_label {
	font-size: 15px;
	font-weight: 900;
	color: #2d2d2d;
}

.ale-sb-cal .rdp-nav_button {
	width: 34px;
	height: 34px;
	border-radius: 8px;
	color: #686461;
}

.ale-sb-cal .rdp-nav_button:hover {
	background: #f4f3f1;
	color: #2d2d2d;
}

.ale-sb-cal .rdp-head_cell {
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: #9a958f;
	text-transform: uppercase;
}

.ale-sb-cal .rdp-day {
	border-radius: 8px;
	font-size: 14.5px;
	font-weight: 700;
	color: #343434;
	/* Smaller than the 40px cell so the selected fill gets air on all
	   sides instead of touching the neighbouring rows. */
	width: 34px;
	height: 34px;
	max-width: 34px;
	margin: 3px auto;
}

.ale-sb-cal .rdp-day:hover:not([disabled]):not(.rdp-day_selected) {
	background: #f4f3f1;
}

.ale-sb-cal .rdp-day_today:not(.rdp-day_selected) {
	color: #bc3800;
}

.ale-sb-cal .rdp-day_selected,
.ale-sb-cal .rdp-day_selected:hover {
	background: #d13e00;
	color: #ffffff;
}

.ale-sb-cal .ale-sb-cal-middle,
.ale-sb-cal .ale-sb-cal-middle:hover {
	background: #fff7f3;
	color: #bc3800;
	border-radius: 0;
}

.ale-sb-cal .ale-sb-cal-start {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.ale-sb-cal .ale-sb-cal-end {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

/* A lone arrival day is both range start and end; without this it loses
   every corner and renders as a hard square. */

.ale-sb-cal .ale-sb-cal-start.ale-sb-cal-end {
	border-radius: 8px;
}

.ale-sb-cal .rdp-day_disabled {
	color: #cfcac4;
	font-weight: 400;
}

.ale-sb-cal-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 10px;
	padding-top: 12px;
	border-top: 1px solid #f0eeea;
	font-size: 13px;
	color: #686461;
}

.ale-sb-cal-done {
	background: #2f353b;
	color: #ffffff;
	border: 0;
	border-radius: 8px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 700;
	padding: 10px 20px;
	cursor: pointer;
	transition: background 0.15s var(--sb-ease);
}

.ale-sb-cal-done:hover {
	background: #22272c;
}

/* Desktop dialog */

.ale-sb-datedialog {
	position: fixed;
	inset: 0;
	z-index: 90;
	background: rgba(17, 17, 17, 0.4);
	display: grid;
	place-items: center;
	padding: 24px;
	animation: sb-fade 0.2s ease-out both;
}

@keyframes sb-fade {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

.ale-sb-datedialog-card {
	background: #ffffff;
	border-radius: 14px;
	box-shadow: 0 2px 6px rgba(17, 17, 17, 0.08),
		0 32px 80px -24px rgba(17, 17, 17, 0.45);
	max-width: 720px;
	width: 100%;
	animation: sb-rise 0.32s var(--sb-ease) both;
}

@keyframes sb-rise {
	from {
		opacity: 0;
		transform: translateY(14px) scale(0.985);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

/* Bottom sheet (vaul) */

.ale-sb-drawer-overlay {
	position: fixed;
	inset: 0;
	z-index: 90;
	background: rgba(17, 17, 17, 0.4);
}

.ale-sb-drawer {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 91;
	background: #ffffff;
	border-radius: 16px 16px 0 0;
	box-shadow: 0 -12px 40px rgba(17, 17, 17, 0.25);
	padding-bottom: env(safe-area-inset-bottom);
	outline: none;
}

.ale-sb-drawer-handle {
	width: 40px;
	height: 4px;
	border-radius: 2px;
	background: #e8e5e1;
	margin: 10px auto 0;
}

.ale-sb-drawer-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 20px 0;
}

.ale-sb-drawer-head h2,
.ale-sb-drawer-head p {
	font-size: 17px;
	font-weight: 900;
	color: #2d2d2d;
	margin: 0;
}

.ale-sb-drawer-head button {
	width: 36px;
	height: 36px;
	border: 0;
	border-radius: 50%;
	background: #f4f3f1;
	color: #686461;
	display: grid;
	place-items: center;
	cursor: pointer;
}

/* ----------------------------------------------------------------- consent */

.ale-sb-consent {
	background: #faf9f7;
	border: 1px solid #f0eeea;
	border-radius: 8px;
	padding: 12px 14px;
	display: grid;
	gap: 10px;
}

.ale-sb-consent details {
	font-size: 13px;
	color: #686461;
	line-height: 1.55;
}

.ale-sb-consent summary {
	cursor: pointer;
	font-weight: 700;
	color: #686461;
	font-size: 13px;
	list-style-position: inside;
}

.ale-sb-consent summary:hover {
	color: #2d2d2d;
}

.ale-sb-consent details p {
	margin: 8px 0 0;
}

/* ----------------------------------------------------------- budget slider */

.ale-sb-slider {
	margin-top: 28px;
	padding: 0 4px;
}

.ale-sb-slider-pill-row {
	position: relative;
	height: 40px;
	margin: 0 12px;
}

.ale-sb-slider-pill {
	position: absolute;
	transform: translateX(-50%);
	bottom: 6px;
	background: #f4f3f1;
	color: #686461;
	border-radius: 999px;
	padding: 7px 16px;
	font-size: 15px;
	font-weight: 900;
	white-space: nowrap;
	transition: left 0.06s linear, background 0.2s var(--sb-ease),
		color 0.2s var(--sb-ease);
}

.ale-sb-slider-pill.is-set {
	background: #d13e00;
	color: #ffffff;
	box-shadow: 0 8px 20px -8px rgba(188, 56, 0, 0.55);
}

.ale-sb-range {
	-moz-appearance: none;
	     appearance: none;
	-webkit-appearance: none;
	width: 100%;
	height: 28px;
	background: transparent;
	cursor: pointer;
	margin: 0;
}

.ale-sb-range::-webkit-slider-runnable-track {
	height: 4px;
	border-radius: 2px;
	background: linear-gradient(
		to right,
		#d13e00 0%,
		#d13e00 var(--sb-fill, 50%),
		#e8e5e1 var(--sb-fill, 50%),
		#e8e5e1 100%
	);
}

.ale-sb-range::-moz-range-track {
	height: 4px;
	border-radius: 2px;
	background: #e8e5e1;
}

.ale-sb-range::-moz-range-progress {
	height: 4px;
	border-radius: 2px;
	background: #d13e00;
}

.ale-sb-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: #d13e00;
	border: 4px solid #ffffff;
	box-shadow: 0 1px 3px rgba(45, 45, 45, 0.3),
		0 6px 16px -6px rgba(188, 56, 0, 0.5);
	margin-top: -12px;
	-webkit-transition: transform 0.15s var(--sb-ease);
	transition: transform 0.15s var(--sb-ease);
}

.ale-sb-range::-webkit-slider-thumb:hover {
	transform: scale(1.08);
}

.ale-sb-range:active::-webkit-slider-thumb {
	transform: scale(1.15);
}

.ale-sb-range::-moz-range-thumb {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #d13e00;
	border: 4px solid #ffffff;
	box-shadow: 0 1px 3px rgba(45, 45, 45, 0.3),
		0 6px 16px -6px rgba(188, 56, 0, 0.5);
}

.ale-sb-range:focus {
	outline: none;
}

.ale-sb-range:focus-visible::-webkit-slider-thumb {
	box-shadow: 0 0 0 4px rgba(209, 62, 0, 0.25),
		0 1px 3px rgba(45, 45, 45, 0.3);
}

.ale-sb-range:focus-visible::-moz-range-thumb {
	box-shadow: 0 0 0 4px rgba(209, 62, 0, 0.25),
		0 1px 3px rgba(45, 45, 45, 0.3);
}

.ale-sb-slider-ends {
	display: flex;
	justify-content: space-between;
	margin-top: 6px;
}

.ale-sb-slider-ends span {
	font-size: 14px;
	font-weight: 900;
	color: #2d2d2d;
}

.ale-sb-slider-ends em {
	display: block;
	font-style: normal;
	font-weight: 400;
	font-size: 12px;
	color: #9a958f;
}

.ale-sb-slider-ends span:last-child {
	text-align: right;
}

.ale-sb-slider-escape {
	display: block;
	margin: 18px auto 0;
	background: none;
	border: 0;
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 700;
	color: #686461;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
	transition: color 0.15s var(--sb-ease);
}

.ale-sb-slider-escape:hover {
	color: #2d2d2d;
}

.ale-sb-slider-escape.is-active {
	color: #bc3800;
}

/* Steppers sit side by side on phones; the labels are short enough. */

@media (max-width: 959px) {
	.ale-sb-pair:has(.ale-sb-stepper) {
		flex-wrap: nowrap;
		gap: 16px;
	}
}

/* ------------------------------------------------------------ phone (iti) */

/* intl-tel-input ships its own skin; these rules restate it in the form's
   own vocabulary (Lato, warm neutrals, 8/10px radii, orange accent) so the
   control reads as part of the wizard rather than a bolted-on widget.
   Selectors match v29's real DOM: the dropdown is .iti__country-selector
   nested in .iti__country-container, not a body-level container. */

.ale-sb .iti {
	--iti-hover-color: transparent;
	width: 100%;
	display: block;
	border: 1.5px solid #d8d4cf;
	border-radius: 8px;
	background: #ffffff;
	transition: border-color 0.2s var(--sb-ease),
		box-shadow 0.2s var(--sb-ease);
}

.ale-sb .iti:hover {
	border-color: #bcb7b0;
}

.ale-sb .iti:focus-within {
	border-color: #d13e00;
	box-shadow: 0 0 0 3px rgba(209, 62, 0, 0.12);
}

.ale-sb .iti input[type='tel'] {
	height: 45px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	box-shadow: none;
}

.ale-sb .iti input[type='tel']:hover,
.ale-sb .iti input[type='tel']:focus {
	border: 0;
	box-shadow: none;
}

.ale-sb-field.has-error .iti {
	border-color: #a3341c;
}

/* No hardcoded padding: iti measures the country button and sets the inline
   padding itself, which is the only thing that fits +1 and +971 alike. */

.ale-sb .iti__country-container {
	padding: 4px;
	inset-inline-start: 0;
}

.ale-sb .iti__selected-country {
	border-radius: 6px;
	background: transparent;
	padding: 0 10px;
}

.ale-sb .iti__selected-country:hover,
.ale-sb .iti__selected-country:focus-visible,
.ale-sb .iti__selected-country-primary:hover {
	background: transparent;
}

/* Each animated step child is a stacking context. Lift the phone block so an
   open country panel always paints above the fields that follow it. */

.ale-sb-field[data-field-key='sb_phone'] {
	position: relative;
	z-index: 20;
}

/* The dial code and the typed number are one value, so they share one type
   treatment — a bolder prefix reads as two different fields. */

.ale-sb .iti__selected-dial-code {
	font-size: 16px;
	font-weight: 400;
	color: #2d2d2d;
	margin-inline-start: 8px;
}

.ale-sb .iti__arrow {
	border-top-color: #9a958f;
	margin-inline-start: 8px;
}

.ale-sb .iti__arrow--up {
	border-bottom-color: #9a958f;
}

/* Panel */

/* The library sizes the panel itself; restyling the search and list padding
   makes the content taller than that box, and the overflowing rows paint
   outside the panel's background. A flex column keeps the list inside it. */

/* Only the open panel is a flex column: .iti__hide is how the library closes
   it, and a bare `display: flex` here out-specifies that and leaves the list
   on screen intercepting clicks. */

.ale-sb .iti__country-selector:not(.iti__hide),
.iti--fullscreen-popup .iti__country-selector:not(.iti__hide) {
	display: flex;
	flex-direction: column;
}

.ale-sb .iti__country-selector.iti__hide,
.iti--fullscreen-popup .iti__country-selector.iti__hide {
	display: none;
}

.ale-sb .iti__country-selector,
.iti--fullscreen-popup .iti__country-selector {
	z-index: 30;
	background: #ffffff;
	border: 1.5px solid #e8e5e1;
	border-radius: 10px;
	box-shadow: 0 1px 2px rgba(45, 45, 45, 0.04),
		0 18px 40px -14px rgba(45, 45, 45, 0.3);
	overflow: hidden;
	margin-top: 8px;
	padding: 0;
}

/* Search */

.ale-sb .iti__search-input-wrapper,
.iti--fullscreen-popup .iti__search-input-wrapper {
	flex: 0 0 auto;
	padding: 10px 12px;
	border-bottom: 1px solid #f0eeea;
	background: #ffffff;
}

.ale-sb .iti__search-input,
.iti--fullscreen-popup .iti__search-input {
	font-family: inherit;
	font-size: 15px;
	color: #2d2d2d;
	height: 40px;
	padding: 0 10px 0 34px;
	border: 1.5px solid #e8e5e1;
	border-radius: 8px;
	background: #faf9f7;
	width: 100%;
	box-sizing: border-box;
	transition: border-color 0.15s var(--sb-ease),
		box-shadow 0.15s var(--sb-ease), background 0.15s var(--sb-ease);
}

/* The default focus ring is the browser blue; use the form's own. */

.ale-sb .iti__search-input:focus,
.iti--fullscreen-popup .iti__search-input:focus {
	outline: none;
	background: #ffffff;
	border-color: #d13e00;
	box-shadow: 0 0 0 3px rgba(209, 62, 0, 0.12);
}

.ale-sb .iti__search-input::-moz-placeholder, .iti--fullscreen-popup .iti__search-input::-moz-placeholder {
	color: #9a958f;
}

.ale-sb .iti__search-input::placeholder,
.iti--fullscreen-popup .iti__search-input::placeholder {
	color: #9a958f;
}

.ale-sb .iti__search-icon,
.iti--fullscreen-popup .iti__search-icon {
	color: #9a958f;
	inset-inline-start: 22px;
}

/* Rows */

.ale-sb .iti__country-list,
.iti--fullscreen-popup .iti__country-list {
	flex: 1 1 auto;
	min-height: 0;
	padding: 6px;
	max-height: none;
	scrollbar-width: thin;
	scrollbar-color: #e8e5e1 transparent;
}

.ale-sb .iti__country-list::-webkit-scrollbar,
.iti--fullscreen-popup .iti__country-list::-webkit-scrollbar {
	width: 8px;
}

.ale-sb .iti__country-list::-webkit-scrollbar-thumb,
.iti--fullscreen-popup .iti__country-list::-webkit-scrollbar-thumb {
	background: #e8e5e1;
	border-radius: 4px;
}

.ale-sb .iti__country,
.iti--fullscreen-popup .iti__country {
	padding: 10px 12px;
	border-radius: 8px;
	font-size: 15px;
	color: #343434;
	gap: 12px;
	min-height: 44px;
	align-items: center;
}

.ale-sb .iti__country.iti__highlight,
.iti--fullscreen-popup .iti__country.iti__highlight {
	background: #fff7f3;
	color: #bc3800;
}

.ale-sb .iti__country-name,
.iti--fullscreen-popup .iti__country-name {
	font-weight: 700;
}

.ale-sb .iti__dial-code,
.iti--fullscreen-popup .iti__dial-code {
	color: #9a958f;
	font-weight: 400;
}

.ale-sb .iti__country[aria-selected='true'] .iti__country-name,
.iti--fullscreen-popup .iti__country[aria-selected='true'] .iti__country-name {
	color: #bc3800;
}

.ale-sb .iti__no-results,
.iti--fullscreen-popup .iti__no-results {
	padding: 16px;
	font-size: 14.5px;
	color: #9a958f;
}

/* ----------------------------------------------------------------- consent */

.ale-sb-consent {
	background: #faf9f7;
	border: 1px solid #f0eeea;
	border-radius: 8px;
	padding: 12px 14px;
	display: grid;
	gap: 10px;
}

.ale-sb-consent details {
	font-size: 13px;
	color: #686461;
	line-height: 1.55;
}

.ale-sb-consent summary {
	cursor: pointer;
	font-weight: 700;
	color: #686461;
	font-size: 13px;
	list-style-position: inside;
}

.ale-sb-consent summary:hover {
	color: #2d2d2d;
}

.ale-sb-consent details p {
	margin: 8px 0 0;
}

/* ----------------------------------------------------------- budget slider */

.ale-sb-slider {
	margin-top: 28px;
	padding: 0 4px;
}

.ale-sb-slider-pill-row {
	position: relative;
	height: 40px;
	margin: 0 12px;
}

.ale-sb-slider-pill {
	position: absolute;
	transform: translateX(-50%);
	bottom: 6px;
	background: #f4f3f1;
	color: #686461;
	border-radius: 999px;
	padding: 7px 16px;
	font-size: 15px;
	font-weight: 900;
	white-space: nowrap;
	transition: left 0.06s linear, background 0.2s var(--sb-ease),
		color 0.2s var(--sb-ease);
}

.ale-sb-slider-pill.is-set {
	background: #d13e00;
	color: #ffffff;
	box-shadow: 0 8px 20px -8px rgba(188, 56, 0, 0.55);
}

.ale-sb-range {
	-moz-appearance: none;
	     appearance: none;
	-webkit-appearance: none;
	width: 100%;
	height: 28px;
	background: transparent;
	cursor: pointer;
	margin: 0;
}

.ale-sb-range::-webkit-slider-runnable-track {
	height: 4px;
	border-radius: 2px;
	background: linear-gradient(
		to right,
		#d13e00 0%,
		#d13e00 var(--sb-fill, 50%),
		#e8e5e1 var(--sb-fill, 50%),
		#e8e5e1 100%
	);
}

.ale-sb-range::-moz-range-track {
	height: 4px;
	border-radius: 2px;
	background: #e8e5e1;
}

.ale-sb-range::-moz-range-progress {
	height: 4px;
	border-radius: 2px;
	background: #d13e00;
}

.ale-sb-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: #d13e00;
	border: 4px solid #ffffff;
	box-shadow: 0 1px 3px rgba(45, 45, 45, 0.3),
		0 6px 16px -6px rgba(188, 56, 0, 0.5);
	margin-top: -12px;
	-webkit-transition: transform 0.15s var(--sb-ease);
	transition: transform 0.15s var(--sb-ease);
}

.ale-sb-range::-webkit-slider-thumb:hover {
	transform: scale(1.08);
}

.ale-sb-range:active::-webkit-slider-thumb {
	transform: scale(1.15);
}

.ale-sb-range::-moz-range-thumb {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #d13e00;
	border: 4px solid #ffffff;
	box-shadow: 0 1px 3px rgba(45, 45, 45, 0.3),
		0 6px 16px -6px rgba(188, 56, 0, 0.5);
}

.ale-sb-range:focus {
	outline: none;
}

.ale-sb-range:focus-visible::-webkit-slider-thumb {
	box-shadow: 0 0 0 4px rgba(209, 62, 0, 0.25),
		0 1px 3px rgba(45, 45, 45, 0.3);
}

.ale-sb-range:focus-visible::-moz-range-thumb {
	box-shadow: 0 0 0 4px rgba(209, 62, 0, 0.25),
		0 1px 3px rgba(45, 45, 45, 0.3);
}

.ale-sb-slider-ends {
	display: flex;
	justify-content: space-between;
	margin-top: 6px;
}

.ale-sb-slider-ends span {
	font-size: 14px;
	font-weight: 900;
	color: #2d2d2d;
}

.ale-sb-slider-ends em {
	display: block;
	font-style: normal;
	font-weight: 400;
	font-size: 12px;
	color: #9a958f;
}

.ale-sb-slider-ends span:last-child {
	text-align: right;
}

.ale-sb-slider-escape {
	display: block;
	margin: 18px auto 0;
	background: none;
	border: 0;
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 700;
	color: #686461;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
	transition: color 0.15s var(--sb-ease);
}

.ale-sb-slider-escape:hover {
	color: #2d2d2d;
}

.ale-sb-slider-escape.is-active {
	color: #bc3800;
}

/* Steppers sit side by side on phones; the labels are short enough. */

@media (max-width: 959px) {
	.ale-sb-pair:has(.ale-sb-stepper) {
		flex-wrap: nowrap;
		gap: 16px;
	}
}

/* Nights when it is derived from an exact date range. */

.ale-sb-derived {
	display: flex;
	align-items: baseline;
	gap: 10px;
	margin: 10px 0 0;
	padding: 12px 16px;
	background: #faf9f7;
	border: 1px solid #f0eeea;
	border-radius: 8px;
}

.ale-sb-derived strong {
	font-size: 17px;
	font-weight: 900;
	color: #2d2d2d;
}

.ale-sb-derived span {
	font-size: 13.5px;
	color: #9a958f;
}

.ale-sb-inc--lead {
	margin: 16px 0 0;
}

/* A step headline sits above the first field, which then keeps its own
   smaller label rather than repeating the question. */

.ale-sb-stepq {
	margin-bottom: 4px;
}

.ale-sb-stepq + .ale-sb-pair,
.ale-sb-stepq + .ale-sb-field {
	margin-top: 18px;
}

