/* Auto-extracted from templates/member_portal/login.html */
*, *::before, *::after { box-sizing: border-box; }
    body {
      font-family: 'Inter', system-ui, sans-serif;
      min-height: 100vh;
      display: flex;
      background: #f8fafc;
    }
    .auth-split-left {
      flex: 1;
      background: linear-gradient(135deg, #0f172a 0%, #1e293b 40%, #145e38 100%);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 3rem;
      position: relative;
      overflow: hidden;
    }
    .auth-split-left::before {
      content: '';
      position: absolute;
      inset: 0;
      background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    }
    .auth-split-right {
      width: 480px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 2rem;
      background: #fff;
    }
    .left-logo { width: 80px; height: 80px; object-fit: contain; margin-bottom: 1.5rem; filter: drop-shadow(0 4px 16px rgba(0,0,0,0.3)); }
    .left-title { color: #fff; font-size: 1.75rem; font-weight: 800; text-align: center; margin-bottom: 0.5rem; }
    .left-subtitle { color: rgba(255,255,255,0.65); font-size: 0.9375rem; text-align: center; max-width: 320px; line-height: 1.6; }
    .left-features { margin-top: 2.5rem; width: 100%; max-width: 320px; }
    .left-feature {
      display: flex;
      align-items: center;
      gap: 0.75rem;
      padding: 0.75rem 1rem;
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.1);
      border-radius: 0.75rem;
      margin-bottom: 0.75rem;
    }
    .left-feature-icon {
      width: 36px;
      height: 36px;
      background: rgba(26,122,74,0.3);
      border-radius: 0.5rem;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #4ade80;
      font-size: 0.875rem;
      flex-shrink: 0;
    }
    .left-feature-text { color: rgba(255,255,255,0.8); font-size: 0.875rem; font-weight: 500; }

    .login-form-wrap { width: 100%; max-width: 380px; }
    .login-title { font-size: 1.5rem; font-weight: 800; color: #0f172a; margin-bottom: 0.25rem; }
    .login-subtitle { font-size: 0.875rem; color: #64748b; margin-bottom: 2rem; }
    .form-label { font-size: 0.875rem; font-weight: 500; color: #374151; margin-bottom: 0.375rem; }
    .form-control {
      border: 1.5px solid #e2e8f0;
      border-radius: 0.625rem;
      padding: 0.625rem 0.875rem;
      font-size: 0.875rem;
      transition: all 0.15s;
    }
    .form-control:focus {
      border-color: #1a7a4a;
      box-shadow: 0 0 0 3px rgba(26,122,74,0.12);
      outline: none;
    }
    .btn-login {
      background: linear-gradient(135deg, #1a7a4a 0%, #145e38 100%);
      border: none;
      border-radius: 0.625rem;
      color: #fff;
      font-size: 0.9375rem;
      font-weight: 600;
      padding: 0.75rem;
      width: 100%;
      transition: all 0.2s;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0.5rem;
    }
    .btn-login:hover { background: linear-gradient(135deg, #145e38 0%, #0f4a2c 100%); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(26,122,74,0.3); }
    .alert { border-radius: 0.625rem; border: none; font-size: 0.875rem; padding: 0.75rem 1rem; margin-bottom: 1rem; }
    .alert-danger  { background: #fee2e2; color: #991b1b; }
    .alert-success { background: #dcfce7; color: #166534; }
    .alert-info    { background: #dbeafe; color: #1e40af; }
    .divider { display: flex; align-items: center; gap: 1rem; margin: 1.25rem 0; color: #94a3b8; font-size: 0.8125rem; }
    .divider::before, .divider::after { content: ''; flex: 1; height: 1px; background: #e2e8f0; }
    .back-link { display: flex; align-items: center; gap: 0.5rem; color: #64748b; font-size: 0.8125rem; text-decoration: none; margin-bottom: 2rem; transition: color 0.15s; }
    .back-link:hover { color: #1a7a4a; }

    @media (max-width: 767.98px) {
      body { flex-direction: column; }
      .auth-split-left { padding: 2rem; min-height: auto; }
      .left-features { display: none; }
      .auth-split-right { width: 100%; padding: 2rem 1.5rem; }
    }
