body {
    /* Farbverlauf von dunkelgrau zu schwarz */
    background: linear-gradient(180deg, #2b2b2b, #000000);
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
    /* Stellt sicher, dass der Hintergrund den gesamten Bildschirm ausfüllt */
    background-repeat: no-repeat;
    background-attachment: fixed;
    /* Skalierung für Mobilgeräte */
    background-size: cover;
    /* Verbessert die Darstellung auf Mobilgeräten */
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
.menu-item {
    padding: 0.5em;
    background-color: rgb(230, 230, 230);
}
.product-label {
    font-size: 1.2em;
    font-weight: 550;
}
.product-price {
    font-size: 1.2em;
    font-weight: 550;
}
.product-left-info-label {
    font-size: 0.75em;
}
.product-right-info-label {
    font-size: 0.75em;
    font-style: italic;
}
.header-container-drinks {
    padding: 1em;
    background-color: rgb(51, 82, 85);
    text-align: center;
    color: rgb(203 213 225 / 1);
}
.header-container-shisha {
    padding: 1em;
    background-color: rgb(85, 61, 51);
    text-align: center;
    color: rgb(203 213 225 / 1);
}
.header-container-essen {
    padding: 1em;
    background-color: rgb(51, 85, 63);
    text-align: center;
    color: rgb(203 213 225 / 1);
}
.header-container h2 {
    font-size: 1.4em;
    font-weight: 600;
}
.menu-font {
    font-size: 1.2em;
    font-weight: 600;
}
.menu-item {
    border-bottom: 1px solid;
    border-color: #acacac;
    background-color: rgb(203 213 225 / 1);
    /*background-color: rgb(148 163 184 / 1);*/
}
#toggleButtonSoftdrinks.rotate-down svg {
   transform: rotate(180deg);
}
#toggleButtonHotDrinks.rotate-down svg {
   transform: rotate(180deg);
}
#toggleButtonTee.rotate-down svg {
   transform: rotate(180deg);
}
#toggleButtonCocktails.rotate-down svg {
   transform: rotate(180deg);
}
#toggleButtonSnacks.rotate-down svg {
   transform: rotate(180deg);
}
#toggleButtonShisha.rotate-down svg {
   transform: rotate(180deg);
}
.border-gradient {
    position: relative;
    border: 2px solid transparent;
    border-image: linear-gradient(to bottom right, pink, purple) 1;
}
.gradient-text {
    background-image: linear-gradient(to right, pink, purple);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}