.registration-container { display: flex; justify-content: center; align-items: center; min-height: 80vh; } .registration-box { background-color: #fff; padding: 2rem; border-radius: 8px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); width: 100%; max-width: 400px; } .registration-box h2 { margin-top: 0; color: #2c3e50; text-align: center; } .form-group { margin-bottom: 1.5rem; } .form-group label { display: block; margin-bottom: 0.5rem; color: #333; font-weight: 500; } .form-group input { width: 100%; padding: 0.75rem; border: 1px solid #ddd; border-radius: 4px; font-size: 1rem; box-sizing: border-box; } .form-group input:focus { outline: none; border-color: #3498db; } .form-group input:disabled { background-color: #f5f5f5; cursor: not-allowed; } .registration-box button[type="submit"] { width: 100%; padding: 0.75rem; background-color: #27ae60; color: white; border: none; border-radius: 4px; font-size: 1rem; cursor: pointer; transition: background-color 0.3s; } .registration-box button[type="submit"]:hover:not(:disabled) { background-color: #229954; } .registration-box button[type="submit"]:disabled { background-color: #95a5a6; cursor: not-allowed; } .error-message { background-color: #fee; color: #c33; padding: 0.75rem; border-radius: 4px; margin-bottom: 1rem; border: 1px solid #fcc; } .switch-auth { margin-top: 1.5rem; text-align: center; color: #666; } .link-button { background: none; border: none; color: #3498db; cursor: pointer; text-decoration: underline; padding: 0; margin-left: 0.5rem; font-size: 1rem; } .link-button:hover:not(:disabled) { color: #2980b9; } .link-button:disabled { color: #95a5a6; cursor: not-allowed; }