/* Physio52 - Formular „Unterlagen senden". Farben und Abstaende kommen aus den
   Custom Properties des Themes, damit das Formular in jeder Section passt. */
.p52-upload{
	background:#fff;border:1px solid var(--line);border-top:4px solid var(--blue);
	border-radius:var(--radius);padding:30px;max-width:720px;box-shadow:var(--shadow);
}
.p52-upload__titel{margin-bottom:.4em}
.p52-upload__text{font-size:.98rem}
.p52-upload__form{display:grid;gap:20px;margin-top:22px}
.p52-upload__zeile{display:grid;gap:6px}
.p52-upload__zeile label,.p52-upload__label{font-size:.88rem;font-weight:700;color:var(--ink)}
.p52-upload input[type="text"],
.p52-upload input[type="email"],
.p52-upload textarea{
	width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:5px;
	background:var(--blue-wash);color:var(--ink);font:inherit;font-size:.96rem;
}
.p52-upload input:focus,.p52-upload textarea:focus{outline:3px solid var(--ink);outline-offset:2px}
.p52-upload textarea{resize:vertical;min-height:110px}
.p52-upload__hinweis{font-size:.82rem;color:var(--muted)}

/* Dateiauswahl: das echte Feld bleibt bedienbar, sieht aber nach Knopf aus.
   Ohne `capture` entscheidet das Handy selbst - genau dann fragt es „Kamera
   oder Galerie?". */
.p52-upload__datei{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.p52-upload__wahl{
	display:flex;align-items:center;gap:14px;cursor:pointer;
	padding:18px 20px;border:2px dashed var(--blue);border-radius:var(--radius);
	background:var(--blue-wash);font-weight:400;font-size:.9rem;line-height:1.5;
}
.p52-upload__wahl:hover{background:var(--blue-pale)}
.p52-upload__wahl strong{display:block;font-size:1rem;color:var(--ink)}
.p52-upload__wahl-zeichen{
	display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;
	border-radius:50%;background:var(--blue);color:var(--ink);font-size:1.5rem;font-weight:700;
}
.p52-upload__datei:focus-visible + .p52-upload__liste,
.p52-upload__datei:focus-visible ~ .p52-upload__wahl{outline:3px solid var(--ink)}

.p52-upload__liste{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:10px}
.p52-upload__eintrag{
	display:flex;align-items:center;gap:14px;padding:10px;
	background:var(--green-wash);border-radius:6px;
}
.p52-upload__eintrag img{width:64px;height:64px;object-fit:cover;border-radius:4px;flex:0 0 64px}
.p52-upload__pdf{
	display:grid;place-items:center;width:64px;height:64px;flex:0 0 64px;
	background:var(--green-pale);border-radius:4px;font-size:.8rem;font-weight:700;color:var(--ink);
}
.p52-upload__name{flex:1;font-size:.86rem;word-break:break-word}
.p52-upload__weg{
	border:1px solid var(--line);background:#fff;border-radius:5px;
	padding:10px 14px;min-height:44px;font-size:.84rem;color:var(--link);cursor:pointer;
}
.p52-upload__weg:hover{border-color:var(--ink)}

.p52-upload__check{display:flex;gap:12px;align-items:flex-start;font-weight:400;font-size:.88rem;line-height:1.6}
.p52-upload__check input{margin-top:3px;width:20px;height:20px;flex:0 0 20px}
.p52-upload__zeile--zustimmung{background:var(--green-wash);padding:16px;border-radius:6px}
.p52-upload__topf{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.p52-upload__senden{justify-self:start}
.p52-upload__senden[disabled]{opacity:.6;cursor:progress}
.p52-upload__status{margin:0;font-size:.9rem;min-height:1.2em}
.p52-upload__status.ist-fehler{color:#8a2b2b;font-weight:700}
.p52-upload__status.ist-fertig{color:#2f6d3a;font-weight:700}
.p52-upload__fuss{margin-top:20px;font-size:.8rem;color:var(--muted);line-height:1.6}
.p52-upload__sperre{
	margin-top:22px;padding:16px 18px;border-radius:6px;
	background:var(--blue-pale);font-size:.88rem;color:var(--ink);
}
@media(max-width:700px){
	.p52-upload{padding:22px}
	.p52-upload__wahl{padding:16px}

	/* Eingabefelder mit mindestens 16px: Darunter zoomt iOS Safari beim
	   Antippen in das Feld hinein und die Seite steht danach verschoben da. */
	.p52-upload input[type="text"],
	.p52-upload input[type="email"],
	.p52-upload textarea{font-size:16px}

	/* Der Eintrag bricht um, sonst quetschen Vorschaubild, Dateiname und
	   Entfernen-Knopf auf 360 px Breite ineinander. */
	.p52-upload__eintrag{flex-wrap:wrap}
	.p52-upload__name{flex:1 1 100%;order:3;font-size:.9rem}
	.p52-upload__weg{margin-left:auto}
	.p52-upload__check{gap:10px}
	.p52-upload__senden{justify-self:stretch;width:100%}
}
@media(max-width:380px){
	.p52-upload{padding:18px}
	.p52-upload__wahl{gap:10px;padding:14px}
	.p52-upload__wahl-zeichen{flex-basis:38px;width:38px;height:38px;font-size:1.25rem}
	.p52-upload__eintrag img,.p52-upload__pdf{width:52px;height:52px;flex-basis:52px}
}
/* Sicherheitsfrage - wird erst eingeblendet, wenn Frage und Beleg geladen sind */
.p52-upload__frage{background:var(--blue-wash);padding:16px;border-radius:6px}
.p52-upload__frage input[type="text"]{max-width:120px;background:#fff}