/* A4-Datenblatt. Aufbau und Maßstab folgen der Patchliste aus
   src/ma3patch/ui.ts, damit gedruckte RAMPENSAU-Unterlagen gleich aussehen. */

@page { size: A4 portrait; margin: 14mm 13mm 16mm; }

:root { color-scheme: light; }

html, body {
  background: #fff !important;
  color: #161616;
  font: 9.5pt/1.35 Inter, Arial, sans-serif;
}

body {
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

/* Bildschirmoberfläche verschwindet, das Datenblatt tritt an ihre Stelle. */
.topbar,
.layout,
noscript,
.no-print { display: none !important; }

.print-only { display: block !important; }

#datenblatt { color: #161616; }

/* ── Kopf ─────────────────────────────────────────────────────────────── */

.db-head {
  border-top: 3px solid #f07d00;
  padding-top: 5mm;
  margin-bottom: 7mm;
  break-inside: avoid;
}

.db-brand {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12mm;
}

.db-logo { display: block; width: auto; max-width: 42mm; max-height: 12mm; object-fit: contain; }

.db-kenndaten { border-collapse: collapse; min-width: 62mm; }

.db-kenndaten th,
.db-kenndaten td {
  border-bottom: .2mm solid #ddd;
  padding: 1.4mm 0;
  font-size: 8.5pt;
}

.db-kenndaten th { text-align: left; color: #666; font-weight: 400; padding-right: 6mm; }
.db-kenndaten td { text-align: right; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }

.db-head h1 {
  font-size: 19pt;
  line-height: 1.1;
  letter-spacing: -.02em;
  margin: 5mm 0 1.5mm;
}

.db-head p { margin: 0; color: #555; }

/* ── Karten ───────────────────────────────────────────────────────────── */

.db-karte { break-inside: avoid; margin-bottom: 6mm; }

.db-karte h2 {
  font-size: 8.5pt;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #666;
  border-bottom: .4mm solid #161616;
  padding-bottom: 1.2mm;
  margin: 0 0 2.5mm;
}

.db-spalten { display: grid; grid-template-columns: 1fr 1fr; gap: 8mm; }

.db-karte dl { margin: 0; }

.db-karte dl > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 3mm;
  border-bottom: .2mm dotted #ccc;
  padding: 1.3mm 0;
}

.db-karte dt { color: #555; }

.db-karte dd {
  margin: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 600;
  text-align: right;
  white-space: nowrap;
}

#db-warnungen { margin: 0; padding-left: 4.5mm; }
#db-warnungen li { margin-bottom: 1.2mm; color: #333; }

/* ── Skizzen ──────────────────────────────────────────────────────────── */

.db-skizze svg { width: 100%; height: auto; display: block; color: #161616; }

/* ── Folgeseiten ──────────────────────────────────────────────────────── */

.db-seite { break-before: page; }

.db-seite h2 {
  font-size: 8.5pt;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #666;
  border-bottom: .4mm solid #161616;
  padding-bottom: 1.2mm;
  margin: 0 0 3mm;
}

#datenblatt table.daten {
  border-collapse: collapse;
  width: 100%;
  font-size: 8.5pt;
  font-variant-numeric: tabular-nums;
}

#datenblatt table.daten thead { display: table-header-group; }

#datenblatt table.daten th {
  background: #242424 !important;
  color: #fff !important;
  padding: 2.2mm 2mm;
  text-align: right;
  font-weight: 500;
  font-size: 8pt;
}

#datenblatt table.daten td {
  padding: 2mm;
  text-align: right;
  border-bottom: .2mm solid #d8d8d8;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

#datenblatt table.daten th:first-child,
#datenblatt table.daten td:first-child { text-align: left; }
#datenblatt table.daten tr { break-inside: avoid; }

/* ── Testbild-Miniaturen ──────────────────────────────────────────────── */

.db-bild-gesamt { margin: 0 0 5mm; break-inside: avoid; }
.db-bild-gesamt img { width: 100%; height: auto; display: block; border: .2mm solid #bbb; }

.db-bild-raster { display: grid; gap: 4mm; }

.db-bild-raster figure { margin: 0; break-inside: avoid; }
.db-bild-raster img { width: 100%; height: auto; display: block; border: .2mm solid #bbb; }

#datenblatt figcaption {
  font-size: 7.5pt;
  color: #555;
  padding-top: 1mm;
  line-height: 1.25;
}

/* ── Fußzeile auf jeder Seite ─────────────────────────────────────────── */

.db-fuss {
  position: fixed;
  left: 0;
  right: 0;
  bottom: -10mm;
  text-align: center;
  color: #929292;
  font-size: 7pt;
  letter-spacing: .01em;
  margin: 0;
}
