/* Customer login/register/reset-password design language — scoped under body.auth-page
   so it never touches admin/partner dashboards, the order form, or the homepage,
   which all share styles.css. Same palette/type system as home.css/customer.css. */

body.auth-page {
    --rc-bg: #F7F5F0;
    --rc-card: #FFFFFF;
    --rc-dark: #232320;
    --rc-mid: #55554E;
    --rc-muted: #8C8A80;
    --rc-green: #3D5A1E;
    --rc-green-mid: #4E7228;
    --rc-green-light: #6B9A35;
    --rc-green-pale: #EDF2E4;
    --rc-border: #E3DFD6;
    font-family: 'DM Sans', 'Inter', sans-serif;
    color: var(--rc-dark);
}

body.auth-page h1,
body.auth-page h2,
body.auth-page h3 {
    font-family: 'Fraunces', serif;
    font-weight: 500;
    letter-spacing: -0.01em;
}

/* Header / nav */
body.auth-page .header { background: rgba(247, 245, 240, 0.92); border-bottom: 1px solid var(--rc-border); }
body.auth-page .tagline { color: var(--rc-green); font-style: normal; letter-spacing: 0.02em; }
body.auth-page .nav-menu a { color: var(--rc-mid); }
body.auth-page .nav-menu a:hover { color: var(--rc-dark); }

/* Section background */
body.auth-page .auth-section {
    background: linear-gradient(135deg, var(--rc-bg) 0%, var(--rc-green-pale) 100%);
}

/* Decorative floating shapes — recolored from the old gray/blue into the warm green palette */
body.auth-page .auth-decoration svg path { stroke: var(--rc-green-light) !important; }
body.auth-page .auth-decoration svg ellipse,
body.auth-page .auth-decoration svg circle { fill: var(--rc-green-pale) !important; }

/* Card */
body.auth-page .auth-form {
    background: var(--rc-card);
    border: 1px solid var(--rc-border);
    border-top: 3px solid var(--rc-green);
    box-shadow: 0 12px 32px rgba(61, 90, 30, 0.1);
}
body.auth-page .auth-form::before {
    background: linear-gradient(90deg, var(--rc-green-light), var(--rc-green), var(--rc-green-light));
}
body.auth-page .auth-form h2 { color: var(--rc-dark); }
body.auth-page .auth-subtitle { color: var(--rc-mid); }
body.auth-page .auth-intro-note { color: var(--rc-mid); }

/* Form fields */
body.auth-page .form-group label { color: var(--rc-dark); font-family: 'DM Sans', sans-serif; font-weight: 500; }
body.auth-page .form-group input {
    border: 2px solid var(--rc-border);
    color: var(--rc-dark);
    font-family: 'DM Sans', sans-serif;
}
body.auth-page .form-group input:focus { border-color: var(--rc-green); }
body.auth-page .form-group small { color: var(--rc-muted); }

body.auth-page .checkbox-label a,
body.auth-page .checkbox-label a:visited { color: var(--rc-green); }
body.auth-page .checkbox-mark { border: 2px solid var(--rc-border); background: var(--rc-card); }
body.auth-page .checkbox-label input[type="checkbox"]:checked + .checkbox-mark {
    background: var(--rc-green);
    border-color: var(--rc-green);
}

/* Buttons + links */
body.auth-page .btn-primary { background: var(--rc-green); font-family: 'DM Sans', sans-serif; }
body.auth-page .btn-primary:hover { background: var(--rc-green-mid); }
body.auth-page .auth-links p { color: var(--rc-mid); }
body.auth-page .auth-links a { color: var(--rc-green); border-bottom-color: var(--rc-green); }
body.auth-page .auth-links a:hover { color: var(--rc-green-mid); }

/* Footer */
body.auth-page .footer { background: var(--rc-dark); }
body.auth-page .footer-section h3,
body.auth-page .footer-section h4 { font-family: 'Fraunces', serif; font-weight: 500; }
body.auth-page .footer-section ul li a:hover { color: var(--rc-green-light); }
body.auth-page .footer-bottom { border-top-color: #3a3a35; }