/**
 * Pulsive — Auth Pages Shared Styles
 * Used by: login.php, forgot-password.php, reset-password.php
 * Requires: brand.css loaded before this file
 */

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
    font-family: 'Inter', sans-serif;
    background: var(--bg);
    color: var(--tx);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.auth-card {
    background: var(--card);
    border: 1px solid var(--bd);
    border-radius: var(--r);
    padding: 3rem;
    width: 100%;
    max-width: 420px;
}

.auth-logo { font-size: 1.5rem; font-weight: 700; margin-bottom: 0.25rem; }
.auth-logo span { color: var(--pr); }

.auth-subtitle {
    color: var(--txm); font-size: 0.85rem; margin-bottom: 2rem;
    padding-bottom: 1.5rem; border-bottom: 1px solid var(--bd);
}

.auth-card label {
    display: block; font-size: 0.8rem; color: var(--txs);
    margin-bottom: 0.5rem; font-weight: 500;
}

.auth-card input[type="email"],
.auth-card input[type="password"],
.auth-card input[type="text"] {
    width: 100%; padding: 0.75rem 1rem;
    background: var(--bg); border: 1px solid var(--bd);
    border-radius: var(--r-sm); color: var(--tx);
    font-size: 0.95rem; margin-bottom: 1.25rem;
    font-family: inherit; outline: none;
    transition: border-color 0.2s;
}
.auth-card input:focus { border-color: var(--pr); }

.auth-btn {
    width: 100%; padding: 0.75rem;
    background: var(--gd); color: white;
    border: none; border-radius: var(--r-sm);
    font-size: 0.95rem; font-weight: 600;
    cursor: pointer; font-family: inherit;
    transition: opacity 0.15s;
}
.auth-btn:hover { opacity: 0.88; }

.auth-link {
    display: block; text-align: right; margin: -0.75rem 0 1.25rem;
    color: var(--prl); font-size: 0.78rem; text-decoration: none;
}
.auth-link:hover { color: var(--pr); }

.auth-error {
    background: var(--err-bg); border: 1px solid var(--err-bd);
    color: var(--err-tx); padding: 0.75rem;
    border-radius: var(--r-sm); margin-bottom: 1.25rem; font-size: 0.85rem;
}

.auth-success {
    background: #0d3320; border: 1px solid #22c55e;
    color: #86efac; padding: 0.75rem;
    border-radius: var(--r-sm); margin-bottom: 1.25rem; font-size: 0.85rem;
}

.auth-hint {
    color: var(--txm); font-size: 0.8rem; margin-bottom: 1.5rem; line-height: 1.5;
}

.auth-footer {
    margin-top: 1.5rem; text-align: center;
    font-size: 0.8rem; color: var(--txm);
}
.auth-footer a { color: var(--prl); text-decoration: none; }
.auth-footer a:hover { color: var(--pr); }

.auth-unverified { line-height: 1.5; }
.auth-resend {
    display: inline-block; margin-top: 0.5rem;
    color: var(--err-tx); font-weight: 600; font-size: 0.8rem; text-decoration: underline;
}

/* ── Responsive ── */
@media (max-width: 480px) {
    .auth-card { padding: 2rem 1.5rem; }
    .auth-logo { font-size: 1.3rem; }
}