:root {
  --portal-green: #006e4e;
  --portal-green-dark: #004f39;
  --portal-green-deep: #163b35;
  --portal-green-soft: #e8f5ef;
  --portal-ink: #16211d;
  --portal-muted: #53635c;
  --portal-border: #dbe5e0;
  --portal-bg: #f7f9f8;
  --portal-focus: #f5b700;
}

.theme-buerger {
  --pri: var(--portal-green);
  --pri-d: var(--portal-green-dark);
  --bg: var(--portal-bg);
  --ink: var(--portal-ink);
  --mut: var(--portal-muted);
  --line: var(--portal-border);
  --focus: var(--portal-focus);
}

.theme-buerger header {
  background: linear-gradient(125deg, var(--portal-green) 0%, #075d48 48%, var(--portal-green-deep) 100%);
}

.theme-buerger header .kick {
  color: #cfe9df;
}

.theme-buerger header p {
  color: #f1faf6;
}

.theme-buerger a.cardlink:hover,
.theme-buerger a.cardlink:focus-visible {
  background: #f0f8f4;
}

.theme-waermewende {
  --bg: var(--portal-bg);
  --surface2: #eef4f1;
  --border: rgba(0, 79, 57, 0.14);
  --text: var(--portal-ink);
  --text2: var(--portal-muted);
  --text3: #718078;
  --blue: var(--portal-green);
  --blue-light: var(--portal-green-soft);
  --blue-mid: #2f8d70;
  --green: #075d48;
  --green-light: var(--portal-green-soft);
}

.theme-waermewende .header {
  margin-bottom: 2.5rem;
  padding: clamp(1.5rem, 4vw, 2.25rem);
  border: 0;
  border-radius: 14px;
  background: linear-gradient(125deg, var(--portal-green) 0%, #075d48 48%, var(--portal-green-deep) 100%);
  box-shadow: 0 5px 20px rgba(18, 47, 38, 0.12);
  color: #fff;
}

.theme-waermewende .header-eyebrow,
.theme-waermewende .header-sub {
  color: #d9eee6;
}

.theme-waermewende .header-title {
  color: #fff;
}

.theme-waermewende .header-badge {
  border: 1px solid rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
}

.theme-waermewende .tab-btn.active {
  color: var(--portal-green-dark);
  border-top-color: var(--portal-green);
}

.theme-feuerwehr {
  --red: var(--portal-green);
  --red-light: var(--portal-green-soft);
  --red-mid: #9dd8c2;
  --dark: var(--portal-ink);
  --dark2: var(--portal-green-deep);
  --mid: var(--portal-muted);
  --muted: #718078;
  --border: var(--portal-border);
  --bg: var(--portal-bg);
  --accent: #eef4f1;
}

.theme-feuerwehr .fw-header {
  background: linear-gradient(125deg, var(--portal-green) 0%, #075d48 48%, var(--portal-green-deep) 100%);
}

.theme-feuerwehr .fw-header::before,
.theme-feuerwehr .fw-header::after {
  background: #fff;
}

.theme-feuerwehr .fw-header-badge {
  border: 1px solid rgba(255, 255, 255, 0.45);
  background: rgba(255, 255, 255, 0.14);
}

.theme-feuerwehr .fw-header h1 span {
  color: #bfe8d8;
}

.theme-feuerwehr .fw-header-meta {
  color: rgba(255, 255, 255, 0.78);
}

.theme-feuerwehr .chart-data summary {
  color: var(--portal-green-dark);
}

.theme-citizen-detail {
  --pri: var(--portal-green);
  --pri-d: var(--portal-green-dark);
  --bg: var(--portal-bg);
  --ink: var(--portal-ink);
  --mut: var(--portal-muted);
  --line: var(--portal-border);
  --ok: #1d7a52;
  --focus: var(--portal-focus);
}

.theme-citizen-detail header.top {
  background: linear-gradient(125deg, var(--portal-green) 0%, #075d48 48%, var(--portal-green-deep) 100%);
}

.theme-citizen-detail header.top p,
.theme-citizen-detail header.top .ls,
.theme-citizen-detail .stand {
  color: #d9eee6;
}

.theme-citizen-detail section {
  border-color: var(--portal-border);
  box-shadow: 0 3px 14px rgba(18, 47, 38, 0.06);
}

.theme-citizen-detail .facts li,
.theme-citizen-detail .filterbar,
.theme-citizen-detail .more a {
  background: var(--portal-green-soft);
}

.theme-citizen-detail details,
.theme-citizen-detail ul.angebote li,
.theme-citizen-detail ol.vorg li {
  background: #f8fbf9;
}

.theme-citizen-detail thead th {
  background: #eef4f1;
}

.theme-citizen-detail .pill.plan {
  background: var(--portal-green-soft);
  color: var(--portal-green-dark);
}

.theme-beschaffung {
  --hz-text-primary: var(--portal-ink);
  --hz-text-secondary: var(--portal-muted);
  --hz-text-muted: #718078;
  --hz-bg-site: var(--portal-bg);
  --hz-bg-light: #eef4f1;
  --hz-border-color: var(--portal-border);
}

.theme-beschaffung .page-header {
  background: linear-gradient(125deg, var(--portal-green) 0%, #075d48 48%, var(--portal-green-deep) 100%) !important;
}

.theme-beschaffung .page-header::before {
  background: radial-gradient(circle, rgba(255, 255, 255, 0.16), transparent 70%) !important;
}

.theme-beschaffung .coming-soon-icon {
  border-color: rgba(0, 110, 78, 0.28) !important;
  background: linear-gradient(135deg, rgba(0, 110, 78, 0.12), rgba(0, 110, 78, 0.03)) !important;
}

.theme-beschaffung .feature-card {
  border-color: var(--portal-border);
  box-shadow: 0 3px 14px rgba(18, 47, 38, 0.07);
}

.theme-beschaffung .feature-card:hover {
  box-shadow: 0 8px 24px rgba(18, 47, 38, 0.12);
}

.theme-beschaffung .site-footer {
  background: var(--portal-green-deep) !important;
}

.theme-beschaffung .test-notice {
  display: grid;
  gap: 0.35rem;
  max-width: 620px;
  margin: 0 auto 2rem;
  padding: 1rem 1.15rem;
  border: 1px solid #eadfca;
  border-left: 5px solid #c48715;
  border-radius: 10px;
  background: #f6f2e9;
  color: #4d4538;
  text-align: left;
  font-size: 0.95rem;
  line-height: 1.55;
}

.theme-beschaffung .test-notice strong {
  color: #50442f;
}

.theme-buerger :focus-visible,
.theme-waermewende :focus-visible,
.theme-feuerwehr :focus-visible,
.theme-citizen-detail :focus-visible,
.theme-beschaffung :focus-visible {
  outline-color: var(--portal-focus) !important;
}

@media (max-width: 640px) {
  .theme-waermewende .header {
    border-radius: 10px;
  }
}