/* ===== Metzgerei-Theme: ruhig, gut lesbar, kompakt (History) ===== */
:root{
  --bg: #f6f5f3;
  --card: #ffffff;
  --ink: #1f2937;
  --muted: #6b7280;
  --line: #e5e7eb;

  --brand: rgba(163,153,67,1);  /* Gold statt Burgundrot */
  --badge: #fffbe3;             /* helles Goldgelb */
  --badge-ink: #8a6d00;         /* dunkles Bronze */
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  font-size: 17px; line-height: 1.5; color: var(--ink);
  background: var(--bg); margin:0;
}

.container{ width: min(1100px, 94vw); margin: 20px auto 40px; }

/* Header */
.header{ display:flex; align-items:center; justify-content:space-between;
  width:min(1100px,94vw); margin: 14px auto 0; padding: 6px 0; }
.brand{display:flex; align-items:center; gap:10px}
.brand img{height:40px; width:auto; display:block}
.brand-text{line-height:1.1}
.brand-name{font-weight:700; color:var(--brand); font-size:20px}
.brand-sub{color:var(--muted); font-size:13px}
.nav{display:flex; gap:8px; flex-wrap:wrap}

/* Typo */
h1{margin: 8px 0 10px; font-size: 24px; color: var(--brand);}
.muted{color: var(--muted);}

/* Suchleiste */
.search{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin: 10px 0 16px; }
.input{
  font-size: 16px; padding: 8px 10px; border:1px solid var(--line); border-radius:8px; background:#fff;
}
.input:focus{ outline:none; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(163,153,67,0.18); }

/* Buttons */
.btn{
  appearance:none; border:none; cursor:pointer; text-decoration:none;
  display:inline-flex; align-items:center; justify-content:center;
  gap:6px; padding: 8px 12px; border-radius: 8px; font-weight:700;
  background: var(--brand); color:#fff; transition: filter .15s ease;
  font-size: 15px;
}
.btn:hover{ filter: brightness(0.97); }
.btn-slim{ padding: 6px 10px; font-size: 14px; border-radius: 7px; }

/* Karten & Layout */
.card{
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px;
  margin: 10px 0;
  box-shadow: 0 1px 0 rgba(0,0,0,0.02);
}
.row{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.ml-auto{ margin-left: auto; }

/* Badges */
.pill{
  background: var(--badge);
  color: var(--badge-ink);
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
}

/* Items-Liste */
.items{ margin-top: 8px; font-size: 14px; color:#374151; }
.items ul{ padding-left: 18px; margin: 6px 0 0; }

/* A11y */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

@media print{
  body{ background:#fff; }
  .header, .search { display:none !important; }
  .container{ width: 100%; margin:0; }
}