/* FoodFusion auth pages refresh */
body.ff-public-shell.auth-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 18% 22%, rgba(240, 141, 73, 0.12), transparent 32%),
        radial-gradient(circle at 82% 12%, rgba(214, 177, 92, 0.16), transparent 30%),
        radial-gradient(circle at 70% 78%, rgba(141, 85, 54, 0.12), transparent 32%),
        linear-gradient(180deg, #120e0b 0%, #0f0a08 60%, #0b0806 100%);
    color: var(--ff-ink);
    font-family: "Manrope", "Segoe UI", sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1.25rem;
    position: relative;
}

body.ff-public-shell.auth-body::before {
    content: "";
    position: fixed;
    inset: 0;
    background:
        radial-gradient(circle at 25% 35%, rgba(240, 141, 73, 0.08), transparent 28%),
        linear-gradient(180deg, rgba(18, 14, 11, 0.4), rgba(12, 9, 7, 0.75)),
        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="140" height="140"><filter id="noise"><feTurbulence type="fractalNoise" baseFrequency="0.8" numOctaves="3" stitchTiles="stitch"/></filter><rect width="140" height="140" filter="url(%23noise)" opacity="0.03"/></svg>');
    pointer-events: none;
    z-index: 1;
}

body.ff-public-shell.auth-body a {
    transition: color 0.2s ease, opacity 0.2s ease, border-color 0.2s ease;
}

.form-container {
    position: relative;
    z-index: 2;
    width: min(520px, 100%);
}

.form-card {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, rgba(37, 27, 22, 0.92), rgba(20, 14, 11, 0.98));
    border: 1px solid var(--ff-border);
    border-radius: 24px;
    box-shadow:
        0 28px 70px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 248, 235, 0.04);
}

.form-card::before {
    content: "";
    position: absolute;
    inset: -20% auto auto -10%;
    width: 220px;
    height: 220px;
    background: radial-gradient(circle, rgba(240, 141, 73, 0.16), transparent 55%);
    filter: blur(6px);
    opacity: 0.8;
    pointer-events: none;
}

.form-card::after {
    content: "";
    position: absolute;
    inset: auto -18% -20% auto;
    width: 260px;
    height: 260px;
    background: radial-gradient(circle, rgba(214, 177, 92, 0.18), transparent 62%);
    filter: blur(10px);
    opacity: 0.75;
    pointer-events: none;
}

.auth-header {
    position: relative;
    text-align: center;
    margin-bottom: 2.25rem;
}

.auth-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: transparent;
    box-shadow: none;
    margin-bottom: 1.25rem;
}

.auth-badge img,
.auth-logo {
    height: 150px;
    max-width: 190px;
    width: auto;
    display: block;
    filter: drop-shadow(0 8px 20px rgba(240, 141, 73, 0.28));
}

.auth-title {
    color: #fff4e3;
    font-family: "Georgia", serif;
    letter-spacing: -0.04em;
}

.auth-subtitle {
    color: var(--ff-muted);
    line-height: 1.6;
}

.luxury-label {
    color: var(--ff-accent);
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.luxury-input {
    background: rgba(255, 248, 235, 0.08);
    border: 1px solid var(--ff-border);
    color: var(--ff-ink);
    transition: all 0.28s ease;
    caret-color: var(--ff-accent);
    border-radius: 14px;
}

.luxury-input::placeholder {
    color: var(--ff-soft);
}

.luxury-input:focus {
    background: rgba(255, 248, 235, 0.92);
    color: #1c120d;
    border-color: var(--ff-border-strong);
    outline: none;
    box-shadow:
        0 0 0 1px var(--ff-border-strong),
        0 0 0 10px var(--ff-glow);
}

.luxury-input:focus::placeholder {
    color: #a89880;
}

.luxury-input:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-luxury {
    background: linear-gradient(135deg, var(--ff-accent), var(--ff-accent-2));
    color: #1c120d;
    font-weight: 800;
    letter-spacing: 0.01em;
    border-radius: 14px;
    box-shadow: 0 16px 32px rgba(240, 141, 73, 0.24);
    transition: transform 0.22s ease, box-shadow 0.22s ease, filter 0.22s ease;
}

.btn-luxury:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 18px 40px rgba(240, 141, 73, 0.32);
    filter: brightness(1.02);
}

.btn-luxury:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    box-shadow: none;
}

.alert-luxury-error {
    background: rgba(240, 141, 73, 0.1);
    border: 1px solid rgba(240, 141, 73, 0.35);
    color: #ffd5bd;
}

.alert-luxury-success {
    background: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.32);
    color: #a7f3d0;
}

.auth-muted {
    color: var(--ff-muted);
}

.auth-link {
    color: var(--ff-accent);
    font-weight: 700;
}

.auth-link:hover {
    color: #f6c98d;
}

.auth-back {
    color: var(--ff-muted);
}

.auth-back:hover {
    color: var(--ff-ink);
}

#caps-warning,
#caps-warning-confirm {
    color: #f6d36b;
    background: rgba(214, 177, 92, 0.14);
    border: 1px solid rgba(214, 177, 92, 0.32);
}

.strength-bar-weak {
    background: #f08d49;
}

.strength-bar-medium {
    background: var(--ff-accent);
}

.strength-bar-strong {
    background: #34d399;
}

.rule-passed {
    color: var(--ff-accent);
}

.rule-pending {
    color: var(--ff-soft);
}

.rule-icon {
    font-weight: 700;
}

.lockout-box {
    text-align: center;
}
