/* Marke Inkult - wird NACH styles.css geladen (BRAND_THEME=/brand/theme.css).
 *
 * Grundsatz wie bei Ibavi: nur Farben und die Kopfzeile. Kein Layout, keine
 * Abstaende, keine Schriftarten - alles andere bleibt exakt wie in styles.css.
 *
 * Palette aus der VEKTORDATEI des Logos (exakte RGB-Werte, nicht gemessen):
 *   #376baf  dunkles Blau  (Figur links)
 *   #57a9e3  helles Blau   (Figur oben)
 *   #6fae70  Gruen         (Figur rechts)   - in der Oberflaeche nicht verwendet
 *   #9bbd3a  Hellgruen     (Figur unten)    - in der Oberflaeche nicht verwendet
 *   #3b3b3a  Grau          (Schriftzug INKULT)
 * Von inkult.de gemessen: #f2f4f7 heller Grund, #e0e5eb Linien, #505050 Text.
 * Die Website selbst hat sonst nur WordPress-/Bootstrap-Standardfarben.
 *
 * Die beiden Gruentoene bleiben bewusst draussen: in der Oberflaeche stehen
 * Gruen und Rot fuer Status (--ok, --bad). Ein gruener Knopf saehe aus wie
 * "erledigt".
 */

:root {
  /* --- Blau: die beiden Blau des Logos statt Royal/Cyan --- */
  --royal-deep: #376baf;
  --royal:      #478ac9;   /* Mitte zwischen den beiden Logo-Blau */
  --cyan:       #57a9e3;
  --sky:        #7dbdea;
  --cyan-light: #a6d1f0;
  --sky-tint:   #eaf4fb;

  /* --- Grundflaechen: von inkult.de, neutral statt blaustichig --- */
  --bg:    #f2f4f7;
  --paper: #ffffff;
  --field: #ffffff;
  --line:  #e0e5eb;

  /* --- Schrift: Grau des Schriftzugs bzw. der Website. --muted ist etwas
         dunkler als das #8c8c8c der Website - das erreichte auf Weiss nur
         3,4:1 Kontrast, #6f6f6f liegt ueber 4,5:1. --- */
  --text:  #505050;
  --muted: #6f6f6f;
  --char:  #3b3b3a;

  /* --- Verlaeufe und Schatten auf das Inkult-Blau ziehen --- */
  --grad-band: linear-gradient(100deg, #376baf 0%, #478ac9 55%, #57a9e3 100%);
  --grad-btn:  linear-gradient(135deg, #478ac9 0%, #376baf 100%);
  --shadow:    0 12px 34px rgba(55, 107, 175, .13);
  --shadow-sm: 0 4px 14px rgba(55, 107, 175, .09);
  --focus:     0 0 0 3px rgba(71, 138, 201, .24);

  /* --amber, --warn, --warn-line, --bad, --ok bleiben: Statusfarben sind
     keine Markenfarben. */
}

/* --- Kopfzeile oben links: Wortmarke statt Schriftzug -----------------------
 * Wie bei Ibavi: Schriftgroesse der aeusseren Spanne auf 0 (schluckt den
 * Textknoten "Inkult"), Logo als Hintergrund, .brand-ki wieder lesbar.
 * Das Inkult-Logo ist hoeher als breit gegliedert (Figuren + Schriftzug in
 * einer Zeile, 2,88:1) - der Schriftzug nimmt nur ein Drittel der Hoehe ein.
 * Deshalb 34 px statt Ibavis 22 px, sonst waeren die Buchstaben 7 px hoch.
 */
.brand {
  display: flex;
  align-items: center;
  min-height: 34px;
  font-size: 0;
  padding-left: 108px;
  background-image: url("/brand/logo-wort.svg");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: auto 34px;
}
.brand-ki {
  font-size: 18px;
  font-weight: 600;
  color: var(--muted);
}

/* --- Die Stellen, die in styles.css feste Farbwerte tragen ------------------
 * Helle Tuepfelchen auf Abzeichen, Tabellenkoepfen und Hover-Zustaenden. Die
 * Werte sind Ibavis - deren Blau hat denselben Farbton (212 Grad) wie Inkults
 * dunkles Blau, die Toenungen passen also unveraendert.
 */
#login {
  background: linear-gradient(140deg, var(--sky-tint) 0%, var(--bg) 55%, #e4ecf6 100%);
}
.dtable th { background: #eef2f7; }

.badge.admin        { background: #e9eff7; color: #35618f; border-color: #c4d7ec; }
.badge.coach        { border-color: #c9dbf0; }
.badge.fallmanager  { background: #eaf0fa; color: #35618f; border-color: #cbdcf0; }
.chip.t-16k         { background: #e9eff9; border-color: #cbdcf0; }
.type.dis           { background: #f0f2f5; }
.iconbtn.regen:hover        { background: #dde8f5; }
.wl-akt .iconbtn.open       { border-color: #cbdcf0; background: #eef3fa; }
.wl-akt .iconbtn.open:hover { background: #e2ebf7; }
.wl-betr em                 { color: #c4cfda; }

/* --- Eingebettete Grafiken --------------------------------------------------
 * styles.css traegt drei SVGs als data:-URI im Stylesheet. Ihre Farben stehen
 * INNERHALB der Grafik und folgen deshalb keiner Variablen. Ohne diesen Block
 * behielte die Inkult-Oberflaeche Stepgoals Royalblau und Cyan im Seitenmuster
 * und in den Auswahlpfeilen. Erzeugt von faerbe_grafiken.py.
 */
/* Hintergrundmuster: Doktorhuete und Funken, in styles.css als base64-SVG
 * eingebettet. Variablen erreichen es nicht - hier dieselbe Grafik, nur mit
 * den Inkult-Farben. Formen Zeichen fuer Zeichen unveraendert. */
body::before { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNDAiIGhlaWdodD0iMjQwIiB2aWV3Qm94PSIwIDAgMjQwIDI0MCI+CiAgPGcgZmlsbD0iIzM3NmJhZiIgZmlsbC1vcGFjaXR5PSIwLjA1Ij4KICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIyIDI4KSByb3RhdGUoLTEwKSBzY2FsZSgxLjU1KSI+CiAgICAgIDxwYXRoIGQ9Ik0yMCAzIEwzOSAxMiBMMjAgMjEgTDEgMTIgWiIvPgogICAgICA8cGF0aCBkPSJNOCAxNS41IEw4IDI0IEMxMS41IDI3LjUgMTUuNSAyOSAyMCAyOSBDMjQuNSAyOSAyOC41IDI3LjUgMzIgMjQgTDMyIDE1LjUgTDIwIDIxIFoiLz4KICAgICAgPHJlY3QgeD0iMzguMiIgeT0iMTIiIHdpZHRoPSIxLjUiIGhlaWdodD0iMTMiLz4KICAgICAgPHBhdGggZD0iTTM2LjcgMjQuNSBoNSBsLTEuMyA2IGgtMi40IHoiLz4KICAgIDwvZz4KICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyOCAxMzApIHJvdGF0ZSgxMikgc2NhbGUoMS4yKSI+CiAgICAgIDxwYXRoIGQ9Ik0yMCAzIEwzOSAxMiBMMjAgMjEgTDEgMTIgWiIvPgogICAgICA8cGF0aCBkPSJNOCAxNS41IEw4IDI0IEMxMS41IDI3LjUgMTUuNSAyOSAyMCAyOSBDMjQuNSAyOSAyOC41IDI3LjUgMzIgMjQgTDMyIDE1LjUgTDIwIDIxIFoiLz4KICAgICAgPHJlY3QgeD0iMzguMiIgeT0iMTIiIHdpZHRoPSIxLjUiIGhlaWdodD0iMTMiLz4KICAgICAgPHBhdGggZD0iTTM2LjcgMjQuNSBoNSBsLTEuMyA2IGgtMi40IHoiLz4KICAgIDwvZz4KICA8L2c+CiAgPGcgZmlsbD0iIzU3YTllMyIgZmlsbC1vcGFjaXR5PSIwLjA3Ij4KICAgIDxwYXRoIGQ9Ik0xOTIgNDAgQzE5MyA0NC40IDE5My42IDQ1IDE5OCA0NiBDMTkzLjYgNDcgMTkzIDQ3LjYgMTkyIDUyIEMxOTEgNDcuNiAxOTAuNCA0NyAxODYgNDYgQzE5MC40IDQ1IDE5MSA0NC40IDE5MiA0MCBaIi8+CiAgICA8cGF0aCBkPSJNNTQgMTUwIEM1NC44IDE1My41IDU1LjMgMTU0IDU4LjggMTU0LjggQzU1LjMgMTU1LjYgNTQuOCAxNTYuMSA1NCAxNTkuNiBDNTMuMiAxNTYuMSA1Mi43IDE1NS42IDQ5LjIgMTU0LjggQzUyLjcgMTU0IDUzLjIgMTUzLjUgNTQgMTUwIFoiLz4KICAgIDxwYXRoIGQ9Ik0xNTAgMTk2IEMxNTAuNiAxOTguNyAxNTEgMTk5IDE1My44IDE5OS42IEMxNTEgMjAwLjIgMTUwLjYgMjAwLjYgMTUwIDIwMy40IEMxNDkuNCAyMDAuNiAxNDkgMjAwLjIgMTQ2LjIgMTk5LjYgQzE0OSAxOTkgMTQ5LjQgMTk4LjcgMTUwIDE5NiBaIi8+CiAgICA8cGF0aCBkPSJNMTAwIDIwIEMxMDAuNSAyMi4yIDEwMC44IDIyLjUgMTAzIDIzIEMxMDAuOCAyMy41IDEwMC41IDIzLjggMTAwIDI2IEM5OS41IDIzLjggOTkuMiAyMy41IDk3IDIzIEM5OS4yIDIyLjUgOTkuNSAyMi4yIDEwMCAyMCBaIi8+CiAgPC9nPgo8L3N2Zz4K"); }
.ueb-field select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%236f6f6f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E"); }
.ueb-field select:focus { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%23376baf' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E"); }
