/* ============================================================
   Lorbass v2 – Design-Tokens + Button-System (gemeinsame Basis)
   Zusammengeführt aus tokens.css + buttons.css (2026-06-24, PageSpeed-
   Optimierung: "Anfragen zum Blockieren des Renderings" - weniger
   render-blocking CSS-Requests, ohne Node/npm-Build). Genutzt von
   public.html.twig, admin.html.twig UND login.html.twig (eigenständige
   Seite ohne Layout-Vererbung) - einzige Quelle für Tokens/Buttons.
   ============================================================ */

@font-face {
  font-family: 'DirtyHeadline';
  /* woff2 zuerst (72 KB statt 181 KB TTF, aus derselben Schriftdatei konvertiert) -
     kleinere Datei lädt schneller, kürzeres Fallback-Fenster -> weniger CLS. */
  src: url('../../fonts/dirty-headline.woff2') format('woff2'),
       url('../../fonts/Dirty_Headline.ttf') format('truetype');
  font-display: swap;
}
@font-face {
  font-family: 'DM Sans';
  src: url('../../fonts/dm-sans-300.woff2') format('woff2');
  font-weight: 300; font-display: swap;
}
@font-face {
  font-family: 'DM Sans';
  src: url('../../fonts/dm-sans-400.woff2') format('woff2');
  font-weight: 400; font-display: swap;
}
@font-face {
  font-family: 'DM Sans';
  src: url('../../fonts/dm-sans-500.woff2') format('woff2');
  font-weight: 500; font-display: swap;
}
@font-face {
  font-family: 'DM Serif Display';
  src: url('../../fonts/dm-serif-display-400.woff2') format('woff2');
  font-weight: 400; font-display: swap;
}

:root {
  /* Marken-Palette (Stand Mockup) */
  --bg:          #0d0d0d;
  --surface:     #161616;
  --surface2:    #1e1e1e;
  --border:      #2a2a2a;
  --accent:      #c8a96e;   /* Gold */
  --accent-dim:  #7a6440;
  --accent-hover:#e0c080;
  --text:        #e8e4dc;
  --muted:       #9a9a9a;   /* Kontrast-Fix ggü. altem #6b6b6b (WCAG AA) */
  --muted-2:     #6b6b6b;   /* nur für bewusst zurückgenommenen Text (z. B. "Geschlossen") */
  --red:         #cc0000;   /* LORBASS-Schriftzug – bewusst ROT (nicht weiß/gold) */
  --red-hover:   #ff2a2a;

  /* Radien */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 16px;

  /* Schriften */
  --font-sans:     'DM Sans', system-ui, -apple-system, sans-serif;
  --font-serif:    'DM Serif Display', Georgia, serif;
  --font-headline: 'DirtyHeadline', Impact, 'Arial Black', sans-serif;

  /* Layout */
  --container: 64rem; /* entspricht max-w-5xl des Mockups */
  --header-h:  70px;  /* = .site-header .bar Höhe; einzige Quelle für alles,
                          das unter dem Header sticky positioniert wird
                          (z. B. .menu-tabs) */
}

/* ── Gemeinsames Button-System ──
   Genutzt von app.css (öffentlich) UND admin.css (Admin) – vorher gab es
   zwei leicht unterschiedliche .btn-Definitionen in beiden Dateien
   (Copy-Paste-Drift). Jetzt eine Quelle. */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 44px; padding: .75rem 1.5rem; border-radius: var(--radius-md);
  font-family: inherit; font-weight: 500; font-size: .95rem; cursor: pointer;
  text-decoration: none; border: 1px solid transparent; transition: all .2s;
  /* Reset für <button>-Elemente (z. B. Formular-Submits) - ohne das setzt der
     Browser seinen UA-Standardhintergrund, <a class="btn">-Links waren davon
     nie betroffen, da Links von sich aus keinen Hintergrund haben. */
  background: none;
}
.btn-primary { background: var(--accent); color: var(--bg); }
.btn-primary:hover { background: var(--accent-hover); }
.btn-outline { border-color: var(--border); color: var(--text); }
.btn-outline:hover { border-color: var(--accent); color: var(--accent); }
/* Für destruktive Aktionen (Stornieren, Löschen-Bestätigung) - "danger" allein
   war nie definiert, der Button blieb daher unstyled/schwer lesbar. */
.btn-danger { border-color: var(--red); color: var(--red); }
.btn-danger:hover { background: var(--red); color: #fff; border-color: var(--red); }
.btn-sm { min-height: 40px; padding: .45rem .9rem; font-size: .85rem; }
.btn svg { width: 1rem; height: 1rem; }
