/* theme.css, shared palette, type, buttons, and seat/table rendering.
   Loaded by index / editor / book / account so the product reads as one thing.
   Direction: warm paper and ink. Light surfaces, hairline borders, one
   wine accent, big tight Inter headlines in sentence case. Calm, printed,
   nothing glows. */
/* self-hosted (fonts/, OFL-licensed), no third-party requests */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url("fonts/inter-var.woff2") format("woff2")}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url("fonts/spacemono-400.woff2") format("woff2")}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;src:url("fonts/spacemono-700.woff2") format("woff2")}

:root{
  --bg:#F7F5F1; --panel:#FFFFFF; --panel2:#FBFAF7; --raise:#EFECE5;
  --line:rgba(26,24,20,.10); --line2:rgba(26,24,20,.16);
  --text:#1A1814; --dim:#5C574D; --faint:#8A8377;

  --accent:#8A3B4A; --accent2:#6E2C39; --ember:#D9A0AC;
  --sand:#B4A98E; --pewter:#8B8577;
  --teal:#3E9B5F; --teal2:#2E7A49;
  --res-fill:#E7E3DB; --res-stroke:#B7B0A2;
  --danger:#C0392B;

  /* illustration-only shade, hero extruded table bases: #D9D3C6 */

  /* legacy aliases still referenced by pages */
  --champagne:var(--accent); --champagne2:var(--accent2);
  --ivory:var(--sand); --ink:var(--text); --ink2:var(--panel); --ink3:var(--panel2);

  --font-display:'Inter',system-ui,sans-serif;
  --font-ui:'Inter',system-ui,sans-serif;
  --font-mono:'Space Mono','SF Mono',ui-monospace,monospace;
  --r:2px; /* corners stay square, printed feel */
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--font-ui);color:var(--text);background:var(--bg);
  -webkit-font-smoothing:antialiased;line-height:1.5;min-height:100vh;
}
a{color:inherit}
::selection{background:var(--accent);color:#fff}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* display type: Inter, heavy and tight, sentence case */
.px{font-family:var(--font-display);font-weight:650;letter-spacing:-.02em;line-height:1.1}

.eyebrow{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--accent);margin:0 0 14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--accent);opacity:.8}

/* buttons, flat, bordered, no glow */
.btn{
  border:1px solid var(--text);border-radius:var(--r);padding:12px 18px;cursor:pointer;
  font-family:var(--font-ui);font-weight:550;font-size:14px;letter-spacing:.01em;
  background:var(--text);color:#fff;
  transition:background .15s ease,border-color .15s ease,opacity .2s;white-space:nowrap;
}
.btn:hover:not(:disabled){background:#33302A;border-color:#33302A}
.btn:disabled{opacity:.4;cursor:not-allowed}
.btn.accent,.btn.teal{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.btn.accent:hover:not(:disabled),.btn.teal:hover:not(:disabled){background:var(--accent2);border-color:var(--accent2)}
.btn.ghost{background:var(--panel);color:var(--text);border:1px solid var(--line2);font-weight:500}
.btn.ghost:hover:not(:disabled){border-color:var(--pewter);background:var(--panel2)}
.btn.sm{padding:8px 12px;font-size:13px}

/* site nav, identical on every page: brand left, one boxed tab bar.
   On small screens the tabs drop to their own full-width row. */
.sitenav{display:flex;align-items:center;justify-content:space-between;gap:12px 16px;padding:18px 0;flex-wrap:wrap}
.sitenav .brand{font-weight:650;font-size:17px;letter-spacing:-.01em;display:flex;align-items:center;gap:10px;text-decoration:none;white-space:nowrap;color:var(--text)}
.sitenav .brand .mark{width:22px;height:22px;flex:none}
.tabs{display:flex;border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;background:var(--panel)}
.tabs a{font-size:13px;color:var(--dim);text-decoration:none;padding:9px 16px;border-right:1px solid var(--line);white-space:nowrap}
.tabs a:last-child{border-right:none}
.tabs a:hover{color:var(--text)}
.tabs a.on{background:var(--raise);color:var(--text)}
.tabs a:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
@media(max-width:720px){
  .sitenav .tabs{width:100%}
  .sitenav .tabs a{flex:1;text-align:center;padding:9px 2px;font-size:12.5px}
}

/* form fields (shared by book / account / editor) */
.field{margin:0 0 14px}
.field label{display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin:0 0 7px}
.field input,.field select{
  width:100%;padding:12px 13px;border-radius:var(--r);border:1px solid var(--line2);
  background:var(--panel);color:var(--text);font-family:var(--font-ui);font-size:14px;
}
.field input:focus,.field select:focus{outline:none;border-color:var(--accent)}
.field .err{color:var(--danger);font-size:11.5px;margin-top:5px;display:none}
.field.invalid .err{display:block}.field.invalid input{border-color:var(--danger)}

/* ---- shared seat/table rendering (output of SeatChart.renderTableInner) ---- */
.sc-seat{fill:var(--tier,#B4A98E);stroke:rgba(26,24,20,.3);stroke-width:.6;transition:fill .2s ease, stroke .2s ease, transform .1s ease}
.sc-seat.selected{fill:var(--teal);stroke:#1E4A2E}
.sc-seat.reserved{fill:var(--res-fill);stroke:var(--res-stroke)}
.sc-tabletop{fill:rgba(26,24,20,.015);stroke:var(--pewter);stroke-width:1.5}
.sc-tablebar{fill:rgba(26,24,20,.03);stroke:var(--pewter);stroke-width:1.3}
.sc-tablelabel{fill:var(--dim);font-family:var(--font-mono);font-size:12px;font-weight:700;text-anchor:middle;pointer-events:none}
.sc-seatnum{fill:#1A1814;font-family:var(--font-mono);font-size:9px;font-weight:700;text-anchor:middle;pointer-events:none}

@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}
