#login-page{
    background: rgb(245,245,245) !important;
    width: 848px;
    max-width: 100%;
    border-radius: 32px;
    padding: 24px;
    margin: 5rem auto;



    .image-holder::before {
        content: '';
        position: absolute;
        z-index: 3;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        background-color: #0000008c;
        opacity: 0.8;
    }

    .image-holder {
        position: relative;
        border-radius: 32px;
        overflow: hidden;
    }

    .image-holder > img {
        width: 100%;
        aspect-ratio: 376 / 504;
        object-fit: cover;
    }

    .image-holder a.login-register-form-logo {
        position: absolute;
        z-index: 4;
        left: 50%;
        top: 40%;
        transform: translate(-50%, -50%);
    }

    .login-register-form-description {
        font-size: 15px;
        line-height: 28px;
        color: var(--gray300);
        font-weight: 400;
        margin-bottom: 16px;
    }

    input {
        border-radius: 8px;
        background: #fff;
        border: none;
        height: 50px;
        display: block;
        width: 100%;
        font-size: 15px;
        line-height: 32px;
        padding-inline-start: 16px;
        padding-inline-end: 44px;
        color: var(--color-secondary);
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);
        direction: rtl;
    }

    .form-group{
        position:relative;
    }
    .icon {
        position: absolute;
        inset-inline-end: 16px;
        top: 39px;
    }


}