/* ---------------------------------------------------
   Overall wrapper: two-column flex
--------------------------------------------------- */
main {
    display: flex;
    min-height: 100vh;
    overflow: hidden;
}
body{
    position: relative;
}

/*.main-layout{*/
/*    height: 100vh;*/
/*}*/

.custom-right-section {
    position: relative;
    flex: 1 1 auto;
    background: #eef1f8;
    overflow: hidden;
}



/* ---------------------------------------------------
   Left column: fixed 652px up to lg, full-height flex
--------------------------------------------------- */
.custom-left-section {
    flex: 0 0 auto;
    position: relative;
    width: 652px;
    height: 100vh;
    max-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px;
    background: #fff;
}

.page-content{
    height: 100%;
    width: 100%;
    max-width: 332px;
    display: flex;
    flex-direction: column;
    /*justify-content: space-between;*/
    align-items: center;
    padding-top: calc(110px - 24px);
}

@media (max-width: 1024px){
    .page-content:has(.register-form-box), .page-content:has(.create-password-form-box), .page-content:has(.create-password-form-box) {
        height: unset;
    }
}

.login-box{
    width: 100%;
    height:100%;
}

.title-login {
    font-size: 24px;
    font-weight: 700;
    /*margin-bottom: 20px;*/
    text-align: left;
}

.main-logo{
    position:absolute;
    top:30px;
    left:30px;
}

.login-and-disclaimer-container{
    width: 100%;
    height: 97%;
    /*max-width: 332px;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    /*padding-top: 20px;*/
    justify-content: space-between;
    padding-bottom: 32px;
}

/* ---------------------------------------------------
   Right column: takes remaining space, hides overflow
--------------------------------------------------- */
.custom-right-section .bg-login-side {
    margin-left: 150px;
    top:50%;
    transform: translateY(-50%);
    position:relative;

    min-width: 470px;
    min-height: 549px;
}



.language-select-form, .localization-select-form {
    position: fixed;
    top: 30px;
    right: 30px;
    z-index: 10;
}

.request-sent-container p {
    font-size: 16px;
    font-weight: 400;
    color: #00000099;
}

.request-sent-container h2 {
    font-size: 24px;
    font-weight: 700;
}

.request-sent-container {
    width: 100%;
    max-width: 332px;
}



@media (max-width: 1023px) {
    .custom-language-select select {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .language-select-form{
        width: 125px;
        position: absolute;
    }
}

.create-password-back-button {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    color: var(--custom-defaultblue);
    margin: 0 20px;
    border: none;
    background-color: transparent;
}
@media (min-width: 1024px) {
    .create-password-back-button {
        margin:0;
        justify-content: start;
        padding: 0;
    }
}

.create-password-back-button-form {
    display: flex;
    align-items: start;
    align-self: start;
    justify-content: flex-start;
    margin-bottom: 20px;
}


/* ---------------------------------------------------
   Responsive adjustments
--------------------------------------------------- */
@media (min-width: 1598px) {
    .custom-right-section{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .custom-right-section .bg-login-side {
        margin: unset;
        top: unset;
        transform: unset;
    }
}
@media (min-width: 1024px) {
    .custom-right-section .bg-login-side {
        width: 647px;
        height: 756px;
    }
}

@media (max-width: 1280px) {
    .custom-right-section .bg-login-side {
        width: 470px;
        height: 549px;
        
        margin-left: 79px;
    }
}
@media (max-width: 1023px) {
    .custom-right-section {
        display: none;
    }
    
    .custom-left-section {
        width: 100%;
        max-width: none;
        padding: 1.5rem 80px;
    }
    #operations-feedback{
        top: 20px;
    }
}


@media (max-width: 768px) {
    main {
        flex-direction: column;
    }

    .custom-left-section {
        width: 100%;
        /*!*padding: 1.5rem;*!*/
        padding: 24px 40px;
    }
    
    .create-password-back-button-form{
        position: absolute;
        top: 35px;
        left: 30px;
    }
    .create-password-back-button{
        margin-left: 0;
        padding-left: 0;
    }
    .password-conditions{
        font-size: 14px;
    }
    .tooltip{
        display: none !important;
    }
    .cookie-banner{
        flex-direction: column;
    }
}
    

.accordion-root{
    padding-bottom: 20px;
}


.create-password-form-box, .register-form-box, .forgot-password-form-box{
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-bottom: 32px;
}

@media (min-width: 1024px) {
    .modal-dialog {
        max-width: 600px;
        width: max-content;
    }
    .modal-dialog.business-unit-modal, .modal-dialog.modal-password-expiring {
        width: 600px;
    }
    .modal-dialog.disclaimer-document-content-modal{
        max-width: 900px;
    }
}