:root {
  --sp-gruen: #2c6d3c;
  --sp-gruen-dunkel: #1f4f2b;
  --sp-navy: #060d46;
}
.sp-body { background: #f6f8f6; min-height: 100vh; display: flex; flex-direction: column; }
.sp-navbar { background: var(--sp-gruen); border-bottom: 3px solid var(--sp-navy); }
.sp-navbar .uk-navbar-nav > li > a, .sp-navbar .uk-navbar-item { color: #fff; }
.sp-navbar .uk-navbar-nav > li > a:hover { color: #d8ecd9; }
.sp-logo { font-weight: 800; letter-spacing: .06em; color: #fff; }
.sp-logo-sub { margin-left: .4em; font-weight: 400; color: #d8ecd9; font-size: .85em; }
.sp-main { flex: 1; padding-bottom: 2rem; }
.sp-footer { padding: 1rem; }
.uk-button-primary { background: var(--sp-gruen); }
.uk-button-primary:hover { background: var(--sp-gruen-dunkel); }
a { color: var(--sp-gruen); }
/* Sichere Bereiche auf iPhones mit Notch */
.sp-navbar { padding-top: env(safe-area-inset-top); }
.sp-footer { padding-bottom: calc(1rem + env(safe-area-inset-bottom)); }

/* Mobile Bottom-Navigation (nur < 960px) */
.sp-bottomnav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; display: flex; background: #fff; border-top: 1px solid #ddd;
  padding-bottom: env(safe-area-inset-bottom); box-shadow: 0 -2px 8px rgba(0,0,0,.06); }
.sp-bottomnav a { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: .45rem 0 .35rem; font-size: .68rem;
  color: #555; text-decoration: none; min-height: 52px; }
.sp-bottomnav a.aktiv { color: var(--sp-gruen); font-weight: 600; }
.sp-bottomnav a .uk-icon { margin-bottom: .15rem; }
@media (max-width: 959px) { .sp-main { padding-bottom: 4.6rem; } .sp-footer { padding-bottom: calc(4.2rem + env(safe-area-inset-bottom)); } }
@media (min-width: 960px) { .sp-bottomnav { display: none; } }

/* Touch-Ziele und Formulare auf dem Handy */
@media (max-width: 639px) {
  .uk-button-small { min-height: 36px; }
  .uk-button:not(.uk-button-small):not(.uk-button-text):not(.uk-button-link) { min-height: 44px; }
  .uk-table-responsive td { padding-top: .35rem; padding-bottom: .35rem; }
  .uk-card-body { padding: 18px; }
}
/* Installierte App: kein Text-Zoom bei Eingaben auf iOS, ruhigere Optik */
.sp-standalone input, .sp-standalone select, .sp-standalone textarea { font-size: 16px; }
.sp-standalone .sp-footer form { display: none; }

/* Banner */
.sp-banner { position: fixed; top: 0; left: 0; right: 0; z-index: 950; padding: .5rem 1rem; text-align: center; font-size: .9rem; }
.sp-banner-offline { background: #f0ad4e; color: #222; }
.sp-banner-update { background: var(--sp-navy); color: #fff; }
.sp-banner button { margin-left: .5rem; }

/* Markenfarbe statt UIkit-Blau, kompaktere Überschriften auf dem Handy */
.uk-card-primary { background: var(--sp-gruen); }
.uk-card-primary.uk-card-body, .uk-card-primary .uk-text-muted { color: #e8f2e9 !important; }
.uk-alert-primary { background: #e6f1e7; color: #1f4f2b; }
@media (max-width: 639px) {
  .uk-heading-small { font-size: 1.55rem; line-height: 1.2; }
  h3.uk-card-title { font-size: 1.15rem; }
}

/* Wochenraster Verfügbarkeit: große Tages-Schalter (kann / kann nicht), ganz ohne JS */
.sp-tag { display: block; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.sp-tag input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.sp-tag-box { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .1rem;
  min-height: 78px; padding: .6rem .4rem; border: 2px solid #ddd; border-radius: 8px; background: #f7f7f7; color: #777; text-align: center; }
.sp-tag input:checked + .sp-tag-box { border-color: var(--sp-gruen); background: #e6f1e7; color: #1f4f2b; }
.sp-tag input:focus-visible + .sp-tag-box { outline: 2px solid var(--sp-navy); outline-offset: 2px; }
.sp-tag .sp-tag-ja { display: none; font-weight: 600; }
.sp-tag input:checked + .sp-tag-box .sp-tag-ja { display: block; }
.sp-tag input:checked + .sp-tag-box .sp-tag-nein { display: none; }