/* VOLK EVENTSERVICE — Branding fuer das Django-Admin
   Markenfarben laut CI:  Primaer #2078a7 · Dunkelblau #176982
   Akzent #27afd9 · Dunkel #212121 · Grau #737373 · Schrift: Jost   */

:root,
html[data-theme="light"] {
  --primary: #2078a7;
  --secondary: #176982;
  --accent: #27afd9;
  --primary-fg: #ffffff;

  --body-fg: #4a4a4a;
  --body-quiet-color: #737373;

  --link-fg: #2078a7;
  --link-hover-color: #176982;
  --link-selected-fg: #176982;

  --button-bg: #2078a7;
  --button-fg: #ffffff;
  --button-hover-bg: #176982;
  --default-button-bg: #176982;
  --default-button-hover-bg: #212121;
  --close-button-bg: #737373;
  --close-button-hover-bg: #212121;

  --object-tools-bg: #176982;
  --object-tools-fg: #ffffff;
  --object-tools-hover-bg: #212121;

  /* Kopfzeile weiss, damit das Logo gut sitzt */
  --header-bg: #ffffff;
  --header-color: #4a4a4a;
  --header-branding-color: #2078a7;
  --header-link-color: #2078a7;

  --breadcrumbs-bg: #2078a7;
  --breadcrumbs-fg: #dceff8;
  --breadcrumbs-link-fg: #ffffff;

  --selected-bg: #e8f3f9;
  --selected-row: #f3f9fc;
  --message-success-bg: #e6f3ea;
}

/* Dunkles Design – gleiche Farben wie im Cockpit (static/css/cockpit.css).
   Gilt bei ausdrücklicher Wahl „Dunkel“ und bei „Automatisch“, wenn das
   Betriebssystem dunkel eingestellt ist. */
html[data-theme="dark"] {
  --primary: #2078a7;
  --secondary: #176982;
  --accent: #5BB6E0;
  --primary-fg: #ffffff;
  --body-bg: #0F1418;
  --body-fg: #E8EDF1;
  --body-quiet-color: #9AA7B1;
  --body-medium-color: #C3CDD4;
  --body-loud-color: #ffffff;
  --darkened-bg: #171E24;
  --selected-bg: #13344A;
  --selected-row: #13344A;
  --hairline-color: #222B32;
  --border-color: #2A343C;
  --link-fg: #5BB6E0;
  --link-hover-color: #8CCFEE;
  --link-selected-fg: #8CCFEE;
  --button-bg: #2078a7;
  --button-fg: #ffffff;
  --button-hover-bg: #176982;
  --default-button-bg: #176982;
  --default-button-hover-bg: #2078a7;
  --object-tools-bg: #2078a7;
  --object-tools-hover-bg: #176982;
  --header-bg: #171E24;
  --header-color: #E8EDF1;
  --header-branding-color: #5BB6E0;
  --header-link-color: #5BB6E0;
  --breadcrumbs-bg: #176982;
  --breadcrumbs-fg: #dceff8;
  --breadcrumbs-link-fg: #ffffff;
  --message-success-bg: #0F3221;
  --message-warning-bg: #3D2A0A;
  --message-error-bg: #3F1512;
}

@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] {
    --primary: #2078a7;
    --secondary: #176982;
    --accent: #5BB6E0;
    --primary-fg: #ffffff;
    --body-bg: #0F1418;
    --body-fg: #E8EDF1;
    --body-quiet-color: #9AA7B1;
    --body-medium-color: #C3CDD4;
    --body-loud-color: #ffffff;
    --darkened-bg: #171E24;
    --selected-bg: #13344A;
    --selected-row: #13344A;
    --hairline-color: #222B32;
    --border-color: #2A343C;
    --link-fg: #5BB6E0;
    --link-hover-color: #8CCFEE;
    --link-selected-fg: #8CCFEE;
    --button-bg: #2078a7;
    --button-fg: #ffffff;
    --button-hover-bg: #176982;
    --default-button-bg: #176982;
    --default-button-hover-bg: #2078a7;
    --object-tools-bg: #2078a7;
    --object-tools-hover-bg: #176982;
    --header-bg: #171E24;
    --header-color: #E8EDF1;
    --header-branding-color: #5BB6E0;
    --header-link-color: #5BB6E0;
    --breadcrumbs-bg: #176982;
    --breadcrumbs-fg: #dceff8;
    --breadcrumbs-link-fg: #ffffff;
    --message-success-bg: #0F3221;
    --message-warning-bg: #3D2A0A;
    --message-error-bg: #3F1512;
  }
}

/* Schrift: Jost als Hausschrift */
body,
.button, input[type=submit], input[type=button], .submit-row input, a.button {
  font-family: "Jost", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    sans-serif;
}

/* Kopf: dezenter Schatten + Logo-Hoehe; Branding-Bereich ausrichten */
#header {
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
  border-bottom: 3px solid var(--primary);
  padding-top: 16px;
  padding-bottom: 16px;
  align-items: center;
}
.volk-logo {
  height: 160px;
  width: auto;
  vertical-align: middle;
  display: block;
}

/* Ueberschriften in Markenblau */
#content h1,
.module h2,
.module caption,
fieldset.module h2 {
  color: #2078a7;
}

/* Login-Seite: Logo etwas groesser zentrieren */
.login #header { justify-content: center; }
.login .volk-logo { height: 208px; }

/* Buttons leicht abgerundet, ruhiger Hover */
.button, input[type=submit], input[type=button],
.submit-row input, a.button {
  border-radius: 6px;
  transition: background 0.15s ease;
}

/* Aktive Navigation / Links in Listen */
.object-tools a { border-radius: 6px; }
