/* ==========================================================================
   Rückruf-Check (public/rueckrufe-pruefen.php) – Präfix .rp-
   Baut auf rueckruf.css (.rd-artikel, .rd-fragen …) auf.
   ========================================================================== */

.rp .rd-artikel { max-width: 760px; }
.rp-marke { background: var(--rf-akzent-weich); color: var(--rf-akzent-stark); }

.rp-pruefer { margin: 8px 0 28px; padding: clamp(18px, 3vw, 28px); border-radius: var(--rf-radius-xl); background: var(--rf-flaeche); border: 1px solid var(--rf-rand); display: grid; gap: 18px; }
.rp-start { justify-content: center; min-height: 56px; font-size: 17px; width: 100%; }
.rp-start svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }

/* Kamera */
.rp-kamera { position: relative; aspect-ratio: 4 / 3; max-height: 60vh; border-radius: var(--rf-radius-lg); overflow: hidden; background: #000; }
.rp-kamera video { width: 100%; height: 100%; object-fit: cover; display: block; }
.rp-kamera__rahmen { position: absolute; left: 12%; right: 12%; top: 32%; bottom: 32%; border: 3px solid #fff; border-radius: 14px; box-shadow: 0 0 0 100vmax rgba(0, 0, 0, .35); }
.rp-kamera__rahmen::after { content: ""; position: absolute; left: 6%; right: 6%; top: 50%; height: 2px; background: var(--rf-gefahr); animation: rp-linie 1.6s ease-in-out infinite alternate; }
@keyframes rp-linie { from { transform: translateY(-30px); } to { transform: translateY(30px); } }
@media (prefers-reduced-motion: reduce) { .rp-kamera__rahmen::after { animation: none; } }
.rp-kamera__hinweis { position: absolute; left: 0; right: 0; bottom: 14px; margin: 0; text-align: center; color: #fff; font-weight: 600; font-size: 15px; text-shadow: 0 1px 4px rgba(0, 0, 0, .6); }
.rp-kamera__aus { position: absolute; top: 10px; right: 10px; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(0, 0, 0, .55); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; }

/* Eingabe */
.rp-eingabe { display: grid; gap: 10px; }
.rp-eingabe label { font-size: var(--rf-text-sm); color: var(--rf-text-2); }
.rp-zeile { display: flex; gap: 10px; flex-wrap: wrap; }
.rp-zeile input { flex: 1 1 180px; min-width: 0; min-height: 48px; padding: 0 14px; border-radius: var(--rf-radius-md); border: 1px solid var(--rf-rand-stark); background: var(--rf-hg); color: var(--rf-text); font: inherit; font-size: 16px; }
.rp-zeile input:focus-visible { outline: none; box-shadow: var(--rf-fokus); border-color: var(--rf-akzent); }
.rp-zeile .pr-knopf { min-height: 48px; }
.rp-name summary { cursor: pointer; font-size: var(--rf-text-sm); color: var(--rf-akzent); font-weight: 600; padding: 4px 0; }
.rp-name .rp-zeile { margin-top: 10px; }

/* Ergebnis */
.rp-ergebnis:empty { display: none; }
.rp-ergebnis { display: grid; gap: 12px; scroll-margin-top: 90px; }
.rp-produkt { margin: 0; font-size: var(--rf-text-sm); color: var(--rf-text-2); overflow-wrap: anywhere; }
.rp-produkt b { color: var(--rf-text); }
.rp-laden { display: flex; align-items: center; gap: 10px; margin: 0; color: var(--rf-text-2); }
.rp-laden__punkt { width: 10px; height: 10px; border-radius: 50%; background: var(--rf-akzent); animation: rp-puls 1s ease-in-out infinite; }
@keyframes rp-puls { 50% { opacity: .25; transform: scale(.7); } }
.rp-hinweis { margin: 0; padding: 12px 16px; border-radius: var(--rf-radius-md); background: var(--rf-info-weich); }
.rp-hinweis--warnung { background: var(--rf-warnung-weich); }
.rp-hinweis--fehler { background: var(--rf-gefahr-weich); }

.rp-karte { padding: 18px 20px; border-radius: var(--rf-radius-lg); border: 1px solid var(--rf-rand); border-left-width: 5px; background: var(--rf-flaeche); display: grid; gap: 8px; }
.rp-karte p { margin: 0; line-height: 1.5; }
.rp-karte--ok { border-left-color: var(--rf-erfolg); background: var(--rf-erfolg-weich); }
.rp-karte--treffer { border-left-color: var(--rf-gefahr); background: var(--rf-gefahr-weich); }
.rp-karte--pruefen { border-left-color: var(--rf-warnung); background: var(--rf-warnung-weich); }
.rp-karte__stufe { justify-self: start; padding: 3px 10px; border-radius: 999px; font-size: 13px; font-weight: 700; background: var(--rf-flaeche); }
.rp-karte--treffer .rp-karte__stufe { background: var(--rf-gefahr); color: #fff; }
.rp-karte__titel { font-family: var(--rf-schrift-titel); font-size: 18px; line-height: 1.3; overflow-wrap: anywhere; }
.rp-klein { font-size: var(--rf-text-sm); color: var(--rf-text-2); }
.rp-pruefen { margin: 0; padding-left: 1.2em; display: grid; gap: 4px; overflow-wrap: anywhere; }
.rp-links { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-top: 6px !important; }
.rp-links a:not(.pr-knopf) { color: var(--rf-akzent); font-weight: 600; }
.rp-nochmal { justify-self: start; border: 0; background: none; padding: 4px 0; color: var(--rf-akzent); font: inherit; font-weight: 650; cursor: pointer; }

/* Hinweis auf die App */
.rp-cta { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; align-items: center; padding: 22px 24px; border-radius: var(--rf-radius-xl); background: var(--rf-akzent-weich); border: 1px solid color-mix(in oklab, var(--rf-akzent) 25%, var(--rf-rand)); }
.rp-cta h2 { margin: 0 0 6px !important; font-size: 20px !important; }
.rp-cta p { margin: 0; color: var(--rf-text-2); line-height: 1.5; }
.rp-cta__knoepfe { display: flex; flex-direction: column; gap: 10px; }
.rp-cta__knoepfe .pr-knopf { justify-content: center; }
@media (max-width: 640px) { .rp-cta { grid-template-columns: 1fr; } .rp-cta__knoepfe { flex-direction: row; flex-wrap: wrap; } }
