diff --git a/sk1/src/public/auth.css b/sk1/src/public/auth.css deleted file mode 100644 index a444302..0000000 --- a/sk1/src/public/auth.css +++ /dev/null @@ -1,304 +0,0 @@ -/* Authentication Styles for Brabus Website */ - -/* Auth Container */ -.auth-container { - padding: 150px 20px 80px; - min-height: calc(100vh - 70px); - display: flex; - align-items: center; - justify-content: center; - background: linear-gradient(to bottom, var(--light-bg), #ffffff); -} - -.auth-card { - width: 100%; - max-width: 480px; - background-color: white; - border-radius: 20px; - box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08); - padding: 40px; - transition: var(--transition); -} - -.auth-header { - text-align: center; - margin-bottom: 30px; -} - -.auth-header h2 { - font-size: 32px; - font-weight: 600; - color: var(--text-dark); - margin-bottom: 10px; - letter-spacing: -0.02em; -} - -.auth-header p { - color: var(--secondary-text); - font-size: 16px; -} - -/* Auth Forms */ -.auth-form { - display: none; -} - -.auth-form.active { - display: block; -} - -.form-group { - margin-bottom: 24px; - position: relative; -} - -.form-group.half { - width: calc(50% - 10px); - display: inline-block; -} - -.form-group.half:first-of-type { - margin-right: 16px; -} - -.form-group label { - display: block; - font-size: 14px; - font-weight: 500; - margin-bottom: 8px; - color: var(--text-dark); -} - -.form-group input[type="text"], -.form-group input[type="email"], -.form-group input[type="password"] { - width: 100%; - padding: 14px 16px; - font-size: 16px; - border: 1px solid #e0e0e0; - border-radius: 8px; - background-color: #ffffff; - transition: var(--transition); -} - -.form-group input:focus { - border-color: var(--primary-color); - outline: none; - box-shadow: 0 0 0 3px rgba(0, 113, 227, 0.2); -} - -/* Password field with toggle */ -.password-field { - position: relative; -} - -.toggle-password { - position: absolute; - right: 16px; - top: 50%; - transform: translateY(-50%); - background: none; - border: none; - cursor: pointer; - color: var(--secondary-text); - transition: var(--transition); - padding: 0; -} - -.toggle-password:hover { - color: var(--text-dark); -} - -/* Password strength indicator */ -.password-strength { - margin-top: 10px; - display: flex; - flex-direction: column; -} - -.strength-bar { - height: 4px; - width: 100%; - background-color: #e0e0e0; - border-radius: 2px; - overflow: hidden; - position: relative; -} - -.strength-bar::before { - content: ''; - position: absolute; - height: 100%; - width: 0; - background-color: #ff3b30; - transition: var(--transition); -} - -.strength-bar.weak::before { - width: 33%; - background-color: #ff3b30; -} - -.strength-bar.medium::before { - width: 66%; - background-color: #ff9500; -} - -.strength-bar.strong::before { - width: 100%; - background-color: #28cd41; -} - -.strength-text { - font-size: 12px; - color: var(--secondary-text); - margin-top: 5px; -} - -/* Checkbox styling */ -.checkbox-container { - display: flex; - align-items: flex-start; -} - -.checkbox-container input[type="checkbox"] { - width: 18px; - height: 18px; - margin-right: 10px; - margin-top: 2px; - accent-color: var(--primary-color); -} - -.checkbox-container label { - margin-bottom: 0; - font-size: 14px; - line-height: 1.4; -} - -.checkbox-container a { - color: var(--primary-color); - text-decoration: none; -} - -.checkbox-container a:hover { - text-decoration: underline; -} - -/* Form actions and buttons */ -.form-actions { - margin-top: 32px; -} - -.btn-auth { - width: 100%; - padding: 14px; - background-color: var(--primary-color); - color: white; - border: none; - border-radius: 8px; - font-size: 16px; - font-weight: 500; - cursor: pointer; - transition: var(--transition); -} - -.btn-auth:hover { - background-color: var(--primary-hover); - transform: translateY(-2px); - box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); -} - -.btn-auth:active { - transform: translateY(0); -} - -/* Auth links */ -.auth-links { - margin-top: 20px; - text-align: center; - font-size: 14px; - color: var(--secondary-text); -} - -.auth-links a { - color: var(--primary-color); - text-decoration: none; - font-weight: 500; - transition: var(--transition); -} - -.auth-links a:hover { - text-decoration: underline; -} - -.auth-links p:not(:last-child) { - margin-bottom: 10px; -} - -/* Error message */ -.error-message { - background-color: rgba(255, 59, 48, 0.1); - color: #ff3b30; - padding: 12px; - border-radius: 8px; - margin-bottom: 20px; - font-size: 14px; - display: none; -} - -.error-message.show { - display: block; -} - -/* Social login */ -.social-login { - margin: 30px 0; - text-align: center; - position: relative; -} - -.social-login::before { - content: ''; - position: absolute; - top: 50%; - left: 0; - right: 0; - height: 1px; - background-color: #e0e0e0; - z-index: 1; -} - -.social-login span { - position: relative; - z-index: 2; - background-color: white; - padding: 0 15px; - color: var(--secondary-text); - font-size: 14px; -} - -.social-buttons { - display: flex; - justify-content: center; - gap: 15px; - margin-top: 20px; -} - -.social-btn { - width: 50px; - height: 50px; - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - background-color: #f5f5f7; - border: none; - cursor: pointer; - transition: var(--transition); -} - -.social-btn i { - font-size: 20px; -} - -.social-btn \ No newline at end of file