/* =========================
   FINAL CSS FÜR MITARBEITERVERWALTUNG (Dashboard + Basis)
   ========================= */

/* ---- Basis ---- */
body {
  background-color: #e3efff;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  margin: 0;
  padding: 2em;
  color: #102a43;
}

.container { max-width: 1200px; margin: 0 auto; }

h2, h3 { color: #003366; text-align: center; }

/* (Optional) einfache alte Nav – bleibt hinter der modernen Navbar-klassen zurück */
nav { background-color: #f5f5f5; padding: 1em; margin-bottom: 1em; }
nav a { margin-right: 1em; text-decoration: none; color: #004080; font-weight: bold; }

/* ---- Tabellen: Basis ---- */
table {
  width: 100%;
  border-collapse: collapse;
  margin: 1em 0;
  table-layout: auto;
}
th, td {
  white-space: nowrap;
  padding: 0.5em 0.5em;
  border: 1px solid #ccc;
  text-align: left;
  font-size: 0.95em;
  vertical-align: middle;
}

/* ---- Inputs in Tabellen ---- */
table input {
  background-color: #fff !important;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 0.95em;
  padding: 0.3em 0.4em;
  box-sizing: border-box;
}
input.kurz  { width: 16ch !important; text-align: center; background-color: #fffce6 !important; }
input.mittel{ width: 20ch !important; background-color: #e6fff8 !important; }
input.lang  { width: 40ch !important; background-color: #eef5ff !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
input[type="email"].lang { width: 45ch !important; background-color: #eef5ff !important; font-weight: normal; }

/* ---- Buttons (Form) ---- */
input[type="submit"] {
  padding: 0.5em 1.5em;
  background-color: #007bff;
  border: none;
  color: white;
  cursor: pointer;
  border-radius: 10px;
  font-weight: 600;
}
input[type="submit"]:hover { background-color: #0056b3; }

/* ---- Standard-Card ---- */
.card {
  background: #fff;
  padding: 1em;
  margin: 1em 0;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(16, 42, 67, .08);
  border: 1px solid rgba(16, 42, 67, .08);
  animation: fadeInUp .35s ease both;
}

/* ---- Baureihe Collapser (Basis) ---- */
/* FIX: keine feste height, nur max-height (damit das Dashboard-Override wirken kann) */
.baureihe-karte.collapsed {
  max-height: 110px;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

/* =========================
   DASHBOARD-ENHANCEMENTS
   (wirken, sobald der Wrapper .dashboard-ui auf dem Container liegt)
   ========================= */

.dashboard-ui .container,
.dashboard-ui .container-fluid { max-width: 1280px; margin-inline: auto; }

/* Überschriften im Dashboard */
.dashboard-ui h2, .dashboard-ui h3 { text-align: left; color: #0f2557; }

/* Karten: farbige Akzente je Status + konsistenter Titelabstand */
.dashboard-ui .card h5.card-title {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: .8rem; /* FIX: nicht von späterer Definition überschreiben */
  display: flex; align-items: center; gap: .5rem;
}

.dashboard-ui .card.border-warning .card-body {
  background: linear-gradient(135deg, #fffbe6, #fff);
  border-left: 5px solid #f59e0b;
}
.dashboard-ui .card.border-danger .card-body {
  background: linear-gradient(135deg, #ffe6e6, #fff);
  border-left: 5px solid #ef4444;
}
.dashboard-ui .card.border-info .card-body {
  background: linear-gradient(135deg, #e6f0ff, #fff);
  border-left: 5px solid #2563eb;
}
.dashboard-ui .card.border-secondary .card-body {
  background: linear-gradient(135deg, #f3f4f6, #fff);
  border-left: 5px solid #6c757d;
}

/* Listen: Hover-Feedback */
.dashboard-ui ul li {
  padding: .3rem .4rem;
  border-radius: 8px;
  transition: background .2s ease;
}
.dashboard-ui ul li:hover { background: #f5f7ff; }

/* Buttons: moderner Look */
.dashboard-ui .btn { border-radius: 10px; font-weight: 600; }
.dashboard-ui .btn-primary { background: #2563eb; border-color: #2563eb; }
.dashboard-ui .btn-primary:hover { background: #1e4ed8; border-color: #1e4ed8; }

.dashboard-ui .btn-warning {
  border-radius: 999px;
  font-weight: 700;
  box-shadow: 0 4px 10px rgba(245, 158, 11, .25);
  transition: transform .1s ease, box-shadow .2s ease;
}
.dashboard-ui .btn-warning:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(245, 158, 11, .35);
}

/* Tabelle: „Karten“-Zeilen */
.dashboard-ui .table { border-collapse: separate; border-spacing: 0 6px; }
.dashboard-ui .table thead th {
  color: #33507a;
  text-transform: uppercase;
  font-size: .8rem;
  letter-spacing: .08em;
  border: none;
}
.dashboard-ui .table tbody td {
  background: #fff;
  border: 1px solid rgba(16,42,67,.08) !important;
}
.dashboard-ui .table tbody tr td:first-child { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
.dashboard-ui .table tbody tr td:last-child  { border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
.dashboard-ui .table tbody tr:hover td { background: #f7faff; }

/* Inputs in Tabellen – nur im Dashboard */
.dashboard-ui table input{
  background:#fff; border:1px solid #dbe3ff; border-radius:8px; font-size:.95em; padding:.35rem .45rem;
}

/* Pflichtdokumente – Chips/Badges + Person-Blöcke */
.required-list .person{
  background: #ffffff;
  border: 1px solid rgba(239, 68, 68, .18);
  border-radius: 12px;
  padding: .6rem .75rem;
}
.required-list .person + .person{ margin-top: .6rem; }
.required-list .name{ font-weight: 700; }
.required-list .missing{ display: flex; flex-wrap: wrap; gap: .35rem; }

/* Chip/Badge-Stil für fehlende Vorgaben */
.fehlend-badge{
  display: inline-block;
  background: #fff3cd;
  color: #7c2d12;
  border: 1px solid #f59e0b;
  padding: .22rem .6rem;
  border-radius: 999px;
  font-size: .8rem;
  font-weight: 700;
  line-height: 1;
}

/* Allgemeine Hover-Animation der Cards */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ===== Icon-Kreise für Card-Titel ===== */
.icon-circle{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:999px;
  font-size:16px; line-height:1;
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
}

/* Farbschemata passend zu den Card-Borders */
.icon-info{     color:#1d4ed8; background: #e6f0ff;    }
.icon-success{  color:#15803d; background: #e9fbea;    }
.icon-warning{  color:#b45309; background: #fff3cd;    }
.icon-danger{   color:#b91c1c; background: #ffe5e5;    }
.icon-secondary{color:#334155; background: #f1f5f9;    }
.icon-primary{  color:#2563eb; background: #e8f0ff;    }

/* Sticky rechte Spalte */
@media (min-width: 992px){
  .sidebar-sticky{ position: sticky; top: 16px; }
}

/* ===== Navbar Styling ===== */
.navbar-glass{
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,.75));
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px); /* Safari */
  border-bottom: 1px solid rgba(16,42,67,.08);
}
.nav-shell{ border-radius: 14px; }
@media (min-width: 992px){
  .navbar-glass .nav-shell{
    box-shadow: 0 8px 24px rgba(16,42,67,.08);
    padding-inline: .5rem;
  }
}

/* Brand */
.brand-modern{ font-weight: 800; }
.brand-badge{
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; border-radius:10px;
  background: #eaf1ff;
  border:1px solid rgba(16,42,67,.08);
  box-shadow: 0 4px 10px rgba(37,99,235,.18);
}

/* Menü-Links */
.nav-modern .nav-link{
  font-weight: 600;
  color:#1f3b7a;
  border-radius: 999px;
  padding: .45rem .9rem;
  margin:.2rem;
  transition: color .15s, background .15s, transform .06s;
}
.nav-modern .nav-link:hover{ background:#eef4ff; color:#1d4ed8; }
.nav-modern .nav-link.active{
  background:#2563eb; color:#fff !important;
  box-shadow: 0 6px 14px rgba(37,99,235,.25);
}

/* Toggler sichtbar machen (auch ohne .navbar-light/.navbar-dark) */
.navbar-glass .navbar-toggler{
  border: 1px solid rgba(16,42,67,.18);
  padding: .35rem .55rem;
}
.navbar-glass .navbar-toggler:focus{ box-shadow: 0 0 0 .15rem rgba(37,99,235,.25); }
.navbar-glass .navbar-toggler-icon{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(31,59,122,0.85)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* User-Dropdown */
.btn-user{
  background:#f8fafc; border:1px solid rgba(16,42,67,.08);
}
.user-dot{ width:10px; height:10px; border-radius:50%; background:#34d399; box-shadow:0 0 0 3px #e6fff4; }
.nav-dropdown{ border-radius:14px; border:1px solid rgba(16,42,67,.08); }
.navbar-glass{
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,.75));
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(16,42,67,.08);
}
.nav-modern .nav-link{ font-weight:600; border-radius:999px; padding:.45rem .9rem; margin:.2rem; }
.nav-modern .nav-link.active{ background:#2563eb; color:#fff !important; box-shadow:0 6px 14px rgba(37,99,235,.25); }
.navbar-glass .navbar-toggler-icon{
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(31,59,122,0.85)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
