/* Bestandsstile aus Version 1.6.2; visuelle Änderungen bevorzugt über die Variablen unten. */
:root {
  --green:#005437;
  --green2:#0b7a4f;
  --lime:#8abd24;
  --ink:#17351f;
  --muted:#64736a;
  --bg:#f3f7f2;
  --card:#fff;
  --line:#dce7df;
  --red:#a62525;
  --blue:#145da0;
  --shadow:0 14px 36px rgba(20,60,30,.10)
}

* {
  box-sizing:border-box
}

body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif
}

a {
  color:var(--green);
  text-decoration:none
}

a:hover {
  text-decoration:underline
}

.wrap {
  width:min(1240px,calc(100% - 32px));
  margin:auto
}

.topbar {
  background:var(--green);
  color:#fff;
  position:sticky;
  top:0;
  z-index:5;
  box-shadow:0 2px 12px rgba(0,0,0,.12)
}

.topbar .wrap {
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:64px;
  gap:20px
}

.brand {
  font-size:1.12rem;
  font-weight:800;
  color:#fff
}

.nav {
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap
}

.nav a {
  color:#fff;
  padding:9px 12px;
  border-radius:9px
}

.nav a.active,.nav a:hover {
  background:rgba(255,255,255,.15);
  text-decoration:none
}

.main {
  padding:28px 0 56px
}

.grid {
  display:grid;
  gap:18px
}

.kpis {
  grid-template-columns:repeat(4,minmax(0,1fr))
}

.two {
  grid-template-columns:repeat(2,minmax(0,1fr))
}

.card {
  background:var(--card);
  border:1px solid var(--line);
  border-radius:16px;
  padding:22px;
  box-shadow:var(--shadow)
}

.kpi small {
  display:block;
  color:var(--muted);
  font-weight:700
}

.kpi strong {
  display:block;
  font-size:2.2rem;
  margin-top:7px;
  color:var(--green)
}

h1 {
  margin:0 0 20px;
  font-size:clamp(1.8rem,4vw,2.6rem)
}

h2 {
  margin:0 0 16px;
  font-size:1.2rem
}

p {
  line-height:1.55
}

.filters,.form-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  align-items:end
}

.form-grid .wide {
  grid-column:span 2
}

.form-grid .full {
  grid-column:1/-1
}

label {
  display:block;
  font-size:.86rem;
  font-weight:750;
  margin:0 0 6px
}

input,select,textarea,button {
  font:inherit
}

input,select,textarea {
  width:100%;
  border:1px solid #b9c9bf;
  border-radius:10px;
  padding:11px 12px;
  background:#fff;
  color:var(--ink)
}

.sm-ai-optin { display:flex; align-items:center; gap:10px; margin:14px 0 8px; font-weight:600; }
.sm-ai-optin input[type="checkbox"] { width:auto; flex:0 0 auto; margin:0; padding:0; }

textarea {
  min-height:110px;
  resize:vertical
}

input:focus,select:focus,textarea:focus {
  outline:3px solid rgba(138,189,36,.25);
  border-color:var(--green2)
}

button,.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:10px;
  padding:11px 16px;
  font-weight:800;
  cursor:pointer;
  background:var(--green);
  color:#fff
}

.button.secondary,button.secondary {
  background:#e7efe9;
  color:var(--green)
}

button.danger {
  background:var(--red)
}

.actions {
  display:flex;
  gap:10px;
  flex-wrap:wrap
}

.flash {
  padding:13px 16px;
  border-radius:10px;
  margin:0 0 16px;
  font-weight:700
}

.flash.success {
  background:#dff3e5;
  color:#005437
}

.flash.error {
  background:#fde4e4;
  color:#7e1d1d
}

.diagnostic {
  margin-top:10px;
  padding:10px 12px;
  border-radius:9px;
  background:#fde4e4;
  color:#7e1d1d;
  font-size:.88rem;
  overflow-wrap:anywhere
}

.table-wrap {
  overflow:auto
}

table {
  width:100%;
  border-collapse:collapse;
  min-width:760px
}

th,td {
  text-align:left;
  padding:12px 10px;
  border-bottom:1px solid var(--line);
  vertical-align:top
}

th {
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--muted)
}

.tag {
  display:inline-block;
  background:#e8f2ea;
  border-radius:999px;
  padding:4px 8px;
  margin:2px 3px 2px 0;
  font-size:.78rem
}

.tag.focus {
  background:#e6f2c9;
  color:#345900
}

.bar-row {
  display:grid;
  grid-template-columns:minmax(120px,1fr) 3fr 54px;
  gap:10px;
  align-items:center;
  margin:10px 0
}

.bar-track {
  height:12px;
  background:#e8eee9;
  border-radius:99px;
  overflow:hidden
}

.bar {
  height:100%;
  background:linear-gradient(90deg,var(--green),var(--lime));
  border-radius:99px
}

.muted {
  color:var(--muted)
}

.checks {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px
}

.check {
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px;
  border:1px solid var(--line);
  border-radius:9px
}

.check input {
  width:auto
}

.login-shell {
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px
}

.login-card {
  width:min(560px,100%)
}

.login-card h1 {
  color:var(--green)
}

.notice {
  background:#fff6d8;
  border:1px solid #ead48d;
  border-radius:10px;
  padding:12px 14px
}

.footer {
  color:var(--muted);
  font-size:.82rem;
  margin-top:28px
}

.inline {
  display:inline
}

.right {
  text-align:right
}

.empty {
  padding:28px;
  text-align:center;
  color:var(--muted)
}

@media(max-width:900px) {
  .kpis,.two {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .filters,.form-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .checks {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

}

@media(max-width:620px) {
  .topbar .wrap {
    align-items:flex-start;
    padding:12px 0;
    flex-direction:column
  }

  .kpis,.two,.filters,.form-grid {
    grid-template-columns:1fr
  }

  .form-grid .wide {
    grid-column:span 1
  }

  .checks {
    grid-template-columns:1fr
  }

  .bar-row {
    grid-template-columns:100px 1fr 42px
  }

  .card {
    padding:17px
  }

  .wrap {
    width:min(100% - 20px,1240px)
  }

}


/* 1.7.0 · Bearbeitbare Designwerte für Navigation und Analyse */
:root {
  --sm-ink: #062f28;
  --sm-muted: #87938d;
  --sm-muted-strong: #64726c;
  --sm-bg: #f5f6f4;
  --sm-side: #eff0ee;
  --sm-card: #ffffff;
  --sm-line: #e5e9e5;
  --sm-lime: #a4ed72;
  --sm-lime-light: #dff8d1;
  --sm-hover: #f3f9ef;
  --sm-card-radius: 14px;
  --sm-sidebar-width: 260px;
  --sm-gap: 16px;
}
body { color: var(--sm-ink); background: var(--sm-bg); }
a { color: var(--sm-ink); }
.sm-app { display: flex; min-height: calc(100vh - 32px); margin: 16px; border: 7px solid var(--sm-lime-light); border-radius: 28px; overflow: hidden; background: var(--sm-bg); }
.sm-sidebar { display: flex; flex: 0 0 var(--sm-sidebar-width); flex-direction: column; padding: 24px 17px 18px; border-right: 1px solid var(--sm-line); background: var(--sm-side); }
.sm-brand { display: flex; align-items: center; gap: 12px; margin: 0 0 27px 4px; color: var(--sm-ink); font-size: 22px; font-weight: 800; letter-spacing: -.04em; }
.sm-brand:hover { text-decoration: none; }
.sm-mark { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 50%; background: var(--sm-lime); font-size: 19px; }
.sm-org { padding: 15px; margin-bottom: 25px; border: 1px solid var(--sm-line); border-radius: 12px; background: var(--sm-card); font-size: 13px; font-weight: 750; }
.sm-org small { display: block; color: var(--sm-muted); font-size: 11px; font-weight: 400; }
.sm-admin-shortcut { display: block; margin: 0 4px 15px; padding: 11px 12px; border: 1px solid var(--sm-line); border-radius: 9px; background: var(--sm-card); color: var(--sm-ink); font-size: 12px; font-weight: 750; text-decoration: none; }
.sm-admin-shortcut:hover { border-color: var(--sm-lime); text-decoration: none; }
.sm-nav-label { margin: 15px 10px 10px; color: var(--sm-muted); font-size: 10px; font-weight: 800; letter-spacing: .13em; }
.sm-nav-link { display: block; margin: 3px 0; padding: 10px 13px; border: 1px solid transparent; border-radius: 9px; color: var(--sm-muted-strong); font-size: 13px; }
.sm-nav-link:hover, .sm-nav-link.active { border-color: var(--sm-line); color: var(--sm-ink); background: var(--sm-card); text-decoration: none; }
.sm-nav-link.active { font-weight: 750; }
.sm-sidebar-bottom { display: grid; gap: 10px; margin-top: auto; padding: 24px 11px 4px; font-size: 12px; }
.sm-main { flex: 1; min-width: 0; }
.sm-top { display: flex; align-items: center; justify-content: space-between; height: 70px; padding: 0 26px; border-bottom: 1px solid var(--sm-line); color: var(--sm-muted); font-size: 12px; }
.sm-content { width: min(100%, 1390px); margin: 0 auto; padding: 24px 26px 40px; }
.sm-page-head { margin: 0 0 17px; }
.sm-page-head h1 { margin: 0 0 3px; font-size: clamp(26px, 2.1vw, 32px); letter-spacing: -.035em; }
.sm-page-head p { margin: 0; color: var(--sm-muted); font-size: 14px; }
.sm-filters { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: flex-end; gap: 10px; margin: 0 0 18px; }
.sm-filters label { flex: 1 1 140px; max-width: 215px; color: var(--sm-muted); font-size: 11px; }
.sm-filters input, .sm-filters select { min-height: 38px; margin-top: 4px; padding: 7px 10px; border-color: var(--sm-line); font-size: 12px; }
.sm-filters button { min-height: 38px; padding: 7px 15px; color: var(--sm-ink); background: var(--sm-lime); }
.sm-stats { display: flex; gap: var(--sm-gap); margin-bottom: var(--sm-gap); }
.sm-stats-outreach { flex-wrap: wrap; }
.sm-hero { position: relative; flex: 1.35 1 290px; min-height: 184px; padding: 23px; overflow: hidden; border-radius: var(--sm-card-radius); background: var(--sm-lime); }
.sm-hero::after { position: absolute; bottom: -95px; left: -70px; width: 430px; height: 210px; border: 12px solid #78d947; border-radius: 50%; content: ""; opacity: .5; transform: rotate(-23deg); }
.sm-hero span, .sm-hero strong, .sm-hero small { position: relative; z-index: 1; display: block; }
.sm-hero span { font-size: 12px; font-weight: 750; text-transform: uppercase; }
.sm-hero strong { margin: 8px 0 0; font-size: 59px; line-height: 1.1; }
.sm-hero small { font-size: 12px; }
.sm-stat { flex: 1 1 195px; min-width: 160px; align-self: flex-start; min-height: 132px; padding: 19px; border: 1px solid var(--sm-line); border-radius: var(--sm-card-radius); background: var(--sm-card); text-decoration: none; }
.sm-stat:hover { text-decoration: none; border-color: var(--sm-lime); }
.sm-stat span, .sm-stat small { display: block; color: var(--sm-muted); font-size: 12px; }
.sm-stat strong { display: block; margin: 12px 0 2px; color: var(--sm-ink); font-size: 30px; }
.sm-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: var(--sm-gap); margin-bottom: var(--sm-gap); }
.sm-panel, .card { border: 1px solid var(--sm-line); border-radius: var(--sm-card-radius); background: var(--sm-card); box-shadow: 0 2px 12px rgba(6,47,40,.02); }
.sm-panel { min-width: 0; margin-bottom: var(--sm-gap); padding: 20px; }
.sm-grid > .sm-panel { margin-bottom: 0; }
.sm-panel h2 { margin-bottom: 4px; font-size: 17px; }
.sm-panel > p { margin: 0 0 15px; color: var(--sm-muted); font-size: 12px; }
.sm-format-row { display: flex; justify-content: space-between; gap: 15px; padding: 13px 0; border-bottom: 1px solid var(--sm-line); color: var(--sm-ink); font-size: 12px; }
.sm-format-row:last-child { border: 0; }
.sm-format-row:hover { text-decoration: none; color: #386d49; }
.sm-format-links { display: flex; flex-wrap: wrap; gap: 10px; padding: 10px 0 18px; }
.sm-format-links a { padding: 9px 13px; border: 1px solid var(--sm-line); border-radius: 9px; background: var(--sm-hover); font-size: 12px; }
.sm-bars { display: flex; align-items: flex-end; justify-content: space-around; gap: 12px; min-height: 225px; padding: 16px 20px 4px; border-bottom: 1px solid var(--sm-line); }
.sm-bar-column { display: flex; flex: 1; max-width: 65px; min-width: 25px; height: 200px; flex-direction: column; align-items: center; justify-content: flex-end; }
.sm-bar-column strong { margin-bottom: 7px; font-size: 12px; }
.sm-bar-column span { margin-top: 7px; color: var(--sm-muted); font-size: 11px; }
.sm-bar-track { display: flex; width: 100%; height: 150px; align-items: flex-end; }
.sm-bar-track meter, .bar-track meter { display: block; width: 100%; border: 0; background: var(--sm-line); }
.sm-bar-track meter { height: 150px; writing-mode: vertical-lr; direction: rtl; }
.sm-bar-track meter::-webkit-meter-bar, .bar-track meter::-webkit-meter-bar { border: 0; background: var(--sm-line); }
.sm-bar-track meter::-webkit-meter-optimum-value, .bar-track meter::-webkit-meter-optimum-value { background: var(--sm-ink); }
.sm-bar-track meter::-moz-meter-bar, .bar-track meter::-moz-meter-bar { background: var(--sm-ink); }
.sm-back { display: inline-block; margin-bottom: 17px; padding: 9px 13px; border: 1px solid var(--sm-line); border-radius: 9px; background: var(--sm-card); font-size: 12px; }
.sm-timeline { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; margin: 34px 0 10px; }
.sm-timeline article { padding: 20px 5px 5px; border-top: 3px solid var(--sm-lime-light); overflow-wrap: anywhere; }
.sm-timeline article span { display: block; margin-bottom: 13px; color: #54784c; font-size: 12px; }
.sm-timeline article strong { font-size: 14px; }
.sm-timeline article p { color: var(--sm-muted); font-size: 12px; }
.sm-timeline article a { font-size: 12px; font-weight: 750; }
.sm-login { max-width: 540px; }
.sm-login label { display: block; margin-bottom: 16px; }
.sm-login input { margin-top: 6px; }
.sm-login p { margin-top: 15px; font-size: 12px; }
.sm-content table { color: var(--sm-ink); }
.sm-content th { background: #f7f8f6; font-size: 10px; }
.sm-content td { font-size: 12px; }
.sm-content .footer { padding-top: 14px; border-top: 1px solid var(--sm-line); }
.bar-track meter { height: 12px; }
@media (max-width: 1050px) {
  .sm-stats { flex-wrap: wrap; }
  .sm-hero { flex-basis: 100%; }
  .sm-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .sm-app { display: block; min-height: 100vh; margin: 0; border: 0; border-radius: 0; }
  .sm-sidebar { padding: 12px 16px; border-bottom: 1px solid var(--sm-line); }
  .sm-sidebar nav { display: flex; gap: 5px; overflow-x: auto; }
  .sm-org, .sm-nav-label { display: none; }
  .sm-sidebar-bottom { display: flex; gap: 18px; padding: 8px 3px 0; }
  .sm-brand { margin-bottom: 7px; }
  .sm-nav-link { flex: 0 0 auto; white-space: nowrap; }
  .sm-content { padding: 19px 15px; }
  .sm-top { padding: 0 15px; }
  .sm-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Ehemalige Inline-Layouts aus dem Bestand */
[data-layout="flex-wide"] { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
[data-layout="flex-row"] { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
[data-layout="flex-grow"] { flex: 1; min-width: 240px; }
[data-layout="gap-18"] { height: 18px; }
[data-layout="align-end"] { justify-content: flex-end; }
[data-layout="below-18"] { margin-bottom: 18px; }
[data-layout="below-5"] { margin-bottom: 5px; }
[data-layout="vertical-16"] { margin: 16px 0; }
[data-layout="above-12"] { margin-top: 12px; }
[data-layout="above-20"] { margin-top: 20px; }
[data-layout="above-5"] { margin-top: 5px; }
[data-layout="top-12"] { margin: 12px 0 0; }
[data-layout="top-12-right-10"] { margin: 12px 10px 0 0; }
[data-layout="vertical-20"] { margin: 20px 0; }