/* CSS Document */
@charset "utf-8";
body {
  font-family: "Roboto", sans-serif !important;
  padding: 10px;
  color: var(--Gold);
}
/* Richtig (Flexibel und zentriert) */
.content-area {
  width: 100%;
  max-width: 1200px; /* Optional: Begrenzung für sehr große Monitore */
  margin: 0 auto; /* Zentriert den gesamten Hauptbereich */
}
.sub-content {
  width: 100%;
}
.loading {
  opacity: 0.5;
  pointer-events: none;
}
.moorschanke-button {
  font-family: 'Inter', cursive;
  font-size: 16px;
  background-color: var(--Gold);
  color: #000000;
  border: 2px solid var(--Gold2);
  border-radius: 50px;
  padding: 10px 20px;
  cursor: pointer;
  transition: all 0.3s ease;
}
.moorschanke-button:hover {
  background-color: var(--Gold2);
  color: #000000;
  border: 2px solid var(--Gold);
}
.moorschanke-button-active {
  font-family: 'Inter', cursive;
  font-size: 16px;
  background-color: var(--Gold2);
  color: var(--Gold);
  border: 2px solid var(--Green);
  border-radius: 50px;
  padding: 10px 20px;
  cursor: pointer;
  transition: all 0.3s ease;
}
hr {
  color: var(--Gold);
}
.IsOpenText {
  color: var(--Green);
}
.IsNotOpenText {
  color: var(--Red);
}
.ContainerDrinksTab {
  width: 100%;
}
.ContainerDrinksTab thead th {
  border-bottom: medium double var(--Gold);
  font-size: 1.2rem;
  font-variant: small-caps;
}
.ContainerDrinksTab tbody tr:first-child td {
  padding-top: 2px;
}
.ContainerDrinksTab tbody tr td {
  font-size: 0.8rem;
}
.ContainerDrinksVol {
  border-bottom: 1px dotted var(--Gold-Matt);
  text-align: center;
}
.ContainerDrinksArticle {
  border-bottom: 1px dotted var(--Gold-Matt);
  text-align: center;
}
.ContainerDrinksArticle td:first-child {
  text-align: left;
}
footer {
  padding-top: 10px !important;
  clear: both;
  text-align: center !important;
  vertical-align: middle !important;
}
.SpanFooter {
  cursor: pointer !important;
  display: inline-block;
  font-size: 0.8em;
  padding-right: 5px;
  color: var(--Gold);
  text-decoration: none;
}
.border-dotted {
  border-bottom: 2px dotted #ccc !important;
  height: 10px;
  margin-top: -8px;
  opacity: 0.5;
}
.ContainerHinweis {
  text-align: center !important;
  font-size: 0.8rem !important;
}
/* Hervorhebung für das gewählte Datum */
.highlight-selected-date {
  background-color: rgba(13, 110, 253, 0.08); /* Sehr helles Blau (Bootstrap Primary-Ton) */
  border-left: 4px solid #0d6efd; /* Akzent-Linie links */
  padding-left: 10px; /* Etwas Abstand zur Linie */
  padding-right: 10px;
  border-radius: 4px; /* Leicht abgerundete Ecken */
  transition: all 0.3s ease; /* Sanfter Übergang beim Laden */
}
/* Optional: Falls der Text auch eine andere Farbe bekommen soll */
.highlight-selected-date .OpenDatum {
  color: #0d6efd;
}
/* Stil für die IsOpen/IsNotOpen Texte innerhalb der Markierung */
.highlight-selected-date .IsOpenText, .highlight-selected-date .IsNotOpenText {
  font-weight: 500;
}
/* Optional: Mehr Platz auf dem Desktop */
@media (min-width: 768px) {
  body {
    padding: 30px;
  }
  .moorschanke-button {
    font-size: 12px;
  }
  .moorschanke-button-active {
    font-size: 12px;
  }
}
/* Zentriert die Buttons im Hamburger-Menü auf dem Handy */
@media (max-width: 991px) {
  .navbar-collapse {
    text-align: center;
    padding-bottom: 20px;
  }
  .navbar-nav {
    align-items: center; /* Zentriert die Buttons horizontal */
  }
  .nav-btn {
    width: 80%; /* Macht die Buttons auf dem Handy breiter und leichter klickbar */
    max-width: 300px;
  }
}