/* Systemdashboard — kleine Ergänzungen zu Tabler. Eine Akzentfarbe, sonst nur Status. */
body { font-feature-settings: "tnum"; }
.kachel .card-body { padding: .6rem .75rem; }
.kachel:hover { border-color: var(--tblr-primary); }
.kachel .avatar { font-size: 1.1rem; }
.kachel .avatar img { width: 24px; height: 24px; object-fit: contain; }
.stat .avatar { font-size: 1.25rem; }
.fuss { font-size: .75rem; }
.fuss .btn-link, .collab-version { font-size: inherit; padding: 0; vertical-align: baseline; }
.dicht .list-group-item { padding-top: .6rem; padding-bottom: .6rem; }
.min-w-0 { min-width: 0; }
.container-tight { max-width: 28rem; }
.setup-card { max-width: 46rem; }
#sd-offcanvas { --tblr-offcanvas-width: 480px; width: 480px; }
#suche-box { position: relative; min-width: 12rem; }
/* Kopf: ab 1200 px ausgeklappt, darunter Burger-Menü. Bis 1500 px Icons vor den Titeln weglassen: zwischen 1200 und 1400 px ist
   der Container 1140 px breit, bei 1400–1500 px bliebe mit Icons keine Luft für andere Schriftmetriken. */
.navbar-expand-xl .navbar-nav .nav-link { padding-left: .45rem; padding-right: .45rem; }
@media (min-width: 1200px) and (max-width: 1499.98px) {
  .navbar-expand-xl #navbar-menu .nav-link-icon { display: none; }
}
#suche-treffer {
  position: absolute; top: calc(100% + .35rem); left: 0; right: 0; z-index: 1080;
  max-height: 24rem; overflow: auto;
}
.suche-gruppe { font-size: .7rem; letter-spacing: .04em; text-transform: uppercase; }
.suche-zeile.aktiv, .suche-zeile:hover { background: var(--tblr-bg-surface-secondary); }
#sd-toast {
  position: fixed; bottom: 1rem; right: 1rem; z-index: 2000;
  padding: .6rem 1rem; border-radius: var(--tblr-border-radius);
  background: var(--tblr-bg-surface); border: 1px solid var(--tblr-border-color);
  box-shadow: var(--tblr-box-shadow-lg);
}
/* Aktiver Reiter: dezente Pille statt Unterstrich (Jan 15.09.) */
.navbar .nav-item.active::after, .navbar .nav-item.active .nav-link::after { display: none !important; border: 0 !important; }
.navbar .nav-item .nav-link { border-radius: var(--tblr-border-radius); }
.navbar .nav-item.active .nav-link { background: rgba(var(--tblr-primary-rgb), .07); color: var(--tblr-primary); font-weight: 600; box-shadow: none; }
/* Legende der Statuspunkte in der Fußzeile — klein und dezent */
.legende { display: flex; flex-wrap: wrap; justify-content: center; gap: .2rem .9rem; font-size: .7rem; margin-bottom: .4rem; opacity: .85; }
.legende .status-dot { width: .45rem; height: .45rem; margin-right: .3rem; vertical-align: middle; }
.navbar .nav-item.active .nav-link .nav-link-icon { color: var(--tblr-primary); }
/* Kontingente: gleicher Abstand trotz unterschiedlich langer Namen, Ziffern in fester Breite */
.kont-name { min-width: 4.5rem; }
.kont-wert { font-variant-numeric: tabular-nums; font-weight: 500; }
/* Kontingente: alle Kästchen gleich breit, darin feste Spalten für Name · Balken · Zahl (Jan 22.09.) —
   unabhängig von Namenslänge und ein-/zwei-/dreistelliger Zahl stehen Balken und Zahlen bündig untereinander */
.kont-kopf { flex: 0 0 10.5rem; } .kont-rumpf { flex: 1 1 0; min-width: 12.5rem; } .kont-liste { display: grid; gap: .5rem; grid-template-columns: repeat(auto-fill, 12.5rem); }
.kont-liste > .kont-wert { display: grid; grid-template-columns: minmax(0, 1fr) 2.5rem 2.25rem; align-items: center;
  column-gap: .35rem; width: 100%; text-align: left; }
.kont-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .kont-nur-text { grid-column: 1 / -1; }
.kont-zahl { text-align: right; white-space: nowrap; }
/* Verbrauchsbalken: füllt sich mit dem Verbrauch, Ampelfarbe ab 80 / 90 % */
.kont-balken { display: block; width: 100%; height: .375rem;
  border-radius: 1rem; overflow: hidden; background: var(--tblr-border-color); }
.kont-balken > span { display: block; height: 100%; }
.kont-fuell { background: currentColor; opacity: .55; }

.table-klick tbody tr { cursor: pointer; }
.table-klick tbody tr:hover { background: var(--tblr-bg-surface-secondary); }
.maschine-karte { cursor: pointer; }
.maschine-karte:hover { border-color: var(--tblr-primary); }
.sd-star[aria-pressed="true"] { color: var(--tblr-primary); }
.lnk-dialog, .lnk-edit, .grp-dialog { background: var(--tblr-bg-surface-secondary); }
.auth-qr svg { max-width: 160px; height: auto; }
.grund-zelle { max-width: 28rem; }
.grp-name, .grp-name-neu { max-width: 16rem; }
.alert > * { min-width: 0; flex: 1; }
@media (max-width: 575.98px) {
  .stat .card-body { padding: .75rem; gap: .6rem !important; }
  .stat .avatar { display: none; }
  .stat .fw-medium { font-size: .85rem; }
  .page-header { margin-top: .75rem; }
  #sd-offcanvas { --tblr-offcanvas-width: 100%; width: 100%; }
  #suche-box { min-width: 0; width: auto; flex: 1; }
  #suche-box kbd { display: none; }
  #suche-treffer { position: fixed; left: .75rem; right: .75rem; width: auto; }
}

/* Anordnen: Ghost/Chosen über Tabler-Tokens; leere Ziele nur während des Ziehens */
.js-rubrik-spalte > [data-rubrik-id] > .card > .card-header { cursor: grab; }
.js-rubrik-spalte > [data-rubrik-id] > .card > .card-header .card-actions { cursor: pointer; }
body.sd-zieht { user-select: none; -webkit-user-select: none; }
body.sd-zieht .js-rubrik-spalte > [data-rubrik-id] > .card > .card-header { cursor: grabbing; }
body.sd-zieht .js-rubrik-spalte,
body.sd-zieht .js-link-liste {
  min-height: 4.5rem;
  outline: 1px dashed var(--tblr-border-color);
  outline-offset: 4px;
  border-radius: var(--tblr-border-radius);
}
/* Rubrik ohne Kacheln (neu angelegt oder leergezogen): sichtbare Ablagefläche statt leerem Kartenkörper */
.js-link-liste:not(:has(> [data-link-id])) {
  min-height: 3.5rem;
  margin: 0;
  align-items: center;
  justify-content: center;
  border: 1px dashed var(--tblr-border-color);
  border-radius: var(--tblr-border-radius);
}
.js-link-liste:not(:has(> [data-link-id]))::before {
  content: "Kacheln hierher ziehen";
  color: var(--tblr-secondary);
  font-size: .8125rem;
}
.sd-ghost { opacity: .4; }
.sd-chosen { box-shadow: var(--tblr-box-shadow-lg); background: var(--tblr-bg-surface-secondary); }
#sd-toast button { margin-left: .75rem; }

/* Meldungen: eine Zeile je Meldung, Detail grau daneben */
.meldung .text-truncate { min-width: 0; }

/* Zwei Kartenreihen hintereinander: Tabler zieht jede Reihe um einen Abstand hoch → ohne Korrektur kleben die Karten. */
.row.row-cards + .row.row-cards { margin-top: 0; }

/* Handy: Logo links, Menü rechts; Suche, Darstellung und Avatar darunter (0.8.1) */
@media (max-width: 1199.98px) {
  .navbar > .container-xl { flex-wrap: wrap; }
  .navbar .navbar-brand { order: 0; margin-right: auto; }
  .navbar .navbar-toggler { order: 1; margin-left: .5rem; }
  .navbar .navbar-nav.order-xl-last { order: 2; width: 100%; }
  .navbar .navbar-collapse { order: 3; }
}

/* Filterleiste der Proxy-Host-Tabelle: auf schmalen Schirmen brechen die Knopfgruppen um, die Suche nimmt die volle Breite */
@media (max-width: 767.98px) {
  .filterleiste .btn-group { flex-wrap: wrap; }
  .filterleiste .ms-auto { margin-left: 0 !important; width: 100%; }
}

/* Kopfmenü: Titel nie umbrechen („Proxy-Hosts“ brach sonst am Bindestrich) */
.navbar .nav-link-title { white-space: nowrap; }

/* Sortierbare Spaltenköpfe der Proxy-Host-Tabelle (Muster Trading-Boards: ⇅ inaktiv, ↑/↓ aktiv) */
.sortknopf {
  background: none; border: 0; padding: 0; margin: 0;
  font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit;
  display: inline-flex; align-items: center; gap: .25rem; white-space: nowrap; cursor: pointer;
}
.sortknopf:focus-visible { outline: 2px solid var(--tblr-primary); outline-offset: 2px; border-radius: 2px; }
.sort-icon { opacity: .4; line-height: 1; transition: opacity .15s ease; }
th.sortierbar:hover .sort-icon { opacity: .75; }
th.sort-aktiv { color: var(--tblr-body-color); }
th.sort-aktiv .sort-icon { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .sort-icon { transition: none; } }