/* ========================================= */
/* 1. CONFIGURAÇÃO GLOBAL (Layout de 2 Colunas) */
/* ========================================= */

/* Remove estilos de fundo padrão do Perfex e define o Flexbox */
body.custom-login-body, 
body.login_admin {
    padding: 0 !important;
    margin: 0 !important;
    background: none !important; 
}

.custom-login-container {
    display: flex;
    min-height: 100vh; /* Ocupa a altura total da tela */
    width: 100vw; /* Ocupa a largura total da tela */
}

/* ========================================= */
/* 2. ESTILO DA COLUNA DO FORMULÁRIO (30%) */
/* ========================================= */

.login-form-wrapper {
    width: 30%; /* AJUSTE: Ocupa 30% da largura total */
    display: flex; 
    align-items: center; /* Centraliza verticalmente */
    justify-content: center; /* Centraliza horizontalmente */
    background-color: #ffffff; 
    z-index: 10;
}

/* Redefine as classes do Perfex para o novo layout */
.tw-max-w-md.tw-mx-auto.tw-pt-24 {
    max-width: none !important; 
    margin: 0 auto !important; 
    padding-top: 0 !important;
    width: 100%;
}

.authentication-form-wrapper {
    max-width: 400px; /* Largura máxima do formulário */
    width: 100%;
    margin: 0 auto;
}

/* ========================================= */
/* 3. ESTILO DA COLUNA DA IMAGEM (70%) */
/* ========================================= */

.login-image-wrapper {
    width: 70%; /* AJUSTE: Ocupa 70% da largura total */
    /* URL DA SUA IMAGEM (Camaleão, neste caso) */
    background: url('https://escritoriovirtual.sistemadtjus.com.br/media/Imagem%20login%20admin/dtjusadminlogin-4.jpg') no-repeat center center;
    background-size: cover; 
    position: relative;
    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5); 
}


/* ========================================= */
/* 4. RESPONSIVIDADE (Para Celulares) */
/* ========================================= */

@media (max-width: 992px) { 
    
    .custom-login-container {
        flex-direction: column; 
    }
    
    .login-form-wrapper {
        width: 100%; 
        min-height: 100vh; 
    }

    .login-image-wrapper {
        display: none; 
    }
}