/* Note: It's better to move these styles to your plugin's style.css file in the long run */
        /* :root { --primary-blue: #1D274E; --primary-orange: #F9A826; } */
        .form-container-split { display: grid; grid-template-columns: 1fr; }
        .form-panel { transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out; }
        @media (min-width: 1024px) { .form-container-split { grid-template-columns: 450px 1fr; } }
        .info-panel { background: linear-gradient(135deg, var(--primary-blue) 0%, #2a355a 100%); color: white; padding: 2.5rem; display: flex; flex-direction: column; justify-content: center; text-align: center; }
        .form-input-icon { position: relative; }
        .form-input-icon .form-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: #9ca3af; }
        .form-input-icon input { padding-left: 36px !important; }
        .form-input { border: 1px solid #d1d5db; border-radius: 0.5rem; padding: 0.75rem 1rem; transition: border-color 0.2s; }
        .form-input:focus { border-color: var(--primary-orange); outline: none; box-shadow: 0 0 0 2px rgba(249, 168, 38, 0.3); }
        .cta-button { background-color: var(--primary-orange); color: white; font-weight: 600; padding: 0.75rem 1.5rem; border-radius: 0.5rem; transition: background-color 0.3s; }
        .cta-button:hover { background-color: #e0941a; }
        .form-checkbox { border-radius: 0.25rem; border-color: #d1d5db; }
        .form-checkbox:checked { background-color: var(--primary-orange); border-color: var(--primary-orange); }
        .social-login-btn { border: 1px solid #d1d5db; border-radius: 0.5rem; }

        a.login-back-home.border-2.border-white\/50.text-white.px-6.py-2.rounded-full.hover\:text-primary-blue.transition-all.font-semibold:hover{ background-color:var(--primary-orange) !important;}