/* SU Bayern – Landesversammlung 2026. Zeilenumbrüche sind fest (je Zeile ein <span>), die Schrift skaliert mit der
   Displaybreite: So bricht der Text auf Handy, Tablet und PC an denselben Stellen um.
   Minimal: keine Kästen, keine Rahmenlinien, keine Ecken – alles liegt direkt auf dem dunklen Grund, Felder sind rund. */
@font-face{font-family:"Lemonmilk";font-style:italic;font-weight:700;font-display:swap;src:url(fonts/lemonmilk-bold-italic.woff2) format("woff2")}
@font-face{font-family:"Lemonmilk";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/lemonmilk-bold.woff2) format("woff2")}
@font-face{font-family:"Ubuntu";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ubuntu-400.woff2) format("woff2")}
@font-face{font-family:"Ubuntu";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/ubuntu-700.woff2) format("woff2")}

:root{
  --bg:#161616; --bg2:#1f1f1f; --line:#3a3a3a; --field:#222; --field-hi:#2c2c2c; --text:#f2f2f2; --muted:#a3a3a3;
  --accent:#D7F916; --accent-ink:#161616; --error:#ff8a80; --error-bg:#3a2020;
  /* eine Größe für alles: skaliert mit der Breite, gedeckelt auf großen Bildschirmen */
  --u:min(1vw, 12px);
  /* große Überschrift; die Zeile darüber (.eyebrow) hängt an dieser Größe */
  --claim:calc(var(--u) * 6.2);
}
*{box-sizing:border-box}
/* kein Zoomen auf dem Handy: nur Scrollen erlauben, kein Pinch, kein Doppeltipp (dazu no-zoom.js) */
html{touch-action:pan-x pan-y;-webkit-text-size-adjust:100%}
body{touch-action:manipulation}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text)}
body{
  min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;
  font-family:Ubuntu,"Helvetica Neue",Arial,sans-serif;font-size:calc(var(--u) * 1.9 + 9px);line-height:1.5;
  background:radial-gradient(120% 90% at 50% 0%, #232323 0%, var(--bg) 60%) fixed;
  -webkit-font-smoothing:antialiased;
}
.stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:calc(var(--u) * 6) calc(var(--u) * 5)}

/* ---------- Kopf ---------- */
/* Eyebrow: fester Bruchteil von --claim – so immer etwas schmaler (ca. 91 %) als „Landesversammlung“, auf jeder Breite */
.eyebrow{margin:0 0 calc(var(--u) * 2.2);font-size:calc(var(--claim) * .39);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.claim{margin:0 0 calc(var(--u) * 5);font-family:Lemonmilk,Ubuntu,sans-serif;font-style:italic;font-weight:700;
  text-transform:uppercase;letter-spacing:.01em;line-height:1.12;font-size:var(--claim)}
.claim .line{display:block;white-space:nowrap}
.claim .accent{color:var(--accent)}
.when{margin:0 0 calc(var(--u) * 5);font-weight:700;line-height:1.5;font-size:calc(var(--u) * 1.4 + 12px)}
.when .where{display:block;margin-top:2px;font-weight:400;color:var(--muted);font-size:.8em}

/* ---------- Knöpfe ---------- */
.cta,.submit{font-family:Lemonmilk,Ubuntu,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  font-size:calc(var(--u) * 1.6 + 8px);border:0;border-radius:999px;cursor:pointer;
  padding:calc(var(--u) * 1.3 + 8px) calc(var(--u) * 3 + 14px);background:var(--accent);color:var(--accent-ink);
  transition:transform .15s ease, filter .15s ease}
.cta:hover,.submit:hover{transform:translateY(-1px);filter:brightness(1.06)}
.cta[aria-expanded="true"]{display:none}
a.cta{display:inline-block;text-decoration:none}
.submit{width:100%}
#signup .submit{margin-top:6px}
.submit[disabled]{opacity:.6;cursor:wait;transform:none}
.cta:focus-visible,.submit:focus-visible,.foot a:focus-visible,.consent a:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:999px}

/* ---------- Formular: offen auf dem Grund, runde Felder ohne Rahmen (nur #signup – der Admin-Bereich behält seinen Stil) ---------- */
.signup{width:min(100%, 520px);text-align:left;animation:rise .25s ease}
.signup[hidden],.done[hidden]{display:none}
#signup .field{margin:0 0 16px}
#signup .field > label:not(.pill),#signup fieldset.field legend{display:block;margin:0 0 6px;padding:0 0 0 18px;font-size:.8em;font-weight:400;color:var(--muted)}
#signup .field input,#signup .field select{width:100%;font:inherit;color:var(--text);background-color:var(--field);border:0;border-radius:999px;
  padding:13px 18px;outline:none;caret-color:var(--accent);transition:background-color .15s ease;-webkit-appearance:none;appearance:none}
#signup .field select{padding-right:44px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23a3a3a3' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 20px center}
#signup .field input:focus,#signup .field select:focus{background-color:var(--field-hi);box-shadow:0 0 0 2px rgba(215,249,22,.6)}
#signup .field input[aria-invalid="true"],#signup .field select[aria-invalid="true"]{background-color:var(--error-bg)}
.row2,.row-street,.row-city{display:grid;gap:10px}
.row2{grid-template-columns:1fr 1fr}
.row-street{grid-template-columns:1fr 104px}
.row-city{grid-template-columns:118px 1fr}

/* Straßen-Vorschläge */
.addr{position:relative}
.suggest{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 6px);margin:0;padding:6px;list-style:none;background:var(--field);
  border-radius:24px;box-shadow:0 18px 40px rgba(0,0,0,.45);max-height:320px;overflow:auto}
.suggest li{padding:10px 14px;border-radius:18px;cursor:pointer;line-height:1.35}
.suggest li small{display:block;color:var(--muted);font-size:.82em}
.suggest li[aria-selected="true"],.suggest li:hover{background:var(--field-hi)}
.suggest .none{cursor:default;color:var(--muted)}

/* Status */
fieldset.field{border:0;padding:0;margin:0 0 16px;min-width:0}
.status{display:flex;flex-wrap:wrap;gap:8px}
.status legend{width:100%}
.pill{position:relative;display:inline-flex}
.pill input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.pill span{display:inline-block;padding:10px 18px;border-radius:999px;background:var(--field);font-size:.92em;cursor:pointer;transition:background-color .15s ease}
.pill input:checked + span{background:var(--accent);color:var(--accent-ink);font-weight:700}
.pill input:focus-visible + span{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--accent)}
fieldset[aria-invalid="true"] .pill span{background:var(--error-bg)}

/* Tagungsbeitrag unter dem Status: nur eine Zeile */
.fee{margin:-4px 0 18px;padding:0 0 0 18px;color:var(--muted);font-size:.9em}
.fee strong{color:var(--accent);margin-left:4px}

/* Einwilligung: runder Haken statt eckiger Box */
.consent{display:flex;gap:12px;align-items:flex-start;font-size:.82em;color:var(--muted);margin:6px 0 18px}
.consent input{flex:none;width:22px;height:22px;margin:0;border-radius:50%;background:#333;outline:none;cursor:pointer;-webkit-appearance:none;appearance:none;
  display:grid;place-content:center;transition:background-color .15s ease}
.consent input::after{content:"";width:10px;height:6px;border:solid var(--accent-ink);border-width:0 0 2px 2px;transform:translateY(-1px) rotate(-45deg);opacity:0}
.consent input:checked{background:var(--accent)}
.consent input:checked::after{opacity:1}
.consent input:focus-visible{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--accent)}
.consent input[aria-invalid="true"]{background:#5a2a2a}
.consent a{color:var(--text)}

.msg{min-height:1.5em;margin:12px 0 0;font-size:.9em;text-align:center}
.msg.error{color:var(--error)}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

/* ---------- Danke ---------- */
.done{animation:rise .25s ease}
.done p{margin:0}
.done-title{font-family:Lemonmilk,Ubuntu,sans-serif;font-style:italic;font-weight:700;text-transform:uppercase;
  color:var(--accent);font-size:calc(var(--u) * 3.2 + 10px);margin:0 0 6px}
.done-text{max-width:520px;margin:0 auto}

/* ---------- Fuß ---------- */
.foot{display:flex;gap:18px;justify-content:center;padding:18px 16px calc(18px + env(safe-area-inset-bottom));font-size:.8em}
.foot a{color:var(--muted);text-decoration:none}
.foot a:hover{color:var(--text)}

/* Windows-Kontrastmodus: dort fallen Hintergründe weg – dann doch dezente Rahmen, damit Felder & Auswahl sichtbar bleiben */
@media (forced-colors:active){
  #signup .field input,#signup .field select,.pill span,.consent input{border:1px solid CanvasText}
  .pill input:checked + span{forced-color-adjust:none;background:Highlight;color:HighlightText}
  .consent input:checked{forced-color-adjust:none;background:Highlight}
  #signup .field input:focus,#signup .field select:focus,.pill input:focus-visible + span,.consent input:focus-visible{outline:2px solid Highlight}
}

@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- /lv26/abmelden: persönliche Anmeldung (aus der Teilnahmebestätigung) ---------- */
.verwalten{width:min(100%, 440px);animation:rise .25s ease}
.verwalten [hidden]{display:none}
.v-title{margin:0 0 6px;font-weight:700;font-size:1.15em}
.v-text{margin:0 0 18px;color:var(--muted)}
.v-list{margin:0 0 26px;text-align:left}
.v-list div{display:flex;gap:16px;justify-content:space-between;padding:10px 0}
.v-list dt{color:var(--muted)}
.v-list dd{margin:0;font-weight:700;text-align:right}
.btn2{font:inherit;font-weight:700;color:var(--text);background:var(--field);border:0;border-radius:999px;padding:13px 30px;cursor:pointer;transition:background-color .15s ease}
.btn2:hover{background:var(--field-hi)}
.v-confirm .cta{margin:0 0 10px}
.v-hinweis{color:var(--text);font-weight:700}
.v-link{display:block;margin:0 auto;font:inherit;color:var(--muted);background:none;border:0;padding:8px;cursor:pointer;text-decoration:underline}
.btn2:focus-visible,.v-link:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:999px}
.cta[disabled]{opacity:.6;cursor:wait;transform:none}

/* Rückfrage „Wieder anmelden?“ (runde Fläche, kein Rahmen) */
.re-dlg{border:0;border-radius:24px;background:#1f1f1f;color:var(--text);padding:30px 24px 22px;width:min(420px, calc(100% - 32px));text-align:center;
  font-size:calc(var(--u) * 1.9 + 9px);line-height:1.5;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.re-dlg[open]{animation:rise .2s ease}
.re-dlg::backdrop{background:rgba(0,0,0,.65);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.re-titel{margin:0 0 8px;font-family:Lemonmilk,Ubuntu,sans-serif;font-style:italic;font-weight:700;text-transform:uppercase;color:var(--accent);font-size:1.25em}
.re-text{margin:0 0 14px;color:var(--muted)}
.re-hinweis{margin:0 0 22px;font-weight:700}
.re-dlg .cta{width:100%;margin:0 0 6px}
.re-dlg .msg{margin-top:6px}

/* =====================================================================================================================
   Anträge: Knopf „Anträge einreichen“ auf /lv26 und die Seite /lv26/antraege (Art wählen, Vorlage, Dateien hochladen)
   ===================================================================================================================== */
/* Knöpfe untereinander, beide genau gleich groß (so breit wie der breiteste; zu lang: Text bricht um, Höhe bleibt gleich) */
.cta-stack{display:grid;gap:12px;width:max-content;max-width:100%;grid-auto-rows:1fr}
.cta-stack[hidden],#antraegeLink[hidden],.antr-start[hidden]{display:none}
.cta-stack .cta{width:100%;line-height:normal;text-align:center}
/* nach „ändern“: gewählte Art hell, die andere dunkel */
.antr-wahl.gewaehlt .cta[aria-pressed="false"]{background:var(--field);color:var(--text)}
/* /lv26/antraege Schritt 1: Art-Knöpfe, darunter „Vorlage herunterladen“ – gleich breit wie die Knöpfe */
.antr-start{display:grid;gap:calc(var(--u) + 14px);width:max-content;max-width:100%}

/* Kopf des Formulars: gewählte Art + „ändern“ */
.antr-kopf{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 14px;padding:0 0 0 18px}
.antr-art{margin:0;min-width:0;font-size:.9em;font-weight:700;color:var(--accent)}
.antr-art:focus,#doneTitel:focus{outline:none}
.antr-aendern{flex:none;font:inherit;font-size:.8em;color:var(--muted);background:none;border:0;padding:6px 12px;cursor:pointer;text-decoration:underline;border-radius:999px}
.antr-aendern:hover{color:var(--text)}
.antr-aendern[disabled]{opacity:.5;cursor:default}

/* Vorlage herunterladen: zweiter Knopf (dunkle runde Fläche, Schrift wie .cta); contain: zählt nicht zur Breite, füllt sie nur.
   Kein Dateityp im Knopf – sonst bricht er um; Name + Endung stehen im title/aria-label */
a.antr-vorlage{display:flex;align-items:center;justify-content:center;gap:.6em;contain:inline-size;line-height:normal;text-align:center;
  background:var(--field);color:var(--text);transition:transform .15s ease, background-color .15s ease}
.antr-vorlage[hidden]{display:none}
.antr-vorlage:hover{background:var(--field-hi);filter:none}
.antr-vorlage svg,.datei-knopf svg{flex:none;width:.9em;height:.9em;color:var(--accent)}
.antr-vorlage svg{width:1.05em;height:1.05em}

/* Dateiauswahl: Feld selbst unsichtbar, die runde Fläche davor öffnet die Auswahl (auch Ziehen & Ablegen) */
#signup .dateien .feld-titel{display:block;margin:0 0 6px;padding:0 0 0 18px;font-size:.8em;color:var(--muted)}
.datei-wahl{position:relative}
#signup .datei-wahl input[type="file"]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;opacity:0}
.datei-knopf{display:flex;align-items:center;justify-content:center;gap:10px;padding:13px 18px;border-radius:999px;background:var(--field);
  color:var(--text);font-weight:700;cursor:pointer;transition:background-color .15s ease, box-shadow .15s ease}
.datei-knopf:hover,.datei-wahl.drop .datei-knopf{background:var(--field-hi)}
.datei-wahl.drop .datei-knopf{box-shadow:0 0 0 2px var(--accent)}
.datei-wahl input:focus-visible + .datei-knopf{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--accent)}
.datei-wahl.voll .datei-knopf{opacity:.55;cursor:default}
.datei-wahl.voll .datei-knopf svg{display:none}
.dateien[aria-invalid="true"] .datei-knopf{background:var(--error-bg)}
.datei-liste{display:grid;gap:6px;margin:8px 0 0;padding:0;list-style:none}
.datei-liste[hidden]{display:none}
.datei-liste li{display:flex;align-items:center;gap:10px;min-width:0;padding:5px 5px 5px 18px;border-radius:999px;background:var(--bg2)}
.datei-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.datei-groesse{flex:none;font-size:.85em;color:var(--muted)}
.datei-weg{flex:none;display:grid;place-content:center;width:max(36px, 1.4em);height:max(36px, 1.4em);padding:0;border:0;border-radius:50%;
  background:var(--field-hi);color:var(--text);font:inherit;font-size:1.1em;line-height:1;cursor:pointer;transition:background-color .15s ease}
.datei-weg:hover{background:#383838}
.datei-weg[disabled]{opacity:.5;cursor:default}
.datei-fehler{margin:8px 0 0;padding:0 0 0 18px;font-size:.85em;color:var(--error)}
.datei-fehler:empty{display:none}
.antr-aendern:focus-visible,.antr-vorlage:focus-visible,.datei-weg:focus-visible,.antr-weiter:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.antr-weiter{margin-top:18px}

@media (forced-colors:active){
  .antr-vorlage,.datei-knopf,.datei-liste li{border:1px solid CanvasText}
  .datei-wahl input:focus-visible + .datei-knopf{outline:2px solid Highlight}
}
