/* ═══════════════════════════════════════════════════════════════════
   EatEasy Login Page — 2026
   Palette matches all other site templates
═══════════════════════════════════════════════════════════════════ */
:root {
    --clr-bg:         #EDF0F4;
    --clr-surface:    #ffffff;
    --clr-surface-2:  #FBFCFF;
    --clr-border:     #CDD7F0;
    --clr-text:       #1a2535;
    --clr-text-muted: #4a5568;
    --clr-accent:     #3a6bc4;
    --clr-accent-dk:  #2a54a0;
    --clr-hero-bg:    #f5ffff;
    --clr-strip-bg:   #D3D7E2;
    --clr-btn-bg:     #D5E3F0;
    --clr-btn-border: #000000;
    --clr-btn-text:   #1a2535;
    --clr-btn-hover:  #B3C6EA;
    --clr-error:      #991b1b;
    --clr-error-bg:   #fee2e2;
    --clr-ok:         #166534;
    --clr-ok-bg:      #dcfce7;
    --font-display: 'Inter', 'DM Sans', sans-serif;
    --font-body:      'DM Sans', 'Segoe UI', Helvetica, Arial, sans-serif;
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 18px;
    --shadow-md: 0 4px 16px rgba(15,39,68,.11);
    --max-width: 1160px;
    --header-h:  62px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.65;
    color: var(--clr-text);
    background: var(--clr-bg);
    -webkit-font-smoothing: antialiased;
    padding-top: var(--header-h);
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--clr-accent); text-decoration: none; }
a:hover { color: var(--clr-accent-dk); text-decoration: underline; }
address { font-style: normal; }

/* ── Header ── */
.site-header { position: fixed; top:0; left:0; right:0; z-index:1000; background:#fff; border-bottom:1px solid #000; }
.header-inner { max-width:var(--max-width); margin:0 auto; padding:0 1.5rem; height:var(--header-h); display:flex; align-items:center; gap:1.25rem; }
.logo-link { display:flex; align-items:center; flex-shrink:0; }
.logo-img  { height:36px !important; width:auto !important; max-width:140px; max-height:36px; object-fit:contain; display:block; }
.nav-toggle { display:none; flex-direction:column; justify-content:center; gap:5px; background:none; border:1px solid var(--clr-border); border-radius:var(--radius-sm); padding:6px 8px; cursor:pointer; margin-left:auto; flex-shrink:0; }
.nav-toggle span { display:block; width:20px; height:2px; background:var(--clr-text); border-radius:1px; }
.main-nav { margin-left:auto; }
.main-nav ul { list-style:none; display:flex; align-items:center; }
.main-nav a { display:block; color:var(--clr-text); font-size:.875rem; font-weight:500; padding:.5rem .85rem; border-radius:var(--radius-sm); white-space:nowrap; transition:background .2s,color .2s; }
.main-nav a:hover { background:var(--clr-strip-bg); color:var(--clr-accent); text-decoration:none; }
@media(max-width:760px){
    .nav-toggle{display:flex;}
    .main-nav{position:absolute;top:var(--header-h);left:0;right:0;background:#fff;border-top:1px solid var(--clr-border);box-shadow:0 4px 12px rgba(0,0,0,.1);max-height:0;overflow:hidden;transition:max-height .3s ease;z-index:999;}
    .main-nav.open{max-height:320px;}
    .main-nav ul{flex-direction:column;align-items:stretch;padding:.5rem 1rem 1rem;gap:.2rem;}
    .main-nav a{padding:.65rem .75rem;}
}

/* ── Page band ── */
.page-band { background:var(--clr-hero-bg); border-bottom:1px solid #000; padding:2rem 0; }
.page-band-inner { max-width:var(--max-width); margin:0 auto; padding:0 1.5rem; }
.page-band h1 { font-family:var(--font-display); font-size:clamp(1.5rem,3vw,2.2rem); font-weight:900; color:var(--clr-text); }

/* ── Form card ── */
.page-main { max-width:var(--max-width); margin:0 auto; padding:2rem 1.5rem 3rem; display:flex; justify-content:center; }
.form-card { background:var(--clr-surface); border:1px solid var(--clr-border); border-radius:var(--radius-lg); padding:2rem 2.25rem; width:100%; max-width:440px; box-shadow:var(--shadow-md); }
.form-card h2 { font-family:var(--font-display); font-size:1.3rem; font-weight:700; margin-bottom:1.5rem; }

.form-row { margin-bottom:1.1rem; }
.form-row label { display:block; font-size:.8rem; font-weight:600; color:var(--clr-text-muted); text-transform:uppercase; letter-spacing:.04em; margin-bottom:.35rem; }
.form-row input { display:block; width:100%; border:1.5px solid var(--clr-border); border-radius:var(--radius-sm); padding:.65rem .85rem; font-family:var(--font-body); font-size:.975rem; color:var(--clr-text); background:var(--clr-surface-2); outline:none; transition:border-color .2s,box-shadow .2s; }
.form-row input:focus { border-color:var(--clr-accent); box-shadow:0 0 0 3px rgba(58,107,196,.12); }

.submit-btn { display:block; width:100%; background:var(--clr-btn-bg); color:var(--clr-btn-text); border:1px solid var(--clr-btn-border); border-radius:var(--radius-sm); padding:.8rem 1rem; font-family:var(--font-body); font-size:1rem; font-weight:700; cursor:pointer; transition:background .2s; margin-top:1.5rem; }
.submit-btn:hover { background:var(--clr-btn-hover); }

.form-links { margin-top:1.1rem; font-size:.875rem; color:var(--clr-text-muted); text-align:center; }
.form-links a { color:var(--clr-accent); font-weight:600; }

.alert { padding:.75rem 1rem; border-radius:var(--radius-sm); font-size:.9rem; margin-bottom:1.1rem; }
.alert-error { background:var(--clr-error-bg); color:var(--clr-error); border:1px solid rgba(153,27,27,.2); }
.alert-ok    { background:var(--clr-ok-bg);    color:var(--clr-ok);    border:1px solid rgba(22,101,52,.2); }

/* ── Footer ── */
.site-footer { background:#fff; border-top:1px solid var(--clr-border); color:var(--clr-text-muted); margin-top:1.5rem; }
.footer-inner { max-width:var(--max-width); margin:0 auto; padding:2rem 1.5rem 1.5rem; display:grid; grid-template-columns:auto 1fr; gap:1.25rem 2.5rem; align-items:start; }
@media(max-width:600px){.footer-inner{grid-template-columns:1fr;}}
.footer-brand { display:flex; flex-direction:column; gap:.5rem; }
.footer-logo  { height:28px !important; width:auto !important; max-width:110px; max-height:28px; object-fit:contain; }
.footer-brand address { font-size:.82rem; line-height:1.6; }
.footer-brand strong  { color:var(--clr-text); }
.footer-brand a { color:var(--clr-accent); font-size:.82rem; }
.footer-links { display:flex; flex-wrap:wrap; gap:.25rem .5rem; }
.footer-links a { color:var(--clr-text-muted); font-size:.78rem; }
.footer-links a:hover { color:var(--clr-accent); text-decoration:underline; }
.footer-copy { grid-column:1/-1; font-size:.75rem; border-top:1px solid var(--clr-border); padding-top:.85rem; margin-top:.2rem; }
