﻿/* =========================================================
   Ave One — Auth Pages  v2.0
   Brand: Navy #0d1f2d · Teal #26b3ae · by Nova Tech Ltd
   ========================================================= */
:root {
    --navy:       #0d1f2d;
    --teal:       #26b3ae;
    --teal-light: #3dc8c3;
}

.auth-body {
    min-height: 100vh;
    background: linear-gradient(145deg, #071320 0%, var(--navy) 50%, #0f2e3e 100%);
    display: flex; align-items: center; justify-content: center;
    font-family: 'Segoe UI', system-ui, sans-serif;
    padding: 1rem;
    position: relative; overflow: hidden;
}
.auth-body::before {
    content: '';
    position: absolute; top: -20%; right: -10%;
    width: 500px; height: 500px; border-radius: 50%;
    background: radial-gradient(circle, rgba(38,179,174,0.12) 0%, transparent 65%);
    pointer-events: none;
}
.auth-body::after {
    content: '';
    position: absolute; bottom: -15%; left: -5%;
    width: 350px; height: 350px; border-radius: 50%;
    background: radial-gradient(circle, rgba(61,200,195,0.08) 0%, transparent 65%);
    pointer-events: none;
}

.auth-wrapper {
    width: 100%; max-width: 520px;
    display: flex; flex-direction: column; align-items: center; gap: 1rem;
    position: relative; z-index: 1;
}
.auth-container { width: 100%; }

.auth-card {
    background: #fff; border-radius: 20px;
    padding: 2.5rem; width: 100%;
    box-shadow: 0 32px 80px rgba(0,0,0,0.35), 0 0 0 1px rgba(38,179,174,0.08);
}
.auth-card-wide { max-width: 620px; }

.auth-logo { text-align: center; margin-bottom: 1.5rem; }
.auth-logo img { height: 44px; }
.auth-brand { font-size: 1.6rem; font-weight: 800; color: var(--navy); }
.auth-title    { font-size: 1.4rem; font-weight: 800; color: #0d1f2d; margin-bottom: 0.3rem; }
.auth-subtitle { color: #64748B; font-size: 0.93rem; margin-bottom: 1.5rem; }

.form-label { font-weight: 600; color: #374151; font-size: 0.88rem; }
.form-control, .form-select {
    border-radius: 10px; border: 1.5px solid #e5e7eb;
    padding: 0.65rem 1rem; font-size: 0.9rem; transition: 0.2s;
}
.form-control:focus, .form-select:focus {
    border-color: var(--teal);
    box-shadow: 0 0 0 3px rgba(38,179,174,0.12);
    outline: none;
}
.input-group-text { background: #f9fafb; border-color: #e5e7eb; border-radius: 10px 0 0 10px; color: #9ca3af; }
.input-group .form-control { border-radius: 0 10px 10px 0; }
.input-group .btn { border-radius: 0 10px 10px 0; border-color: #e5e7eb; }

.btn-primary {
    background: linear-gradient(135deg, var(--navy) 0%, #1e3a50 100%);
    border: none; border-radius: 10px; font-weight: 700;
    padding: 0.75rem 1.5rem; color: #fff; transition: 0.2s;
}
.btn-primary:hover { opacity: 0.9; transform: translateY(-1px); color: #fff; box-shadow: 0 6px 20px rgba(13,31,45,0.3); }
.btn-lg { padding: 0.85rem 1.5rem; font-size: 1rem; }

.auth-footer { color: rgba(255,255,255,0.5); font-size: 0.8rem; text-align: center; }
.auth-footer a { color: rgba(255,255,255,0.7); transition: color 0.2s; }
.auth-footer a:hover { color: var(--teal-light); }

a.teal-link { color: var(--teal); text-decoration: none; font-weight: 600; }
a.teal-link:hover { color: #1a8f8b; text-decoration: underline; }

@media (max-width: 540px) { .auth-card { padding: 2rem 1.5rem; } }
