/* ============================================================
   datly v2 — „Fokus" Design-System
   Referenz: Handoff PHP-Umsetzung + datly v2 Screens/Varianten
   Schlank, kein Bootstrap, kein Font Awesome.
   ============================================================ */

/* ---------- Self-hosted Fonts (DSGVO) ----------
   woff2-Dateien nach fonts/ legen (siehe fonts/README.md).
   Fehlen sie, greift der System-Fallback automatisch. */
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/space-grotesk-400.woff2') format('woff2');}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/space-grotesk-500.woff2') format('woff2');}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/space-grotesk-600.woff2') format('woff2');}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/space-grotesk-700.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/jetbrains-mono-400.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/jetbrains-mono-700.woff2') format('woff2');}

:root{
  --navy:#0e1a33;
  --blue:#1d4fd8; --blue-hover:#1740ad; --blue-soft:#7ea8ff; --blue-bg:#e8effe; --blue-tint:#f5f8ff;
  --green:#177245; --green-mid:#17a45c; --green-bg:#e8f7ee; --green-bg2:#d9f2e3; --green-line:#7fd4a5;
  --yellow:#a1720a; --yellow-bg:#fdf0c9; --yellow-line:#ecd48a;
  --gray:#98a2b8; --gray-bg:#eef1f7; --line:#dbe1ec; --line-soft:#e7ebf3;
  --ink:#101828; --muted:#5d6b85; --ink2:#3a4763;
  --red:#c0392b; --red-bg:#fdf4f3; --red-line:#f3d2d2;
  --bg:#f4f6fa; --card:#ffffff;
  --radius:14px; --radius-sm:9px; --radius-lg:20px;
  --shadow:0 1px 4px rgba(16,24,40,.06);
  --shadow-card:0 2px 24px rgba(15,23,42,.10);
  --mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  --sans:'Space Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;overflow-y:scroll;scrollbar-gutter:stable;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.5;
  min-height:100vh;display:flex;flex-direction:column;}
a{color:var(--blue);text-decoration:none;}
a:hover{color:var(--blue-hover);}
h1,h2,h3{letter-spacing:-.02em;margin:0;}
img{max-width:100%;}
.mono{font-family:var(--mono);}

.site{flex:1 0 auto;}   /* füllt den Raum zwischen Navbar & Footer → Sticky Footer; Inhalt bleibt im Block-Fluss (kein Flex-Schrumpfen) */
.container{max-width:960px;margin:0 auto;padding:0 16px;}
.page{max-width:960px;margin:0 auto;padding:24px 16px 64px;}
/* Rechtsseiten (Impressum, Datenschutz, Nutzungsbedingungen) */
.legal{max-width:960px;margin:0 auto;padding:28px 16px 64px;}
.legal-back{display:inline-block;color:var(--muted);font-size:13px;font-weight:600;text-decoration:none;margin-bottom:18px;}
.legal-back:hover{color:var(--ink);}
.legal h1{font-size:clamp(24px,4vw,32px);font-weight:700;color:var(--ink);margin:0 0 6px;}
.legal-sub{color:var(--muted);font-size:14px;margin:0 0 22px;}
.legal-note{background:var(--blue-tint);border:1px solid #cddcff;border-radius:var(--radius);padding:14px 16px;color:var(--ink2);font-size:14px;line-height:1.6;margin-bottom:20px;}
.legal .card{margin-bottom:16px;}
.legal .card>h2:first-child{margin-top:0;}
.legal h2{font-size:16.5px;font-weight:700;color:var(--ink);margin:0 0 10px;}
.legal h3{font-size:14px;font-weight:700;color:var(--ink2);margin:16px 0 6px;}
.legal p{color:var(--ink2);font-size:14.5px;line-height:1.65;margin:0 0 10px;}
.legal p:last-child,.legal ul:last-child{margin-bottom:0;}
.legal ul{color:var(--ink2);font-size:14.5px;line-height:1.65;margin:0 0 10px;padding-left:20px;}
.legal li{margin-bottom:5px;}
.legal a{color:var(--blue);text-decoration:none;}
.legal a:hover{text-decoration:underline;}
.legal strong{color:var(--ink);}
.legal code{font-family:var(--mono);font-size:.92em;background:var(--gray-bg);color:var(--ink2);padding:1px 5px;border-radius:4px;}
.legal .legal-updated{color:var(--muted);font-size:13px;margin-top:22px;}
.mt-2{margin-top:8px;} .mt-3{margin-top:12px;} .mt-4{margin-top:16px;}
.mb-2{margin-bottom:8px;} .mb-3{margin-bottom:12px;} .mb-4{margin-bottom:16px;}
.muted{color:var(--muted);} .small{font-size:12.5px;}
.hide{display:none !important;}

/* ---------- Navbar ---------- */
.nav-v2{background:var(--navy);}
.nav-v2 .nav-inner{max-width:960px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:14px 16px;}
.nav-brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:700;font-size:18px;}
.nav-brand img{height:26px;border-radius:6px;display:block;}
.nav-brand span{line-height:1;position:relative;top:1px;}
.nav-brand:hover{color:#fff;}
.nav-badge{background:rgba(126,168,255,.18);color:var(--blue-soft);font-size:11px;font-weight:700;border-radius:6px;padding:3px 8px;}
.nav-links{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.nav-link{color:rgba(255,255,255,.82);font-size:13px;font-weight:600;padding:6px 11px;border-radius:8px;display:inline-flex;align-items:center;gap:6px;}
.nav-link:hover{color:#fff;background:rgba(255,255,255,.08);}
.nav-ic{display:none;width:18px;height:18px;flex-shrink:0;}   /* nur mobil sichtbar (statt Text) */
.nav-pill{color:#fff;background:var(--blue);font-size:13px;font-weight:700;padding:6px 14px;border-radius:8px;display:inline-flex;align-items:center;gap:6px;}
.nav-pill:hover{color:#fff;background:var(--blue-hover);}
.nav-sep{width:1px;align-self:stretch;background:rgba(255,255,255,.2);margin:2px 4px;}
.nav-lang{display:flex;gap:4px;}
.nav-lang a{color:rgba(255,255,255,.7);font-size:12px;font-weight:700;padding:4px 7px;border-radius:6px;}
.nav-lang a.on{background:var(--blue);color:#fff;}

/* ---------- Cards / generic ---------- */
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px 22px;}
.card-pad{padding:20px 22px;}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;gap:7px;border:none;border-radius:var(--radius-sm);
  font-family:inherit;font-weight:700;font-size:14px;height:42px;padding:0 20px;cursor:pointer;line-height:1;transition:background .12s,transform .06s;}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--blue);color:#fff;}
.btn-primary:hover{background:var(--blue-hover);color:#fff;}
.btn-primary:disabled{background:var(--gray);cursor:not-allowed;opacity:.7;}
.btn-green{background:var(--green);color:#fff;}
.btn-green:hover{background:#125c37;color:#fff;}
.btn-ghost{background:var(--card);border:1px solid var(--line);color:var(--ink2);font-weight:600;}
.btn-ghost:hover{background:#f7f9fc;color:var(--ink);}
.btn-danger{background:var(--card);border:1px solid var(--red-line);color:var(--red);font-weight:600;}
.btn-danger:hover{background:var(--red-bg);}
.btn-sm{font-size:12.5px;height:36px;padding:0 13px;}
.claim-br{display:none;}
.admin-actions{display:flex;gap:8px;flex-wrap:wrap;}
/* Claim-Box („Umfrage keinem Konto zugeordnet") — eigenständiges Block-Layout,
   alle vertikalen Abstände explizit über margins (KEIN Flex-Column-Container),
   damit kein unerwarteter Zwischenraum entsteht. */
.claim-box{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;margin-bottom:16px;color:#7a5a14;}
.claim-box .claim-head{font-weight:700;font-size:15px;margin-bottom:6px;}
.claim-box .claim-lead{font-size:12.5px;line-height:1.45;margin:0 0 14px;}
.claim-form{margin:0;}
.claim-fields{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;}
.claim-fields .claim-field{flex:1 1 220px;min-width:150px;}
.claim-fields .claim-login-btn{flex:0 0 auto;white-space:nowrap;}
.claim-forgot{display:inline-block;font-size:12.5px;color:var(--muted);text-decoration:none;margin-top:12px;}
.claim-forgot:hover{text-decoration:underline;}
.claim-noacct{font-size:12.5px;color:var(--muted);margin:4px 0 0;}
.claim-noacct a{font-weight:700;color:var(--blue);text-decoration:none;}
.btn-lg{font-size:15px;height:48px;padding:0 26px;}
.btn-block{width:100%;}
.btn svg{width:17px;height:17px;flex-shrink:0;}

/* ---------- Inputs ---------- */
.inp{border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:10px 13px;font:inherit;font-size:13.5px;
  outline:none;background:#fff;color:var(--ink);width:100%;transition:border-color .12s;}
/* Inputs/Selects auf einheitliche Steuerhöhe (Textareas ausgenommen) */
input.inp,select.inp{height:42px;padding-top:0;padding-bottom:0;}
.inp.inp-sm{height:36px;font-size:12.5px;}   /* passt zur Höhe von .btn-sm (Link+Kopieren-Zeilen) */
select.inp{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235d6b85' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px;}   /* eigener Dropdown-Pfeil mit Abstand zum Rand */
.inp:focus{border-color:var(--blue-soft);}
.inp[readonly]{background:#f1f5f9;cursor:default;}
.field-label{font-size:12.5px;font-weight:600;color:var(--muted);margin-bottom:4px;display:block;}
.field-hint{font-size:12px;margin-top:4px;}
.field-hint .danger{color:var(--red);}
.field-hint .info{color:var(--blue);}

/* ---------- Badges / pills ---------- */
.badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;border-radius:6px;padding:3px 9px;white-space:nowrap;flex-shrink:0;}
.badge-free{background:var(--yellow-bg);color:var(--yellow);}
.badge-date{background:var(--blue-bg);color:var(--blue);}
.badge-open{background:var(--green-bg);color:var(--green);}
.badge-closed{background:var(--gray-bg);color:var(--muted);}
.badge-neutral{background:var(--gray-bg);color:var(--ink2);}
.badge-final{background:var(--green-bg);color:var(--green);}

/* ---------- Poll header + ID/link box ---------- */
.poll-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:16px;}
.poll-head h2{font-size:25px;font-weight:700;margin-bottom:3px;}
.poll-head .lead{color:var(--muted);font-size:13.5px;margin:0;}
.poll-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;align-items:center;}
.meta-break{display:none;}   /* erzwingt mobil den Umbruch nach Teilnehmer (Erstellt/Endet in Zeile 2) */
.idbox{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px 6px 6px 12px;max-width:100%;}
.idbox .id-code{font-family:var(--mono);font-weight:700;color:var(--navy);font-size:15px;letter-spacing:.05em;}
.idbox-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;}
.idbox .id-url{font-family:var(--mono);font-weight:600;color:var(--navy);font-size:13px;border:none;outline:none;background:transparent;cursor:pointer;
  padding:4px 4px;min-width:120px;flex:1;text-overflow:ellipsis;}
.idbox .id-url:focus{background:transparent;}
/* Link-Felder (mit URL): ganze Box grau hinterlegen → klar erkennbar „nur kopieren".
   Code-Boxen (.id-code) bleiben weiß; Admin-Box überschreibt inline mit Creme. */
.idbox:has(.id-url){background:var(--gray-bg);}
.idbox .id-copy{background:var(--blue);color:#fff;font-size:12.5px;font-weight:700;border:none;border-radius:8px;padding:8px 13px;cursor:pointer;font-family:inherit;}
.idbox .id-copy:hover{background:var(--blue-hover);}

/* ---------- Alerts / banners ---------- */
.banner{border-radius:var(--radius);padding:15px 18px;margin-bottom:16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.banner-final{background:linear-gradient(120deg,#177245,#125c37);color:#fff;}
.banner-final .b-emoji{font-size:24px;flex-shrink:0;}   /* Desktop: 🎉 links */
.b-title-emoji{display:none;}                            /* mobil: 🎉 im Titel */
.banner-final .b-title{font-weight:700;font-size:15px;}
.banner-final .b-date{font-weight:800;font-size:19px;letter-spacing:-.01em;margin:3px 0 3px;}
.banner-final .b-sub{font-size:12.5px;opacity:.85;}
.banner-final .b-actions{display:flex;gap:8px;flex-shrink:0;align-items:center;}
.banner-final .btn{flex-shrink:0;}
.banner-info{background:var(--blue-tint);border:1px solid #cddcff;color:var(--ink2);align-items:flex-start;}
.banner-voted{background:var(--green-bg);border:1px solid var(--green-line);color:var(--green);font-weight:600;}
.banner-closed{background:var(--gray-bg);color:var(--muted);font-weight:600;}
.banner-result{border-radius:var(--radius);padding:20px 22px;margin-bottom:16px;}

/* ============================================================
   UNIFIED BLOCK
   ============================================================ */
.ub{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);margin-bottom:16px;}
.ub-section-title{font-size:16px;font-weight:700;margin:0 0 10px;color:var(--ink);}
/* Kalenderübersicht als oberster Teil der Admin-Zusammenfassung */
.ub-cal-block{padding:16px 18px 8px;border-bottom:1px solid var(--line-soft);}

/* Stimmen-Zusammenfassung (Anzahl + Symbol, farbig) */
.vcount{display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:12.5px;margin-right:14px;}
.vc-yes{color:var(--green);}
.vc-maybe{color:var(--yellow);}
.vc-no{color:var(--gray);}
/* Kompakte Stimmen-Badges (Zahl statt Symbol) — Admin-Optionentabelle */
.vc-num{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:22px;border-radius:6px;font-size:12.5px;font-weight:700;padding:0 6px;margin-right:5px;}
.vc-num-yes{background:var(--green-bg);color:var(--green);}
.vc-num-maybe{background:var(--yellow-bg);color:var(--yellow);}
.vc-num-no{background:var(--gray-bg);color:var(--muted);}

/* Datepicker (Popup-Kalender) */
.dp-display{height:42px;display:inline-flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;cursor:pointer;background:#fff;color:var(--ink);}
.dp-display::after{content:'▾';color:var(--muted);font-size:12px;flex-shrink:0;}
.dp-display.dp-empty{color:var(--gray);}
.dp-pop{position:absolute;z-index:1000;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 28px rgba(16,24,40,.16);padding:12px;width:252px;max-width:calc(100vw - 24px);}
.dp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.dp-title{font-weight:700;font-size:13.5px;color:var(--ink);}
.dp-nav{width:30px;height:30px;border:1px solid var(--line);border-radius:8px;background:var(--blue-tint);color:var(--blue);cursor:pointer;font-size:15px;display:inline-flex;align-items:center;justify-content:center;font-family:inherit;}
.dp-nav:hover{background:#e6edff;border-color:var(--blue-soft);}
.dp-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:3px;}
.dp-dow div{text-align:center;font-size:10.5px;font-weight:600;color:var(--gray);}
.dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
.dp-day{aspect-ratio:1;border:none;background:transparent;font:inherit;font-size:12.5px;font-weight:600;color:var(--ink);border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;}
.dp-day:hover:not(:disabled){background:var(--gray-bg);}
.dp-day.dp-sel{background:var(--blue);color:#fff;}
.dp-day:disabled{color:#c9d0dd;cursor:default;}

/* Top-Strip: Beste Termine */
.ub-strip{padding:12px 18px;border-bottom:1px solid var(--line-soft);}
.ub-strip-head{display:flex;align-items:center;gap:10px;margin-bottom:9px;flex-wrap:wrap;}
.ub-strip-label{background:var(--green-bg);color:var(--green);font-size:11px;font-weight:800;border-radius:6px;padding:4px 9px;text-transform:uppercase;letter-spacing:.05em;}
.ub-strip-hint{font-size:11.5px;font-weight:600;color:var(--green);}
.ub-chips{display:flex;gap:8px;flex-wrap:wrap;}
.ub-chip{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:600;color:var(--green);
  background:transparent;border:1.5px dashed var(--green-line);border-radius:8px;padding:6px 11px;cursor:pointer;
  user-select:none;transition:background .12s,border-color .12s;}
.ub-chip .c-plus{font-weight:800;}
.ub-chip .c-count{font-weight:800;}
.ub-chip:hover{background:var(--green-bg);border-color:var(--green-mid);}
.ub-chip.sel{background:var(--green-mid);border:1.5px solid var(--green-mid);color:#fff;}
.ub-chip.static{cursor:default;}
.ub-chip.static:hover{background:transparent;border-color:var(--green-line);}
.ub-chip-fix{background:var(--green);color:#fff;border:none;border-radius:6px;padding:3px 9px;margin-left:6px;
  font-size:11.5px;font-weight:700;cursor:pointer;font-family:inherit;}

/* Beste-Termine-Karten (Strip + „Termin festlegen") */
.bt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;}
.bt-card{background:#f4fbf7;border:1.5px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;position:relative;}
.bt-card.bt-all{border-color:var(--green-line);}
.bt-card.bt-plain{background:#fff;}
.bt-main{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:11px 13px 18px;}
.bt-date{font-size:14.5px;font-weight:700;color:var(--ink);}
.bt-time{font-size:12.5px;color:var(--muted);margin-top:3px;display:flex;align-items:center;gap:4px;}
.bt-count{text-align:right;line-height:1.05;flex-shrink:0;}
.bt-count-num{font-size:20px;font-weight:700;color:var(--ink2);}
.bt-count-num.bt-green{color:var(--green);}
.bt-count-lbl{font-size:11px;color:var(--muted);}
.bt-fix{border:none;border-top:1px solid var(--line-soft);background:var(--green);color:#fff;padding:10px;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;width:100%;display:flex;align-items:center;justify-content:center;gap:6px;}
.bt-fix:hover{background:#125c37;}
.bt-card.qv{cursor:pointer;transition:border-color .12s,background .12s;user-select:none;}
.bt-card.qv:hover{border-color:var(--green-mid);}
.bt-card.qv.bt-sel{border-color:var(--green-mid);background:var(--green-bg);}
.bt-card.qv.bt-sel .bt-count-num{color:var(--green);}
.bt-check{position:absolute;bottom:8px;right:8px;width:15px;height:15px;border-radius:50%;background:var(--green-mid);color:#fff;font-size:9px;font-weight:800;display:none;align-items:center;justify-content:center;}
.bt-card.qv.bt-sel .bt-check{display:flex;}

/* Grid */
.ub-grid-wrap{overflow-x:auto;}
.ub-table{border-collapse:collapse;width:100%;min-width:0;}
.ub-col-hidden{display:none !important;}
.ub-table th{padding:8px 4px;text-align:center;}
.ub-table thead tr{border-bottom:1px solid var(--line-soft);}
/* Feste Breite der linken Spalte → kein Springen beim Ein-/Ausklappen,
   Namen dürfen den vollen Platz nutzen */
:root{--ub-namecol:210px;}
.ub-table th.ub-th-corner{text-align:left;padding:10px 14px;width:var(--ub-namecol);}
.ub-du-label,.ub-others-toggle,.ub-total-label,.ub-voter-name-td{width:var(--ub-namecol);max-width:var(--ub-namecol);box-sizing:border-box;}
.ub-th-date{font-size:12px;font-weight:700;color:var(--ink);white-space:nowrap;}
.ub-th-time{font-size:11px;font-weight:700;color:var(--muted);margin-top:3px;display:inline-block;
  background:var(--gray-bg);border-radius:6px;padding:2px 7px;}
.ub-th-time.is-all{background:var(--green-bg);color:var(--green);}
.ub-th-time.is-final{background:var(--green-mid);color:#fff;}
.ub-th-date.is-final{color:var(--green);}

/* Du-Zeile */
.ub-row-du{background:var(--blue-tint);border-bottom:1px solid var(--line-soft);}
/* Ja-Stimmen-Zeile: gleiche Farbfamilie wie die Du-Zeile darüber, nur heller */
.ub-row-yes{background:#fafcff;}
/* Trennlinie unter der Ja-Stimmen-Zeile (wie der Header-Strich) — in allen Ansichten */
.ub-row-total{border-bottom:1px solid var(--line-soft);}
.ub-du-label{padding:11px 14px;white-space:nowrap;}
.ub-du-label .t{font-weight:700;font-size:14.5px;color:var(--blue);}
.ub-du-label .s{font-size:10.5px;color:var(--muted);line-height:1.25;white-space:normal;margin-top:2px;}
.ub-du-cell-td{text-align:center;padding:7px 4px;}

/* Stimmzellen */
.ub-cell{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:38px;padding:0 6px;
  border-radius:var(--radius-sm);font-weight:700;font-size:15px;user-select:none;border:1.5px solid var(--line);}
.ub-cell.st-yes{background:var(--green-bg);color:var(--green);border-color:var(--green-line);}
.ub-cell.st-maybe{background:var(--yellow-bg);color:var(--yellow);border-color:var(--yellow-line);}
.ub-cell.st-no{background:var(--gray-bg);color:var(--gray);border-color:var(--line);}
.ub-du-cell{cursor:pointer;transition:transform .08s,box-shadow .12s;}
.ub-du-cell:hover{transform:scale(1.08);box-shadow:0 2px 10px rgba(16,24,40,.12);}
.ub-du-cell.editing{outline:2px dashed var(--blue-soft);outline-offset:1px;}
/* read-only (andere Teilnehmer / Übersicht) — kleiner */
/* Read-only (Übersicht anderer Stimmen): kein Rahmen — nur die eigene Du-Zeile ist gerahmt */
.ub-cell-ro{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:28px;
  border-radius:7px;font-weight:700;font-size:13px;border:none;}
.ub-cell-ro.st-yes{background:var(--green-bg);color:var(--green);}
.ub-cell-ro.st-maybe{background:var(--yellow-bg);color:var(--yellow);}
.ub-cell-ro.st-no{background:var(--gray-bg);color:var(--gray);}

/* Ja-Balken-Zeile */
.ub-bar-td{padding:9px 6px;vertical-align:middle;}
.ub-bar-track{height:6px;width:85%;margin:0 auto;background:#ccd3e0;border-radius:99px;overflow:hidden;}
.ub-bar-fill{height:100%;border-radius:99px;background:var(--blue);}
.ub-bar-fill.full{background:var(--green-mid);}
.ub-bar-label{text-align:center;font-size:11px;font-weight:700;color:var(--muted);margin-top:3px;line-height:1;}
.ub-others-toggle{padding:9px 14px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;white-space:nowrap;}
.ub-others-toggle .arrow{color:var(--blue);}
/* Vollbreiter Ein-/Ausklapp-Balken unter dem Gitter */
.ub-others-bar{text-align:center;padding:12px;font-size:13.5px;font-weight:700;color:var(--blue);cursor:pointer;
  border-top:1px solid var(--line-soft);user-select:none;transition:background .12s;}
.ub-others-bar:hover{background:var(--blue-tint);}
.ub-total-label{padding:9px 14px;font-size:12px;font-weight:600;color:var(--muted);vertical-align:middle;}

/* Voter-Zeilen */
.ub-voter-row{border-bottom:1px solid #f1f4f9;}
.ub-voter-name{font-size:13px;font-weight:600;color:var(--ink2);max-width:calc(var(--ub-namecol) - 24px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ub-voter-name-td{padding:8px 14px;}
.ub-voter-cell-td{text-align:center;padding:5px 4px;}
/* Entfernen-Spalte: nur im Edit-Modus sichtbar */
.ub-rm-col{display:none;width:1%;text-align:center;padding:0 8px;}
.ub-table.editing .ub-rm-col{display:table-cell;}
.ub-rm-btn{color:var(--red);font-size:13px;cursor:pointer;padding:4px 9px;border-radius:6px;background:var(--red-bg);border:none;font-family:inherit;line-height:1;}
.ub-rm-btn:hover{background:#f9d9d6;}
/* Admin: editierbare Zellen nur im Edit-Modus */
.ub-adm-cell{cursor:default;}
.ub-table.editing .ub-adm-cell{cursor:pointer;outline:2px dashed var(--blue-soft);outline-offset:1px;transition:transform .08s;}
.ub-table.editing .ub-adm-cell:hover{transform:scale(1.1);}

/* Grid-Pager (Spalten-Blättern bei vielen Terminen) */
.ub-pager{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 16px;}
.ub-pager-info{font-size:12.5px;font-weight:700;color:var(--muted);text-align:center;flex:1;}
.ub-pager-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;flex-shrink:0;
  background:var(--blue-tint);border:1px solid var(--line);border-radius:10px;font-size:17px;line-height:1;color:var(--blue);cursor:pointer;font-family:inherit;transition:background .12s,border-color .12s;}
.ub-pager-btn:hover:not(:disabled){background:#e6edff;border-color:var(--blue-soft);}
.ub-pager-btn:disabled{color:var(--gray);cursor:default;opacity:.5;background:#f3f5f9;}

/* Identity / Save */
.ub-idbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap;padding:14px 18px;background:#fafbfd;border-top:1px solid var(--line-soft);}
.ub-idbar .inp{width:auto;}
.ub-idbar .i-name{flex:1 1 150px;}
.ub-idbar .i-mail{flex:1 1 190px;}
.ub-idbar .i-note{width:100%;margin:2px 0 0;font-size:11.5px;color:var(--muted);}
.ub-notify{width:100%;display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);}
.ub-notify input{width:16px;height:16px;}
.ub-editbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap;padding:12px 18px;background:#fafbfd;border-top:1px solid var(--line-soft);}
.ub-editbar .spacer{margin-left:auto;}
.ub-editbar .foot-link{font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;gap:5px;}
.foot-ico{font-size:14px;line-height:1;display:inline-flex;align-items:center;}

/* ---------- Kalender (freie Abfrage) ---------- */
.cal-wrap{padding:16px 18px 6px;}
.cal-propose-head{font-size:11px;font-weight:800;color:var(--muted);margin-bottom:8px;text-transform:uppercase;letter-spacing:.04em;}
.cal-nav{display:flex;align-items:center;justify-content:space-between;margin:0 0 10px;}
.cal-nav .cal-arrow{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--line);
  border-radius:10px;background:var(--blue-tint);font-size:17px;line-height:1;color:var(--blue);cursor:pointer;user-select:none;flex-shrink:0;transition:background .12s,border-color .12s;}
.cal-nav .cal-arrow:hover{background:#e6edff;border-color:var(--blue-soft);}
.cal-titles{display:flex;flex:1;justify-content:space-around;}
.cal-titles span{font-weight:700;font-size:13.5px;}
.cal-months{display:flex;gap:60px;justify-content:center;margin:0 auto;}
.cal-month{flex:1;min-width:0;}
.cal-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;margin-bottom:2px;}
.cal-dow div{text-align:center;font-size:10.5px;font-weight:600;color:var(--gray);padding:1px 0;}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;}
.cal-day{aspect-ratio:1;width:100%;margin:0 auto;border:none;background:transparent;font:inherit;font-size:13px;font-weight:600;color:var(--ink);
  border-radius:99px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background .1s;}
.cal-pad{aspect-ratio:1;}
.cal-day:hover:not(:disabled){background:var(--gray-bg);}
.cal-day:disabled{color:#c5ccda;cursor:default;}
.cal-existing{background:var(--green-bg2);color:var(--green);}    /* alle können → grün */
.cal-gold{background:var(--yellow-bg);color:var(--yellow);}       /* manche können → gelb */
.cal-selected{background:var(--blue);color:#fff;}                 /* eigene Auswahl → blau */
.cal-existing.cal-selected,.cal-gold.cal-selected{background:var(--blue);color:#fff;}
.cal-today{box-shadow:inset 0 0 0 2px var(--blue-soft);}
.cal-today.cal-selected{box-shadow:none;}
.cal-legend{display:flex;gap:14px;align-items:center;margin-top:10px;font-size:11.5px;font-weight:600;color:var(--muted);flex-wrap:wrap;}
.cal-legend .dot{width:12px;height:12px;border-radius:99px;display:inline-block;}
.cal-legend .lg{display:inline-flex;align-items:center;gap:5px;}
.cal-legend .dot-all{background:var(--green-bg2);border:1.5px solid var(--green-line);}
.cal-legend .dot-some{background:var(--yellow-bg);border:1.5px solid var(--yellow-line);}
.cal-legend .dot-mine{background:var(--blue);}
.cal-count{margin-left:auto;}

/* Slot-Liste (freie Abfrage: Tage + optionale Uhrzeiten) */
.free-slots{margin:12px 0 2px;}
.fslot-head{font-size:12px;font-weight:700;color:var(--muted);margin-bottom:4px;}
.fslot{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--line-soft);flex-wrap:wrap;}
.fslot:first-of-type{border-top:none;}
.fslot-day{font-weight:600;font-size:13.5px;min-width:96px;}
.fslot-times{display:flex;align-items:center;gap:6px;}
.fslot-times input[type=time]{border:1.5px solid var(--line);border-radius:8px;padding:5px 8px;font:inherit;font-size:13px;color:var(--ink);background:#fff;}
.fslot-dash{color:var(--muted);}
.fslot-note{font-size:11.5px;color:var(--gray);font-style:italic;}
.fslot-rm{margin-left:auto;color:var(--red);background:var(--red-bg);border:none;border-radius:6px;padding:4px 9px;cursor:pointer;font-family:inherit;line-height:1;}
.fslot-rm:hover{background:#f9d9d6;}

/* Termin-vorschlagen-Dialog (freie Abfrage, grid-first) */
.ub-propose{padding:12px 18px;border-top:1px solid var(--line-soft);}
.ub-propose-btn{background:var(--blue-tint);border:1px dashed var(--blue-soft);color:var(--blue);font-weight:700;font-size:13px;
  border-radius:9px;padding:9px 14px;cursor:pointer;font-family:inherit;transition:background .12s;}
.ub-propose-btn:hover{background:#e6edff;}
.ub-propose-form{margin-top:12px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  background:#fafbfd;border:1px solid var(--line-soft);border-radius:12px;padding:12px 14px;}
.ub-propose-form .fp-date{width:150px;flex:0 0 150px;}
.ub-propose-form .fp-time{flex:1;min-width:84px;width:auto;text-align:center;}
/* „Hinzufügen"/„Abbrechen" rechtsbündig → volle Zeilenbreite auch bei Ganztägig */
.ub-propose-form .btn-primary{margin-left:auto;}
.fp-seg{display:inline-flex;border:1.5px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;height:42px;flex-shrink:0;}
.fp-seg-btn{border:none;background:#fff;color:var(--muted);font-family:inherit;font-weight:700;font-size:13px;padding:0 14px;min-width:88px;text-align:center;cursor:pointer;}
.fp-seg-btn+.fp-seg-btn{border-left:1.5px solid var(--line);}
.fp-seg-btn.active{background:var(--blue);color:#fff;}
.fp-times{display:inline-flex;align-items:center;gap:8px;flex:1;min-width:180px;}
.fp-time{min-width:0;text-align:center;}
.ub-propose-form{gap:8px;}
#fp-date{min-width:146px;}
.fp-seg-btn{padding:0 13px;}
.fp-dash{color:var(--muted);}
.fp-actions{display:flex;gap:8px;}
.ub-proposals{margin-top:12px;display:grid;grid-template-columns:repeat(5,1fr);gap:10px;}
.fp-item{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;
  background:var(--blue-tint);border:1.5px dashed var(--blue-soft);border-radius:10px;padding:8px 26px 8px 12px;min-height:46px;position:relative;}
.fp-item-day{font-weight:700;font-size:13.5px;color:var(--blue);}
.fp-item-time{font-size:12px;color:var(--muted);}
.fp-item .fslot-rm{position:absolute;top:7px;right:7px;margin-left:0;padding:2px 7px;background:transparent;}
.fp-item .fslot-rm:hover{background:var(--red-bg);}
/* Mobil: Vorschlags-Dialog gestapelt, volle Breite */
@media (max-width:560px){
  /* Stapeln via flex-wrap + flex-basis:100% (NICHT column — sonst wird flex-basis zur Höhe) */
  .ub-propose-form .fp-date,
  .ub-propose-form .fp-seg,
  .ub-propose-form .fp-times,
  .ub-propose-form .btn{flex:1 1 100%;width:100%;}
  .ub-propose-form .fp-seg-btn{flex:1;}
  .ub-propose-form .fp-time{flex:1;width:auto;}
  /* Vorschlags-Karten: eine pro Reihe, Inhalt horizontal */
  .ub-proposals{grid-template-columns:1fr;}
  .fp-item{flex-direction:row;align-items:center;gap:10px;min-height:0;padding:9px 12px;}
  .fp-item .fslot-rm{position:static;top:auto;right:auto;margin-left:auto;}
}

/* ---------- Footer ---------- */
.footer-v2{text-align:center;color:var(--muted);font-size:12.5px;padding:28px 16px;border-top:1px solid #e5e7eb;background:#fff;margin-top:auto;}

/* Konfetti */
.confetti-piece{position:fixed;top:-14px;width:9px;height:14px;border-radius:2px;z-index:9999;pointer-events:none;opacity:.92;animation:confetti-fall linear forwards;}
@keyframes confetti-fall{0%{transform:translateY(0) rotate(0);}100%{transform:translateY(106vh) rotate(680deg);}}
@media (prefers-reduced-motion:reduce){.confetti-piece{display:none;}}
.footer-v2 a{color:var(--muted);}
.footer-v2 a:hover{color:var(--ink);}
.footer-v2 .row{margin-bottom:8px;}
.footer-v2 .sep{margin:0 10px;color:var(--gray);}

/* ============================================================
   LANDING PAGE (index.php) — v2-Mockup „3c Startseite"
   ============================================================ */
.lp-hero{background:var(--navy);color:#fff;text-align:center;padding:48px 16px 54px;}
.lp-hero-inner{max-width:960px;margin:0 auto;}
.lp-h1{font-size:clamp(28px,5.4vw,40px);font-weight:700;letter-spacing:-.03em;line-height:1.12;margin-bottom:12px;}
.lp-accent{color:var(--blue-soft);}
.lp-lead{color:rgba(255,255,255,.65);font-size:16px;line-height:1.55;max-width:620px;margin:0 auto 24px;}
.lp-cta-row{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:30px;}
.btn-outline-light{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.3);font-weight:600;}
.btn-outline-light:hover{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.5);}
.lp-search{max-width:680px;margin:0 auto;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:14px;padding:16px 20px;text-align:left;}
.lp-search-label{color:rgba(255,255,255,.6);font-size:12px;font-weight:600;margin-bottom:8px;}
.lp-search-group{display:flex;gap:8px;}
.lp-search-group .inp{flex:1;border:none;border-radius:9px;font-family:var(--mono);font-size:14px;}
.lp-search-group .inp:focus{border:none;}
.lp-search-btn{background:var(--blue);color:#fff;font-weight:700;font-size:13.5px;padding:0 18px;border:none;border-radius:9px;cursor:pointer;font-family:inherit;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;}
.lp-search-btn:hover{background:var(--blue-hover);}
.lp-search-btn svg{width:15px;height:15px;}
.lp-search-err{color:#fff;font-size:12px;margin-top:7px;opacity:.85;}
.lp-trust{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:26px;}
.lp-trust span{border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.7);font-size:11.5px;font-weight:600;border-radius:99px;padding:4px 12px;}

/* Sektionen (v2) */
.lp-section{padding:34px 16px;}
.lp-section-inner{max-width:960px;margin:0 auto;}
.lp-section.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.lp-head{text-align:center;max-width:560px;margin:0 auto 26px;}
.lp-label{display:inline-block;background:var(--blue-bg);color:var(--blue);border-radius:99px;padding:5px 14px;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;margin-bottom:10px;}
.lp-title{font-size:clamp(22px,3.5vw,30px);font-weight:700;color:var(--ink);}
.lp-sub{color:var(--muted);font-size:15px;margin-top:8px;}

.lp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;}
.lp-feat{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px;transition:transform .18s,box-shadow .18s;}
.lp-feat:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(29,79,216,.10);}
.lp-feat-head{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
.lp-feat-ic{width:46px;height:46px;border-radius:12px;background:var(--blue-bg);color:var(--blue);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.lp-feat-ic svg{width:23px;height:23px;}
.lp-feat h3{font-size:15.5px;font-weight:700;color:var(--ink);margin:0;line-height:1.25;}
.lp-feat p{color:var(--muted);font-size:14px;line-height:1.6;margin:0;}

.lp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.lp-step{text-align:center;}
.lp-step-num{width:46px;height:46px;border-radius:50%;background:var(--blue);color:#fff;font-size:18px;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
.lp-step h3{font-size:16px;font-weight:700;color:var(--ink);margin-bottom:6px;}
.lp-step p{color:var(--muted);font-size:14px;line-height:1.55;margin:0;}

.lp-quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.lp-quick{display:flex;align-items:center;gap:14px;background:var(--card);border:1.5px solid var(--line);border-radius:14px;padding:18px;transition:border-color .15s,box-shadow .15s;}
.lp-quick:hover{border-color:var(--blue-soft);box-shadow:0 4px 16px rgba(29,79,216,.10);}
.lp-quick-ic{width:46px;height:46px;border-radius:12px;background:var(--blue-bg);color:var(--blue);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.lp-quick-ic svg{width:22px;height:22px;}
.lp-quick-t{font-weight:700;color:var(--ink);font-size:15px;}
.lp-quick-s{color:var(--muted);font-size:12.5px;}
.lp-quick-arrow{margin-left:auto;color:var(--gray);}
.lp-quick-arrow svg{width:18px;height:18px;}

.lp-cta{background:linear-gradient(135deg,#0e1a33,#1b2f57);border-radius:var(--radius-lg);color:#fff;padding:44px 28px;text-align:center;max-width:960px;margin:0 auto;}
.lp-cta h3{font-size:24px;font-weight:700;margin-bottom:10px;}
.lp-cta p{color:rgba(255,255,255,.85);margin:0 auto 22px;max-width:440px;}
.lp-cta-note{margin-top:16px;font-size:12.5px;color:rgba(255,255,255,.85);}
.lp-cta-note a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:2px;}
.lp-cta-note a:hover{color:#fff;opacity:.85;}

.lp-toast{position:fixed;bottom:16px;right:16px;z-index:9999;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-card);padding:13px 16px;display:flex;align-items:center;gap:10px;max-width:320px;}
.lp-toast svg{width:18px;height:18px;flex-shrink:0;}
.lp-toast-close{margin-left:6px;background:none;border:none;color:var(--gray);font-size:18px;cursor:pointer;line-height:1;}

/* ============================================================
   CREATE PAGE (create.php)
   ============================================================ */
.cp-back{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:13px;font-weight:600;margin-bottom:10px;}
.cp-back:hover{color:var(--ink);}
.cp-h1{font-size:24px;font-weight:700;letter-spacing:-.02em;margin-bottom:3px;}
.cp-sub{color:var(--muted);font-size:13.5px;margin:0 0 18px;}
.cp-guest{background:#fdf7ee;border:1px solid #ecd9b8;border-radius:11px;padding:12px 14px;font-size:12.5px;color:#7a5a14;line-height:1.5;margin-bottom:16px;}
.cp-guest b{color:#5c430e;}
.cp-guest-why{margin-top:6px;color:#8a6a24;}
.cp-guest .btn{margin-top:10px;}
.cp-alert{background:var(--red-bg);border:1px solid var(--red-line);color:var(--red);border-radius:11px;padding:12px 14px;font-size:13.5px;font-weight:600;margin-bottom:16px;}
.cp-card{margin-bottom:14px;}

/* Typ-Auswahl */
.cp-types{display:flex;gap:10px;margin-bottom:14px;}
.cp-type{flex:1;background:var(--card);border:1.5px solid var(--line);border-radius:13px;padding:14px 16px;cursor:pointer;transition:border-color .12s,background .12s;box-shadow:var(--shadow);}
.cp-type:hover{border-color:var(--blue-soft);}
.cp-type.sel{border-color:var(--blue);background:var(--blue-tint);}
.cp-type-t{font-weight:700;font-size:14.5px;margin-bottom:2px;}
.cp-type-d{color:var(--muted);font-size:12px;line-height:1.45;}

/* Tip- und Info-Boxen */
.cp-tip{background:var(--blue-tint);border:1px solid #cddcff;color:var(--ink2);border-radius:10px;padding:10px 13px;font-size:12.5px;margin-bottom:14px;}
.cp-info{display:flex;gap:12px;align-items:flex-start;}
.cp-info .cp-info-ic{font-size:18px;flex-shrink:0;line-height:1.3;}
.cp-info h3{font-size:14px;font-weight:700;margin-bottom:3px;}
.cp-info p{color:var(--muted);font-size:12.5px;line-height:1.55;margin:0;}

/* Tag-Karten (Zeiten pro Tag) */
.cp-count{margin-top:10px;font-size:12px;color:var(--muted);font-weight:600;}
.cp-days{display:flex;flex-direction:column;gap:8px;}
.cp-day{border:1.5px solid var(--line-soft);border-radius:11px;padding:10px 14px;}
.cp-day-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.cp-day-label{font-weight:700;font-size:13.5px;flex:1;min-width:120px;}
.cp-day-rm{background:none;border:none;color:var(--red);font-size:15px;cursor:pointer;line-height:1;padding:2px 4px;}
.cp-slots{margin-top:10px;}
.cp-addslot{background:none;border:none;color:var(--blue);font-size:12.5px;font-weight:700;cursor:pointer;font-family:inherit;padding:4px 0;}
.cp-addslot:hover{color:var(--blue-hover);}
.cp-slot{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.cp-time{width:120px;flex-shrink:0;}
.cp-slot-sep{color:var(--muted);}
.cp-slot-rm{background:none;border:none;color:var(--red);font-size:14px;cursor:pointer;line-height:1;padding:2px 4px;}

.cp-actions{display:flex;gap:10px;margin-top:4px;}
@media (max-width:560px){
  .cp-types{flex-direction:column;}
}

/* ============================================================
   DASHBOARD (dashboard.php)
   ============================================================ */
.db-alert{border-radius:11px;padding:12px 14px;font-size:13.5px;font-weight:600;margin-bottom:16px;display:flex;align-items:center;gap:10px;}
.db-alert.ok{background:var(--green-bg);border:1px solid var(--green-line);color:var(--green);}
.db-alert.info{background:var(--blue-tint);border:1px solid #cddcff;color:var(--ink2);}
.db-alert-x{margin-left:auto;background:none;border:none;color:inherit;opacity:.6;font-size:17px;cursor:pointer;line-height:1;}
.db-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:16px;}
.db-head h1{font-size:24px;font-weight:700;letter-spacing:-.02em;margin-bottom:3px;}
.db-sub{color:var(--muted);font-size:13px;margin:0;}
.db-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px;}
.db-tab{display:inline-flex;align-items:center;gap:7px;padding:8px 15px;border-radius:99px;font-size:13px;font-weight:700;color:var(--ink2);background:var(--card);border:1px solid var(--line);}
.db-tab:hover{border-color:var(--blue-soft);color:var(--ink);}
.db-tab.active{background:var(--blue);color:#fff;border-color:var(--blue);}
.db-tab-n{font-weight:700;opacity:.7;}
.db-tab.active .db-tab-n{opacity:.85;}
.db-list{display:flex;flex-direction:column;gap:10px;}
.db-card{background:var(--card);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow);display:flex;align-items:center;gap:14px;flex-wrap:wrap;transition:box-shadow .15s;}
.db-card:hover{box-shadow:0 4px 16px rgba(29,79,216,.12);}
.db-card-main{flex:1;min-width:240px;}
.db-card-title{font-weight:700;font-size:15.5px;margin-bottom:7px;}
.db-card-title a{color:var(--ink);}
.db-card-title a:hover{color:var(--blue);}
.db-badges{display:flex;gap:6px;flex-wrap:wrap;align-items:center;}
.db-actions{display:flex;gap:8px;flex-wrap:wrap;}
.db-empty{background:var(--card);border-radius:16px;box-shadow:var(--shadow);padding:44px 24px;text-align:center;}
.db-empty-ic{font-size:40px;margin-bottom:12px;}
.db-empty h2{font-size:19px;font-weight:700;margin-bottom:6px;}
.db-empty p{color:var(--muted);font-size:14px;margin:0 auto 18px;max-width:380px;}

/* ============================================================
   AUTH & FEHLERSEITEN (login, register, verify, _error, …)
   ============================================================ */
.auth-wrap{max-width:960px;margin:0 auto;padding:44px 16px 64px;}
.auth-head{text-align:center;max-width:440px;margin:0 auto 20px;}
.auth-ic{width:58px;height:58px;border-radius:16px;background:var(--blue-bg);color:var(--blue);display:inline-flex;align-items:center;justify-content:center;font-size:26px;margin-bottom:12px;}
.auth-head h1{font-size:23px;font-weight:700;letter-spacing:-.02em;margin-bottom:3px;}
.auth-head p{color:var(--muted);font-size:13.5px;margin:0;}
.auth-card{background:var(--card);border-radius:16px;box-shadow:var(--shadow-card);padding:24px;max-width:440px;margin:0 auto;}
.auth-field{margin-bottom:14px;}
.auth-field:last-of-type{margin-bottom:18px;}
.auth-alert{border-radius:10px;padding:10px 13px;font-size:13px;line-height:1.45;margin-bottom:14px;}
.auth-alert.err{background:var(--red-bg);border:1px solid var(--red-line);color:var(--red);}
.auth-alert.ok{background:var(--green-bg);border:1px solid var(--green-line);color:var(--green);}
.auth-alert.info{background:var(--blue-tint);border:1px solid #cddcff;color:var(--ink2);}
.auth-alert a{font-weight:700;color:inherit;text-decoration:underline;}
.auth-sep{border:none;border-top:1px solid var(--line);margin:16px 0;}
.auth-links{text-align:center;font-size:13px;color:var(--muted);}
.auth-links p{margin:0 0 6px;}
.auth-links p:last-child{margin-bottom:0;}
.auth-links a{color:var(--muted);}
.auth-links a.strong{color:var(--blue);font-weight:700;}

/* Ergebnis-/Statuskarten (verify, forgot-success, error) */
.auth-result{max-width:480px;margin:0 auto;background:var(--card);border-radius:18px;box-shadow:var(--shadow-card);padding:40px 28px;text-align:center;}
.auth-result-emoji{font-size:52px;line-height:1;margin-bottom:14px;}
.auth-result h1{font-size:22px;font-weight:700;letter-spacing:-.02em;margin-bottom:8px;}
.auth-result p{color:var(--muted);font-size:14px;line-height:1.55;margin:0 auto 22px;max-width:380px;}
.auth-result-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
.err-code{font-size:68px;font-weight:800;line-height:1;color:var(--blue-soft);letter-spacing:-.03em;margin-bottom:10px;}

/* ============================================================
   PROFIL (profile.php)
   ============================================================ */
.pf-wrap{max-width:960px;margin:0 auto;padding:24px 16px 64px;}
.pf-head{display:flex;align-items:center;gap:14px;margin:6px 0 18px;}
.pf-avatar{width:62px;height:62px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--navy));color:#fff;font-size:26px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.pf-head h1{font-size:22px;font-weight:700;letter-spacing:-.02em;margin-bottom:1px;}
.pf-head .pf-user{color:var(--muted);font-size:13px;}
.pf-card{margin-bottom:16px;}
.pf-sub{color:var(--muted);font-size:13px;margin:-4px 0 16px;}
.pf-danger{border:1.5px solid var(--red-line);}
.pf-danger .ub-section-title{color:var(--red);}

/* ============================================================
   ANLEITUNG / FAQ (anleitung.php)
   ============================================================ */
.guide-hero{background:var(--navy);color:#fff;text-align:center;padding:44px 16px 40px;}
.guide-hero h1{font-size:clamp(24px,4vw,32px);font-weight:700;letter-spacing:-.02em;margin-bottom:8px;}
.guide-hero p{color:rgba(255,255,255,.7);font-size:15px;margin:0 auto 22px;max-width:480px;}
.guide-search-wrap{max-width:520px;margin:0 auto;}
.guide-search{width:100%;border:none;border-radius:12px;padding:13px 16px;font:inherit;font-size:15px;box-shadow:0 4px 20px rgba(0,0,0,.2);outline:none;color:var(--ink);}
.guide-count{color:rgba(255,255,255,.75);font-size:13px;margin-top:8px;min-height:1.2em;}
.guide-layout{max-width:1000px;margin:0 auto;padding:28px 16px 64px;display:grid;grid-template-columns:220px 1fr;gap:24px;align-items:start;}
.guide-toc{position:sticky;top:16px;background:var(--card);border-radius:14px;box-shadow:var(--shadow);padding:14px;}
.guide-toc-label{font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;}
.guide-toc a{display:block;color:var(--ink2);font-size:13.5px;font-weight:600;padding:7px 9px;border-radius:8px;}
.guide-toc a:hover{background:var(--blue-bg);color:var(--blue);}
.guide-toc .sep{border-top:1px solid var(--line);margin:8px 0;}
.guide-card{background:var(--card);border-radius:16px;box-shadow:var(--shadow);padding:22px 24px;margin-bottom:16px;}
.guide-card h2{font-size:19px;font-weight:700;letter-spacing:-.01em;margin-bottom:12px;display:flex;align-items:center;gap:9px;}
.guide-card h3{font-size:15px;font-weight:700;margin:16px 0 5px;color:var(--ink);}
.guide-card p{color:var(--ink2);font-size:14px;line-height:1.6;margin:0 0 10px;}
.guide-card ul{margin:0 0 10px;padding-left:20px;color:var(--ink2);font-size:14px;line-height:1.7;}
.guide-card li{margin-bottom:3px;}
.guide-card strong{color:var(--ink);}
.section-hidden{display:none;}
.faq-item{border:1px solid var(--line);border-radius:11px;margin-bottom:8px;overflow:hidden;}
.faq-q{padding:13px 15px;cursor:pointer;font-weight:600;font-size:14px;color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:10px;}
.faq-q:hover{background:#f7f9fc;}
.faq-chev{color:var(--gray);transition:transform .2s;flex-shrink:0;}
.faq-q.active .faq-chev{transform:rotate(180deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s;background:#f9fafb;}
.faq-a.open{max-height:600px;}
.faq-a p{padding:12px 15px;margin:0;color:var(--ink2);font-size:13.5px;line-height:1.6;}
.faq-item.hidden{display:none;}
@media (max-width:820px){
  .guide-layout{grid-template-columns:1fr;}
  .guide-toc{display:none;}
}

@media (max-width:640px){
  .lp-steps{grid-template-columns:1fr;gap:26px;}
  .lp-quick-grid{grid-template-columns:1fr;}
  .lp-search{padding:16px;}
  .lp-search-group{flex-direction:column;gap:10px;}
  .lp-search-group .inp{height:50px;font-size:16px;border-radius:10px;}
  .lp-search-btn{width:100%;justify-content:center;height:48px;font-size:15px;border-radius:10px;}
}

/* ============================================================
   RESPONSIVE  (Mobile ≤ 560px)
   ============================================================ */
@media (max-width:560px){
  :root{--ub-namecol:132px;}
  body{font-size:14px;}
  .poll-head h2{font-size:21px;}
  .idbox{width:100%;}
  /* Einklappbare Karten (Header mit toggleCollapse) mobil kompakter */
  .card:has(> h5[onclick^="toggleCollapse"]){padding:14px 16px;}
  /* Mobil: Gitter scrollt horizontal (Spalten-Paging folgt in einer späteren Phase) */
  .ub-grid-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .ub-voter-name{max-width:90px;}
  /* Name/E-Mail/Button stapeln via flex-basis:100% (kein column → keine Höhen-Verzerrung) */
  .ub-idbar .inp, .ub-idbar .btn{flex:1 1 100%;}
  .cal-months{gap:0;}
  .cal-month.second{display:none;}   /* Mobil: nur 1 Monat */
  .cal-title-second{display:none;}
  .cal-legend .cal-count{margin-left:0;width:100%;}
  .idbox .id-url{min-width:40px;}   /* schmale Screens: URL-Feld darf stärker schrumpfen (Admin-Box) */
  /* Beste Termine / Termin festlegen: 2 pro Zeile, kompaktere Karten */
  .bt-grid{grid-template-columns:1fr 1fr;gap:8px;}
  .bt-main{padding:10px 11px 14px;}
  .bt-date{font-size:13px;}
  .bt-count-num{font-size:17px;}
  .bt-fix{padding:9px;font-size:12px;}
  /* Editbar: Buttons sauber gestapelt (volle Breite, kein Spacer-Verteilen) */
  .ub-editbar .btn{flex:1 1 100%;}
  .ub-editbar .spacer{margin-left:0;}
  /* Vorschlags-Button auf volle Breite */
  .ub-propose-btn{width:100%;justify-content:center;}
  /* Claim-Box mobil: Felder volle Breite gestapelt; Button kompakt (btn-sm-Größe) */
  .claim-fields .claim-field{flex:1 1 100%;}
  .claim-fields .claim-login-btn{height:36px;min-height:0;padding:0 13px;font-size:12.5px;}
  /* Konto-verknüpfen-Buttons mobil: kompakt (btn-sm-Größe) und volle Breite geteilt */
  .acct-link-btn{flex:1 1 0;height:36px;font-size:12px;padding:0 10px;}
  /* Navbar: alles in EINER Zeile — Logo, Name (wenn Platz), dann einheitliche Icons */
  .nav-v2 .nav-inner{gap:6px;padding:12px 14px;flex-wrap:nowrap;}
  .nav-links{gap:2px;flex-wrap:nowrap;}
  .nav-tx{display:none;}
  .nav-ic{display:inline-flex;}
  /* Pille verliert mobil ihren Hintergrund → alle Items gleich hoch/schlicht */
  .nav-link,.nav-pill{padding:7px;background:transparent;color:rgba(255,255,255,.85);}
  .nav-link:hover,.nav-pill:hover{background:rgba(255,255,255,.1);color:#fff;}
  .nav-sep{display:none;}   /* Trennstriche mobil weg — gleichmäßiger Abstand */
  /* Metadaten-Chips: nach Teilnehmer umbrechen (Erstellt/Endet in Zeile 2) */
  .meta-break{display:block;flex-basis:100%;height:0;}
  /* Finaltermin-Banner: 🎉 in den Titel, Text volle Breite, Buttons in eigener Zeile */
  .banner-final .b-emoji{display:none;}
  .b-title-emoji{display:inline;}
  .banner-final{align-items:stretch;}
  .banner-final .b-content{flex:1 1 100%;}
  .banner-final .b-actions{flex:1 1 100%;display:flex;gap:8px;}
  .banner-final .b-actions>*{flex:1;}
  .banner-final .b-actions .btn{width:100%;}
}
/* Admin-Aktionen mobil/tablet: 4 Buttons in EINER Zeile über volle Breite.
   flex:1 1 auto → Breite orientiert sich am Text, Restplatz wird verteilt
   (kurze wie CSV bleiben schmal, längere bekommen Luft → gleichmäßiges Padding) */
@media (max-width:768px){
  .admin-actions{gap:6px;flex-wrap:nowrap;}
  /* Formular-Wrapper auflösen → alle 4 Buttons sind echte Flex-Geschwister */
  .admin-actions form{display:contents;}
  /* flex:1 1 auto → Basis = Textbreite, Restplatz gleichmäßig verteilt
     (breite an den Text angepasst, zusammen volle Breite) */
  .admin-actions .btn{flex:1 1 auto;min-width:0;width:auto;font-size:12.5px;padding:0 10px;height:auto;min-height:44px;line-height:1.2;white-space:normal;}
}
@media (max-width:360px){
  .nav-brand span{display:none;}   /* sehr schmal: nur Logo, kein „datly"-Text */
}