/* 🌿 Portal — auth/login Module Styles */
/* Extracted 2026-10-02 */

/* 🌿 Portal Login — Digital Greenhouse */
        body { 
            background: linear-gradient(160deg, #e8f5e9 0%, #c8e6c9 30%, #a5d6a7 60%, #c5e1c5 100%);
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            font-family: var(--gh-font);
            padding: 15px;
            position: relative;
            overflow: hidden;
        }

        body::before, body::after {
            content: '';
            position: fixed;
            border-radius: 50%;
            filter: blur(80px);
            opacity: 0.3;
            z-index: 0;
        }
        body::before {
            width: 350px; height: 350px;
            background: var(--gh-tertiary-container);
            top: -8%; left: -5%;
        }
        body::after {
            width: 300px; height: 300px;
            background: var(--gh-primary-fixed);
            bottom: -5%; right: -5%;
        }

        .login-card {
            width: 100%;
            max-width: 420px;
            border: none;
            border-radius: var(--gh-radius-lg);
            box-shadow: var(--gh-shadow-lg);
            overflow: hidden;
            background-color: var(--gh-surface-lowest);
            position: relative;
            z-index: 1;
            animation: ghSlideUp 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
        }

        .login-header {
            background: var(--gh-surface-lowest);
            padding: 32px 24px 12px;
            text-align: center;
        }
        
        .logo-img {
            max-height: 140px;
            max-width: 260px;
            margin-bottom: 12px;
        }

        .erp-title {
            font-weight: 800;
            color: var(--gh-on-surface);
            letter-spacing: 0.5px;
            margin-bottom: 4px;
            font-size: 1.25rem;
        }

        .login-card .input-group {
            border-radius: var(--gh-radius, 8px);
            transition: all var(--gh-transition-fast);
        }

        .login-card .form-control {
            height: 48px;
            background-color: var(--gh-surface-lowest, #ffffff);
            border: 1px solid var(--gh-outline, #cbd5e1);
            border-radius: var(--gh-radius, 8px);
            font-size: 0.92rem;
            padding-left: 14px;
            transition: border-color var(--gh-transition-fast), box-shadow var(--gh-transition-fast);
        }
        
        .login-card .form-control:focus {
            border-color: var(--gh-primary, var(--gh-primary)) !important;
            box-shadow: 0 0 0 4px rgba(0, 107, 50, 0.14) !important;
            background-color: #ffffff;
        }

        .login-card .input-group-text {
            background-color: var(--gh-surface-low, #f0f5f1);
            border: 1px solid var(--gh-outline, #cbd5e1);
            color: var(--gh-primary, var(--gh-primary));
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .login-card .input-group:focus-within {
            box-shadow: 0 0 0 4px rgba(0, 107, 50, 0.14);
            border-radius: var(--gh-radius, 8px);
        }

        .login-card .input-group:focus-within .input-group-text {
            border-color: var(--gh-primary, var(--gh-primary)) !important;
            background-color: rgba(0, 107, 50, 0.08) !important;
            color: var(--gh-primary, var(--gh-primary)) !important;
        }

        #togglePassword {
            border-radius: 0 var(--gh-radius) 0 0;
            cursor: pointer;
        }

        .btn-login {
            height: 48px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border-radius: var(--gh-radius-md);
            background: linear-gradient(135deg, var(--gh-primary) 0%, var(--gh-primary-container) 100%);
            border: none;
            color: #fff;
            transition: all 0.3s ease;
            box-shadow: 0 4px 16px rgba(0, 107, 50, 0.25);
        }
        
        .btn-login:hover {
            background: linear-gradient(135deg, var(--gh-primary-container) 0%, var(--gh-primary) 100%);
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(0, 107, 50, 0.3);
            color: #fff;
        }

        .invalid-feedback {
            font-size: 0.82rem;
            margin-top: 5px;
            margin-left: 5px;
        }

        .default-pw-hint {
            background: var(--gh-surface);
            border: 1px solid var(--gh-outline-variant);
            border-radius: var(--gh-radius);
            padding: 10px 14px;
            margin-bottom: 16px;
            font-size: 0.8rem;
            color: var(--gh-on-surface-variant);
        }
        .default-pw-hint i { color: var(--gh-text-muted); margin-right: 6px; }

        .alert { border-radius: var(--gh-radius-md); font-size: 0.85rem; }

        .card-footer {
            background: var(--gh-surface-lowest) !important;
            border: none !important;
        }

        @media (max-width: 480px) {
            .login-card { max-width: 100%; }
            .login-header { padding: 22px 15px; }
        }