/* ===== Enzian Dark Purple — Lightened ===== */
:root{
  --bg:#251a4b;              /* vorher #1b1030 */
  --text:#fbf8ff;            /* etwas heller */
  --text-muted:#efe6ff;

  --header:#5a2b93;          /* vorher #4b1f78 */
  --surface:#372a63;         /* vorher #2b1a44 */
  --surface-alt:#443274;     /* vorher #3c2755 */
  --surface-hover:#5b3d95;   /* vorher #4a3070 */

  --accent:#7F00FF;          /* beibehalten */
  --accent-600:#6600cc;      /* beibehalten */
  --border:#6a3bb3;          /* etwas heller als header */
  --link:#ead9ff;
}

/* Base */
body{
  background-color: var(--bg);
  color: var(--text);
  font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  padding-top:0;
  overflow-x:hidden;
}

/* Navbar */
.custom-navbar{
  background-color: color-mix(in oklab, var(--header) 80%, transparent);
  backdrop-filter: blur(8px);
  transition: background-color .3s ease;
  border-bottom:1px solid color-mix(in oklab, var(--header) 55%, black);
}
.navbar-brand{ font-size:1.5rem; color:var(--text) !important; }
.navbar .nav-link{
  color:#efe3ff !important;
  transition:color .2s ease;
  font-size:1.05rem;
}
.navbar .nav-link:hover{ color:#ffffff !important; }

/* Header Section */
.welcome-section{
  position:relative;
  height:var(--header-height, 400px);
  background-image: var(--header-image);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:var(--header-visible, center center);
  margin-top:0;
}
.welcome-section .overlay{
  position:absolute; inset:0;
  background-color: rgba(90,43,147,.45); /* etwas heller (weniger Opazität) */
  backdrop-filter: blur(2px);
}
.welcome-section .content{ z-index:2; }

/* Content Übergang */
main{ position:relative; z-index:2; }
.welcome-section::after{
  content:'';
  position:absolute; left:0; right:0; bottom:-1px; height:60px;
  background: linear-gradient(to bottom, rgba(37,26,75,0) 0%, var(--bg) 100%);
}

/* Footer */
.footer-glow{
  background: var(--header);
  border-top:1px solid var(--border);
  color:var(--text);
}
.footer-links{ font-size:.9rem; }
.footer-link{
  color: var(--link);
  text-decoration:none;
  margin:0 .5rem;
}
.footer-link:hover{ color:#ffffff; text-decoration:underline; }

/* Optional hübsche Footer-Box (leicht heller gemacht) */
.footer-box{
  max-width:800px;
  margin:40px auto 0;
  padding:20px;
  text-align:center;
  font-size:.9rem;
  color:#ddd;
  border-radius:12px;
  background: rgba(255,255,255,.09); /* vorher .06 */
  box-shadow:0 2px 10px rgba(255,255,255,.08);
  backdrop-filter: blur(2px);
}
.footer-box a{ color:#66b3ff; text-decoration:none; margin:0 8px; }
.footer-box a:hover{ text-decoration:underline; }

/* Links allgemein */
a{ color:var(--link); }
a:hover{ color:#ffffff; }

/* Buttons */
.btn-primary, .btn-vorschlagen{
  background-color: var(--accent) !important;
  border:none !important;
  color:#fff !important;
  font-weight:bold;
}
.btn-primary:hover, .btn-vorschlagen:hover{ background-color: var(--accent-600) !important; }

.btn-success{
  background-color:#28a745 !important;
  border:none !important;
  color:#fff !important;
}
.btn-success:hover{ background-color:#218838 !important; }

/* Formulare (hellere Kachel) */
.form-select,
.form-select:focus{
  background-color: var(--surface-alt);
  color: var(--text-muted);
  border:1px solid var(--accent);
  box-shadow:none;
}

/* Tabellen (Enzian Darkmode – aufgehellt) */
.table{
  background-color: transparent;
  color: var(--text-muted);
  border-color: var(--border);
}
.table thead{ background-color: var(--surface); }
.table thead th{
  background-color: var(--surface) !important;
  color: var(--text-muted) !important;
  border-color: var(--border) !important;
}
.table td{
  background-color: var(--surface) !important;
  color: var(--text-muted) !important;
  border-color: var(--border) !important;
}
.table tbody tr:nth-child(odd){ background-color: var(--surface-alt) !important; }
.table tbody tr:nth-child(even){ background-color: var(--surface) !important; }
.table tbody tr:hover{ background-color: var(--surface-hover) !important; }

/* Alerts */
.alert-success, .alert-info{
  background-color: color-mix(in oklab, var(--header) 85%, white 15%);
  border-color: var(--accent);
  color: var(--text-muted);
}

/* Glow & Typografie (leicht kräftiger) */
.text-glow{
  color:#fbf7ff;
  text-shadow:0 0 6px var(--accent), 0 0 14px color-mix(in oklab, var(--accent) 45%, white);
}
.neon-text{
  color:#f3ecff;
  text-shadow:0 0 3px var(--accent-600), 0 0 8px color-mix(in oklab, var(--accent-600) 40%, white);
}

/* Fade-In */
@keyframes fadein{
  from{ opacity:0; transform: translateY(20px); }
  to{ opacity:1; transform: translateY(0); }
}
.animate-fadein{ animation: fadein 1.2s ease-out forwards; opacity:0; }
.fadein-section{ opacity:0; transform: translateY(30px); transition: all .8s ease-out; }
.fadein-section.visible{ opacity:1; transform: translateY(0); }