/* ============================================================
   PRINTED MENU — A4, black ink on white paper
   The site's look (Cinzel, Garamond, the ember rule) without its dark ground:
   a full-bleed near-black page wastes toner, streaks on office printers and
   can't be read under a dim table light. Ember is kept for the rules only.
   ============================================================ */
@page{
  size:A4 portrait;margin:14mm 14mm 18mm;
  /* Claim every margin box the browser's own "Headers and footers" use (title
     and timestamp top, URL and page count bottom): Chrome only draws its own
     in the boxes the page leaves undefined. */
  @top-left{content:""}
  @top-center{content:""}
  @top-right{content:""}
  @bottom-left{content:""}
  @bottom-right{content:""}
  /* The provenance line on every page. Its text is set inline by the template. */
  @bottom-center{
    content:"";
    vertical-align:middle;
    font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:600;font-size:8pt;
    letter-spacing:.2em;text-transform:uppercase;color:#B75D24;
  }
}

:root{
  --ink:#1B140E;
  --ink-soft:#4A3F35;
  --ink-muted:#7A6D60;
  --ember:#B75D24;
  --rule:#D8CCBE;
  --font-display:"Cinzel",Georgia,serif;
  --font-body:"EB Garamond",Georgia,serif;
  --font-ui:"Barlow Condensed","Arial Narrow",sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-print-color-adjust:exact;print-color-adjust:exact}
body{background:#E7E2DB;color:var(--ink);font-family:var(--font-body);font-size:10.5pt;line-height:1.35}

/* ---------- screen: toolbar + a paper-width preview ---------- */
.toolbar{
  position:sticky;top:0;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;
  padding:12px 20px;background:#16100B;color:#E9DCC8;font-family:var(--font-ui);
  letter-spacing:.04em;font-size:15px;
}
.toolbar a{color:#F6C078;text-decoration:none}
.toolbar .hint{flex:1;color:#A8977F;min-width:200px}
.toolbar button{
  font:600 15px var(--font-ui);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;
  border:0;border-radius:4px;padding:10px 18px;color:#1A0E04;
  background:linear-gradient(180deg,#D98A40 0%,#B65E20 38%,#9C4517 60%,#C85C16 84%,#EA6B13 100%);
}

/* 210mm wide with the @page margins as padding, so what you see is the page. */
.sheet{
  width:210mm;max-width:100%;margin:24px auto;padding:14mm 14mm 16mm;
  background:#fff;box-shadow:0 8px 30px rgba(0,0,0,.18);
}

/* ---------- the menu ---------- */
.sheet-head{text-align:center;margin-bottom:7mm}
.brand{font-family:var(--font-display);font-weight:800;font-size:26pt;letter-spacing:.22em;line-height:1;padding-left:.22em}
.brand-sub{font-family:var(--font-ui);text-transform:uppercase;letter-spacing:.42em;font-size:8.5pt;color:var(--ink-muted);margin-top:2mm;padding-left:.42em}
.eyebrow{font-family:var(--font-ui);text-transform:uppercase;letter-spacing:.3em;font-size:8pt;color:var(--ember);font-weight:600;margin-bottom:1.5mm}
h1{font-family:var(--font-display);font-weight:700;font-size:19pt;letter-spacing:.06em;line-height:1.1}
.served{font-family:var(--font-ui);text-transform:uppercase;letter-spacing:.2em;font-size:8pt;color:var(--ink-muted);margin-top:1.5mm}

.rule{display:flex;align-items:center;gap:3mm;width:60mm;margin:4mm auto}
.rule span{flex:1;height:.6pt;background:var(--ember)}
.rule i{width:1.6mm;height:1.6mm;transform:rotate(45deg);background:var(--ember)}

.sec{margin-top:6mm}
/* "Start on a new page in the PDF", set per section in the admin. On screen
   it's a dashed line where the paper will be cut; in print, a real break. */
.sec-break{margin-top:8mm;padding-top:8mm;border-top:1pt dashed var(--rule)}
.sec-head{text-align:center;margin-bottom:3mm;break-after:avoid;page-break-after:avoid}
h2{
  font-family:var(--font-display);font-weight:700;font-size:12.5pt;letter-spacing:.12em;text-transform:uppercase;
  display:inline-block;padding:0 0 1.2mm;border-bottom:.6pt solid var(--ember);
}
.note{font-style:italic;color:var(--ink-muted);font-size:9.5pt;margin-top:1.5mm}

/* Two columns: a single column on A4 leaves a long gap between dish and price
   and runs most menus to an extra page. */
.items{column-count:2;column-gap:10mm}
.item{break-inside:avoid;page-break-inside:avoid;padding:1.6mm 0 2mm}
.top{display:flex;align-items:baseline;gap:2mm}
.nm{font-family:var(--font-display);font-weight:600;font-size:10pt;letter-spacing:.02em}
.leader{flex:1;min-width:6mm;border-bottom:.8pt dotted var(--ink-muted);transform:translateY(-1mm);opacity:.7}
.price{font-family:var(--font-ui);font-weight:600;font-size:10.5pt;white-space:nowrap}
.desc{font-style:italic;color:var(--ink-soft);font-size:9.5pt;margin-top:.6mm}
.badge{font-family:var(--font-ui);font-style:normal;text-transform:uppercase;letter-spacing:.12em;font-size:7pt;font-weight:600;color:var(--ember);white-space:nowrap}
.diet{display:flex;flex-wrap:wrap;gap:1.2mm;margin-top:.8mm}
.diet span{
  font-family:var(--font-ui);font-size:7pt;font-weight:600;letter-spacing:.08em;color:var(--ink-muted);
  border:.5pt solid var(--rule);border-radius:1mm;padding:0 1.2mm;line-height:1.5;
}

.empty{text-align:center;font-style:italic;color:var(--ink-muted);margin:10mm 0}

.sheet-foot{text-align:center;margin-top:7mm;break-inside:avoid;page-break-inside:avoid}
.provenance{
  font-family:var(--font-ui);font-weight:600;font-size:8pt;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ember);margin:0 0 2.5mm;
}
.fine{font-style:italic;font-size:8.5pt;color:var(--ink-muted);max-width:150mm;margin:0 auto}
.venue{font-family:var(--font-ui);text-transform:uppercase;letter-spacing:.16em;font-size:7.5pt;color:var(--ink-muted);margin-top:2.5mm}

/* ---------- print ---------- */
@media print{
  body{background:#fff}
  .toolbar{display:none}
  .provenance{display:none}
  /* @page supplies the margins now. */
  .sheet{width:auto;margin:0;padding:0;box-shadow:none}
  .sec-break{break-before:page;page-break-before:always;margin-top:0;padding-top:0;border-top:0}
}

@media screen and (max-width:640px){
  .sheet{margin:0;padding:18px}
  .items{column-count:1}
}