body {
  font-size: 12px;
  font-family: 'Inter', sans-serif;
}
@font-face {
  font-family: "Roboto-Regular";
  src: url("/fonts/Roboto/static/Roboto-Regular.ttf");
}
.form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #C9C9C9;
  opacity: 1; /* Firefox */
}
h1 {
  font-size: 27px;
}
h2 {
  font-size: 27px;
}
h3 {
  font-size: 24px;
}
h4 {
  font-size: 18px;
}
.f-6 {
  font-size: 6px
}
.f-7 {
  font-size: 7px
}
.f-8 {
  font-size: 8px
}
.f-9 {
  font-size: 9px
}
.f-10 {
  font-size: 10px
}
.f-12 {
  font-size: 12px
}
.f-14 {
  font-size: 14px
}
.f-16 {
  font-size: 16px
}
.f-18 {
  font-size: 18px
}
.f-20 {
  font-size: 20px
}
.f-22 {
  font-size: 22px
}
.f-24 {
  font-size: 24px
}
.f-25 {
  font-size: 25px
}
.f-26 {
  font-size: 26px
}
.f-28 {
  font-size: 28px
}
.f-30 {
  font-size: 30px
}
.f-44 {
  font-size: 44px;
}
.f-60 {
  font-size: 60px;
}
.lh-30 {
  line-height: 30px;
}
.lh-35 {
  line-height: 35px;
}
.text-blue {
  color: #0770F7
}
.text-grau {
  color: #8c8c8c !important;
}
.text-mein {
  color: #fead0d;
}
.text-red {
  color: #cd0100;
}
.btn-mein {
  color: #fff;
  background-color: #fead0d;
  border-color: #fead0d;
}
.btn-mein:hover {
  color: #fff;
  background-color: #ff9c00;
  border-color: #ff9c00;
}
.btn-red {
  color: #fff;
  background-color: #cd0100;
}
.btn-red:hover {
  color: #fff;
  background-color: #900000;
}
.bg-mein {
  background-color: #fead0d;
  color: #fff;
}
.bg-red {
  background-color: #cd0100;
}
.gelb {
  color: #fead0d;
}
.rot {
  color: #FE660C;
}
#headerPixel {
  position: relative;
  background-color: white;
  height: 100vh; /* Adjust the height as needed */
  overflow: hidden;
}
#content {
  position: relative;
  z-index: 1;
}
.pixel {
  position: absolute;
  background-color: #ACACAC;
  z-index: 0;
}
/* Overlay Style */
#overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.card-header {
  padding: 5px 5px 5px 15px;
}
.border-end-header {
  border-right: #9A4041 solid 1px
}
.border-bottom-thick th {
    border-bottom-width: 3px; /* oder deine Wunschfarbe */
  }
.border-top-thick td {
    border-top-width: 3px; /* oder deine Wunschfarbe */
  }
.bootstrap-select .dropdown-toggle .filter-option-inner-inner {
  white-space: normal !important; /* Zeilenumbruch innerhalb des Buttons erlauben */
  line-height: 1.5; /* Optional: Höhe zwischen den Zeilen */
}
.bootstrap-select .dropdown-toggle .filter-option-inner-inner span {
  display: block; /* Jede Option untereinander anzeigen */
}
.no-border-radius {
  --bs-btn-border-radius: 0;
}
/*.form-check-input {
  border: 2px solid #000; 
  width: 20px; 
  height: 20px;
}
.form-check-input:checked {
  background-color: #0d6efd; 
  border-color: #0d6efd;
}*/
.border-dashed {
  border-style: dashed !important;
}
.border-dotted {
  border-style: dotted !important;
}
.hover-bg:hover {
  background-color: #F0F0F0; /* Bootstrap's bg-light */
  transition: background-color 0.3s ease;
}
.scroll-wrapper {
      position: relative;
    }

    .scroll-top {
      overflow-x: auto;
      overflow-y: hidden;
      height: 16px; /* Höhe wie typische Scrollbar */
      margin-bottom: 4px;
    }

    .scroll-top::-webkit-scrollbar {
      height: 16px;
    }

    .scroll-top::after {
      content: '';
      display: block;
      height: 1px;
    }

    .table-responsive {
      overflow-x: auto;
    }

    /* Optional für gleichmäßiges Scrollverhalten */
    .scroll-top, .table-responsive {
      scrollbar-width: thin;
      white-space: nowrap;
    }

#overlay {
  position: fixed; inset: 0;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  background: rgba(15,15,18,.75);
  backdrop-filter: blur(8px);
  z-index: 9999; color: #eaeaea; font: 500 16px/1.4 system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}

.bar-wrap {
  width: min(420px, 80vw); height: 8px; border-radius: 999px;
  background: rgba(255,255,255,.12); overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
  margin-bottom: 14px;
}
.bar {
  width: 40%; height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(255,255,255,.2), rgba(255,255,255,.8), rgba(255,255,255,.2));
  animation: slide 1.2s infinite ease-in-out, shimmer 1.2s infinite linear;
}

@keyframes slide {
  0% { transform: translateX(-120%); }
  50% { transform: translateX(10%); }
  100% { transform: translateX(120%); }
}
@keyframes shimmer {
  0% { filter: brightness(1); } 
  50% { filter: brightness(1.35); }
  100% { filter: brightness(1); }
}

#overlay p { opacity: .9; letter-spacing: .2px; }

/* Container erlaubt Umbrüche */
.bootstrap-select .filter-option-inner-inner {
  white-space: pre-line !important;
}

/* Nach jedem Komma -> Zeilenumbruch erzwingen */
.bootstrap-select .filter-option-inner-inner::first-line {
  display: block;
}
.bootstrap-select .filter-option-inner-inner {
  word-break: break-word;
}

.bg-half {
    background: linear-gradient(to right, transparent 50%, #f8f9fa 50%);
}