.login-register-holder .btn-register {
    padding: 1rem !important;
}

@media (max-width: 576px) {
    .login-register-holder .btn {
        padding: 0.75rem 0.3rem !important;
    }
}

@media (min-width: 1200px) AND (max-width: 1399px) {
    .spacingForCode {
        width: 10% !important;
    }

    .spacingForContactNumer {
        width: 40% !important;
    }
}

@media (min-width: 344px) AND (max-width: 374px) {
    .spacingForCode {
        width: 30% !important;
    }

    .spacingForContactNumer {
        width: 70% !important;
    }
}

@media (min-width: 992px) AND (max-width: 1024px) {
    .spacingForCode {
        width: 12% !important;
    }

    .spacingForContactNumer {
        width: 88% !important;
    }
}

@media (min-width: 539px) AND (max-width: 550px) {
    .spacingForCode {
        width: 19% !important;
    }

    .spacingForContactNumer {
        width: 81% !important;
    }
}



@media (min-width: 375px) AND (max-width: 390px) {
    .login-register-holder .btn {
        padding: 0.75rem 0.3rem !important;
    }

    .givingtopSpcae {
        margin-top: 14px !important;
    }

    .spacingForCode {
        width: 27% !important;
    }

    .spacingForContactNumer {
        width: 73% !important;
    }
}



.success-message {
    color: green;
    /* Define the color for success messages */
    font-weight: bold;
    display: none;
    /* Hide initially */
}

#backStep2:hover {
    background-color: #0B5DD8;
}

.country_scrollbar::-webkit-scrollbar {
    width: 4px;
}

.country_scrollbar::-webkit-scrollbar-track {
    border-radius: 10px;
}

.country_scrollbar::-webkit-scrollbar-thumb {
    border-radius: 10px;
}

.country_scrollbar::-webkit-scrollbar-thumb:hover {
    background: #d2d2d2;
}

.btn-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.btn-loading .spinner-border {
    margin-left: 10px;
}

.circle-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5em;
    height: 1.5em;
    margin-left: 0.5em;
    border-radius: 50%;
    background-color: #0d6efd;
    color: white;
    font-size: 0.75em;
}

.spinner-border {
    margin-left: 0.5em;
}

.tooltip-fields-wrapper {
    position: relative;
    width: 100%;
}

.password-toggle {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

@media only screen and (max-width: 767px) {
    input[type="checkbox"] {
        float: left;
        line-height: 1em;
        height: 1.6em;
        /* You may want to keep this or remove it since you define height below */
        margin: 0px 2px;
        padding: 0px;
        font-size: inherit;
        clear: left;
        height: 14px;
        /* Final height definition */
        width: 14px;
        /* Final width definition */
    }
}

@media only screen and (max-width: 768px) {

    /* Styles for small screens (mobile) */
    .givingtopSpcae {
        margin-top: 14px !important;
    }
}