.one-time-invitation-modal {
  // .iti__flag {
  //   background-image: url("../../../assets/white-label-cfd-broker/sprite/flags_sprite.png");
  // }
  
  // @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  //   .iti__flag {
  //     background-image: url("../../../assets/white-label-cfd-broker/sprite/flags_sprite.png");
  //   }
  // }
  
  .iti__flag-box {
    width: max-content;
  }
  
  .iti__flag {
    // border-radius: 100%;
  }
  
  .iti {
    width: 100%;
    z-index: 10;
    display: flex;
    justify-content: flex-end;
  
    .iti__selected-dial-code {
      // color: white;
      // margin: 0 !important;
      // width: 40px;
      font-size: 21px;
      line-height: 36px;
      @include breakpoint-down('deskL') {
        font-size: 18px;
        line-height: 25.2px;
      }
      @include breakpoint-down('tabL') {
        font-size: 16px;
        line-height: 19.49px;
      }
      @include breakpoint-down('tabM') {
        font-size: 12px;
        line-height: 14.4px;
      }
    }
  
    .iti__country-list {
      background: #05060A;
      border-radius: 8px;
      border: 1px solid #9A9A9A;
      top: 100%;
      max-width: 400px;
      min-width: 400px;
      min-height: 304px;
      overflow-x: hidden;
      padding: 8px 0;
  
      @include breakpoint-down('tabM') {
        top: initial;
        max-width: none;
        min-width: auto;
        min-height: auto;
      }
  
      &::-webkit-scrollbar {
        width: 4px;
        background: transparent;
      }
  
      &::-webkit-scrollbar-thumb {
        background: rgba(59, 59, 59, 1);
        border-radius: 4px;
      }
    }
  
    .iti__country {
      padding: 12px 16px;
  
      .iti__flag-box {
        margin-right: 10px;
      }
  
      &:hover {
        background: rgba(28, 28, 28, 1);
  
        .iti__country-name {
          // color: rgba(255, 255, 255, 1);
        }
      }
  
      &.iti__active {
        background: rgba(19, 19, 19, 1);
  
        .iti__country-name {
          // color: #9A9A9A;
        }
      }
    }
  
    .iti__country-name {
      // color: #9A9A9A;
      display: inline-flex;
      white-space: initial;
    }
  
    .iti__dial-code {
      // color: white;
    }
  
    .iti__arrow {
      display: none;
      border: none;
      width: 16px;
      height: 16px;
      background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.46852 11.3799C7.74789 11.7059 8.25211 11.7059 8.53148 11.3799L13.0095 6.15555C13.3987 5.70148 13.0761 5 12.478 5H3.52195C2.92391 5 2.60127 5.70148 2.99047 6.15555L7.46852 11.3799Z' fill='white'/%3E%3C/svg%3E%0A");
      background-repeat: no-repeat;
      background-position: center center;
      background-size: contain;
      margin: 0 !important;
    }
  
    .iti__arrow--up {
      background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.46852 4.62006C7.74789 4.29413 8.25211 4.29413 8.53148 4.62006L13.0095 9.84445C13.3987 10.2985 13.0761 11 12.478 11H3.52195C2.92391 11 2.60127 10.2985 2.99047 9.84445L7.46852 4.62006Z' fill='white'/%3E%3C/svg%3E%0A");
    }
  
    .iti__selected-flag {
      padding: 12px 30px ;
      color: #445667;
      background: transparent;
      
      @include breakpoint-down('tabM') {
        padding: 12px;
      }
    }
  
    .iti__flag-container {
      position: static;
      border: 1px solid #445667;
      background-color: #F1F1F1;
      border-radius: 12px;
      width: fit-content;
      &:hover {
        .iti__selected-flag {
          background: transparent !important;
        }
      }
    }
  
    .inputFieldInput {
      padding: 27px 16px 9px 58px !important;
      margin-left: 148px;
      width: calc(100% - 148px);
  
      @include breakpoint-down('deskS') {
        font-size: 15px;
      }
  
      @include breakpoint-down('mobM') {
        font-size: 14px;
        padding: 20px 16px 3px 54px !important;
        margin-left: 128px !important;
        width: calc(100% - 128px);
      }
    }
  }
  
  .iti.iti--container {
    z-index: 101;
  
    @include breakpoint-down('tabM') {
      width: auto;
    }
  }
  
  .formFieldItemPhone {
  
    .inputField {
      &:hover {
        .inputFieldInput {
          background: #060606 !important;
        }
  
        // .iti__flag-container {
        //   background: #060606 !important;
        // }
      }
  
      .iti {
        .inputFieldInput {
          &:hover {
            background: #131313 !important;
          }
        }
  
        // .iti__flag-container {
        //   &:hover {
        //     background: #131313 !important;
  
        //     + .inputFieldInput {
        //       background: #060606 !important;
        //     }
        //   }
        // }
      }
    }
  
    .inputFieldIcon {
      z-index: 11;
      left: 164px;
  
      @include breakpoint-down('mobM') {
        left: 140px;
      }
    }
  
    .inputFieldLabel {
      z-index: 11;
      left: 206px;
  
      @include breakpoint-down('mobM') {
        left: 182px;
      }
    }
  }
}