html,
body {
    height: 100%;
    margin: 0;
    padding: 0;
}

small {
    font-size: 0.8em;
    color: gray;
}

.button.scrolled {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
}

#hamburger-background.scrolled-background {
    height: 72px;
}

#calendarTable th,
#calendarTable td,
#bookingTable th,
#bookingTable td {
    border: 1px solid rgba(15, 23, 42, 0.18);
    text-align: center;
    padding: 10px 8px;
}

#calendarTable td {
    cursor: pointer;
    transition: background-color 0.2s ease;
}

#calendarTable td:hover {
    background-color: rgba(148, 163, 184, 0.18);
}

.today {
    background-color: #38bdf8 !important;
    color: #fff !important;
    font-weight: 700;
}

.selected {
    outline: 2px solid #124554;
    outline-offset: -2px;
}

.disabled {
    color: #cbd5e1 !important;
    cursor: not-allowed !important;
    background-color: rgba(241, 245, 249, 0.7);
}

.booked {
    font-weight: 700;
    cursor: pointer;
    border: none !important;
}

.booked-first {
    border-top: 2px solid #887874 !important;
}

.booked-last {
    border-bottom: 2px solid #887874 !important;
}

.booked-by-user {
    box-shadow: inset 0 0 0 2px #887874;
}

.booked-rangliste {
    background-color: #6b7280 !important;
    color: #fff !important;
    border-left: 2px solid #887874 !important;
    border-right: 2px solid #887874 !important;
}

.booked-punktspiel {
    background-color: #16a34a !important;
    color: #fff !important;
    border-left: 2px solid #887874 !important;
    border-right: 2px solid #887874 !important;
}

.booked-turnier {
    background-color: #fde047 !important;
    color: #111827 !important;
    border-left: 2px solid #887874 !important;
    border-right: 2px solid #887874 !important;
}

.booked-training {
    background-color: #dc2626 !important;
    color: #fff !important;
    border-left: 2px solid #887874 !important;
    border-right: 2px solid #887874 !important;
}

.booked-challenge {
    background-color: #0f766e !important;
    color: #fff !important;
    font-weight: 700;
}

@media screen and (max-width: 1000px) {
    .booked {
        cursor: pointer;
    }
}