/* Upload-Manager & Ergebnisseite - bewusst schlicht, gut lesbar am Handy */
:root{
  --blau:#0b4d8f; --blau-hell:#e8f0f9; --dunkel:#1b1f24; --grau:#5b6672;
  --linie:#dde3ea; --flaeche:#fff; --grund:#f4f6f9;
  --gruen:#0a7a45; --rot:#b3261e; --gelb:#8a6100; --gelb-hell:#fff6e0;
  --radius:10px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--grund);color:var(--dunkel);
  font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}
a{color:var(--blau)}
.inhalt{max-width:880px;margin:0 auto;padding:0 16px}
.schmal{max-width:480px;padding-top:40px}
.leise{color:var(--grau);font-weight:400}
.mini{font-size:.82em}

/* --- Kopf oeffentliche Seite --- */
.kopf{background:var(--blau);color:#fff;padding:22px 0;margin-bottom:22px}
.kopf .kopfzeile{display:flex;align-items:center;gap:18px}
.kopf .logo{flex:0 0 auto;width:78px;height:78px}
.kopf h1{overflow-wrap:break-word;hyphens:none}
.zusammen{white-space:nowrap}
@media(max-width:560px){
  .kopf{padding:18px 0}
  .kopf .kopfzeile{gap:12px}
  .kopf .logo{width:54px;height:54px}
  .kopf h1{font-size:1.18rem;margin:1px 0 3px}
  .kopf .verein{font-size:.7rem}
  .kopf .untertitel{font-size:.88rem;line-height:1.35}
}
@media(max-width:400px){
  .kopf .logo{width:46px;height:46px}
  .kopf h1{font-size:1.06rem}
  .kopf .untertitel{font-size:.82rem}
}
.kopf h1{margin:2px 0 4px;font-size:1.6rem;line-height:1.2}
.kopf .verein{margin:0;font-size:.8rem;letter-spacing:.09em;text-transform:uppercase;opacity:.85}
.kopf .untertitel{margin:0;opacity:.9}
.intro{margin:0 0 18px;color:var(--grau);overflow-wrap:break-word}
.stand{color:var(--grau);font-size:.8rem;margin:4px 0 0;text-align:right}

.hinweis{background:var(--gelb-hell);border:1px solid #f0d9a0;border-left:5px solid var(--gelb);
  border-radius:var(--radius);padding:12px 16px;margin:0 0 20px}
.hinweis strong{color:var(--gelb)}
.hinweis p{margin:4px 0 0}
.hinweis .zeit{color:var(--grau);font-size:.85rem}

.leer{background:var(--flaeche);border:1px dashed var(--linie);border-radius:var(--radius);
  padding:28px;text-align:center;color:var(--grau)}
.leer p{margin:4px 0}

/* --- Dateiliste oeffentlich --- */
.gruppe{margin:0 0 26px}
.gruppe h2{font-size:1.05rem;text-transform:uppercase;letter-spacing:.05em;color:var(--grau);
  margin:0 0 8px;padding-bottom:6px;border-bottom:2px solid var(--linie)}
ul.dateien{list-style:none;margin:0;padding:0}
ul.dateien li{display:flex;align-items:stretch;gap:2px;background:var(--flaeche);
  border:1px solid var(--linie);border-radius:var(--radius);margin-bottom:8px;overflow:hidden}
a.datei{flex:1;display:flex;align-items:center;gap:12px;padding:12px 14px;text-decoration:none;color:inherit}
a.datei:hover{background:var(--blau-hell)}
.symbol{flex:0 0 auto;background:var(--blau);color:#fff;font-size:.66rem;font-weight:700;
  letter-spacing:.04em;padding:5px 7px;border-radius:5px}
.text{min-width:0}
.titel{display:block;font-weight:600}
.meta{display:block;color:var(--grau);font-size:.84rem}
.titel{font-size:1.06rem}
.dateiname{display:block;color:#8a94a0;font-size:.74rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  word-break:break-all;margin:1px 0}
.badge{display:inline-block;background:var(--gruen);color:#fff;font-size:.68rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;padding:2px 6px;border-radius:4px;vertical-align:2px;margin-left:6px}
a.download{display:flex;align-items:center;padding:0 16px;text-decoration:none;color:var(--grau);
  border-left:1px solid var(--linie);font-size:1.2rem}
a.download:hover{background:var(--blau-hell);color:var(--blau)}
.aufbewahrung{margin:0 0 8px}
.fuss{margin:34px auto 24px;color:var(--grau);font-size:.88rem;border-top:1px solid var(--linie);padding-top:14px}

/* --- Admin --- */
body.admin{background:var(--grund)}
.adminkopf{background:var(--dunkel);color:#fff;padding:12px 0;margin-bottom:20px}
.adminkopf a{color:#fff}
.zeile{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.werkzeuge{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.karte{background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--radius);
  padding:18px;margin-bottom:20px}
.karte h1{margin:0 0 4px;font-size:1.5rem}
.karte h2{margin:0 0 14px;font-size:1.1rem}
.karte h2 .leise{font-weight:400;font-size:.78rem}
.login{margin-top:6vh}
.login .verein{margin:0;font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;color:var(--grau)}

label{display:block;margin:0 0 12px;font-weight:600;font-size:.92rem}
label.voll{display:block}
input[type=text],input[type=password],select,textarea{
  width:100%;padding:10px 12px;margin-top:4px;border:1px solid #c6ced8;border-radius:8px;
  font:inherit;background:#fff;color:inherit}
input[type=file]{width:100%;margin-top:6px;font:inherit}
textarea{resize:vertical}
input:focus,select:focus,textarea:focus{outline:3px solid #bcd6f3;outline-offset:0;border-color:var(--blau)}
.raster{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media(max-width:600px){.raster{grid-template-columns:1fr}}
.schalter{display:flex;align-items:center;gap:8px;font-weight:500}
.schalter input{width:18px;height:18px}

.knopf{display:inline-block;background:var(--blau);color:#fff;border:1px solid var(--blau);
  padding:10px 18px;border-radius:8px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none}
.knopf:hover{filter:brightness(1.1)}
.knopf.gross{width:100%;padding:13px;font-size:1.05rem;margin-top:6px}
.knopf.klein{padding:6px 12px;font-size:.85rem}
.knopf.mini{padding:5px 10px;font-size:.8rem;background:#eef1f5;color:var(--dunkel);border-color:#ccd4de}
.knopf.mini:hover{background:#e2e7ee}
.knopf.hell{background:transparent;border-color:#5a636e}
.knopf.gefahr{color:var(--rot);border-color:#e6c4c1;background:#fdf1f0}
.knopf.gefahr:hover{background:#f9dedb}
button.link{background:none;border:0;color:var(--blau);text-decoration:underline;cursor:pointer;font:inherit;padding:0}
.inline{display:inline-flex;gap:4px;margin:0}

.meldung{padding:11px 14px;border-radius:8px;margin:0 0 14px;font-size:.94rem}
.meldung.ok{background:#e6f6ee;border:1px solid #bfe6d3;color:var(--gruen)}
.meldung.fehler{background:#fdecea;border:1px solid #f3c9c5;color:var(--rot)}

/* Dropzone */
.dropzone{border:2px dashed #b9c5d3;border-radius:var(--radius);background:#fbfcfe;
  padding:26px 18px;text-align:center;margin-bottom:16px;transition:.15s}
.dropzone.aktiv{border-color:var(--blau);background:var(--blau-hell)}
.dz-gross{margin:0 0 4px;font-size:1.12rem;font-weight:600}
.dropzone p{margin:0}
.dropzone input[type=file]{margin-top:12px}
.dz-liste{list-style:none;margin:12px 0 0;padding:0;text-align:left;font-size:.9rem}
.dz-liste li{padding:6px 10px;background:#fff;border:1px solid var(--linie);border-radius:6px;margin-bottom:5px}
.js .dropzone input[type=file]{display:none}
.fortschritt{height:9px;background:#e3e8ef;border-radius:5px;overflow:hidden;margin:12px 0}
.fortschritt .balken{height:100%;width:0;background:var(--blau);transition:width .15s}

/* Verwaltungsliste */
.katkopf{font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--grau);
  margin:20px 0 8px;padding-bottom:5px;border-bottom:1px solid var(--linie)}
ul.verwaltung{list-style:none;margin:0;padding:0}
ul.verwaltung>li{border:1px solid var(--linie);border-radius:var(--radius);padding:12px 14px;margin-bottom:9px}
ul.verwaltung>li.versteckt{background:#fafbfc;border-style:dashed;opacity:.85}
.kopfzeile{align-items:flex-start}
.wer{min-width:0}
.wer .titel{font-weight:600;text-decoration:none;color:var(--dunkel)}
.wer .titel:hover{color:var(--blau);text-decoration:underline}
.knoepfe{display:flex;gap:6px;flex-wrap:wrap}
details{margin-top:10px}
summary{cursor:pointer;color:var(--blau);font-size:.88rem}
.details{margin-top:12px;padding-top:12px;border-top:1px dashed var(--linie)}
.details form{margin-bottom:14px}
.details .knopf{margin-top:2px}
.code{background:#f2f4f7;border:1px solid var(--linie);border-radius:8px;padding:12px;
  overflow:auto;font-size:.8rem;white-space:pre-wrap}
code{background:#f2f4f7;padding:2px 5px;border-radius:4px;font-size:.86em;word-break:break-all}
.checkliste{list-style:none;padding:0;margin:0 0 18px;font-size:.92rem}
.checkliste li{padding:4px 0;border-bottom:1px solid var(--linie)}
.checkliste .gut{color:var(--gruen)}
.checkliste .schlecht{color:var(--rot);font-weight:600}
.schritte{padding-left:20px}
.schritte li{margin-bottom:7px}
.fussnote{margin:0 0 30px}

/* Impressum / Datenschutz */
.recht{max-width:760px}
.recht h2{font-size:1.3rem;margin:34px 0 10px;padding-bottom:7px;border-bottom:2px solid var(--linie)}
.recht h2:first-of-type{margin-top:8px}
.recht h3{font-size:1rem;margin:22px 0 4px}
.recht p{margin:0 0 12px}
.stand-recht{color:var(--grau);font-size:.8rem;margin-top:28px}
