/**
 * Eau System - Login Page Styles
 *
 * Layout inspirado na página de login existente:
 * - Split screen (50% branco, 50% azul)
 * - Card de login no lado branco
 * - Design moderno e limpo
 *
 * @since 1.72.41
 */

/* ====================================
   BODY & PAGE OVERRIDES - Full Screen Login
   ==================================== */

/* Remove qualquer limitação de largura dos containers do tema */
body.page-template-elementor_header_footer .site-content,
body.page-template-elementor_header_footer .site-main,
body.page-template-elementor_header_footer .entry-content,
body.page-template-elementor_header_footer article,
body.page-template-elementor_header_footer .elementor-widget-container,
body.page-template-elementor_header_footer .elementor-widget-shortcode,
body.page-template-elementor_header_footer .elementor-element,
body.page-template-elementor_header_footer .elementor-section,
body.page-template-elementor_header_footer .elementor-container,
body.page-template-elementor_header_footer main,
body.page-template-default .site-content,
body.page-template-default .site-main,
body.page-template-default .entry-content,
body.page-template-default article,
body.page-template-default main {
    max-width: none !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Esconde header e footer quando a página tem eau-login-container */
body:has(.eau-login-container) header,
body:has(.eau-login-container) footer,
body:has(.eau-login-container) .elementor-location-header,
body:has(.eau-login-container) .elementor-location-footer,
body:has(.eau-login-container) #site-header,
body:has(.eau-login-container) #site-footer,
body:has(.eau-login-container) .site-header,
body:has(.eau-login-container) .site-footer {
    display: none !important;
}

/* Fallback para navegadores sem suporte a :has() */
body.page-login header,
body.page-login footer,
body.page-login .elementor-location-header,
body.page-login .elementor-location-footer {
    display: none !important;
}

/* ====================================
   LOGIN CONTAINER - Split Screen Full Viewport
   ==================================== */

.eau-login-container {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
    z-index: 9998 !important;
    overflow: hidden !important;
}

/* Blue panel (right side) */
.eau-login-blue-panel {
    width: 50% !important;
    min-width: 50% !important;
    height: 100% !important;
    background: #1e40af !important;
    flex-shrink: 0 !important;
}

/* Mobile: hide blue panel */
@media (max-width: 768px) {
    .eau-login-container {
        flex-direction: column !important;
    }

    .eau-login-blue-panel {
        display: none !important;
    }
}

/* ====================================
   LOGIN CARD
   ==================================== */

.eau-login-card {
    width: 50% !important;
    max-width: 50% !important;
    min-width: 50% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 3rem !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    overflow-y: auto !important;
    flex-shrink: 0 !important;
}

.eau-login-card > * {
    width: 100% !important;
    max-width: 400px !important;
}

@media (max-width: 768px) {
    .eau-login-card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        height: auto !important;
        min-height: 100vh !important;
        padding: 2rem 1.5rem !important;
    }
}

/* ====================================
   LOGO
   ==================================== */

.eau-login-logo {
    text-align: center !important;
    margin-bottom: 2rem !important;
}

.eau-login-logo img {
    max-width: 200px !important;
    height: auto !important;
}

/* ====================================
   WELCOME TEXT
   ==================================== */

.eau-login-welcome {
    margin-bottom: 2rem !important;
}

.eau-login-welcome p {
    font-size: 0.9rem !important;
    color: #374151 !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}

/* ====================================
   ERROR MESSAGE
   ==================================== */

.eau-login-error {
    background: #fef2f2 !important;
    border: 1px solid #fecaca !important;
    border-radius: 8px !important;
    padding: 1rem !important;
    margin-bottom: 1.5rem !important;
}

.eau-login-error p {
    color: #dc2626 !important;
    font-size: 0.875rem !important;
    margin: 0 !important;
}

/* ====================================
   FORM
   ==================================== */

.eau-login-form {
    width: 100% !important;
}

.eau-form-group {
    margin-bottom: 1.25rem !important;
}

.eau-form-label {
    display: block !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    color: #374151 !important;
    margin-bottom: 0.5rem !important;
}

.eau-form-input {
    width: 100% !important;
    padding: 0.75rem 1rem !important;
    font-size: 0.875rem !important;
    border: 1px solid #d1d5db !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    color: #111827 !important;
    box-sizing: border-box !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

.eau-form-input::placeholder {
    color: #9ca3af !important;
}

.eau-form-input:focus {
    outline: none !important;
    border-color: #2563eb !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}

/* ====================================
   PASSWORD TOGGLE
   ==================================== */

.eau-password-wrapper {
    position: relative !important;
}

.eau-password-wrapper .eau-form-input {
    padding-right: 3rem !important;
}

.eau-password-toggle {
    position: absolute !important;
    right: 0.75rem !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: none !important;
    border: none !important;
    padding: 0.25rem !important;
    cursor: pointer !important;
    color: #6b7280 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.eau-password-toggle:hover {
    color: #374151 !important;
}

.eau-password-toggle svg {
    width: 20px !important;
    height: 20px !important;
}

/* ====================================
   CHECKBOX
   ==================================== */

.eau-checkbox-group {
    margin-bottom: 1.5rem !important;
}

.eau-checkbox-label {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    cursor: pointer !important;
    font-size: 0.875rem !important;
    color: #374151 !important;
}

.eau-checkbox-label input[type="checkbox"] {
    width: 1rem !important;
    height: 1rem !important;
    border: 1px solid #d1d5db !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    accent-color: #2563eb !important;
}

/* ====================================
   SUBMIT BUTTON
   ==================================== */

.eau-login-form .eau-btn-primary {
    width: 100% !important;
    padding: 0.875rem 1.5rem !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    background: #111827 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: background 0.15s ease !important;
}

.eau-login-form .eau-btn-primary:hover {
    background: #1f2937 !important;
}

.eau-login-form .eau-btn-primary:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(17, 24, 39, 0.3) !important;
}

.eau-login-form .eau-btn-primary:active {
    background: #374151 !important;
}

/* ====================================
   LINKS
   ==================================== */

.eau-login-links {
    margin-top: 1.5rem !important;
    text-align: center !important;
}

.eau-login-link {
    color: #2563eb !important;
    font-size: 0.875rem !important;
    text-decoration: none !important;
    transition: color 0.15s ease !important;
}

.eau-login-link:hover {
    color: #1d4ed8 !important;
    text-decoration: underline !important;
}

.eau-login-register-text {
    margin-top: 1rem !important;
    font-size: 0.875rem !important;
    color: #6b7280 !important;
}

.eau-login-register-text .eau-login-link {
    color: #2563eb !important;
}

/* ====================================
   LOGGED IN STATE
   ==================================== */

.eau-login-links .eau-btn-full {
    display: block !important;
    text-align: center !important;
    text-decoration: none !important;
}

.eau-login-links .eau-btn-secondary {
    background: #f3f4f6 !important;
    color: #374151 !important;
    border: 1px solid #d1d5db !important;
}

.eau-login-links .eau-btn-secondary:hover {
    background: #e5e7eb !important;
}

/* ====================================
   RAINBOW STRIPE (Bottom)
   ==================================== */

.eau-login-container::after {
    content: '' !important;
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 8px !important;
    background: linear-gradient(
        to right,
        #ef4444 0%,
        #f59e0b 20%,
        #22c55e 40%,
        #3b82f6 60%,
        #8b5cf6 80%,
        #ec4899 100%
    ) !important;
    z-index: 9999 !important;
}

/* ====================================
   ACCESSIBILITY
   ==================================== */

.eau-form-input:focus-visible,
.eau-password-toggle:focus-visible,
.eau-checkbox-label input:focus-visible,
.eau-btn-primary:focus-visible {
    outline: 2px solid #2563eb !important;
    outline-offset: 2px !important;
}

/* Screen reader only */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
