/* stylelint-disable rule-empty-line-before */
/* stylelint-disable string-quotes */
/* stylelint-disable declaration-block-trailing-semicolon */
:root {
  /** General Style */
  --root--background: #141415;
  --profile--background: #141415;
  --body--background: #141415;
  --preloader-bg: #141415;
  
  --background-modal: #141415;

  --skeleton-base-color: #14131e;
  --skeleton-highlight-color: linear-gradient(90deg, rgb(27 25 40 / 26%), rgb(20 19 30 / 70%), rgb(27 25 40 / 55%));

  /* * Forms */
  --auth-forms-title-color: #fff;
  --auth-forms-bg: #1d1e20;
  --auth-forms-border: unset;
  --auth-forms-shadow: unset;

  --auth-forms__socialtitle-color: #fff;

  --auth-forms__button-success-bg: #3fbd53;
  --auth-forms__button-success-color: #fff;

  --auth-forms__button-forgot-bg: transparent;
  --auth-forms__button-forgot-color: #fff;

  --auth-forms__button-reg-color: #fff;
  --auth-forms__button-reg-bg: rgb(63 189 83);

  --auth-forms__input-bg: rgb(38 38 38);
  --auth-forms__tab-active-bg: #3fbd53;
  --auth-forms__tab-second-bg: #282829;

  --auth-forms__tab-active-border: unset;
  --auth-forms__tab-second-border: unset;
  --auth-forms__input-height: 50px;
  --auth-forms__input-placeholder-color: #ffffff90;


  /* * Verification */
  --verification-popup-bg: transparent;
  --verification-bg: #2b2740;
  --verification-shadow: none;

  --verification__content-title: #fff;
  --verification__content-text: #fff;

  --verification__button__send-color: #fff;
  --verification__button__send-bg: rgb(3 189 113);

  --verification__input-bg: rgb(217, 217, 217);
  --verification__input-color: #000;
  --verification__input-border: 1px solid transparent;
  --verification__input-border-active: 1px solid #4096ff;
  --verification__input-placeholder: rgba(121, 121, 121, 1);

  --verification__input-disable-bg: rgba(239, 239, 239, 0.3);
  --verification__input-disable-color: rgb(170, 170, 170);
  --verification__input-disable-border: 1px solid rgba(118, 118, 118, 0.3);

  --bonus-title-color:#fff;
  --bonus-win-color: #F9D679;
  --bonus-border: 2px solid #57bef8;
  --bonus-background: linear-gradient(180deg, #2071ac 0%, #090813 100%);
  --bonus-shadow: 0 3px 40px 0 rgb(64 121 176);
  --bonus-color: #fff;

  --cross-color: transparent;
  --cross-shadow:  transparent;

  --react-international-phone-flag-height: 33px;
  --react-international-phone-flag-width: 33px;
  --lang-button_border: none;
}

.roulette-section .show-form .title-win {
  font-weight: 800 !important;
  margin-bottom: 26px !important;
  font-size: 34px !important;
}

.roulette-section .show-form .title {
  margin-bottom: 21px !important;
  font-size: 10px !important;
}

.roulette-section .show-form .title-reg {
  color: #858DAB !important;
}

.roulette-section .show-form .bonus-in-form {
  display: none !important;
}

.auth-form_field input {
  border-radius: .5rem !important;
  color: #858DAB !important;
}

.react-international-phone-input-container .react-international-phone-input {
  border-radius: 0 .5rem .5rem 0 !important;
  border-left: none !important;
}

.react-international-phone-input-container .react-international-phone-input > button,
.react-international-phone-input-container .react-international-phone-country-selector > button {
  border-radius: .5rem 0 0 .5rem !important;
  background: transparent !important;
  border: none !important;
}

.react-international-phone-input-container .react-international-phone-country-selector {
  border-radius: .5rem 0 0 .5rem !important;
}

.auth-form_wrapper .auth-form_field input:hover,
.auth-form_wrapper .react-international-phone-input-container:hover .react-international-phone-input > button,
.auth-form_wrapper .react-international-phone-input-container:hover .react-international-phone-country-selector > button,
.auth-form_wrapper .auth-form_field input:focus,
.auth-form_wrapper .react-international-phone-input-container .react-international-phone-input:focus > button,
.auth-form_wrapper .react-international-phone-input-container:has(.react-international-phone-input:focus) .react-international-phone-country-selector > button,
.auth-form_wrapper .auth-form_field .react-international-phone-input-container:has(.react-international-phone-country-selector > button:hover) input,
.auth-form_wrapper .auth-form_field .react-international-phone-input-container:hover input {
  box-shadow: unset !important;
}

.auth-form_field .InputPassword .input {
  box-shadow: unset !important;
}

.react-international-phone-country-selector-button__dropdown-arrow,
.roulette-section__link .icon-arrow {
  display: none !important;
}

.react-international-phone-flag-emoji {
  border-radius: 10px;
}

.auth-form-terms a:first-letter {
  text-transform: capitalize !important;
}

.auth-form .submit-button-disabled {
  background: #3fbd53 !important;
}

.auth-form_buttons .button {
  border-radius: .5rem !important;
  padding: unset !important;
  height: 48px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

.show-form_content {
  border-radius: 10px 10px 0 0 !important;
  margin-bottom: 0 !important;
}

.show-form .roulette-section__link {
  border: unset !important;
  border-radius: 0 0 10px 10px !important;
  padding-top: 0;
  gap: 11px !important;
  height: fit-content;
}

.roulette-section__link span:first-of-type {
  color: #FFFFFF !important;
  font-weight: 500 !important;
}

.roulette-section__link span:last-of-type {
  background: #282829;
  width: 280px;
  padding: 11.75px 0;
  border-radius: 12px;
  color: #F9D679 !important;
  font-size: 13.5px !important;
  line-height: 13.5px !important;
}

.button-language {
  display: flex;
  justify-content: center;
  margin-top: 10px !important;
}

.button-language .trigger {
  background: #2f3032 !important;
  min-width: 180px;
  border-radius: 8px !important;
}

.button-language[data-opened=true] .trigger {
  border-radius: 0 0 8px 8px !important;
}

.button-language .list {
  background: #2f3032 !important;
  min-width: 180px;
  display: flex;
  flex-direction: column;
  width: unset !important;
  left: 50% !important;
  transform: translateX(-50%);
  border: unset !important;
  border-radius: 8px 8px 0 0 !important;
}

body .show-form {
  background: #1d1e20;
  border-radius: 10px;
  padding: 23px 0;
  max-width: 28rem !important;
  width: 100% !important;
  height: fit-content;
  margin: 20px auto !important;
}

.roulette-section__link span:last-of-type::after {
  content: '';
  background: url('/images/arrow.svg') no-repeat;
  width: 14px;
  background-size: cover;
  height: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  right: 10px;
  margin: auto;
  top: 0;
  bottom: 0;
}

.roulette-section__link span:last-of-type {
  position: relative;
}

.roulette-section .show-form .logo {
  height: 80px !important;
}

@media (max-width: 992px) {
  .roulette-section .show-form .logo {
    height: 99px !important;
  }
}

.auth-form-tabs .tab__nav .name {
  border-radius: 0.5rem !important;
  font-size: 1.25rem !important;
  line-height: 1.75rem !important;
  padding: 12px 24px !important;
}

@media (min-height: 600px) {
  body .modal-wrapper {
    top: 0;
    transform: unset;
    left: unset;
    position:relative;
  }
}

@media (max-height: 991px) {
  body .modal-wrapper {
    top: unset;
    height: fit-content !important;
  }
}

body .modal-wrapper {
  display: flex;
  position: relative;
  height: fit-content;
  margin: 0 auto;
  justify-content: center;
}

.auth-form {
  --width-form: 100% !important;
}

.auth-form_wrapper .auth-form_field .ant-input-password {
  background: transparent !important;
}

.auth-form-tabs .tab__nav {
  padding-bottom: 1.5rem !important;
}

.button__loader-text-wrapper .second_step span {
  display: none;
}

.button__loader-text-wrapper .second_step::after {
  content: "Adım 2'ye geç";
  text-transform: capitalize;
}

.auth-form_field .label {
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
  font-weight: 500 !important;
  margin-bottom: 0.5rem !important;
}

.auth-form_content .auth-progress-indicator {
  margin-bottom: 40px !important;
}