/* Kopie von packages/core/src/paper.css – nicht hier ändern, sondern dort und dann: npm run wp:css */
/*
 * Das Papier: die Gestaltung dessen, was renderCard() ausgibt.
 *
 * Gehört zum Renderer und liegt deshalb mit ihm in @kartenwerk/core – die
 * Einbindung auf der Website und das PDF brauchen genau diese Regeln und
 * sonst nichts aus dem Editor. Der Editor bindet sie als
 * `@kartenwerk/core/paper.css` ein.
 *
 * Darf nicht scoped werden: das HTML kommt als Zeichenkette über v-html und
 * trägt deshalb keine Scope-Kennung der Komponente.
 *
 * Farbe, Überschriften- und Textschrift setzt die Vorschau am Element selbst;
 * die Werte hier sind nur die Vorgabe.
 */

/* Vorgaben nur am Papier, nicht an :root – auf Kundenseiten würden sie sonst
   gleichnamige Variablen des Themes überschreiben. */
.paper{
--paper-ink:#1F2A22; --paper-green:#2F5D3A; --paper-gold:#9C7A17; --paper-muted:#5E665F;
--menu:Georgia,"Times New Roman",serif;
--menu-sc:Georgia,"Times New Roman",serif;
}

.paper{background:#fff; color:var(--paper-ink); font-family:var(--menu); margin:0 auto; max-width:640px; font-size:15px; padding:40px 44px 34px; border-radius:4px; box-shadow:0 1px 2px rgba(0,0,0,.06),0 10px 28px rgba(0,0,0,.08)}
.paper.sheet{aspect-ratio:210/297; overflow:hidden; padding:6% 7%; font-size:11px}
.paper.sheet.a5{font-size:15px}
.paper.sheet.pcols2 .m-body{column-count:2; column-gap:2.4em}
.m-head{text-align:center; margin-bottom:1.8em}
.m-logo{display:block; max-height:5.2em; max-width:55%; margin:0 auto .5em}
.m-house{font-family:var(--menu-sc); font-weight:700; color:var(--paper-green); letter-spacing:.08em}
.m-title{font-family:var(--menu-sc); font-weight:500; font-size:2.3em; line-height:1.05; margin:.15em 0 .2em}
.m-title-en{font-family:var(--menu-sc); font-size:1.15em; color:var(--paper-muted); margin-bottom:.2em}
.m-sub{font-style:italic; color:var(--paper-muted)}
.m-orn{display:flex; align-items:center; gap:.6em; justify-content:center; color:var(--paper-gold); margin-top:.7em}
.m-orn::before,.m-orn::after{content:""; height:1px; width:3.5em; background:currentColor}
.m-body > .m-cat:first-child{margin-top:0}
.m-cat{font-family:var(--menu-sc); font-weight:700; color:var(--paper-green); font-size:1.3em; margin:1.5em 0 .5em; display:flex; align-items:baseline; gap:.5em; break-after:avoid}
.m-cat::after{content:""; flex:1; border-bottom:1px dotted var(--paper-gold); transform:translateY(-.25em)}
.m-cat .en{font-weight:400; font-size:.72em; color:var(--paper-muted)}
.m-catnote{font-style:italic; color:var(--paper-muted); margin:-.3em 0 .6em}
.m-item{display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:1.2em; margin:0 0 .85em; break-inside:avoid}
.m-name{font-weight:600; grid-column:1; grid-row:1}
.m-name sup{font-weight:400; color:var(--paper-muted); font-size:.68em; margin-left:.25em}
.m-desc{font-style:italic; color:var(--paper-muted); grid-column:1; line-height:1.35; max-width:34em}
.m-en{grid-column:1; color:var(--paper-muted); font-size:.88em; line-height:1.35}
.m-en b{font-weight:600; color:var(--paper-ink)}
.m-extra{grid-column:1; color:var(--paper-muted); font-size:.9em}
.m-price{font-weight:600; white-space:nowrap; grid-column:2; grid-row:1; text-align:right}
.m-tag{display:inline-block; font-family:var(--ui); font-size:.62em; font-weight:600; color:var(--paper-green); border:1px solid var(--paper-green); border-radius:999px; padding:0 .55em; margin-left:.45em; vertical-align:.18em}
.m-note{text-align:center; font-style:italic; background:#F3F5EF; border-radius:3px; padding:.6em .9em; margin:1.2em 0; break-inside:avoid}
.m-legend{margin-top:2em; padding-top:.8em; border-top:1px solid #DDE2DA; font-size:.78em; color:var(--paper-muted); line-height:1.5}
.m-notes{margin-top:2mm}
.m-notes sup{color:var(--menu-accent,inherit)}
.m-foot{text-align:center; margin-top:1.2em; font-size:.8em; color:var(--paper-muted)}
.m-address{text-align:center; margin-top:.5em; font-size:.8em; color:var(--paper-muted)}
.m-empty{font-family:var(--ui); text-align:center; color:var(--paper-muted); padding:2em 0; font-size:14px}

@media print{
  .paper,.paper.sheet{box-shadow:none; max-width:none; padding:0; font-size:11pt; aspect-ratio:auto; overflow:visible}
  .paper.a5,.paper.sheet.a5{font-size:9.5pt}
  .paper.pcols2 .m-body{column-count:2; column-gap:8mm}
}
