/* ============================================================
   WTS Hartheim – App Stylesheet (Bootstrap 5 custom theme)
   ============================================================ */

/* ---------- Variables ---------- */
:root {
  --navbar-bg:       #1a2634;
  --navbar-hover:    #253749;
  --tab-bar-bg:      #f0f2f5;
  --tab-active-bg:   #ffffff;
  --tab-border:      #d0d5dd;
  --content-bg:      #ffffff;
  --accent:          #0d6efd;
  --accent-rgb:      13, 110, 253;
  --danger:          #dc3545;
  --success:         #198754;
  --kw-highlight:    #c7eaff;
  --dropdown-bg:     #1e3048;
  --dropdown-option-bg: #1a2634;
  --text-muted:      #6c757d;
  --label-color:     #374151;
  --login-bg-start:  #0f1c2e;
  --login-bg-mid:    #1a2e4a;
  --login-bg-end:    #0f1c2e;
  --login-card-bg:   #ffffff;
  --shadow-sm:       0 1px 4px rgba(0,0,0,.08);
  --shadow-md:       0 4px 16px rgba(0,0,0,.15);
}

/* ---------- Global ---------- */
body {
  background: var(--tab-bar-bg);
  font-size: .9rem;
}

a { text-decoration: none; }

/* ---------- Navbar ---------- */
#main-navbar {
  background: var(--navbar-bg) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.35);
  padding: .45rem 0;
  z-index: 1050;
}

#main-navbar .navbar-brand {
  color: #fff !important;
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: .3px;
  transition: opacity .15s;
}

#main-navbar .navbar-brand:hover { opacity: .85; }

#main-navbar .nav-link {
  color: rgba(255,255,255,.82) !important;
  font-weight: 500;
  padding: .45rem .8rem;
  border-radius: 5px;
  transition: background .15s, color .15s;
}

#main-navbar .nav-link:hover,
#main-navbar .nav-link.show {
  color: #fff !important;
  background: rgba(255,255,255,.1);
}

/* ---------- Role Simulator (admin only) ---------- */
.role-simulator-select {
  background-color: rgba(255,255,255,.1);
  color: #fff;
  border-color: rgba(255,255,255,.25);
  font-size: .8rem;
  padding: .2rem .5rem;
  cursor: pointer;
  max-width: 175px;
}

.role-simulator-select:focus {
  background-color: rgba(255,255,255,.15);
  color: #fff;
  border-color: rgba(255,255,255,.5);
  box-shadow: 0 0 0 2px rgba(255,255,255,.15);
}

.role-simulator-select option {
  background-color: var(--dropdown-option-bg);
  color: #fff;
}

.role-simulator-active {
  border-color: #ffc107 !important;
  color: #ffc107 !important;
  box-shadow: 0 0 0 2px rgba(255,193,7,.3) !important;
}

/* dropdown */
.dropdown-menu-dark {
  background: var(--dropdown-bg);
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: var(--shadow-md);
  min-width: 210px;
}

.dropdown-menu-dark .dropdown-item {
  color: rgba(255,255,255,.82);
  padding: .48rem 1.1rem;
  border-radius: 4px;
  margin: 1px 4px;
  transition: background .12s;
}

.dropdown-menu-dark .dropdown-item:hover,
.dropdown-menu-dark .dropdown-item:focus {
  background: rgba(255,255,255,.12);
  color: #fff;
}

.dropdown-menu-dark .dropdown-divider { border-color: rgba(255,255,255,.15); }

/* env badge */
.env-badge {
  animation: env-pulse 1.8s ease-in-out infinite;
  font-size: .75rem;
  letter-spacing: .5px;
}
@keyframes env-pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: .5; }
}

/* logout btn */
.btn-logout {
  border-color: rgba(255,255,255,.5);
  color: rgba(255,255,255,.9) !important;
  font-size: .82rem;
}
.btn-logout:hover {
  background: rgba(255,255,255,.12);
  border-color: #fff;
  color: #fff !important;
}

/* ---------- Tab Bar ---------- */
.tab-bar-container {
  background: var(--tab-bar-bg);
  border-bottom: 1px solid var(--tab-border);
  overflow-x: auto;
  overflow-y: hidden;
  padding: .4rem .6rem 0;
  min-height: 46px;
  /* scrollbar styling */
  scrollbar-width: thin;
  scrollbar-color: #c1c8d0 transparent;
}

.tab-bar-container::-webkit-scrollbar { height: 4px; }
.tab-bar-container::-webkit-scrollbar-thumb { background: #c1c8d0; border-radius: 2px; }

.tab-bar-nav {
  flex-wrap: nowrap !important;
  border-bottom: none;
  gap: 2px;
}

.tab-bar-nav .nav-item { display: inline-flex; }

.tab-bar-nav .nav-link {
  white-space: nowrap;
  border: 1px solid transparent;
  border-radius: 7px 7px 0 0;
  color: #5a6473;
  padding: .38rem .85rem;
  font-size: .84rem;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  background: transparent;
  transition: all .14s;
  margin-bottom: -1px;
  cursor: pointer;
}

.tab-bar-nav .nav-link:hover {
  background: rgba(var(--accent-rgb), .08);
  border-color: var(--tab-border);
  color: #212529;
}

.tab-bar-nav .nav-link.active {
  background: var(--tab-active-bg);
  border-color: var(--tab-border) var(--tab-border) var(--tab-active-bg);
  color: var(--accent);
  font-weight: 600;
  box-shadow: 0 -2px 0 var(--accent) inset;
}

.tab-close-btn {
  background: none;
  border: none;
  padding: 0;
  color: #9aa5b1;
  font-size: .7rem;
  line-height: 1;
  cursor: pointer;
  border-radius: 50%;
  width: 15px;
  height: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all .12s;
  flex-shrink: 0;
}
.tab-close-btn:hover { background: rgba(220,53,69,.15); color: var(--danger); }

/* ---------- Content Area ---------- */
.tab-content-area {
  min-height: calc(100vh - 56px - 46px);
}

#tab-panels { width: 100%; }

.tab-pane {
  padding: 1.5rem 1.75rem;
  background: var(--content-bg);
  min-height: calc(100vh - 56px - 46px);
  display: none;
}
.tab-pane.active { display: block; }

/* Loading spinner inside tab */
.tab-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 180px;
  gap: .8rem;
  color: var(--text-muted);
  font-size: .92rem;
}

/* ---------- Tables ---------- */
.table thead th {
  font-weight: 600;
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .3px;
  background: var(--card-header-bg, #f8f9fa);
  border-bottom-width: 2px;
  white-space: nowrap;
}

.table tbody tr { cursor: pointer; transition: background .1s; }
.table tbody tr:hover td { background: rgba(var(--accent-rgb), .06); }

.kw-highlight td { background: var(--kw-highlight) !important; }
.table tbody tr.kw-highlight:hover td { background: rgba(var(--accent-rgb), .12) !important; }

/* action buttons in tables */
.btn-action { padding: .2rem .45rem; font-size: .78rem; }

/* DataTables overrides */
.dataTables_wrapper .dataTables_filter input {
  border: 1px solid #ced4da;
  border-radius: 6px;
  padding: .3rem .6rem;
  font-size: .88rem;
}

.dataTables_wrapper .dataTables_length select {
  border-radius: 5px;
  font-size: .88rem;
}

.dataTables_wrapper {
  position: relative;
}

.dataTables_wrapper > .row {
  --bs-gutter-x: .75rem;
  margin-left: 0;
  margin-right: 0;
}

.dataTables_wrapper > .row > [class*="col-"] {
  padding-left: 0;
  padding-right: 0;
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_length label,
.dataTables_wrapper .dataTables_length select {
  position: relative;
  z-index: 4;
}

.dataTables_wrapper .dataTables_info { font-size: .82rem; color: var(--text-muted); }
.dataTables_wrapper .dataTables_paginate { font-size: .85rem; }

/* DataTables ColumnControl */
.dataTables_wrapper {
  --dtcc-dropdown_width: min(24rem, calc(100vw - 24px));
  --dtcc-dropdown_z-index: 1090;
  --dtcc-list-buttons_max-height: min(18rem, 42vh);
}

.dataTables_wrapper table.dataTable span.dtcc button.dtcc-button {
  opacity: .58;
  transition: opacity .15s ease, background-color .15s ease, color .15s ease;
}

.dataTables_wrapper table.dataTable span.dtcc button.dtcc-button:hover,
.dataTables_wrapper table.dataTable span.dtcc button.dtcc-button:focus-visible {
  opacity: .95;
}

.dataTables_wrapper table.dataTable span.dtcc button.dtcc-button_active {
  opacity: 1;
  color: var(--accent);
}

.dataTables_wrapper table.dataTable span.dtcc button.dtcc-button span.dtcc-button-text {
  display: none !important;
}

.dataTables_wrapper table.dataTable span.dtcc button.dtcc-button span.dtcc-button-icon {
  margin-right: 0;
}

.dataTables_wrapper div.dtcc-dropdown {
  overflow: hidden;
}

.dataTables_wrapper div.dtcc-dropdown div.dtcc-list div.dtcc-list-controls {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--dtcc-dropdown_background);
}

.dataTables_wrapper div.dtcc-dropdown div.dtcc-list div.dtcc-list-buttons {
  overscroll-behavior: contain;
}

.table-responsive.table-responsive--dtcc-open {
  overflow: visible !important;
}

/* Column filter row in thead */
.dt-column-filters th { padding: .25rem .35rem !important; background: transparent; }
.dt-column-filters input { font-size: .8rem; }
.dt-column-filters .dt-column-filter-group { flex-wrap: nowrap; }
.dt-column-filters .dt-column-filter-input { min-width: 0; }
.dt-column-filters .dt-column-filter-picker,
.dt-column-filters .dt-column-filter-clear { padding: .2rem .55rem; }
.dt-column-filters .dt-column-filter-picker i,
.dt-column-filters .dt-column-filter-clear i { pointer-events: none; }

.dt-column-filter-menu {
  position: fixed;
  z-index: 1600;
  min-width: 260px;
  max-width: min(360px, calc(100vw - 24px));
  max-height: min(60vh, 420px);
  overflow: hidden;
  border: 1px solid var(--bs-border-color);
  background: var(--bs-body-bg);
  color: var(--bs-body-color);
}

.dt-column-filter-menu__header {
  padding: .7rem .85rem;
  border-bottom: 1px solid var(--bs-border-color);
  background: var(--bs-tertiary-bg);
}

.dt-column-filter-menu__list {
  max-height: min(52vh, 320px);
  overflow: auto;
}

.dt-column-filter-menu .list-group-item {
  font-size: .85rem;
  white-space: normal;
}

.dt-column-filter-menu__empty,
.dt-column-filter-menu__hint {
  padding: .8rem .9rem;
  font-size: .82rem;
  color: var(--text-muted);
}

.dt-row-details-toggle {
  padding: 0 !important;
  color: var(--text-muted);
  text-decoration: none;
}

.dt-row-details-toggle:hover,
.dt-row-details-toggle:focus {
  color: var(--bs-primary);
  text-decoration: none;
}

.dt-row-details-toggle.is-open {
  color: var(--bs-primary);
}

.dt-row-details-child > td {
  padding: 0 !important;
  background: transparent !important;
}

.dt-row-details-card {
  margin: .45rem .75rem .65rem;
  padding: .85rem .95rem;
  border: 1px solid var(--bs-border-color);
  border-radius: .85rem;
  background: color-mix(in srgb, var(--bs-tertiary-bg) 80%, transparent);
}

.dt-row-details-card__label {
  margin-bottom: .45rem;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.dt-row-details-card__text {
  font-size: .9rem;
  line-height: 1.5;
  white-space: normal;
}

.table tbody tr.table-active td {
  background: rgba(var(--accent-rgb), .12) !important;
}

/* ---------- Overviews ---------- */
.overview-shell {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.overview-hero {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 1.45rem 1.55rem;
  border-radius: 24px;
  border: 1px solid rgba(12, 35, 52, .08);
  background: linear-gradient(135deg, rgba(var(--accent-rgb), .18), rgba(255, 255, 255, .97));
  box-shadow: var(--shadow-sm);
}

.overview-hero::before {
  content: '';
  position: absolute;
  top: -120px;
  right: -60px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, .5), transparent 70%);
  pointer-events: none;
}

.overview-hero--warning {
  background: linear-gradient(135deg, rgba(255, 200, 87, .22), rgba(255, 255, 255, .97));
}

.overview-hero--danger {
  background: linear-gradient(135deg, rgba(220, 53, 69, .16), rgba(255, 255, 255, .97));
}

.overview-hero--success {
  background: linear-gradient(135deg, rgba(25, 135, 84, .16), rgba(255, 255, 255, .97));
}

.overview-hero--info {
  background: linear-gradient(135deg, rgba(32, 164, 216, .18), rgba(255, 255, 255, .97));
}

.overview-hero__copy,
.overview-hero__meta {
  position: relative;
  z-index: 1;
}

.overview-hero__copy {
  flex: 1 1 380px;
  max-width: 760px;
}

.overview-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .36rem .7rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .72);
  color: #294559;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.overview-hero__copy h4 {
  margin: .55rem 0 .45rem;
  font-size: 1.6rem;
  line-height: 1.15;
  color: #102a41;
}

.overview-hero__copy p {
  margin: 0;
  max-width: 58ch;
  color: #42586b;
  line-height: 1.55;
}

.overview-hero__meta {
  display: flex;
  gap: .65rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.overview-hero__pill {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .72rem .95rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .82);
  border: 1px solid rgba(255, 255, 255, .65);
  backdrop-filter: blur(10px);
  color: #21384b;
  font-size: .82rem;
  font-weight: 600;
}

.overview-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: .85rem;
}

.overview-stat-card {
  position: relative;
  overflow: hidden;
  min-height: 112px;
  padding: 1rem 1.05rem;
  border-radius: 20px;
  border: 1px solid rgba(12, 35, 52, .08);
  background: linear-gradient(180deg, rgba(255, 255, 255, .97), rgba(248, 251, 254, .94));
  box-shadow: var(--shadow-sm);
}

.overview-stat-card::after {
  content: '';
  position: absolute;
  right: -18px;
  bottom: -28px;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: rgba(var(--accent-rgb), .08);
}

.overview-stat-label,
.overview-stat-meta {
  position: relative;
  z-index: 1;
}

.overview-stat-label {
  display: block;
  margin-bottom: .45rem;
  color: #65798a;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.overview-stat-value {
  position: relative;
  z-index: 1;
  display: block;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.1;
  color: #102a41;
}

.overview-stat-meta {
  display: block;
  margin-top: .45rem;
  color: #5f7385;
  font-size: .82rem;
}

.overview-toolbar,
.overview-filter-card,
.overview-table-card,
.overview-content-card {
  border: 1px solid rgba(12, 35, 52, .08);
  border-radius: 22px;
  background: rgba(255, 255, 255, .94);
  box-shadow: var(--shadow-sm);
}

.overview-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  align-items: center;
  padding: 1rem 1.15rem;
}

.overview-toolbar__group {
  display: flex;
  align-items: center;
  gap: .65rem;
  flex-wrap: wrap;
}

.overview-toolbar__label {
  color: #607484;
  font-size: .82rem;
  font-weight: 600;
}

.overview-toolbar__stats {
  display: flex;
  align-items: center;
  gap: .55rem;
  flex-wrap: wrap;
}

.overview-toolbar__badge,
.overview-toolbar__stat {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .48rem .72rem;
  border-radius: 999px;
  border: 1px solid rgba(12, 35, 52, .08);
  background: rgba(244, 247, 250, .9);
  color: #42586b;
  font-size: .8rem;
  font-weight: 600;
}

.overview-toolbar__stat-value {
  font-size: .94rem;
  font-weight: 800;
  color: #102a41;
}

.overview-toolbar__hint {
  color: #607484;
  font-size: .82rem;
  font-weight: 500;
}

.overview-filter-card {
  display: flex;
  align-items: center;
  gap: .85rem;
  flex-wrap: wrap;
  padding: 1rem 1.15rem;
}

.overview-table-card {
  padding: 1rem 1rem .5rem;
}

.overview-content-card {
  padding: 1rem 1.15rem 1.25rem;
}

.gbr-overview-top {
  display: flex;
  flex-direction: column;
  gap: .9rem;
  padding: 1.1rem 1.15rem;
  border-radius: 22px;
  border: 1px solid rgba(12, 35, 52, .08);
  background: linear-gradient(180deg, rgba(255, 252, 245, .98), rgba(255, 255, 255, .96));
  box-shadow: var(--shadow-sm);
}

.gbr-overview-top__headline {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1rem;
  flex-wrap: wrap;
}

.gbr-overview-top__copy {
  flex: 1 1 360px;
  max-width: 760px;
}

.gbr-overview-top__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .35rem .72rem;
  border-radius: 999px;
  border: 1px solid rgba(12, 35, 52, .08);
  background: rgba(255, 255, 255, .82);
  color: #294559;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.gbr-overview-top__copy h4 {
  margin: .55rem 0 .25rem;
  font-size: 1.55rem;
  line-height: 1.15;
  color: #102a41;
}

.gbr-overview-top__copy p {
  margin: 0;
  color: #5c7182;
  line-height: 1.55;
}

.gbr-overview-top__meta {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: .65rem;
  flex-wrap: wrap;
}

.gbr-overview-top__badge {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .7rem .9rem;
  border-radius: 999px;
  border: 1px solid rgba(12, 35, 52, .08);
  background: rgba(255, 255, 255, .8);
  color: #21384b;
  font-size: .83rem;
  font-weight: 600;
}

.gbr-overview-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  padding-top: .9rem;
  border-top: 1px solid rgba(12, 35, 52, .08);
}

.gbr-overview-bar__stats {
  display: flex;
  align-items: center;
  gap: .65rem;
  flex-wrap: wrap;
}

.gbr-overview-metric {
  display: inline-flex;
  align-items: baseline;
  gap: .55rem;
  padding: .66rem .85rem;
  border-radius: 16px;
  border: 1px solid rgba(12, 35, 52, .08);
  background: rgba(255, 255, 255, .78);
}

.gbr-overview-metric__value {
  min-width: 1.1rem;
  font-size: 1.08rem;
  font-weight: 800;
  color: #102a41;
}

.gbr-overview-metric__label {
  color: #5c7182;
  font-size: .82rem;
  font-weight: 700;
}

.gbr-overview-bar__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .85rem;
  flex-wrap: wrap;
}

.overview-table-card .table-responsive {
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x pan-y pinch-zoom;
  border-radius: 18px;
  padding-bottom: .35rem;
}

.overview-table-card .table {
  min-width: 56rem;
  margin-bottom: 0;
}

.overview-table-card .table thead th {
  padding-top: .8rem;
  padding-bottom: .8rem;
  color: #21384b;
  background: linear-gradient(180deg, rgba(var(--accent-rgb), .08), rgba(255, 255, 255, .98));
  border-bottom-color: rgba(12, 35, 52, .12);
}

.overview-table-card .table tbody td {
  padding: .72rem .62rem;
  vertical-align: middle;
}

.overview-table-card .dataTables_wrapper .dt-column-filters th {
  background: rgba(246, 249, 252, .92);
  border-bottom: 1px solid rgba(12, 35, 52, .06);
}

.overview-table-card .dataTables_wrapper .dataTables_info,
.overview-table-card .dataTables_wrapper .dataTables_paginate {
  padding-top: .9rem;
}

.overview-empty-state {
  text-align: center;
  padding: 2.75rem 1.5rem;
  border-radius: 24px;
  border: 1px dashed rgba(var(--accent-rgb), .25);
  background: linear-gradient(180deg, rgba(255, 255, 255, .85), rgba(var(--accent-rgb), .06));
}

.overview-empty-state h3 {
  margin: .9rem 0 .35rem;
  font-size: 1.3rem;
}

.overview-empty-state p {
  margin: 0;
  color: #607484;
}

.overview-empty-state__icon {
  width: 68px;
  height: 68px;
  margin: 0 auto;
  display: grid;
  place-items: center;
  border-radius: 22px;
  background: rgba(var(--accent-rgb), .12);
  color: var(--accent);
  font-size: 1.7rem;
}

.overview-calendar-shell {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.overview-calendar-month {
  padding: 1.2rem;
  border-radius: 26px;
  border: 1px solid rgba(12, 35, 52, .08);
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(247, 250, 253, .96));
  box-shadow: var(--shadow-sm);
}

.overview-calendar-month__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: .8rem;
  flex-wrap: wrap;
}

.overview-calendar-month__eyebrow {
  color: #607484;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.overview-calendar-month__title {
  margin: .25rem 0 0;
  font-size: 1.45rem;
  color: #102a41;
  text-transform: capitalize;
}

.overview-calendar-month__count {
  display: inline-flex;
  align-items: center;
  padding: .5rem .8rem;
  border-radius: 999px;
  background: rgba(var(--accent-rgb), .08);
  color: #294559;
  font-size: .82rem;
  font-weight: 700;
}

.overview-calendar-week {
  display: flex;
  flex-direction: column;
  gap: .8rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(12, 35, 52, .06);
}

.overview-calendar-week__label {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  padding: .44rem .72rem;
  border-radius: 999px;
  background: rgba(var(--accent-rgb), .1);
  color: #163651;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.overview-entry-card {
  border: 1px solid rgba(12, 35, 52, .08);
  border-radius: 20px;
  padding: 1rem 1.05rem;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 10px 26px rgba(15, 23, 42, .06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.overview-entry-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 32px rgba(15, 23, 42, .09);
  border-color: rgba(var(--accent-rgb), .22);
}

.overview-entry-card.is-clickable {
  cursor: pointer;
}

.overview-entry-card--training {
  border-left: 4px solid rgba(32, 164, 216, .8);
}

.overview-entry-card--muted {
  border-left: 4px solid rgba(181, 77, 61, .74);
}

.overview-entry-card--restricted {
  background: linear-gradient(180deg, rgba(255, 247, 245, .96), rgba(255, 255, 255, .94));
}

.overview-entry-card__top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: .9rem;
}

.overview-entry-card__date {
  color: #617586;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.overview-entry-card__title {
  margin: .3rem 0 0;
  font-size: 1.08rem;
  line-height: 1.3;
  color: #102a41;
}

.overview-entry-card__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .6rem .85rem;
  border-radius: 14px;
  border: 1px solid rgba(var(--accent-rgb), .18);
  background: rgba(var(--accent-rgb), .08);
  color: var(--accent);
  font-size: .84rem;
  font-weight: 600;
  white-space: nowrap;
}

.overview-entry-card__action:hover {
  background: rgba(var(--accent-rgb), .14);
  color: var(--accent);
}

.overview-entry-card__description {
  margin: .9rem 0 0;
  color: #314759;
  line-height: 1.6;
}

.overview-entry-card__meta {
  display: flex;
  gap: .55rem;
  flex-wrap: wrap;
  margin-top: .95rem;
}

.overview-entry-card__chip {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .48rem .72rem;
  border-radius: 999px;
  border: 1px solid rgba(12, 35, 52, .08);
  background: #f5f8fb;
  color: #294559;
  font-size: .8rem;
}

.overview-entry-card__chip i {
  color: var(--accent);
  font-size: .78rem;
}

.deleted-entry-badge {
  vertical-align: middle;
  margin-left: .35rem;
  font-weight: 700;
}

.deleted-entry-badge--training {
  color: #0b5d7f;
  background: rgba(32, 164, 216, .14) !important;
}

.deleted-entry-badge--ok {
  color: #1f6a3e;
  background: rgba(44, 137, 82, .14) !important;
}

#deleted-table tbody tr.deleted-entry-row--training-ok > * {
  background: linear-gradient(180deg, rgba(232, 248, 238, .95), rgba(245, 252, 247, .98));
}

#deleted-table tbody tr.deleted-entry-row--training-ok {
  box-shadow: inset 4px 0 0 rgba(38, 128, 79, .82);
}

[data-bs-theme="dark"] #deleted-table tbody tr.deleted-entry-row--training-ok > * {
  background: linear-gradient(180deg, rgba(19, 63, 37, .88), rgba(16, 33, 24, .96));
}

[data-bs-theme="dark"] .deleted-entry-badge--training {
  color: #97def8;
  background: rgba(32, 164, 216, .2) !important;
}

[data-bs-theme="dark"] .deleted-entry-badge--ok {
  color: #a8efc3;
  background: rgba(44, 137, 82, .24) !important;
}

.overview-entry-card__inline-link {
  color: var(--accent);
  font-weight: 600;
}

[data-bs-theme="dark"] .overview-hero,
[data-bs-theme="dark"] .overview-stat-card,
[data-bs-theme="dark"] .gbr-overview-top,
[data-bs-theme="dark"] .overview-toolbar,
[data-bs-theme="dark"] .overview-filter-card,
[data-bs-theme="dark"] .overview-table-card,
[data-bs-theme="dark"] .overview-content-card,
[data-bs-theme="dark"] .overview-calendar-month,
[data-bs-theme="dark"] .overview-entry-card {
  border-color: rgba(255, 255, 255, .08);
  background: linear-gradient(180deg, rgba(26, 31, 38, .96), rgba(15, 17, 23, .98));
}

[data-bs-theme="dark"] .overview-hero__pill,
[data-bs-theme="dark"] .gbr-overview-top__eyebrow,
[data-bs-theme="dark"] .gbr-overview-top__badge,
[data-bs-theme="dark"] .gbr-overview-metric,
[data-bs-theme="dark"] .overview-toolbar__badge,
[data-bs-theme="dark"] .overview-toolbar__stat,
[data-bs-theme="dark"] .overview-entry-card__chip {
  border-color: rgba(255, 255, 255, .08);
  background: rgba(255, 255, 255, .04);
}

[data-bs-theme="dark"] .overview-hero--info {
  background: linear-gradient(135deg, rgba(32, 164, 216, .2), rgba(12, 16, 24, .98) 58%, rgba(9, 12, 18, .99));
}

[data-bs-theme="dark"] .overview-hero--warning {
  background: linear-gradient(135deg, rgba(255, 200, 87, .18), rgba(16, 18, 22, .98) 58%, rgba(10, 12, 16, .99));
}

[data-bs-theme="dark"] .overview-hero--danger {
  background: linear-gradient(135deg, rgba(220, 53, 69, .18), rgba(17, 14, 18, .98) 58%, rgba(10, 9, 12, .99));
}

[data-bs-theme="dark"] .overview-hero--success {
  background: linear-gradient(135deg, rgba(25, 135, 84, .18), rgba(12, 18, 16, .98) 58%, rgba(8, 12, 11, .99));
}

[data-bs-theme="dark"] .overview-hero::before {
  background: radial-gradient(circle, rgba(var(--accent-rgb), .24), transparent 68%);
}

[data-bs-theme="dark"] .overview-hero__copy p,
[data-bs-theme="dark"] .gbr-overview-top__copy p,
[data-bs-theme="dark"] .gbr-overview-metric__label,
[data-bs-theme="dark"] .overview-stat-meta,
[data-bs-theme="dark"] .overview-calendar-month__eyebrow,
[data-bs-theme="dark"] .overview-entry-card__date,
[data-bs-theme="dark"] .overview-entry-card__description,
[data-bs-theme="dark"] .gbr-overview-top__eyebrow,
[data-bs-theme="dark"] .gbr-overview-top__badge,
[data-bs-theme="dark"] .overview-toolbar__badge,
[data-bs-theme="dark"] .overview-toolbar__stat,
[data-bs-theme="dark"] .overview-toolbar__hint,
[data-bs-theme="dark"] .overview-toolbar__label,
[data-bs-theme="dark"] .overview-hero__pill,
[data-bs-theme="dark"] .overview-empty-state p {
  color: rgba(230, 237, 243, .74);
}

[data-bs-theme="dark"] .overview-hero__eyebrow,
[data-bs-theme="dark"] .gbr-overview-top__eyebrow,
[data-bs-theme="dark"] .gbr-overview-top__badge,
[data-bs-theme="dark"] .overview-calendar-month__count,
[data-bs-theme="dark"] .overview-calendar-week__label {
  color: rgba(240, 246, 252, .92);
  background: rgba(var(--accent-rgb), .16);
  border: 1px solid rgba(var(--accent-rgb), .2);
}

[data-bs-theme="dark"] .overview-entry-card__action {
  color: rgba(240, 246, 252, .92);
  background: rgba(var(--accent-rgb), .16);
  border-color: rgba(var(--accent-rgb), .26);
}

[data-bs-theme="dark"] .overview-entry-card__action:hover {
  background: rgba(var(--accent-rgb), .22);
  color: #fff;
}

[data-bs-theme="dark"] .overview-entry-card__chip {
  color: rgba(230, 237, 243, .82);
}

[data-bs-theme="dark"] .overview-entry-card__chip i,
[data-bs-theme="dark"] .overview-entry-card__inline-link {
  color: rgba(121, 192, 255, .95);
}

[data-bs-theme="dark"] .overview-calendar-week {
  border-top-color: rgba(255, 255, 255, .08);
}

[data-bs-theme="dark"] .overview-entry-card:hover {
  border-color: rgba(var(--accent-rgb), .32);
  box-shadow: 0 18px 36px rgba(0, 0, 0, .34);
}

[data-bs-theme="dark"] .overview-entry-card--restricted {
  background: linear-gradient(180deg, rgba(52, 28, 32, .88), rgba(20, 16, 19, .98));
}

[data-bs-theme="dark"] .overview-table-card .table thead th {
  color: rgba(240, 246, 252, .9);
  background: linear-gradient(180deg, rgba(var(--accent-rgb), .15), rgba(18, 24, 33, .98));
  border-bottom-color: rgba(255, 255, 255, .08);
}

[data-bs-theme="dark"] .overview-table-card .dataTables_wrapper .dt-column-filters th {
  background: rgba(18, 24, 33, .96);
  border-bottom-color: rgba(255, 255, 255, .06);
}

[data-theme="dark"] .overview-hero__eyebrow,
[data-theme="dark"] .overview-hero__pill,
[data-theme="dark"] .overview-calendar-month__count,
[data-theme="dark"] .overview-calendar-week__label,
[data-theme="dark"] .overview-entry-card__action {
  box-shadow: 0 8px 24px rgba(88, 166, 255, .12);
}

[data-theme="nord"] .overview-hero--info {
  background: linear-gradient(135deg, rgba(136, 192, 208, .24), rgba(46, 52, 64, .98) 58%, rgba(36, 41, 51, .99));
}

[data-theme="nord"] .overview-hero--success {
  background: linear-gradient(135deg, rgba(163, 190, 140, .22), rgba(46, 52, 64, .98) 58%, rgba(39, 44, 54, .99));
}

[data-theme="nord"] .overview-hero--warning {
  background: linear-gradient(135deg, rgba(235, 203, 139, .2), rgba(46, 52, 64, .98) 58%, rgba(38, 42, 52, .99));
}

[data-theme="nord"] .overview-hero--danger {
  background: linear-gradient(135deg, rgba(191, 97, 106, .2), rgba(46, 52, 64, .98) 58%, rgba(38, 40, 50, .99));
}

[data-theme="nord"] .overview-entry-card__chip i,
[data-theme="nord"] .overview-entry-card__inline-link {
  color: #88c0d0;
}

[data-theme="dracula"] .overview-hero--info {
  background: linear-gradient(135deg, rgba(139, 233, 253, .18), rgba(40, 42, 54, .98) 58%, rgba(26, 27, 38, .99));
}

[data-theme="dracula"] .overview-hero--success {
  background: linear-gradient(135deg, rgba(80, 250, 123, .16), rgba(40, 42, 54, .98) 58%, rgba(26, 27, 38, .99));
}

[data-theme="dracula"] .overview-hero--warning {
  background: linear-gradient(135deg, rgba(241, 250, 140, .18), rgba(40, 42, 54, .98) 58%, rgba(26, 27, 38, .99));
}

[data-theme="dracula"] .overview-hero--danger {
  background: linear-gradient(135deg, rgba(255, 85, 85, .18), rgba(40, 42, 54, .98) 58%, rgba(26, 27, 38, .99));
}

[data-theme="dracula"] .overview-entry-card__chip i,
[data-theme="dracula"] .overview-entry-card__inline-link {
  color: #bd93f9;
}

[data-bs-theme="dark"] .overview-empty-state {
  background: linear-gradient(180deg, rgba(15, 17, 23, .96), rgba(var(--accent-rgb), .08));
  border-color: rgba(var(--accent-rgb), .3);
}

[data-bs-theme="dark"] .overview-hero__copy h4,
[data-bs-theme="dark"] .gbr-overview-top__copy h4,
[data-bs-theme="dark"] .gbr-overview-metric__value,
[data-bs-theme="dark"] .overview-toolbar__stat-value,
[data-bs-theme="dark"] .overview-stat-value,
[data-bs-theme="dark"] .overview-calendar-month__title,
[data-bs-theme="dark"] .overview-entry-card__title {
  color: var(--bs-body-color);
}

[data-bs-theme="dark"] .gbr-overview-bar {
  border-top-color: rgba(255, 255, 255, .08);
}

@media (max-width: 768px) {
  .overview-hero,
  .gbr-overview-top,
  .overview-toolbar,
  .overview-filter-card,
  .overview-table-card,
  .overview-content-card,
  .overview-calendar-month {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .overview-hero__meta {
    justify-content: flex-start;
  }

  .gbr-overview-top__meta {
    justify-content: flex-start;
  }

  .gbr-overview-bar__actions {
    justify-content: flex-start;
  }

  .overview-toolbar__stats {
    width: 100%;
  }

  .overview-entry-card__top {
    flex-direction: column;
  }

  .overview-table-card {
    padding-left: 0;
    padding-right: 0;
  }

  .overview-table-card .table-responsive {
    border-radius: 0;
    padding: 0 1rem .35rem;
  }

  .overview-table-card .table {
    min-width: 52rem;
  }
}

/* ---------- Cards ---------- */
.card {
  box-shadow: var(--shadow-sm);
  border: 1px solid rgba(0,0,0,.09);
  border-radius: 8px;
}
.card-header {
  font-weight: 600;
  font-size: .88rem;
  background: var(--card-header-bg, #f8f9fa);
  border-bottom: 1px solid rgba(0,0,0,.08);
  padding: .75rem 1rem;
}

/* ---------- Alerts ---------- */
.alert { border-radius: 8px; font-size: .88rem; }

/* ---------- Forms ---------- */
.form-label { font-weight: 500; font-size: .87rem; color: var(--label-color); }
.form-control, .form-select {
  font-size: .88rem;
  border-radius: 6px;
  border-color: #ced4da;
  transition: border-color .15s, box-shadow .15s;
}
.form-control:focus, .form-select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 .2rem rgba(var(--accent-rgb), .15);
}

/* ---------- Login Page ---------- */
.login-page {
  min-height: 100vh;
  background: linear-gradient(135deg, var(--login-bg-start) 0%, var(--login-bg-mid) 50%, var(--login-bg-end) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.login-card {
  background: var(--login-card-bg);
  border-radius: 14px;
  box-shadow: 0 10px 40px rgba(0,0,0,.4);
  padding: 2.5rem 2rem;
  width: 100%;
  max-width: 420px;
}

.login-icon {
  font-size: 2.8rem;
  color: var(--navbar-bg);
}

.login-title { font-weight: 700; color: var(--navbar-bg); font-size: 1.5rem; }
.login-subtitle { color: var(--text-muted); font-size: .88rem; }

/* ---------- Home Page ---------- */
.home-welcome {
  max-width: 750px;
}

.home-logo {
  width: 52px; height: 52px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--navbar-bg), #2a4260);
  color: #fff; font-size: 1.5rem;
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
}

.home-greeting {
  font-size: 1.05rem;
  color: var(--text-muted);
  margin: .75rem 0 0;
}

.home-card {
  cursor: pointer;
  border-radius: 12px;
  transition: transform .18s ease, box-shadow .18s ease;
  border: 1px solid rgba(0,0,0,.06);
}
.home-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
}
.home-card .card-body { padding: 1.25rem; }
.home-card-icon { font-size: 2rem; margin-bottom: .6rem; }
.home-card-title { font-weight: 600; font-size: .95rem; }
.home-card-desc { font-size: .82rem; color: var(--text-muted); margin-top: .2rem; }

.stat-card {
  border-radius: 10px;
  transition: transform .15s, box-shadow .15s;
}
.stat-card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,.12); }

/* ---------- Bootbox ---------- */
.modal-header { border-bottom: 1px solid var(--tab-border, #dee2e6); }
.modal-footer { border-top: 1px solid var(--tab-border, #dee2e6); }

/* ---------- Toast Container ---------- */
#toast-container {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 9999;
}

/* ---------- Tab Context Menu ---------- */
.tab-context-menu {
  position: fixed;
  z-index: 9999;
  min-width: 200px;
  background: #1e3048;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
  padding: 4px 0;
  display: none;
}

.tab-context-menu.show { display: block; }

.tab-context-menu .ctx-item {
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .5rem 1rem;
  color: rgba(255,255,255,.82);
  font-size: .84rem;
  cursor: pointer;
  transition: background .12s;
  border: none;
  background: none;
  width: 100%;
  text-align: left;
}

.tab-context-menu .ctx-item:hover {
  background: rgba(255,255,255,.12);
  color: #fff;
}

.tab-context-menu .ctx-item i { width: 16px; text-align: center; }

.tab-context-menu .ctx-divider {
  height: 1px;
  background: rgba(255,255,255,.12);
  margin: 4px 0;
}

/* ============================================================
   Themes – each [data-theme] block overrides :root variables.
   Dark themes also use Bootstrap 5.3 data-bs-theme="dark"
   for automatic card/table/form/modal dark styling.
   ============================================================ */

/* --- JV Freiburg --- */
[data-theme="jvf"] {
  --navbar-bg:       #2f3f24;
  --navbar-hover:    #445632;
  --tab-bar-bg:      #e7dfcf;
  --tab-active-bg:   #f7f2e7;
  --tab-border:      #b79b74;
  --content-bg:      #f7f2e7;
  --card-header-bg:  #e1d4bb;
  --accent:          #8d6333;
  --accent-rgb:      141, 99, 51;
  --danger:          #8b3a32;
  --success:         #3d6b35;
  --kw-highlight:    #dde6cf;
  --dropdown-bg:     #433f3e;
  --dropdown-option-bg: #433f3e;
  --text-muted:      #6f6455;
  --label-color:     #4b4034;
  --login-bg-start:  #2f3f24;
  --login-bg-mid:    #5d4b34;
  --login-bg-end:    #8d6333;
  --login-card-bg:   #fbf7ef;
  --shadow-sm:       0 2px 6px rgba(47,63,36,.12);
  --shadow-md:       0 12px 30px rgba(67,63,62,.2);
  --bs-body-bg:      #f7f2e7;
  --bs-body-color:   #2f2923;
  --bs-emphasis-color: #241f1a;
  --bs-secondary-color: #6f6455;
  --bs-secondary-bg: #ede4d4;
  --bs-tertiary-bg:  #e1d4bb;
  --bs-border-color: #cdb89a;
  --bs-border-color-translucent: rgba(79, 64, 52, .14);
  --bs-link-color:   #3d6b35;
  --bs-link-hover-color: #2f5329;
  --bs-primary:      #8d6333;
  --bs-primary-rgb:  141, 99, 51;
  --bs-primary-text-emphasis: #553819;
  --bs-primary-bg-subtle: #ecdfcf;
  --bs-primary-border-subtle: #caa77c;
  --bs-secondary:    #5d4b34;
  --bs-secondary-rgb: 93, 75, 52;
  --bs-secondary-text-emphasis: #3f3020;
  --bs-secondary-bg-subtle: #e9dfd0;
  --bs-secondary-border-subtle: #c6b196;
  --bs-success:      #3d6b35;
  --bs-success-rgb:  61, 107, 53;
  --bs-success-text-emphasis: #274421;
  --bs-success-bg-subtle: #dce8d5;
  --bs-success-border-subtle: #a7c19d;
  --bs-info:         #64724a;
  --bs-info-rgb:     100, 114, 74;
  --bs-info-text-emphasis: #3d462d;
  --bs-info-bg-subtle: #dde3d3;
  --bs-info-border-subtle: #b5bea2;
  --bs-warning:      #b0822e;
  --bs-warning-rgb:  176, 130, 46;
  --bs-warning-text-emphasis: #654710;
  --bs-warning-bg-subtle: #f2e5c8;
  --bs-warning-border-subtle: #d6ba83;
  --bs-danger:       #8b3a32;
  --bs-danger-rgb:   139, 58, 50;
  --bs-danger-text-emphasis: #5d221d;
  --bs-danger-bg-subtle: #f0d8d4;
  --bs-danger-border-subtle: #c5968f;
  --bs-light:        #fbf7ef;
  --bs-light-rgb:    251, 247, 239;
  --bs-dark:         #2f2923;
  --bs-dark-rgb:     47, 41, 35;
}

[data-theme="jvf"] body {
  color: var(--bs-body-color);
  background:
    radial-gradient(circle at top right, rgba(176,130,46,.08), transparent 28%),
    radial-gradient(circle at bottom left, rgba(61,107,53,.08), transparent 24%),
    var(--tab-bar-bg);
}

[data-theme="jvf"] .card {
  border-color: rgba(93, 75, 52, .14);
  background: rgba(255, 252, 245, .96);
}

[data-theme="jvf"] .card-header {
  background:
    linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,0)),
    var(--card-header-bg);
}

[data-theme="jvf"] .tab-bar-container {
  background:
    linear-gradient(180deg, rgba(255,255,255,.45), rgba(255,255,255,0)),
    var(--tab-bar-bg);
}

[data-theme="jvf"] .tab-bar-nav .nav-link:hover {
  color: #3f3020;
}

[data-theme="jvf"] .tab-bar-nav .nav-link.active {
  color: var(--bs-primary);
  box-shadow: 0 -3px 0 var(--bs-success) inset;
}

[data-theme="jvf"] .stat-card:hover {
  box-shadow: 0 10px 22px rgba(61,107,53,.14);
}

[data-theme="jvf"] .btn-primary {
  box-shadow: 0 4px 12px rgba(141,99,51,.18);
}

[data-theme="jvf"] .btn-outline-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
}

[data-theme="jvf"] .form-check-input:checked {
  background-color: var(--bs-success);
  border-color: var(--bs-success);
}

[data-theme="jvf"] .form-check-input:focus {
  border-color: rgba(var(--bs-success-rgb), .55);
  box-shadow: 0 0 0 .2rem rgba(var(--bs-success-rgb), .15);
}

[data-theme="jvf"] .page-link {
  color: var(--bs-primary);
}

[data-theme="jvf"] .page-link:hover {
  color: var(--bs-primary-text-emphasis);
  background-color: var(--bs-primary-bg-subtle);
  border-color: var(--bs-primary-border-subtle);
}

[data-theme="jvf"] .page-item.active .page-link {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

/* --- Dark (GitHub-inspired) --- */
[data-theme="dark"] {
  --navbar-bg:       #010409;
  --navbar-hover:    #161b22;
  --tab-bar-bg:      #161b22;
  --tab-active-bg:   #0d1117;
  --tab-border:      #30363d;
  --content-bg:      #0d1117;
  --card-header-bg:  #161b22;
  --accent:          #58a6ff;
  --accent-rgb:      88, 166, 255;
  --kw-highlight:    #1c3049;
  --dropdown-bg:     #161b22;
  --dropdown-option-bg: #010409;
  --login-bg-start:  #010409;
  --login-bg-mid:    #161b22;
  --login-bg-end:    #010409;
  --shadow-sm:       0 1px 4px rgba(0,0,0,.4);
  --shadow-md:       0 4px 16px rgba(0,0,0,.5);
}

/* --- Nord --- */
[data-theme="nord"] {
  --navbar-bg:       #2e3440;
  --navbar-hover:    #3b4252;
  --tab-bar-bg:      #3b4252;
  --tab-active-bg:   #2e3440;
  --tab-border:      #4c566a;
  --content-bg:      #2e3440;
  --card-header-bg:  #3b4252;
  --accent:          #88c0d0;
  --accent-rgb:      136, 192, 208;
  --danger:          #bf616a;
  --success:         #a3be8c;
  --kw-highlight:    #434c5e;
  --dropdown-bg:     #2e3440;
  --dropdown-option-bg: #2e3440;
  --login-bg-start:  #2e3440;
  --login-bg-mid:    #3b4252;
  --login-bg-end:    #2e3440;
  --shadow-sm:       0 1px 4px rgba(0,0,0,.3);
  --shadow-md:       0 4px 16px rgba(0,0,0,.4);
}

/* --- Dracula --- */
[data-theme="dracula"] {
  --navbar-bg:       #1e1f29;
  --navbar-hover:    #282a36;
  --tab-bar-bg:      #282a36;
  --tab-active-bg:   #1e1f29;
  --tab-border:      #44475a;
  --content-bg:      #282a36;
  --card-header-bg:  #21222c;
  --accent:          #bd93f9;
  --accent-rgb:      189, 147, 249;
  --danger:          #ff5555;
  --success:         #50fa7b;
  --kw-highlight:    #342e58;
  --dropdown-bg:     #21222c;
  --dropdown-option-bg: #1e1f29;
  --login-bg-start:  #1e1f29;
  --login-bg-mid:    #282a36;
  --login-bg-end:    #1e1f29;
  --shadow-sm:       0 1px 4px rgba(0,0,0,.3);
  --shadow-md:       0 4px 16px rgba(0,0,0,.4);
}

/* --- Solarized Dark --- */
[data-theme="solarized"] {
  --navbar-bg:       #002b36;
  --navbar-hover:    #073642;
  --tab-bar-bg:      #073642;
  --tab-active-bg:   #002b36;
  --tab-border:      #586e75;
  --content-bg:      #002b36;
  --card-header-bg:  #073642;
  --accent:          #268bd2;
  --accent-rgb:      38, 139, 210;
  --danger:          #dc322f;
  --success:         #859900;
  --kw-highlight:    #0a4050;
  --dropdown-bg:     #073642;
  --dropdown-option-bg: #002b36;
  --login-bg-start:  #002b36;
  --login-bg-mid:    #073642;
  --login-bg-end:    #002b36;
  --shadow-sm:       0 1px 4px rgba(0,0,0,.3);
  --shadow-md:       0 4px 16px rgba(0,0,0,.4);
}

/* --- Dark-mode overrides for custom (non-Bootstrap) components --- */
[data-bs-theme="dark"] .tab-bar-nav .nav-link {
  color: #8b949e;
}
[data-bs-theme="dark"] .tab-bar-nav .nav-link:hover {
  background: rgba(255,255,255,.06);
  color: #e6edf3;
  border-color: var(--tab-border);
}
[data-bs-theme="dark"] .tab-bar-nav .nav-link.active {
  background: var(--tab-active-bg);
  color: var(--accent);
  border-color: var(--tab-border) var(--tab-border) var(--tab-active-bg);
}
[data-bs-theme="dark"] .tab-close-btn { color: #6e7681; }
[data-bs-theme="dark"] .tab-close-btn:hover { color: var(--danger); }

[data-bs-theme="dark"] .table thead th {
  background: var(--tab-bar-bg);
  color: #8b949e;
  border-color: var(--tab-border);
}
[data-bs-theme="dark"] .table tbody tr:hover td { background: rgba(255,255,255,.04); }
[data-bs-theme="dark"] .kw-highlight td { background: var(--kw-highlight) !important; }
[data-bs-theme="dark"] .table tbody tr.kw-highlight:hover td {
  background: rgba(255,255,255,.08) !important;
}

[data-bs-theme="dark"] .card { border-color: var(--tab-border); }
[data-bs-theme="dark"] .card-header { border-color: var(--tab-border); }

[data-bs-theme="dark"] .tab-loading { color: #8b949e; }
[data-bs-theme="dark"] .form-label { color: inherit; }
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_info { color: #8b949e; }

[data-bs-theme="dark"] .login-page {
  background: linear-gradient(135deg, var(--navbar-bg) 0%, var(--tab-bar-bg) 50%, var(--navbar-bg) 100%);
}
[data-bs-theme="dark"] .login-card { background: var(--content-bg); }
[data-bs-theme="dark"] .login-icon { color: var(--accent); }
[data-bs-theme="dark"] .login-title { color: inherit; }

[data-bs-theme="dark"] .role-simulator-select option { background-color: var(--navbar-bg); }

/* Theme picker swatches in settings */
.theme-card {
  border: 2px solid var(--tab-border, #d0d5dd);
  border-radius: 10px;
  padding: .6rem;
  cursor: pointer;
  text-align: center;
  transition: border-color .15s, box-shadow .15s;
  background: transparent;
}
.theme-card:hover { border-color: var(--accent); }
.theme-card.active {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .2);
}
.theme-swatch {
  display: flex;
  gap: 0;
  border-radius: 6px;
  overflow: hidden;
  height: 24px;
  margin-bottom: .4rem;
}
.theme-swatch span { flex: 1; }
.theme-card .small { font-weight: 600; font-size: .78rem; }

/* ---------- Flatpickr –  German date/time pickers ---------- */
/* Make flatpickr fill Bootstrap grid columns; flex-row filter inputs get
   their width transferred to the wrapper via JS (_initFlatpickrs). */
[class*="col-"] .flatpickr-wrapper {
  display: block;
  width: 100%;
}
.flatpickr-wrapper .flatpickr-input {
  width: 100%;
}
.flatpickr-today-bar {
  display: flex;
  justify-content: flex-end;
  padding: .45rem .5rem .5rem;
  border-top: 1px solid rgba(0,0,0,.08);
}
.flatpickr-today-button {
  border: 1px solid rgba(var(--accent-rgb), .25);
  background: rgba(var(--accent-rgb), .08);
  color: var(--accent);
  border-radius: .5rem;
  padding: .25rem .65rem;
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.flatpickr-today-button:hover,
.flatpickr-today-button:focus {
  background: rgba(var(--accent-rgb), .14);
  border-color: rgba(var(--accent-rgb), .4);
  color: var(--accent);
  outline: none;
}

/* ---------- Responsive ---------- */
@media (max-width: 768px) {
  .tab-pane { padding: 1rem; }
  .login-card { padding: 2rem 1.5rem; }
}

@media (max-width: 576px) {
  #main-navbar .brand-text { display: none; }
}