/* ==========================================================================
   Registration / confirmation guest pages
   ========================================================================== */

.rk-registration-page {
    display: flex;
    flex-direction: column;
}

.rk-registration-main {
    position: relative;
    z-index: 2;
    flex: 1 1 auto;
    width: 100%;
    min-height: calc(100vh - 96px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 18px 72px;
}

.rk-registration-card {
    position: relative;
    width: 100%;
    max-width: 520px;
    padding: 38px 38px 34px;
    border-radius: 28px;
    border: 1px solid rgba(255, 255, 255, .20);
    background:
        radial-gradient(circle at 76% 0%, rgba(255, 49, 195, .28), transparent 38%),
        radial-gradient(circle at 7% 0%, rgba(69, 121, 255, .20), transparent 39%),
        linear-gradient(145deg, rgba(255, 255, 255, .115), rgba(255, 255, 255, .045));
    box-shadow:
        0 26px 80px rgba(0, 0, 0, .44),
        0 0 58px rgba(255, 54, 200, .20),
        inset 0 1px 0 rgba(255, 255, 255, .18);
    backdrop-filter: blur(24px);
}

.rk-registration-card-sm {
    max-width: 470px;
}

.rk-registration-card-lg {
    max-width: 560px;
}

/* ==========================================================================
   Heading / text
   ========================================================================== */

.rk-registration-head {
    margin-bottom: 28px;
}

.rk-registration-head h1 {
    margin: 0;
    color: #fff;
    font-size: 34px;
    line-height: 1.07;
    letter-spacing: -.04em;
    font-weight: 800;
}

.rk-registration-head p {
    margin: 10px 0 0;
    color: rgba(255, 255, 255, .70);
    font-size: 16px;
    line-height: 1.45;
}

.rk-registration-note {
    margin: 0 0 22px;
    padding: 13px 15px;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .06);
    color: rgba(255, 255, 255, .72);
    font-size: 13px;
    line-height: 1.45;
}

.rk-registration-note a {
    color: #9ab2ff !important;
    font-weight: 800;
    text-decoration: none !important;
}

.rk-registration-note a:hover {
    color: #fff !important;
    text-decoration: underline !important;
}

.rk-registration-status {
    margin: 18px 0 0;
    color: rgba(255, 255, 255, .74);
    font-size: 14px;
    line-height: 1.45;
    font-weight: 700;
}

.rk-registration-phone-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 24px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .18);
    background: rgba(255, 255, 255, .08);
    color: #fff !important;
    font-size: 22px;
    line-height: 1;
    font-weight: 900;
    text-decoration: none !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .12),
        0 16px 34px rgba(0, 0, 0, .20);
}

.rk-registration-phone-link:hover {
    color: #fff !important;
    background: rgba(255, 255, 255, .12);
    text-decoration: none !important;
}

/* ==========================================================================
   Form base
   ========================================================================== */

.rk-registration-form,
.rk-registration-fields {
    width: 100%;
}

.rk-registration-card .row {
    margin-left: -6px;
    margin-right: -6px;
}

.rk-registration-card .row > [class*="col-"] {
    padding-left: 6px;
    padding-right: 6px;
}

.rk-registration-card .form-group,
.rk-registration-form-group {
    position: relative;
    margin-bottom: 16px;
}

.rk-registration-card label,
.rk-registration-card .control-label,
.rk-registration-form-label,
.rk-registration-card .select-group-title {
    display: block;
    margin-bottom: 8px;
    color: rgba(255, 255, 255, .82);
    font-size: 13px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -.01em;
}

/* ==========================================================================
   Inputs with icons
   ========================================================================== */

.rk-registration-input-wrap {
    position: relative;
}

.rk-registration-input-icon {
    position: absolute;
    left: 15px;
    top: 50%;
    z-index: 4;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    transform: translateY(-50%);
    color: rgba(255, 255, 255, .46);
    font-size: 15px;
    line-height: 1;
    pointer-events: none;
    text-shadow: 0 0 14px rgba(80, 142, 255, .22);
    transition: color .16s ease, text-shadow .16s ease, opacity .16s ease;
}

.rk-registration-card .form-control,
.rk-registration-card input.form-control,
.rk-registration-card select.form-control,
.rk-registration-card textarea.form-control,
.rk-registration-card .rk-registration-input-wrap .form-control,
.rk-registration-card .rk-registration-input-wrap input.form-control,
.rk-registration-card .rk-registration-input-wrap select.form-control {
    height: 50px;
    min-height: 50px;
    border-radius: 11px;
    border: 1px solid rgba(255, 255, 255, .16);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .105), rgba(255, 255, 255, .055));
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .12),
        0 12px 24px rgba(0, 0, 0, .16);
}

.rk-registration-card .rk-registration-input-wrap .form-control,
.rk-registration-card .rk-registration-input-wrap input.form-control,
.rk-registration-card .rk-registration-input-wrap select.form-control {
    padding-left: 46px !important;
    padding-right: 14px;
}

.rk-registration-card .form-control::placeholder {
    color: rgba(255, 255, 255, .42);
    font-weight: 600;
}

.rk-registration-card select.form-control option {
    color: #111827;
    background: #fff;
}

.rk-registration-card .form-control:focus,
.rk-registration-card .rk-registration-input-wrap .form-control:focus {
    border-color: rgba(78, 146, 255, .88);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .075));
    color: #fff;
    box-shadow:
        0 0 0 3px rgba(58, 130, 255, .20),
        0 0 26px rgba(58, 130, 255, .22),
        inset 0 1px 0 rgba(255, 255, 255, .16);
}

.rk-registration-form-group:focus-within .rk-registration-input-icon {
    color: #69a7ff;
    text-shadow: 0 0 18px rgba(78, 146, 255, .55);
}

.rk-registration-form-group.has-error .rk-registration-input-icon,
.rk-registration-form-group.rk-invalid .rk-registration-input-icon {
    color: #ff6fae;
    text-shadow: 0 0 18px rgba(255, 77, 150, .55);
}

.rk-registration-form-group.has-success .rk-registration-input-icon,
.rk-registration-form-group.rk-valid .rk-registration-input-icon {
    color: #79ffbf;
    text-shadow: 0 0 18px rgba(80, 255, 170, .38);
}

/* ==========================================================================
   Gender buttons
   ========================================================================== */

.rk-registration-gender-group,
.rk-registration-card .select-group,
.rk-registration-card .select-group-sex {
    margin-bottom: 18px;
}

.rk-registration-gender-buttons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.rk-registration-sex-option {
    position: relative;
    display: block;
    margin: 0;
    cursor: pointer;
}

.rk-registration-sex-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.rk-registration-sex-button {
    min-height: 54px;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, .17);
    background: rgba(255, 255, 255, .055);
    color: rgba(255, 255, 255, .82);
    font-size: 16px;
    line-height: 1;
    font-weight: 800;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
    transition:
        border-color .16s ease,
        background .16s ease,
        color .16s ease,
        box-shadow .16s ease;
}

.rk-registration-sex-icon,
.rk-registration-sex-title {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.rk-registration-sex-option:hover .rk-registration-sex-button {
    background: rgba(255, 255, 255, .085);
    color: #fff;
}

.rk-registration-sex-male .rk-registration-sex-button {
    border-color: rgba(52, 137, 255, .62);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .10),
        0 0 22px rgba(40, 123, 255, .15);
}

.rk-registration-sex-female .rk-registration-sex-button {
    border-color: rgba(255, 70, 188, .58);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .10),
        0 0 22px rgba(255, 70, 188, .13);
}

.rk-registration-sex-input:checked + .rk-registration-sex-button {
    color: #fff;
    background:
        radial-gradient(circle at 70% 0%, rgba(255, 61, 169, .22), transparent 42%),
        linear-gradient(92deg, rgba(31, 114, 255, .34), rgba(123, 53, 255, .25), rgba(255, 61, 169, .30));
    border-color: rgba(255, 255, 255, .36);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .15),
        0 0 24px rgba(123, 53, 255, .30),
        0 0 28px rgba(255, 61, 169, .18);
}

/* ==========================================================================
   Legacy gender compatibility
   ========================================================================== */

.rk-registration-card .selectgroup,
.rk-registration-card .selectgroup-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.rk-registration-card .selectgroup-item {
    margin: 0;
    flex: 1 1 0;
}

.rk-registration-card .selectgroup-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.rk-registration-card .selectgroup-button,
.rk-registration-card .selectgroup-button-icon {
    min-height: 54px;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px !important;
    border: 1px solid rgba(255, 255, 255, .17);
    background: rgba(255, 255, 255, .055);
    color: rgba(255, 255, 255, .82);
    font-size: 16px;
    font-weight: 800;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.rk-registration-card .selectgroup-input:checked + .selectgroup-button,
.rk-registration-card .selectgroup-input:checked + .selectgroup-button-icon {
    color: #fff;
    background:
        radial-gradient(circle at 70% 0%, rgba(255, 61, 169, .22), transparent 42%),
        linear-gradient(92deg, rgba(31, 114, 255, .34), rgba(123, 53, 255, .25), rgba(255, 61, 169, .30));
    border-color: rgba(255, 255, 255, .36);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .15),
        0 0 24px rgba(123, 53, 255, .30),
        0 0 28px rgba(255, 61, 169, .18);
}

.rk-registration-card .btn-pill,
.rk-registration-card .btn-sex {
    min-height: 48px;
    margin: 0 8px 8px 0 !important;
    padding: 0 18px;
    border-radius: 999px !important;
    border: 1px solid rgba(255, 255, 255, .17);
    background: rgba(255, 255, 255, .055);
    color: rgba(255, 255, 255, .82);
    font-size: 14px;
    font-weight: 800;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.rk-registration-card .btn-pill:hover,
.rk-registration-card .btn-sex:hover,
.rk-registration-card .btn-pill.active,
.rk-registration-card .btn-sex.active {
    color: #fff;
    background: rgba(255, 255, 255, .095);
}

.rk-registration-card .btn-sex.btn-male {
    border-color: rgba(52, 137, 255, .62);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .10),
        0 0 22px rgba(40, 123, 255, .15);
}

.rk-registration-card .btn-sex.btn-female {
    border-color: rgba(255, 70, 188, .58);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .10),
        0 0 22px rgba(255, 70, 188, .13);
}

/* ==========================================================================
   Register partial compatibility
   ========================================================================== */

.rk-registration-card .field-registrationform-sex,
.rk-registration-card .field-registrationform-dob,
.rk-registration-card .field-registrationform-dobday,
.rk-registration-card .field-registrationform-dobmonth,
.rk-registration-card .field-registrationform-dobyear,
.rk-registration-card .field-registrationform-name,
.rk-registration-card .field-registrationform-username,
.rk-registration-card .field-registrationform-email,
.rk-registration-card .field-registrationform-phone,
.rk-registration-card .field-registrationform-password,
.rk-registration-card .field-registrationform-country,
.rk-registration-card .field-registrationform-city {
    margin-bottom: 16px;
}

/* ==========================================================================
   Selectize / Select2
   ========================================================================== */

.rk-registration-card .selectize-control,
.rk-registration-card .select2-container {
    width: 100% !important;
}

/* Fix: selectize wrapper can inherit form-control class from original input/select.
   The wrapper itself must be transparent, only .selectize-input should look like a field. */
.rk-registration-card .selectize-control.form-control,
.rk-registration-card .select2-container.form-control {
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: inherit !important;
}

.rk-registration-card .selectize-control.single {
    position: relative;
}

.rk-registration-card .selectize-control.single .selectize-input,
.rk-registration-card .selectize-input {
    position: relative;
    width: 100% !important;
    min-height: 50px !important;
    height: 50px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 38px 0 14px !important;
    border-radius: 11px !important;
    border: 1px solid rgba(255, 255, 255, .16) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .105), rgba(255, 255, 255, .055)) !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .12),
        0 12px 24px rgba(0, 0, 0, .16) !important;
    overflow: hidden !important;
}

.rk-registration-card .rk-registration-input-wrap .selectize-control.single .selectize-input,
.rk-registration-card .rk-registration-input-wrap .selectize-input {
    padding-left: 46px !important;
}

.rk-registration-card .selectize-input.focus,
.rk-registration-card .selectize-input.input-active {
    border-color: rgba(78, 146, 255, .88) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .075)) !important;
    color: #fff !important;
    box-shadow:
        0 0 0 3px rgba(58, 130, 255, .20),
        0 0 26px rgba(58, 130, 255, .22),
        inset 0 1px 0 rgba(255, 255, 255, .16) !important;
}

.rk-registration-card .selectize-input input {
    width: auto !important;
    min-width: 2px !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

.rk-registration-card .selectize-input input::placeholder {
    color: rgba(255, 255, 255, .42) !important;
    font-weight: 600 !important;
}

.rk-registration-card .selectize-input > div,
.rk-registration-card .selectize-input .item {
    max-width: 100% !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.rk-registration-card .selectize-control.single .selectize-input::after {
    right: 16px !important;
    border-color: rgba(255, 255, 255, .72) transparent transparent transparent !important;
}

.rk-registration-card .selectize-control.single .selectize-input.dropdown-active::after {
    border-color: transparent transparent rgba(255, 255, 255, .72) transparent !important;
}

.rk-registration-card .selectize-dropdown {
    z-index: 1000 !important;
    overflow: hidden;
    margin-top: 6px !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    background: rgba(18, 20, 38, .96) !important;
    color: #fff !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .42);
    backdrop-filter: blur(18px);
}

.rk-registration-card .selectize-dropdown .option {
    color: rgba(255, 255, 255, .86) !important;
    background: transparent !important;
    padding: 10px 13px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.rk-registration-card .selectize-dropdown .option.active,
.rk-registration-card .selectize-dropdown .option:hover,
.rk-registration-card .selectize-dropdown .active {
    background: rgba(73, 142, 255, .20) !important;
    color: #fff !important;
}

.rk-registration-card .select2-container--default .select2-selection--single {
    min-height: 50px !important;
    height: 50px !important;
    border-radius: 11px !important;
    border: 1px solid rgba(255, 255, 255, .16) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .105), rgba(255, 255, 255, .055)) !important;
    color: #fff !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .12),
        0 12px 24px rgba(0, 0, 0, .16) !important;
}

.rk-registration-card .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #fff !important;
    line-height: 50px !important;
    padding-left: 14px !important;
    padding-right: 38px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

.rk-registration-card .rk-registration-input-wrap .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-left: 46px !important;
}

.rk-registration-card .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 50px !important;
    right: 8px !important;
}

.rk-registration-card .select2-dropdown {
    overflow: hidden !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    background: rgba(18, 20, 38, .96) !important;
    color: #fff !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .42);
}

.rk-registration-card .select2-results__option {
    color: rgba(255, 255, 255, .86) !important;
    padding: 10px 13px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.rk-registration-card .select2-results__option--highlighted {
    background: rgba(73, 142, 255, .20) !important;
    color: #fff !important;
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.rk-registration-submit,
.rk-registration-card .btn-primary {
    min-height: 54px;
    border: 0;
    border-radius: 13px;
    background: linear-gradient(92deg, #1f72ff 0%, #7b35ff 48%, #ff3da9 100%);
    color: #fff !important;
    font-size: 16px;
    font-weight: 900;
    box-shadow:
        0 18px 36px rgba(94, 66, 255, .34),
        0 0 26px rgba(255, 64, 178, .18);
}

.rk-registration-submit:hover,
.rk-registration-submit:focus,
.rk-registration-card .btn-primary:hover,
.rk-registration-card .btn-primary:focus {
    color: #fff !important;
    filter: brightness(1.06);
}

.rk-registration-card .btn-link {
    color: #9ab2ff !important;
    font-weight: 800;
    text-decoration: none !important;
}

.rk-registration-card .btn-link:hover {
    color: #fff !important;
    text-decoration: underline !important;
}

/* ==========================================================================
   Errors / alerts / captcha
   ========================================================================== */

.rk-registration-card .alert {
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .08);
    color: #fff;
}

.rk-registration-card .alert-info {
    background: rgba(58, 130, 255, .14);
    border-color: rgba(58, 130, 255, .22);
}

.rk-registration-card .error-summary,
.rk-registration-card .help-block,
.rk-registration-card .invalid-feedback,
.rk-registration-card .error,
.rk-registration-card .text-danger {
    display: block;
    min-height: 0;
    margin: 7px 0 0;
    padding: 0;
    color: #ff8fc0 !important;
    font-size: 12px;
    line-height: 1.35;
    font-weight: 700;
    text-shadow: 0 0 16px rgba(255, 77, 150, .24);
}

.rk-registration-card .error-summary {
    margin-bottom: 16px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(255, 77, 150, .22);
    background: rgba(255, 77, 150, .10);
}

.rk-registration-card .help-block:empty,
.rk-registration-card .invalid-feedback:empty,
.rk-registration-card .error:empty {
    display: none;
}

.rk-registration-card .has-error .form-control,
.rk-registration-card .rk-registration-form-group.has-error .form-control,
.rk-registration-card .is-invalid {
    border-color: rgba(255, 77, 150, .90) !important;
    background:
        linear-gradient(180deg, rgba(255, 77, 150, .14), rgba(255, 255, 255, .06)) !important;
    box-shadow:
        0 0 0 3px rgba(255, 77, 150, .16) !important,
        0 0 24px rgba(255, 77, 150, .18) !important,
        inset 0 1px 0 rgba(255, 255, 255, .12) !important;
}

.rk-registration-card .rk-registration-form-group.has-error .help-block:not(:empty),
.rk-registration-card .rk-registration-form-group.rk-invalid .help-block:not(:empty) {
    position: relative;
    display: block;
    padding-left: 18px;
}

.rk-registration-card .rk-registration-form-group.has-error .help-block:not(:empty)::before,
.rk-registration-card .rk-registration-form-group.rk-invalid .help-block:not(:empty)::before {
    content: "!";
    position: absolute;
    left: 0;
    top: 1px;
    width: 13px;
    height: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(255, 77, 150, .18);
    color: #ff8fc0;
    font-size: 9px;
    font-weight: 900;
    box-shadow: 0 0 14px rgba(255, 77, 150, .28);
}

.rk-registration-card .captcha img,
.rk-registration-card .rk-registration-captcha img {
    max-width: 100%;
    border-radius: 10px;
    margin-bottom: 8px;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .22);
}

/* ==========================================================================
   Terms
   ========================================================================== */

.rk-registration-card .terms {
    max-width: 400px;
    margin: 4px auto 16px;
    color: rgba(255, 255, 255, .56) !important;
    font-size: 11px;
    line-height: 1.35;
}

.rk-registration-card .terms a {
    color: #9ab2ff !important;
    text-decoration: none;
    font-weight: 800;
}

.rk-registration-card .terms a:hover {
    color: #fff !important;
    text-decoration: underline;
}

/* ==========================================================================
   Social / bottom links
   ========================================================================== */

.rk-registration-social {
    width: 100%;
    margin: 18px 0 14px;
    overflow: visible;
}

.rk-registration-social > * {
    max-width: 100%;
}

.rk-registration-bottom-links {
    margin-top: 20px;
    text-align: center;
}

.rk-registration-bottom-links p {
    margin: 8px 0 0;
    color: rgba(255, 255, 255, .64);
    font-size: 13px;
    line-height: 1.35;
}

.rk-registration-bottom-links a {
    color: #9ab2ff !important;
    text-decoration: none;
    font-weight: 800;
}

.rk-registration-bottom-links a:hover {
    color: #fff !important;
    text-decoration: underline;
}

/* ==========================================================================
   Mobile
   ========================================================================== */

@media (max-width: 767px) {
    .rk-registration-main {
        align-items: flex-start;
        padding: 24px 16px 42px;
    }

    .rk-registration-card {
        max-width: 460px;
        padding: 24px 18px 22px;
        border-radius: 22px;
    }

    .rk-registration-head {
        margin-bottom: 22px;
    }

    .rk-registration-head h1 {
        font-size: 30px;
    }

    .rk-registration-head p {
        font-size: 14px;
    }

    .rk-registration-card .row {
        display: block;
        margin-left: 0;
        margin-right: 0;
    }

    .rk-registration-card .row > [class*="col-"] {
        width: 100%;
        max-width: 100%;
        flex: 0 0 100%;
        padding-left: 0;
        padding-right: 0;
    }

    .rk-registration-card .form-control,
    .rk-registration-card input.form-control,
    .rk-registration-card select.form-control,
    .rk-registration-card textarea.form-control,
    .rk-registration-card .rk-registration-input-wrap .form-control,
    .rk-registration-card .rk-registration-input-wrap input.form-control,
    .rk-registration-card .rk-registration-input-wrap select.form-control {
        height: 48px !important;
        min-height: 48px !important;
        font-size: 14px !important;
    }

    .rk-registration-card .selectize-control.single .selectize-input,
    .rk-registration-card .selectize-input,
    .rk-registration-card .select2-container--default .select2-selection--single {
        height: 48px !important;
        min-height: 48px !important;
        font-size: 14px !important;
    }

    .rk-registration-card .select2-container--default .select2-selection--single .select2-selection__rendered {
        line-height: 48px !important;
    }

    .rk-registration-card .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 48px !important;
    }

    .rk-registration-gender-buttons {
        grid-template-columns: 1fr;
    }

    .rk-registration-sex-button,
    .rk-registration-card .selectgroup-button,
    .rk-registration-card .selectgroup-button-icon {
        min-height: 48px;
        font-size: 15px;
    }

    .rk-registration-card .btn-pill,
    .rk-registration-card .btn-sex {
        width: 100%;
        margin-right: 0 !important;
    }

    .rk-registration-submit,
    .rk-registration-card .btn-primary {
        min-height: 52px;
        font-size: 15px;
    }
}

/* ==========================================================================
   Registration agreement checkbox
   ========================================================================== */

.rk-registration-agreement {
    width: 100%;
    margin: 4px 0 18px;
}

.rk-registration-agreement-label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px;
    width: 100%;
    margin: 0 !important;
    padding: 0 2px;
    color: rgba(255, 255, 255, .66);
    cursor: pointer;
}

.rk-registration-card label.rk-registration-agreement-label {
    display: flex !important;
    margin-bottom: 0 !important;
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
    letter-spacing: normal;
}

.rk-registration-agreement-checkbox {
    position: static !important;
    display: inline-block !important;
    flex: 0 0 auto;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px;
    min-height: 18px;
    margin: 2px 0 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    appearance: auto;
    -webkit-appearance: checkbox;
    accent-color: #ff3da9;
    cursor: pointer;
}

.rk-registration-agreement-text {
    display: block;
    min-width: 0;
    color: rgba(255, 255, 255, .66);
    font-size: 11px;
    line-height: 1.4;
    font-weight: 600;
    text-align: left;
}

.rk-registration-agreement-text a {
    color: #c7d2ff !important;
    text-decoration: none;
    font-weight: 800;
}

.rk-registration-agreement-text a:hover {
    color: #ffffff !important;
    text-decoration: underline;
}

.rk-registration-submit.rk-registration-submit-disabled,
.rk-registration-submit:disabled,
.rk-registration-card .btn-primary.rk-registration-submit-disabled,
.rk-registration-card .btn-primary:disabled {
    opacity: .48;
    cursor: not-allowed;
    filter: grayscale(.22);
    box-shadow:
        0 10px 20px rgba(0, 0, 0, .18),
        inset 0 1px 0 rgba(255, 255, 255, .10);
}

@media (max-width: 767px) {
    .rk-registration-agreement {
        margin: 2px 0 16px;
    }

    .rk-registration-agreement-label {
        gap: 9px;
    }

    .rk-registration-agreement-checkbox {
        width: 17px !important;
        height: 17px !important;
        min-width: 17px;
        min-height: 17px;
        margin-top: 2px !important;
    }

    .rk-registration-agreement-text {
        font-size: 10.5px;
        line-height: 1.38;
    }
}