/* FAQ (Bootstrap 5 Accordion) – angepasst an RasPiZeroHub-UI */
.rz-card .accordion{
  --rz-brand: #0175d8;
  --rz-border: #e5e5e5;
  --rz-hover: rgba(1,117,216,0.06);
  --rz-open: rgba(1,117,216,0.08);
}

.rz-card .accordion-item{
  border: 1px solid var(--rz-border);
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
  margin-bottom: 10px;
}

/* verhindert doppelte Rahmen zwischen Items (BS setzt teils eigene Borders) */
.rz-card .accordion-item + .accordion-item{
  margin-top: 0;
}

.rz-card .accordion-header{
  margin: 0;
}

.rz-card .accordion-button{
  font-weight: 700;
  color: #111;
  background: #fff;
  padding: 12px 14px;
}

.rz-card .accordion-button:hover{
  background: var(--rz-hover);
}

/* Offenes Item */
.rz-card .accordion-button:not(.collapsed){
  color: #111;
  background: var(--rz-open);
  box-shadow: none; /* BS5 setzt sonst oft einen Shadow */
}

/* Fokus – wie beim Rest eurer UI */
.rz-card .accordion-button:focus{
  border-color: rgba(1,117,216,0.35);
  box-shadow: 0 0 0 3px rgba(1,117,216,0.25);
}

/* Body optisch wie eure Cards */
.rz-card .accordion-body{
  padding: 12px 14px 14px 14px;
}

/* 'Nach oben' Link dezenter */
.rz-card .accordion-body a[href="#top"]{
  display: inline-block;
  margin-top: 6px;
  font-size: 13px;
}

/* Chevron-Farbe neutral halten */
.rz-card .accordion-button::after{
  filter: none;
  opacity: 0.85;
}

/* RasPiZeroHub-API shared layout */
.rz-page { padding-top: 30px; }

.rz-topbar { background: #0175d8; }

.rz-topbar-inner{
  display:flex; align-items:center; justify-content:flex-start;
  gap:18px; padding:12px 0;
}

.rz-brand{
  color:#fff; font-weight:700; text-decoration:none;
  font-size:18px; line-height:1; white-space:nowrap;
}

.rz-menu{
  display:flex; align-items:center; gap:14px; margin-left:18px;
}

.rz-auth{
  display:flex; align-items:center; gap:10px; margin-left:auto;
}

.rz-menu-link{
  color:#fff; text-decoration:none; font-size:14px;
  white-space:nowrap; padding:6px 8px; border-radius:4px;
}

.rz-menu-link:hover, .rz-menu-link:focus{
  color:#eaf4ff; background: rgba(255,255,255,0.12);
  text-decoration:none;
}

.rz-menu-link.is-active{ background: rgba(255,255,255,0.18); }

.rz-menu-link.rz-btn{
  border:1px solid rgba(255,255,255,0.55);
  background: rgba(255,255,255,0.10);
}

.rz-menu-link.rz-btn:hover, .rz-menu-link.rz-btn:focus{
  background: rgba(255,255,255,0.18);
  border-color: rgba(255,255,255,0.8);
}

@media (max-width:767px){
  .rz-topbar-inner{ flex-direction:column; align-items:flex-start; gap:10px; }
  .rz-menu{ margin-left:0; flex-wrap:wrap; }
  .rz-auth{ margin-left:0; flex-wrap:wrap; }
}

.rz-hero{ padding: 30px 0 10px 0; }

.rz-card{
  border:1px solid #e5e5e5; border-radius:6px;
  padding:18px; margin-bottom:15px;
}

.rz-footer{
  margin-top:40px; padding:20px 0;
  border-top:1px solid #e5e5e5;
  color:#666; font-size:13px;
}

/* Dashboard filter UI */
.rz-filter { text-align: left; }
.rz-filter-label{
  display:block;
  font-size:12px;
  font-weight:700;
  color: rgba(255,255,255,0.0); /* fallback if used in topbar - not here */
}

/* labels inside content area */
.rz-page .rz-filter-label{ color:#333; }

.rz-filter-hint{ display:block; margin-top:4px; }

@media (max-width:767px){
  .rz-filter .form-control{ width:100%; }
}