/* ==========================================================================
   Dick & Doof – Westalpen Rally 2026
   print.css (Agent: design, v2) — Roadbook-Druck für Tagesseiten + praxis.html.
   Einbindung: <link rel="stylesheet" href="css/print.css?v=20260704c" media="print">
   Ziel: sauberes Schwarz-auf-Weiß, keine Karten/Buttons/Galerien —
   Timeline, Stats und Infokästen kompakt auf Papier.
   ========================================================================== */

@page { margin: 14mm 14mm 20mm; }

html { scroll-behavior: auto; }
body {
  background: #fff !important;
  background-image: none !important;
  color: #111 !important;
  font-size: 11pt;
  line-height: 1.45;
}

/* Film-Korn-Overlay aus style.css wird zur Roadbook-Fußzeile umgewidmet */
body::after {
  content: "Dick & Doof – Westalpen Rally 2026 · Roadbook-Druck · Alle Angaben Stand Juli 2026, ohne Gewähr – vor Abfahrt prüfen: bardonecchia.it / +39 0122 99032";
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  inset: auto 0 0 0;
  z-index: 1;
  opacity: 1;
  pointer-events: none;
  background: none;
  background-image: none;
  border-top: 0.5pt solid #999;
  padding-top: 2mm;
  font-size: 7.5pt;
  letter-spacing: 0.04em;
  color: #555;
  text-align: center;
}

/* ----- Ausblenden: alles Interaktive/Dekorative ---------------------------- */
.site-nav,
.live-status,
.hero-scrollcue,
.hero-countdown,
.map-box,
.map,
.leaflet-container,
.map-error,
.btn,
.btn-gpx,
.btn-secondary,
.gpx-zip-link,
.gallery,
.figure,
.lightbox,
.day-nav,
.day-watermark,
.route-divider,
.wetter-slot,
.teaser-grid,
.compare-chart,
.footer-links,
.footer-logo,
canvas,
video,
audio,
iframe,
button {
  display: none !important;
}

/* ----- Grundfarben / Typografie --------------------------------------------- */
h1, h2, h3, .display { color: #000; text-shadow: none; }
a { color: #111; text-decoration: none; }
.prose { max-width: none; }
.prose p, .prose strong, li { color: #111; }
.prose strong, .info-box strong, .timeline-station { color: #000; }
.small, .section-kicker, .stat-label, .timeline-highlight, .etappen-info, .credit { color: #444; }
.section-kicker { color: #000; }

.section { padding: 12px 0; }
.section--tight { padding: 8px 0; }
.section-title { font-size: 16pt; break-after: avoid; }
h2, h3 { break-after: avoid; }

/* ----- Tageskopf: kompakter Titelblock statt Hero-Foto ----------------------- */
.day-hero, .hero {
  min-height: 0;
  border-bottom: 2pt solid #000;
  overflow: visible;
}
.day-hero .hero-bg, .hero-bg, .day-hero::after, .hero::after { display: none !important; }
.day-hero-inner, .hero-inner { padding: 0 0 8px; }
.day-number { color: #000; font-size: 22pt; text-shadow: none; }
.day-date { color: #333; text-shadow: none; }
.day-title, .hero-title { color: #000; font-size: 20pt; text-shadow: none; }
.day-subtitle, .hero-claim { color: #222; text-shadow: none; margin-bottom: 8px; }
.hero-logo { display: none; }
.date-badge { background: none; color: #000; border: 1pt solid #000; box-shadow: none; padding: 3px 10px; }

/* ----- Badges: Umriss-Chips ---------------------------------------------------- */
.badge {
  background: none !important;
  border: 0.75pt solid #666 !important;
  color: #111 !important;
  animation: none !important;
  box-shadow: none !important;
}
.badge::before { color: #111 !important; }

/* ----- Stat-Kacheln -------------------------------------------------------------- */
.stats { grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 10px 0; break-inside: avoid; }
.stat-tile {
  background: none;
  border: 0.75pt solid #999;
  border-top: 2.5pt solid #000;
  padding: 8px 10px 6px;
}
.stat-value { color: #000; font-size: 15pt; }
.stat-value small { color: #444; }

/* ----- Timeline -------------------------------------------------------------------- */
.timeline { margin: 10px 0; }
.timeline::before { background: #bbb; }
.timeline-item { padding: 4px 0; break-inside: avoid; }
.timeline-time { color: #000; }
.timeline-dot::before { background: #fff; border-color: #000; }
.timeline-highlight { font-size: 9.5pt; }

/* ----- Infokästen / Etappen-Info ------------------------------------------------------ */
.info-box {
  background: none;
  border: 0.75pt solid #999;
  border-left: 3pt solid #000;
  padding: 10px 14px;
  margin: 12px 0;
  break-inside: avoid;
}
.info-box--warn, .info-box--danger { border-left-color: #000; }
.info-box h3 { font-size: 12pt; }
.info-box li { margin-bottom: 4px; }
.etappen-info {
  background: none;
  border: 0.75pt solid #999;
  border-left: 3pt solid #000;
  color: #333;
  break-inside: avoid;
}

/* ----- Höhenprofil: bleibt (SVG), nur heller Rahmen ------------------------------------ */
.elevation-box {
  background: none;
  border: 0.75pt solid #999;
  padding: 10px 12px 6px;
  break-inside: avoid;
}
.elevation-box h3 { color: #333; }
.elevation-box svg text { fill: #333 !important; }
.elevation-box svg line { stroke: #ccc !important; }

/* ----- Tabellen (praxis.html, quellen.html) --------------------------------------------- */
.table-wrap { border: 0.75pt solid #999; overflow: visible; }
table.sources, table { background: none; font-size: 9pt; }
table.sources th, table th {
  background: #eee !important;
  color: #000;
}
table.sources th, table.sources td, table th, table td {
  border-bottom: 0.5pt solid #999;
  padding: 4px 8px;
}
table img { display: none; }

/* ----- Checklisten (praxis.html): Haken sichtbar lassen ---------------------------------- */
input[type="checkbox"] {
  -webkit-appearance: checkbox;
  appearance: checkbox;
  accent-color: #000;
}
label { color: #111; }

/* ----- Footer ------------------------------------------------------------------------------ */
.site-footer {
  background: none;
  border-top: 1pt solid #000;
  margin-top: 16px;
  padding: 8px 0 12mm;
  color: #333;
}
.footer-text { color: #333; font-size: 8.5pt; }
.footer-text .brand { color: #000; }

/* ----- Reveal-/Animations-Reste neutralisieren ----------------------------------------------- */
[data-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
.compare-bar { transition: none !important; }
*, *::before { animation: none !important; }
