/* Farben/Kanten global */
:root {
  --bs-primary: #0052cc;
  --bs-secondary: #6b778d;
  --bs-success: #22a06b;
  --bs-warning: #f5cd47;
  --bs-danger:  #e2483d;

  --bs-body-bg: #f7f9fc;
  --bs-body-color: #1d2129;
  --bs-border-radius: 0.75rem;  /* runde Ecken */
}

/* Karten/Tabellen etwas „luftiger“ */
.card { border: 0; box-shadow: 0 6px 24px rgba(0,0,0,.06); }
.table { vertical-align: middle; }
.table th { font-weight: 600; }
.table-hover tbody tr:hover { background: rgba(0,0,0,.03); }

/* Buttons kräftiger */
.btn-primary { box-shadow: 0 4px 16px rgba(0,82,204,.25); }
.btn-outline-primary:hover { background: var(--bs-primary); color: #fff; }

/* Formulare */
.form-control, .form-select { border-radius: var(--bs-border-radius); }

/* Badge-Größen für Ampel */
.badge { font-weight: 600; padding: .45rem .6rem; }

/* Navbar (falls du eine hast) */
.navbar-brand img { height: 28px; }

.navbar, .navbar .container-fluid, .navbar .collapse { overflow: visible !important; }
.navbar .dropdown-menu { max-width: calc(100vw - 24px); }

/* OLT Status Ampel */
.ampel {
  display: inline-block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  vertical-align: middle;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);
}

/* Statusfarben */
.rating-green {
  background-color: #2ecc71; /* grün */
}

.rating-grey {
  background-color: #bdc3c7; /* grau */
}

.rating-yellow {
  background-color: #f1c40f; /* optional */
}

.rating-red {
  background-color: #e74c3c; /* optional */
}

/* rechte Spalte in der OLT/ONT Card */
.olt-actions{
  min-width: 300px;
  max-width: 340px;
}

.olt-actions__row{
  display: flex;
  gap: .5rem;
  align-items: end;
  margin-bottom: .6rem; /* 👈 Luft nach unten */
}

.olt-actions__grow{
  flex: 1 1 auto;
  min-width: 220px;
}

.olt-actions__btn{
  width: 110px; /* verhindert "ONTs" Zeilenumbruch */
}

.olt-actions__stack{
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

/* optional: macht die Card rechts etwas "ruhiger" */
.olt-actions hr{
  opacity: .25;
}