/* foto-daten.css — /tools/foto-daten (05.10.2026). Baut auf werkzeug.css auf. */
.fd { display: flex; flex-direction: column; gap: 1rem; max-width: 50rem; margin: 0 auto; }
.fd [hidden] { display: none !important; }
.fd-symbol { background: linear-gradient(145deg, #3aa0e0, #1a6aaa); }
.fd-arbeit { display: flex; flex-direction: column; gap: 0.9rem; }
.fd-leiste { align-items: center; }
.fd-abstand { flex: 1; }
.fd-liste { display: flex; flex-direction: column; gap: 0.9rem; }

.fd-karte { display: flex; flex-direction: column; gap: 1rem; animation: wzRein 0.35s var(--ease-out); }
.fd-kopf { display: flex; align-items: center; gap: 0.8rem; }
.fd-bild { flex: none; width: 64px; height: 64px; border-radius: 14px; background: var(--bg2) center / cover no-repeat; }
.fd-titel { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.15rem; }
.fd-titel b { font-size: 0.98rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fd-titel small { font-size: 0.8rem; color: var(--sub); }
.fd-marke { flex: none; padding: 0.3rem 0.7rem; border-radius: 99px; background: var(--bg2); color: var(--pri); font-size: 0.76rem; font-weight: 700; }
.mit-ort .fd-marke { background: #fdecea; color: #c0392b; }
.sauber .fd-marke { background: #e5f5ec; color: #23824f; }

.fd-ort {
  display: flex; gap: 0.8rem; align-items: flex-start; padding: 0.9rem 1rem; border-radius: 16px;
  background: linear-gradient(135deg, #fff1ee, #fde4df); color: #8a2c1f;
}
.fd-ort svg { flex: none; width: 26px; height: 26px; fill: none; stroke: #e05a47; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.fd-ort div { display: flex; flex-direction: column; gap: 0.2rem; }
.fd-ort b { font-size: 0.95rem; }
.fd-ort span { font-size: 0.84rem; font-variant-numeric: tabular-nums; }
.fd-ort a { color: inherit; font-weight: 600; }

.fd-gruppen { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: 0.8rem 1.4rem; }
.fd-gruppe .wz-etikett { margin-bottom: 0.4rem; }
.fd-gruppe dl { margin: 0; display: flex; flex-direction: column; }
.fd-gruppe dl div { display: flex; justify-content: space-between; gap: 0.8rem; padding: 0.38rem 0; border-bottom: 1px solid var(--border); font-size: 0.87rem; }
.fd-gruppe dl div:last-child { border-bottom: 0; }
.fd-gruppe dt { color: var(--sub); }
.fd-gruppe dd { margin: 0; font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.fd-gruppe .heikel dd { color: #c0392b; }
.fd-gruppe ul { margin: 0; padding-left: 1.1rem; font-size: 0.87rem; color: var(--text2); line-height: 1.6; }
.fd-leer { display: flex; align-items: center; gap: 0.5rem; margin: 0; font-size: 0.9rem; color: #23824f; font-weight: 600; }
.fd-leer svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.fd-unten { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 0.6rem; }
.fd-probe { margin-right: auto; font-size: 0.82rem; font-weight: 600; color: #23824f; opacity: 0; transition: opacity 0.3s; }
.fd-probe.da { opacity: 1; }