/* TIK / Universität Stuttgart Theme für pretalx
   Corporate Design: https://www.uni-stuttgart.de/corporate-design/ */

/* ── Uni Stuttgart Sans (self-hosted) ─────────────────────────────────────── */
@font-face {
  font-family: "Uni Stuttgart Sans";
  src: url("../fonts/UniStuttgartSans-Light.20bf1603a668.woff2") format("woff2");
  font-weight: 300 400;
  font-style:  normal;
  font-display: swap;
}

@font-face {
  font-family: "Uni Stuttgart Sans";
  src: url("../fonts/UniStuttgartSans-Bold.1eea369695d0.woff2") format("woff2");
  font-weight: 600 700;
  font-style:  normal;
  font-display: swap;
}

/* ── Offizielle Farbpalette Universität Stuttgart ─────────────────────────── */
:root {
  --color-pretalx:      #004191;   /* Mittelblau – Primärfarbe */
  --color-tik-accent:   #00BEFF;   /* Hellblau – Akzentfarbe */
  --color-tik-dark:     #323232;   /* Anthrazit */
  --color-tik-grey:     #dddddd;   /* Hellgrau / Trennlinien */
  --color-tik-gradient: linear-gradient(45deg, #004191 0%, #00BEFF 100%);

  --font-family:       "Uni Stuttgart Sans", Arial, sans-serif;
  --font-family-title: "Uni Stuttgart Sans", Arial, sans-serif;
}

/* ── Oberer farbiger Balken ───────────────────────────────────────────────── */
#top-bg {
  background: var(--color-tik-gradient);
}

/* ── Header / Logo ────────────────────────────────────────────────────────── */
header {
  background-color: #ffffff;
  border-bottom: 1px solid var(--color-tik-grey);
}

header h1 a {
  display:             block;
  width:               220px;
  height:              70px;
  background-image:    url("../img/logo-uni-stuttgart.fa795d449f9b.svg");
  background-repeat:   no-repeat;
  background-size:     contain;
  background-position: left center;
  overflow:            hidden;
  font-size:           0;
  color:               transparent;
}

/* ── Navigations-Links ────────────────────────────────────────────────────── */
.header-row-right a,
#header-tabs a {
  color: var(--color-pretalx);
  font-weight: 600;
}

.header-row-right a:hover,
#header-tabs a:hover {
  color: #002d6e;
  text-decoration: underline;
}

#header-tabs a.active,
#header-tabs a[aria-current] {
  border-bottom: 3px solid var(--color-pretalx);
  color: var(--color-pretalx);
}

/* ── Buttons ──────────────────────────────────────────────────────────────── */
.btn-primary {
  background-color: var(--color-pretalx);
  border-color:     var(--color-pretalx);
  color:            #ffffff;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #002d6e;
  border-color:     #002d6e;
  color:            #ffffff;
}

.btn-outline-primary {
  color:        var(--color-pretalx);
  border-color: var(--color-pretalx);
}

.btn-outline-primary:hover {
  background-color: var(--color-pretalx);
  color:            #ffffff;
}

/* ── Links ────────────────────────────────────────────────────────────────── */
a { color: var(--color-pretalx); }
a:hover { color: #002d6e; }

/* ── Badges / Tags ────────────────────────────────────────────────────────── */
.badge-primary,
.badge.bg-primary {
  background-color: var(--color-pretalx) !important;
}

/* ── Event-Karten ─────────────────────────────────────────────────────────── */
.card { border-color: var(--color-tik-grey); }
.card-header.bg-primary { background-color: var(--color-pretalx) !important; }

/* ── Footer ───────────────────────────────────────────────────────────────── */
footer {
  background-color: var(--color-tik-dark);
  color:            #cccccc;
  padding:          16px;
  font-size:        12px;
}

footer a { color: #aaaaaa; }
footer a:hover { color: #ffffff; text-decoration: underline; }

/* ── Akzentstreifen am Header-Ende (Gradient) ─────────────────────────────── */
header::after {
  content:    "";
  display:    block;
  width:      100%;
  height:     4px;
  background: var(--color-tik-gradient);
}
