:root {
  --eg-blue: #2f6f9f;
  --eg-blue-dark: #245a81;
  --eg-blue-soft: #e8f1f8;
  --eg-cyan: #25a7c6;
  --eg-green: #4d9b67;
  --eg-orange: #e5a23a;
  --eg-red: #c95b5b;
  --eg-ink: #26333d;
  --eg-muted: #6f7d87;
  --eg-line: #d8e0e5;
  --eg-panel: #ffffff;
  --eg-bg: #eef2f5;
  --eg-sidebar: #f7f9fb;
  --eg-shadow: 0 2px 8px rgba(31, 51, 66, .12);
  --eg-radius: 5px;
  font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--eg-ink);
  background: var(--eg-bg);
}
* { box-sizing: border-box; }
html, body { min-height: 100%; }
body { margin: 0; background: var(--eg-bg); font-size: 14px; }
a { color: var(--eg-blue-dark); text-decoration: none; }
a:hover { text-decoration: underline; }
button, input, textarea, select { font: inherit; }

.app-shell { min-height: 100vh; display: grid; grid-template-rows: 48px 1fr; }
.topbar { background: #fff; border-bottom: 1px solid var(--eg-line); display: flex; align-items: center; padding: 0 14px; position: sticky; top: 0; z-index: 50; box-shadow: 0 1px 3px rgba(23, 36, 46, .08); }
.brand { display: flex; align-items: center; min-width: 238px; gap: 10px; color: var(--eg-ink); font-weight: 700; }
.brand:hover { text-decoration: none; }
.brand-logo { width: 31px; height: 31px; object-fit: contain; flex: 0 0 31px; }
.login-logo { width: 72px; height: 72px; object-fit: contain; }
.brand small { display: block; color: var(--eg-muted); font-size: 10px; font-weight: 500; letter-spacing: .03em; }
.top-actions { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.icon-button { border: 1px solid transparent; background: transparent; border-radius: 4px; color: var(--eg-muted); min-width: 34px; height: 34px; display: inline-grid; place-items: center; cursor: pointer; }
.icon-button:hover { background: var(--eg-blue-soft); color: var(--eg-blue-dark); text-decoration: none; }
.user-chip { display: flex; align-items: center; gap: 8px; padding-left: 8px; margin-left: 4px; border-left: 1px solid var(--eg-line); color: var(--eg-ink); }
.avatar { width: 30px; height: 30px; border-radius: 50%; background: var(--eg-blue); color: #fff; display: grid; place-items: center; font-weight: 700; }
.logout-form { margin: 0; }

.workspace { display: grid; grid-template-columns: 238px minmax(0, 1fr); min-height: calc(100vh - 48px); }
.sidebar { background: var(--eg-sidebar); border-right: 1px solid var(--eg-line); padding: 10px 8px 18px; position: sticky; top: 48px; height: calc(100vh - 48px); overflow-y: auto; }
.sidebar-title { color: var(--eg-muted); text-transform: uppercase; font-size: 10px; letter-spacing: .12em; padding: 10px 11px 5px; font-weight: 700; }
.nav-list { list-style: none; margin: 0; padding: 0; }
.nav-list li { margin: 2px 0; }
.nav-item { display: flex; align-items: center; gap: 10px; min-height: 38px; padding: 7px 11px; border-radius: 4px; color: #43525d; }
.nav-item:hover { background: #e6edf2; text-decoration: none; color: var(--eg-blue-dark); }
.nav-item.active { background: var(--eg-blue); color: #fff; box-shadow: inset 3px 0 0 #83d2e2; }
.nav-icon { width: 20px; text-align: center; font-size: 16px; }
.sidebar-club { margin: 10px 7px; padding: 10px; background: #fff; border: 1px solid var(--eg-line); border-radius: var(--eg-radius); }
.sidebar-club strong { display: block; }
.sidebar-club span { color: var(--eg-muted); font-size: 12px; }

.content { min-width: 0; padding: 16px 18px 32px; }
.page-header { min-height: 45px; display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.page-title { margin: 0; font-size: 22px; font-weight: 600; color: #2d3a44; }
.page-subtitle { color: var(--eg-muted); margin: 3px 0 0; }
.page-actions { margin-left: auto; display: flex; gap: 6px; flex-wrap: wrap; }
.toolbar { min-height: 43px; display: flex; align-items: center; gap: 7px; padding: 6px 8px; background: #fff; border: 1px solid var(--eg-line); border-radius: var(--eg-radius); margin-bottom: 12px; box-shadow: 0 1px 2px rgba(31, 51, 66, .05); }
.toolbar .spacer { flex: 1; }

.panel, .card { background: var(--eg-panel); border: 1px solid var(--eg-line); border-radius: var(--eg-radius); box-shadow: 0 1px 3px rgba(31, 51, 66, .08); padding: 16px; }
.panel + .panel { margin-top: 12px; }
.panel-header { display: flex; align-items: center; gap: 10px; margin: -16px -16px 14px; padding: 10px 14px; border-bottom: 1px solid var(--eg-line); background: linear-gradient(#fff, #f7f9fa); border-radius: var(--eg-radius) var(--eg-radius) 0 0; }
.panel-header h2, .panel-header h3 { margin: 0; font-size: 15px; font-weight: 600; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 12px; }
.dashboard-tile { min-height: 150px; position: relative; overflow: hidden; }
.dashboard-tile::after { content: ""; position: absolute; right: -28px; bottom: -35px; width: 105px; height: 105px; border-radius: 50%; background: var(--eg-blue-soft); }
.dashboard-tile h2 { font-size: 16px; margin: 0 0 10px; }
.metric { font-size: 30px; font-weight: 300; color: var(--eg-blue-dark); }

.button, button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 34px; padding: 7px 12px; border: 1px solid var(--eg-blue-dark); border-radius: 4px; background: var(--eg-blue); color: #fff; cursor: pointer; text-decoration: none; font-weight: 500; }
.button:hover, button:hover { background: var(--eg-blue-dark); text-decoration: none; }
.button.secondary, button.secondary { background: #fff; color: #40515d; border-color: #b9c5cd; }
.button.secondary:hover, button.secondary:hover { background: #edf2f5; }
.button.danger, button.danger { background: #fff; color: var(--eg-red); border-color: #d8a1a1; }
.button.small, button.small { min-height: 28px; padding: 4px 8px; font-size: 12px; }

input, textarea, select { width: 100%; padding: 7px 9px; border: 1px solid #b8c4cc; border-radius: 3px; background: #fff; color: var(--eg-ink); }
input:focus, textarea:focus, select:focus { outline: 2px solid rgba(47,111,159,.18); border-color: var(--eg-blue); }
label { display: inline-block; font-weight: 600; margin-bottom: 4px; }
form p { margin: 0 0 12px; }
.helptext { color: var(--eg-muted); font-size: 12px; }
.errorlist { color: #a33; margin: 0 0 5px; }
.filter-grid { display: grid; grid-template-columns: minmax(220px, 2fr) minmax(160px, 1fr) auto; gap: 8px; align-items: end; width: 100%; }

.table-wrap { overflow-x: auto; margin: -16px; }
table { width: 100%; border-collapse: collapse; background: #fff; }
th { background: #f2f5f7; color: #43515b; font-size: 12px; text-transform: uppercase; letter-spacing: .035em; font-weight: 700; }
th, td { text-align: left; padding: 9px 11px; border-bottom: 1px solid #e1e7eb; vertical-align: middle; }
tbody tr:hover { background: #f3f8fb; }
tbody tr:last-child td { border-bottom: 0; }
.table-actions { white-space: nowrap; }

.badge { display: inline-flex; align-items: center; min-height: 22px; padding: 2px 8px; border-radius: 11px; background: var(--eg-blue-soft); color: var(--eg-blue-dark); font-size: 12px; border: 1px solid #c8ddea; }
.badge.success { background: #e8f5ec; color: #34734a; border-color: #bcdcc6; }
.badge.warning { background: #fff4dc; color: #8b631e; border-color: #ead29f; }
.badge.danger { background: #fbeaea; color: #9b4141; border-color: #e4b8b8; }
.muted { color: var(--eg-muted); }
.logo { max-width: 180px; max-height: 105px; object-fit: contain; }
.club-hero { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 18px; align-items: start; }
.club-logo-box { width: 190px; min-height: 120px; display: grid; place-items: center; background: #f7f9fa; border: 1px solid var(--eg-line); border-radius: var(--eg-radius); }
.club-meta { display: grid; grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap: 8px 18px; margin-top: 14px; }
.club-meta div { padding-bottom: 7px; border-bottom: 1px dotted #d5dde2; }
.club-meta strong { display: block; color: var(--eg-muted); font-size: 11px; text-transform: uppercase; }
.event-list { display: grid; gap: 8px; }
.event-row { display: grid; grid-template-columns: 118px minmax(0,1fr) auto; gap: 14px; align-items: start; padding: 12px; border: 1px solid var(--eg-line); border-left: 4px solid var(--eg-blue); border-radius: 3px; background: #fff; }
.event-date { font-weight: 700; color: var(--eg-blue-dark); }
.event-date span { display: block; color: var(--eg-muted); font-weight: 400; font-size: 12px; }
.event-row h3 { margin: 0 0 4px; font-size: 15px; }
.event-row p { margin: 3px 0; }
.message { margin-bottom: 10px; padding: 10px 12px; border: 1px solid #bcdcc6; background: #eef8f1; border-radius: 4px; }
.empty-state { text-align: center; padding: 32px 18px; color: var(--eg-muted); }
.login-wrap { max-width: 410px; margin: 7vh auto 0; }
.login-brand { text-align: center; margin-bottom: 14px; }
.login-brand .brand-mark { margin: auto; width: 46px; height: 46px; }
details > summary { cursor: pointer; }
code { background: #eef1f3; padding: 2px 4px; border-radius: 3px; }

@media (max-width: 850px) {
  .workspace { grid-template-columns: 1fr; }
  .sidebar { position: static; height: auto; border-right: 0; border-bottom: 1px solid var(--eg-line); display: flex; overflow-x: auto; padding: 6px; }
  .sidebar-title, .sidebar-club { display: none; }
  .nav-list { display: flex; gap: 4px; }
  .nav-item { white-space: nowrap; }
  .brand { min-width: 0; }
  .brand small, .user-chip span { display: none; }
  .content { padding: 12px; }
  .club-hero { grid-template-columns: 1fr; }
  .club-logo-box { width: 100%; }
  .event-row { grid-template-columns: 1fr; }
  .filter-grid { grid-template-columns: 1fr; }
}

.form-panel { max-width: 920px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 1.25rem; }
.form-field { display: flex; flex-direction: column; gap: .35rem; }
.form-field-wide { grid-column: 1 / -1; }
.form-field label { font-weight: 600; }
.form-field input, .form-field select, .form-field textarea { width: 100%; box-sizing: border-box; }
.checkbox-field { flex-direction: row; align-items: flex-start; }
.checkbox-field input { width: auto; margin-top: .25rem; }
.field-error { color: #a61b1b; font-size: .88rem; }
.message.info { border-left: 4px solid #3577a8; }
.message.error { border-left: 4px solid #b22929; }
@media (max-width: 720px) { .form-grid { grid-template-columns: 1fr; } }
.module-tabs { min-height: 40px; display: flex; align-items: stretch; gap: 2px; padding: 0 14px; background: #fff; border-bottom: 1px solid var(--eg-line); }
.module-tabs a { display: inline-flex; align-items: center; padding: 0 15px; color: #43525d; border-bottom: 3px solid transparent; }
.module-tabs a:hover { background: var(--eg-blue-soft); color: var(--eg-blue-dark); text-decoration: none; border-bottom-color: var(--eg-cyan); }
@media (max-width: 850px) { .module-tabs { overflow-x: auto; padding: 0 6px; } .module-tabs a { white-space: nowrap; padding: 0 11px; } }
.app-shell { grid-template-rows: 48px auto 1fr; }
.module-tabs + .workspace { min-height: calc(100vh - 88px); }
.module-tabs + .workspace .sidebar { top: 88px; height: calc(100vh - 88px); }
@media (max-width: 850px) { .module-tabs + .workspace { min-height: auto; } .module-tabs + .workspace .sidebar { height: auto; } }
.top-link { color: #43525d; font-size: 13px; padding: 7px 8px; border-radius: 4px; }
.top-link:hover { background: var(--eg-blue-soft); color: var(--eg-blue-dark); text-decoration: none; }
@media (max-width: 720px) { .top-link { display: none; } }

/* Zentrale Portalverwaltung */
.management-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1rem;margin:1rem 0}
.management-card{display:flex;flex-direction:column;gap:.3rem;padding:1.2rem;background:#fff;border:1px solid var(--border,#d8dee8);border-radius:10px;text-decoration:none;color:inherit;box-shadow:0 2px 8px rgba(15,23,42,.04)}
.management-card strong{font-size:1.7rem;color:#8b1e24}.management-card span{font-weight:600}
.filter-bar,.sub-actions{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin:0 0 1rem}
.filter-bar input,.filter-bar select{min-width:180px;padding:.6rem;border:1px solid #cbd5e1;border-radius:6px;background:#fff}
.sub-actions a{padding:.55rem .75rem;background:#fff;border:1px solid #d8dee8;border-radius:6px;text-decoration:none}
.management-form{max-width:900px}.management-form .form-row{margin-bottom:1rem}.management-form label{display:block;font-weight:600;margin-bottom:.35rem}
.management-form input:not([type=checkbox]):not([type=radio]),.management-form select,.management-form textarea{width:100%;max-width:100%;box-sizing:border-box;padding:.65rem;border:1px solid #cbd5e1;border-radius:6px}
.management-form ul{list-style:none;padding:0;columns:2}.management-form ul li{break-inside:avoid;padding:.2rem 0}.management-form ul label{font-weight:400;display:inline}
.form-actions{display:flex;gap:.6rem;margin-top:1.2rem}.field-error{color:#b91c1c;font-size:.9rem}.page-header.compact{margin-bottom:0}
@media(max-width:720px){.management-form ul{columns:1}.filter-bar>*{width:100%}}

/* Aufklappbare Verwaltungsnavigation */
.nav-management{list-style:none}
.nav-disclosure{margin:0;padding:0}
.nav-disclosure>summary{list-style:none;cursor:pointer;user-select:none}
.nav-disclosure>summary::-webkit-details-marker{display:none}
.nav-chevron{margin-left:auto;transition:transform .18s ease;font-size:1.15rem;line-height:1}
.nav-disclosure[open] .nav-chevron{transform:rotate(90deg)}
.nav-sublist{list-style:none;margin:.2rem 0 .45rem 1.05rem;padding:.15rem 0 .15rem .75rem;border-left:2px solid #d8dee8}
.nav-subitem{display:block;padding:.42rem .55rem;border-radius:6px;text-decoration:none;color:inherit;font-size:.9rem;line-height:1.25}
.nav-subitem:hover,.nav-subitem.active{background:#edf2f7;color:#8b1e24;font-weight:600}

/* Rollen- und Rechteauswahl im zentralen Mitgliederformular */
.management-form .form-row ul[id$="club_role"] {
  list-style: none;
  margin: .5rem 0 0;
  padding: .75rem;
  display: grid;
  gap: .6rem;
  border: 1px solid var(--border, #d7dde5);
  border-radius: .5rem;
  background: #f8fafc;
}
.management-form .form-row ul[id$="club_role"] label {
  display: flex;
  align-items: flex-start;
  gap: .55rem;
  font-weight: 500;
}
.management-form .form-row ul[id$="club_role"] input[type="checkbox"] {
  margin-top: .2rem;
}

/* Rollenwahl in der Vereinszugehörigkeit */
.management-form .role-selection-row ul[id$="roles"] {
  list-style: none;
  margin: .5rem 0 0;
  padding: .8rem;
  display: grid;
  gap: .65rem;
  columns: initial;
  border: 1px solid var(--border, #d7dde5);
  border-radius: .5rem;
  background: #f8fafc;
}
.management-form .role-selection-row ul[id$="roles"] li {
  padding: 0;
}
.management-form .role-selection-row ul[id$="roles"] label {
  display: flex;
  align-items: flex-start;
  gap: .55rem;
  margin: 0;
  font-weight: 500;
  cursor: pointer;
}
.management-form .role-selection-row ul[id$="roles"] input[type="checkbox"] {
  width: auto;
  margin-top: .2rem;
  flex: 0 0 auto;
}

/* Version 1.2.0: portalweites responsives Zwei-Spalten-Formularlayout */
.two-column-form,
.management-form {
  max-width: 1120px;
}
.two-column-form .form-grid,
.management-form .form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 20px;
  align-items: start;
}
.two-column-form .form-field,
.management-form .form-field {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.two-column-form .form-field-wide,
.management-form .form-field-wide,
.form-grid-wide {
  grid-column: 1 / -1;
}
.two-column-form .form-actions,
.management-form .form-actions {
  grid-column: 1 / -1;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 18px;
}
.required-marker { color: var(--eg-red); margin-left: 3px; }
.single-checkbox {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px 11px;
  border: 1px solid var(--eg-line);
  border-radius: 4px;
  background: #f8fafb;
  cursor: pointer;
}
.single-checkbox input[type="checkbox"] { width: auto; margin: 0; }
.form-field-checkbox { justify-content: end; }

/* Django CheckboxSelectMultiple and radio groups */
.form-field > ul,
.form-field .checkbox-grid,
.management-form .form-field > ul {
  list-style: none;
  margin: 0;
  padding: 10px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px 16px;
  border: 1px solid var(--eg-line);
  border-radius: 4px;
  background: #f8fafb;
}
.form-field > ul li,
.management-form .form-field > ul li { min-width: 0; padding: 0; break-inside: avoid; }
.form-field > ul label,
.management-form .form-field > ul label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  font-weight: 400;
  cursor: pointer;
}
.form-field > ul input[type="checkbox"],
.form-field > ul input[type="radio"],
.management-form .form-field > ul input[type="checkbox"],
.management-form .form-field > ul input[type="radio"] {
  width: auto;
  flex: 0 0 auto;
  margin-top: 3px;
}

/* Alte as_p-Formulare erhalten ebenfalls ein Zwei-Spalten-Raster. */
form.portal-form-as-p {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 20px;
}
form.portal-form-as-p > p { margin: 0; min-width: 0; }
form.portal-form-as-p > p:has(textarea),
form.portal-form-as-p > p:has(input[type="file"]),
form.portal-form-as-p > p:has(ul) { grid-column: 1 / -1; }

@media (max-width: 760px) {
  .two-column-form .form-grid,
  .management-form .form-grid,
  form.portal-form-as-p {
    grid-template-columns: 1fr;
  }
  .two-column-form .form-field-wide,
  .management-form .form-field-wide,
  .form-grid-wide,
  form.portal-form-as-p > p:has(textarea),
  form.portal-form-as-p > p:has(input[type="file"]),
  form.portal-form-as-p > p:has(ul) {
    grid-column: auto;
  }
  .form-field > ul,
  .management-form .form-field > ul {
    grid-template-columns: 1fr;
  }
}


/* Version 1.2.6: konsistentes Zwei-Spalten-Layout in sämtlichen Portalformularen */
.form-panel form.two-column-form,
.panel form.two-column-form,
.management-form,
.registration-form,
.login-form {
  width: 100%;
  max-width: 1120px;
}

/* Das Raster liegt grundsätzlich innerhalb von .form-grid. */
.form-panel .form-grid,
.panel .two-column-form .form-grid,
.management-form .form-grid,
.registration-form .form-grid,
.login-form .form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px 20px;
  align-items: start;
}

.form-panel .form-field,
.management-form .form-field,
.registration-form .form-field,
.login-form .form-field {
  min-width: 0;
}

/* Breite Eingabetypen und fachlich umfangreiche Auswahllisten bleiben zwecks Lesbarkeit vollbreit. */
.form-field-wide,
.form-grid-wide,
.form-field:has(textarea),
.form-field:has(input[type="file"]),
.form-field:has(ul),
.role-selection-row {
  grid-column: 1 / -1;
}

/* Checkbox- und Radio-Optionen innerhalb eines Vollbreitenfeldes wiederum zweispaltig. */
.form-field > ul,
.form-field .checkbox-grid,
.management-form .form-field > ul,
.role-selection-row > ul {
  columns: initial !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

/* Einzelcheckboxen sind normale Rasterfelder und stehen paarweise nebeneinander. */
.form-field-checkbox {
  grid-column: auto;
  align-self: stretch;
}
.single-checkbox { height: 100%; box-sizing: border-box; }

.login-panel { width: min(720px, 100%); }
.login-form .form-actions { grid-column: 1 / -1; }

@media (max-width: 760px) {
  .form-panel .form-grid,
  .panel .two-column-form .form-grid,
  .management-form .form-grid,
  .registration-form .form-grid,
  .login-form .form-grid,
  .form-field > ul,
  .form-field .checkbox-grid,
  .management-form .form-field > ul,
  .role-selection-row > ul {
    grid-template-columns: 1fr !important;
  }
  .form-field-wide,
  .form-grid-wide,
  .form-field:has(textarea),
  .form-field:has(input[type="file"]),
  .form-field:has(ul),
  .role-selection-row {
    grid-column: auto;
  }
}


/* Version 1.2.7: Django 5 rendert Mehrfach-Checkboxen als verschachtelte DIVs statt UL. */
.choice-grid {
  grid-column: 1 / -1;
}
.choice-grid > div,
.choice-grid > div[id^="id_"],
.form-field > div[id^="id_"]:has(input[type="checkbox"]),
.form-field > div[id^="id_"]:has(input[type="radio"]) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px 18px !important;
  margin: 0 !important;
  padding: 10px !important;
  border: 1px solid var(--eg-line);
  border-radius: 4px;
  background: #f8fafb;
}
.choice-grid > div > div,
.choice-grid > div[id^="id_"] > div,
.form-field > div[id^="id_"] > div {
  min-width: 0;
  margin: 0 !important;
}
.choice-grid label,
.form-field > div[id^="id_"] label {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  margin: 0 !important;
  font-weight: 400 !important;
  cursor: pointer;
}
.choice-grid input[type="checkbox"],
.choice-grid input[type="radio"],
.form-field > div[id^="id_"] input[type="checkbox"],
.form-field > div[id^="id_"] input[type="radio"] {
  width: auto !important;
  flex: 0 0 auto;
  margin: 3px 0 0 !important;
}
@media (max-width: 760px) {
  .choice-grid > div,
  .choice-grid > div[id^="id_"],
  .form-field > div[id^="id_"]:has(input[type="checkbox"]),
  .form-field > div[id^="id_"]:has(input[type="radio"]) {
    grid-template-columns: 1fr !important;
  }
}

/* Dashboard-Aufgaben und Navigationszaehler (1.3.0) */
.task-alert { display:flex; align-items:center; gap:16px; margin:0 0 20px; padding:16px 18px; border:1px solid #e4c36f; border-left:5px solid #d79b16; border-radius:8px; background:#fff8e8; box-shadow:0 1px 3px rgba(15,23,42,.08); }
.task-alert-icon { display:grid; place-items:center; flex:0 0 34px; width:34px; height:34px; border-radius:50%; background:#d79b16; color:#fff; font-weight:800; font-size:20px; }
.task-alert-content { flex:1 1 auto; min-width:0; }
.task-alert h2 { margin:0 0 3px; font-size:16px; }
.task-alert p { margin:0; }
.nav-subitem-with-badge { display:flex !important; align-items:center; justify-content:space-between; gap:8px; }
.nav-count { display:inline-flex; align-items:center; justify-content:center; min-width:22px; height:22px; padding:0 7px; border-radius:11px; background:#b42318; color:#fff; font-size:12px; font-weight:700; line-height:1; }
@media (max-width: 700px) { .task-alert { align-items:flex-start; flex-wrap:wrap; } .task-alert .button { width:100%; text-align:center; } }

/* 1.4.0: Dashboard, Aufgaben und konsistente Formularraster */
.task-board { margin-bottom: 18px; }
.task-list { display: grid; gap: 8px; }
.task-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid var(--eg-line); border-radius: 6px; color: inherit; text-decoration: none; background: #fff; }
.task-row:hover { background: #f8fafb; }
.task-dot { width: 10px; height: 10px; border-radius: 50%; background: #64748b; }
.task-dot.warning { background: #d79b16; }
.task-dot.info { background: #2563eb; }
.task-dot.danger { background: #b42318; }
.dashboard-summary .dashboard-tile { min-height: 190px; }
.compact-filter .filter-grid { display: grid; grid-template-columns: minmax(220px, 2fr) minmax(180px, 1fr) auto; gap: 12px; align-items: end; }
.compact-filter p { margin: 0; }
.filter-actions { display: flex; gap: 8px; align-items: center; }
.two-column-form .form-grid > .form-field,
.management-form .form-grid > .form-field,
.registration-form .form-grid > .form-field,
.login-form .form-grid > .form-field { min-width: 0; }
@media (max-width: 760px) {
  .compact-filter .filter-grid { grid-template-columns: 1fr; }
  .filter-actions { flex-wrap: wrap; }
  .task-row { grid-template-columns: auto 1fr; }
  .task-row strong { grid-column: 2; }
}


/* Version 1.4.5: Mail-Uebersicht - Funktionsboxen breiter, Hinweis kompakter. */
.mail-overview-grid {
  grid-template-columns: minmax(360px, 1.35fr) minmax(340px, 1.25fr) minmax(220px, 0.65fr);
  align-items: start;
}
@media (max-width: 1120px) {
  .mail-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mail-overview-grid > .panel:last-child { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .mail-overview-grid { grid-template-columns: 1fr; }
  .mail-overview-grid > .panel:last-child { grid-column: auto; }
}

/* Version 1.5.0: integrierte Hilfe und Kontaktformular */
.context-help-link{display:flex;justify-content:flex-end;margin:-2px 0 10px}.context-help-link a{font-size:.88rem;text-decoration:none;color:#425466;background:#f5f7fa;border:1px solid var(--eg-line);border-radius:999px;padding:5px 10px}.context-help-link a:hover{color:var(--eg-red);background:#fff}
.help-search-panel{margin-bottom:14px}.help-search-form label{display:block;font-weight:600;margin-bottom:6px}.help-search-row{display:flex;gap:8px}.help-search-row input{flex:1;min-width:180px}.help-topic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.help-topic-card{display:block;text-decoration:none;color:inherit;transition:box-shadow .15s,transform .15s}.help-topic-card:hover{box-shadow:0 4px 14px rgba(0,0,0,.08);transform:translateY(-1px)}.help-topic-card h2{margin-top:0}.help-more{font-weight:600;color:var(--eg-red)}.help-section{margin-bottom:12px}.help-print-actions{margin-top:14px}.contact-intro{margin-bottom:12px}.contact-form-panel{max-width:1120px}.contact-privacy-note{font-size:.9rem;color:#586572;background:#f7f9fb;border:1px solid var(--eg-line);padding:10px 12px;border-radius:4px}
@media(max-width:760px){.help-topic-grid{grid-template-columns:1fr}.help-search-row{flex-direction:column}.context-help-link{justify-content:flex-start}}
@media print{.sidebar,.topbar,.context-help-link,.help-print-actions{display:none!important}.workspace{display:block}.content{padding:0}.panel{box-shadow:none;border:0;padding:0 0 14px}.help-section{break-inside:avoid}}

/* 1.5.3 public landing page and event rows */
.public-events-overview{margin-bottom:16px}.public-event-lines{display:flex;flex-direction:column}.public-event-line{display:grid;grid-template-columns:92px 82px minmax(160px,1fr) minmax(140px,.7fr);gap:10px;align-items:center;padding:9px 6px;border-bottom:1px solid var(--border,#e4e7eb);text-decoration:none;color:inherit}.public-event-line:last-child{border-bottom:0}.public-event-line:hover{background:rgba(0,0,0,.025)}.public-event-date,.public-event-time{white-space:nowrap;font-variant-numeric:tabular-nums}.public-event-club{color:var(--muted,#667085)}.public-event-lines.compact .public-event-line{grid-template-columns:86px 76px minmax(0,1fr);font-size:.94rem;padding:7px 2px}.club-event-preview{margin:14px 0}.club-event-preview>strong{display:block;margin-bottom:6px}.public-club-card{display:flex;flex-direction:column}.public-club-card .form-actions{margin-top:auto}@media(max-width:720px){.public-event-line,.public-event-lines.compact .public-event-line{grid-template-columns:86px 1fr;gap:4px 10px}.public-event-title,.public-event-club{grid-column:2}.public-event-time{grid-column:1;grid-row:2}.public-event-title{grid-row:1}.public-event-club{grid-row:2}}

/* 1.5.4: klarere Verwaltung und luftigere öffentliche Veranstaltungsliste */
.nav-subheading{padding:10px 12px 4px;font-size:.72rem;font-weight:700;letter-spacing:.055em;text-transform:uppercase;color:#7a8794;list-style:none}
.public-event-lines:not(.compact) .public-event-line{grid-template-columns:100px 96px minmax(180px,1fr) minmax(160px,.75fr);column-gap:24px;padding-left:10px;padding-right:10px}
@media(max-width:900px){.public-event-lines:not(.compact) .public-event-line{column-gap:16px}}
@media(max-width:720px){.public-event-lines:not(.compact) .public-event-line{column-gap:12px}}

/* 1.5.7: kompakte öffentliche Vereinsübersicht */
.public-club-directory{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:14px}
.public-club-summary{display:grid;grid-template-columns:68px minmax(0,1fr) minmax(130px,.75fr);gap:14px;align-items:center;padding:16px 18px;min-height:96px}
.public-club-logo{width:62px;height:62px;display:flex;align-items:center;justify-content:center}
.public-club-logo .logo{max-width:62px;max-height:62px;object-fit:contain}
.public-club-logo-placeholder{font-size:1.8rem;color:var(--muted,#667085)}
.public-club-main h2{margin:0 0 3px;font-size:1.08rem;line-height:1.25}
.public-club-short-name{font-size:.9rem;margin-bottom:3px}
.public-club-location{font-size:.94rem}
.public-club-contact{display:flex;flex-direction:column;align-items:flex-end;gap:4px;font-size:.9rem;text-align:right;overflow-wrap:anywhere}
@media(max-width:720px){.public-club-directory{grid-template-columns:1fr}.public-club-summary{grid-template-columns:68px minmax(0,1fr)}.public-club-contact{grid-column:1/-1;align-items:flex-start;text-align:left;padding-top:4px}}