46 lines
1.1 KiB
CSS
46 lines
1.1 KiB
CSS
@layer components {
|
|
.auth-container {
|
|
@apply min-h-screen flex items-center justify-center p-6 bg-aura-bg relative overflow-hidden;
|
|
}
|
|
|
|
.auth-card {
|
|
@apply aura-glass-card p-12 w-full max-w-xl flex flex-col items-center text-center relative z-10;
|
|
}
|
|
|
|
.auth-step-container {
|
|
@apply space-y-8 w-full max-w-md;
|
|
}
|
|
|
|
.auth-input-container {
|
|
@apply relative;
|
|
}
|
|
|
|
.auth-input-icon {
|
|
@apply absolute left-5 top-1/2 -translate-y-1/2 text-slate-400 w-6 h-6;
|
|
}
|
|
|
|
.auth-input-field {
|
|
@apply aura-input py-5 pl-14 pr-6 text-xl;
|
|
}
|
|
|
|
.auth-submit-btn {
|
|
@apply absolute right-3 top-1/2 -translate-y-1/2 bg-slate-900 dark:bg-slate-100 text-white dark:text-slate-900 p-3 rounded-xl hover:bg-blue-600 dark:hover:bg-blue-400 disabled:opacity-50 transition-all;
|
|
}
|
|
|
|
.auth-progress-indicator {
|
|
@apply fixed bottom-12 left-1/2 -translate-x-1/2 flex gap-2;
|
|
}
|
|
|
|
.auth-progress-dot {
|
|
@apply h-1.5 rounded-full transition-all duration-500;
|
|
}
|
|
|
|
.auth-progress-dot-active {
|
|
@apply w-8 bg-blue-600;
|
|
}
|
|
|
|
.auth-progress-dot-inactive {
|
|
@apply w-2 bg-slate-200 dark:bg-slate-800;
|
|
}
|
|
}
|