/* =========================================================
   CSS personalizado — SOLO página de acceso (login)
   Extraído del rediseño de test el 2026-06-05.
   Estas reglas aplican únicamente a body.login-modern
   y .login-split — NO afectan el interior del software.
   ========================================================= */
:root {
    --blue:       #2563EB;
    --white:      #FFFFFF;
    --text-muted: #6B7280;
    --r-md: 8px;
}


/* =========================================================
   PÁGINA DE ACCESO — split layout
   ========================================================= */
body.login-modern {
    height: 100vh !important;
    overflow: hidden !important;
    background: var(--white) !important;
    padding: 0 !important;
    margin: 0 !important;
}

.login-split {
    display: flex !important;
    width: 100vw !important;
    height: 100vh !important;
}

/* ---- LADO IZQUIERDO: formulario ---- */
.login-split-left {
    flex: 0 0 50% !important;
    width: 50% !important;
    background: var(--white) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 48px 40px !important;
    overflow-y: auto !important;
}

.login-split-inner {
    width: 100% !important;
    max-width: 380px !important;
}

/* ---- LADO DERECHO: imagen ---- */
.login-split-right {
    flex: 0 0 50% !important;
    width: 50% !important;
    background: linear-gradient(135deg, var(--blue) 0%, #1E3A8A 100%) !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* Quitar el card del panel — el fondo blanco ya lo da el split-left */
body.login-modern .panel {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin-bottom: 0 !important;
}
body.login-modern .panel-background { display: none !important; }
body.login-modern .panel-body {
    background: transparent !important;
    padding: 0 !important;
}

/* Logo */
body.login-modern .panel-body img.center-block {
    max-height: 64px !important;
    margin-bottom: 32px !important;
}

/* Separador debajo del logo — oculto */
body.login-modern .panel-body hr {
    display: none !important;
}

/* Campos más cómodos */
body.login-modern .form-control {
    height: 44px !important;
    font-size: 14px !important;
}

/* Botones de acción más grandes */
body.login-modern .btn-lg {
    height: 44px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border-radius: var(--r-md) !important;
}

/* Espaciado entre grupos */
body.login-modern .form-group {
    margin-bottom: 16px !important;
}

/* Espacio entre el botón Ingresar y los botones secundarios */
body.login-modern .btn-primary.btn-block ~ .form-group {
    margin-top: 24px !important;
}
body.login-modern .btn-primary.btn-block ~ .form-group .col-sm-12 + .col-sm-12 {
    margin-top: 10px !important;
}

/* Checkbox — tipografía del label */
body.login-modern .checkbox label {
    font-size: 13px !important;
    font-weight: 400 !important;
    color: var(--text-muted) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* Alertas dentro del form */
body.login-modern .alert {
    border-radius: var(--r-md) !important;
    font-size: 13px !important;
    margin-bottom: 16px !important;
}

/* Texto de bienvenida / bottom_text */
body.login-modern .sign-in-text {
    text-align: center !important;
    font-size: 13px !important;
    color: var(--text-muted) !important;
    margin-bottom: 16px !important;
}

/* App-store links */
body.login-modern .app-links {
    margin-top: 24px !important;
}

/* Mobile: formulario full width, imagen oculta */
@media (max-width: 767px) {
    body.login-modern { overflow-y: auto !important; }
    .login-split { flex-direction: column !important; height: auto !important; min-height: 100vh !important; }
    .login-split-right { display: none !important; }
    .login-split-left {
        flex: 1 1 auto !important;
        width: 100% !important;
        padding: 32px 24px !important;
    }
}
