/**
 * LiveEasy login page — brand overlay + glass form on hero background.
 * Loaded after assets/login_assets/css/style.css
 */

:root {
    --le-login-primary: #D32F2F;
    --le-login-primary-dark: #B71C1C;
    --le-login-primary-light: #FFEBEE;
}

/* Stronger overlay on hero photo (replaces faint body:after from template) */
body.le-login-page {
    position: relative;
    min-height: 100vh;
}

body.le-login-page::after {
    opacity: 0 !important;
}

body.le-login-page::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    background: linear-gradient(
        160deg,
        rgba(15, 17, 23, 0.82) 0%,
        rgba(26, 26, 46, 0.72) 45%,
        rgba(183, 28, 28, 0.35) 100%
    );
    pointer-events: none;
}

body.le-login-page .ftco-section {
    position: relative;
    z-index: 1;
}

/* Logo area */
body.le-login-page .login100-form-title img {
    max-height: 72px;
    width: auto;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.35));
}

body.le-login-page .login-wrap h3 {
    font-family: 'Poppins', 'Lato', sans-serif;
    font-weight: 600;
    font-size: 1.35rem;
    letter-spacing: 0.02em;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* Glass card container */
body.le-login-page .login-wrap {
    background: rgba(255, 255, 255, 0.07);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 20px;
    padding: 2rem 1.75rem !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
}

/* Floating inputs */
body.le-login-page .login-wrap .form-control {
    background: rgba(255, 255, 255, 0.1) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    border-radius: 40px !important;
    color: #fff !important;
    font-size: 15px;
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

body.le-login-page .login-wrap .form-control:focus {
    background: rgba(255, 255, 255, 0.14) !important;
    border-color: rgba(255, 255, 255, 0.45) !important;
    box-shadow: 0 0 0 3px rgba(211, 47, 47, 0.25) !important;
}

body.le-login-page .login-wrap .form-control::placeholder {
    color: rgba(255, 255, 255, 0.65) !important;
}

body.le-login-page .field-icon {
    color: rgba(255, 255, 255, 0.75);
}

/* Sign In — brand red */
body.le-login-page .login-wrap .btn-primary.submit {
    background: var(--le-login-primary) !important;
    border: 1px solid var(--le-login-primary) !important;
    color: #fff !important;
    font-family: 'Poppins', 'Lato', sans-serif;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.08em;
    height: 50px;
    transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
    box-shadow: 0 4px 14px rgba(211, 47, 47, 0.45);
}

body.le-login-page .login-wrap .btn-primary.submit:hover,
body.le-login-page .login-wrap .btn-primary.submit:focus {
    background: var(--le-login-primary-dark) !important;
    border-color: var(--le-login-primary-dark) !important;
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(183, 28, 28, 0.5);
}

/* Remember me + forgot password */
body.le-login-page .checkbox-primary {
    color: rgba(255, 255, 255, 0.9);
    font-size: 14px;
}

body.le-login-page .checkbox-primary input:checked ~ .checkmark:after {
    color: var(--le-login-primary) !important;
}

body.le-login-page .login-wrap a {
    color: var(--le-login-primary-light);
    font-size: 14px;
    transition: color 0.2s ease;
}

body.le-login-page .login-wrap a:hover {
    color: #fff;
    text-decoration: none;
}

/* Login page toasts — compact, top-right */
body.le-login-page #toast-container {
    z-index: 999999 !important;
}

body.le-login-page #toast-container.toast-top-right {
    top: 20px;
    right: 20px;
}

body.le-login-page #toast-container.toast-top-right > .toast,
body.le-login-page #toast-container.toast-top-right > div {
    width: 360px !important;
    max-width: calc(100vw - 40px) !important;
    opacity: 1 !important;
    padding: 14px 18px 14px 50px !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35) !important;
    font-family: 'Poppins', 'Lato', sans-serif;
    font-size: 14px !important;
    line-height: 1.45 !important;
}