/* ============================================================
   LISUM LibraBooking – Brandenburg Styleguide v1.6
   Primärfarbe: #C13B33 | Schrift: Open Sans
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap');

/* =============================================================
   1. FARB-VARIABLEN
   ============================================================= */

:root,
[data-bs-theme="dark_red"],
[data-bs-theme] {
    --primary:                #C13B33;
    --primary-hover:          #9e2e27;
    --primary-disabled:       #d97b75;
    --text-color-btn:         #ffffff;
    --reservable:             #ffffff;
    --reserved:               #C13B33;
    --reservedMine:           #1565C0;
    --reservedParticipating:  #6A1B9A;
    --reservedPending:        #FFF3CD;
    --unreservable:           #BDBDBD;
    --pasttime:               #f0f0f0;
    --hiliteReservation:      #2E7D32;
    --color-lines:            #dddddd;
}

/* =============================================================
   2. SCHRIFT
   ============================================================= */

body {
    font-family: 'Open Sans', Helvetica, Arial, sans-serif !important;
}

/* =============================================================
   3. NAVBAR
   ============================================================= */

.navbar.bg-light {
    --bs-bg-opacity: 1;
    background-color: var(--primary) !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.25) !important;
}

.navbar.bg-light .navbar-brand,
.navbar.bg-light .navbar-brand:hover,
.navbar.bg-light .nav-link,
.navbar.bg-light .nav-link.link-primary,
.navbar.bg-light .nav-link.dropdown-toggle {
    color: #ffffff !important;
}

.navbar.bg-light .nav-link:hover,
.navbar.bg-light .nav-link:focus,
.navbar.bg-light .nav-link.show {
    color: #ffffff !important;
    background-color: rgba(0,0,0,0.15);
    border-radius: var(--bs-border-radius);
}

.navbar.bg-light .navbar-toggler {
    border-color: rgba(255,255,255,0.4);
}

.navbar.bg-light .navbar-toggler-icon {
    filter: brightness(0) invert(1);
}

/* =============================================================
   4. LOGO-BEREICH
   ============================================================= */

body > div.d-flex.align-items-center,
.d-flex.align-items-center.gap-2.m-2 {
    background-color: #ffffff;
    padding: 12px 24px !important;
    margin: 0 !important;
    border-bottom: 3px solid var(--primary);
}

img.logo {
    max-height: 70px !important;
    width: auto;
}

.d-flex.align-items-center.gap-2 .link-primary,
.d-flex.align-items-center.gap-2 h5 a {
    color: #161616 !important;
    text-decoration: none;
}

.d-flex.align-items-center.gap-2 .link-primary:hover {
    color: var(--primary) !important;
    text-decoration: underline;
}

.d-flex.align-items-center.gap-2 .border-start {
    border-color: #dddddd !important;
}

/* =============================================================
   5. DASHBOARD AKKORDEON
   ============================================================= */

.accordion-item .accordion-header.dashboardHeader {
    background-color: var(--primary) !important;
}

.accordion-item .accordion-header.dashboardHeader > .accordion-button,
.accordion-item .accordion-header.dashboardHeader > .accordion-button.collapsed,
.accordion-item .accordion-header.dashboardHeader > button {
    background-color: var(--primary) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    box-shadow: none !important;
}

.accordion-item .accordion-header.dashboardHeader > .accordion-button:hover {
    background-color: var(--primary-hover) !important;
}

.accordion-item .accordion-header.dashboardHeader > .accordion-button::after {
    filter: brightness(0) invert(1);
}

.accordion-item .accordion-header.dashboardHeader .link-primary {
    color: #ffffff !important;
}

/* =============================================================
   6. SCHEDULE SLOT-FARBEN
   ============================================================= */

td.reservable,
div.reservable {
    background-color: #e8f5e9 !important;
    color: #1b5e20 !important;
}

div.reservable:hover,
.reservable.hilite,
#reservations .ui-selecting {
    background-color: #2E7D32 !important;
    color: #ffffff !important;
    cursor: pointer;
}

.reservable.clicked,
#reservations .ui-selected {
    background-color: #1b5e20 !important;
    color: #ffffff !important;
}

.event,
.reserved {
    background-color: var(--primary) !important;
    color: #ffffff !important;
    border-color: var(--primary-hover) !important;
}

.reserved.mine {
    background-color: #1565C0 !important;
    color: #ffffff !important;
    border-color: #0D47A1 !important;
}

.reserved.participating {
    background-color: #6A1B9A !important;
    color: #ffffff !important;
    border-color: #4A148C !important;
}

.reserved.pending {
    background-color: #FFF8E1 !important;
    color: #E65100 !important;
    border-color: #FFB300 !important;
}

.unreservable,
.buffer {
    background-color: #BDBDBD !important;
    color: #424242 !important;
}

.pasttime {
    background-color: #f5f5f5 !important;
}

.past { opacity: 0.6; }

.restricted {
    background: repeating-linear-gradient(
        45deg, transparent, transparent 8px,
        #e0e0e0 8px, #e0e0e0 16px
    ) !important;
    color: #333333;
}

table.reservations td.resourcename {
    background-color: #fafafa;
    color: #161616;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 6px;
    border-right: 2px solid #eeeeee;
}

table.reservations td.resourcename a {
    color: var(--primary);
    font-weight: 600;
    text-decoration: none;
}

table.reservations td.resdate {
    background-color: var(--primary) !important;
    color: #ffffff !important;
    font-size: 11px;
    font-weight: 600;
}

table.reservations tr.today td.resdate,
table.reservations td.today {
    background-color: var(--primary-hover) !important;
    color: #ffffff !important;
}

table.reservations td {
    border-color: #dddddd !important;
}

.reservations-left-header {
    background-color: var(--primary);
    color: #ffffff;
    font-weight: 600;
    font-size: 12px;
    padding: 6px 10px;
}

#loading-schedule {
    background-color: rgba(193,59,51,0.85) !important;
    border-color: rgba(158,46,39,0.85) !important;
    color: #ffffff !important;
}

/* =============================================================
   7. FULLCALENDAR – Buttons flach, klarer Kontrast
   Nicht-aktiv: weiß mit rotem Rand
   Aktiv + Heute: rot ausgefüllt
   ============================================================= */

/* Alle Pseudo-Elemente und Gradienten deaktivieren */
.fc .fc-button::before,
.fc .fc-button::after,
.fc .fc-button-primary::before,
.fc .fc-button-primary::after {
    display: none !important;
    background: none !important;
}

/* Nicht-aktive Buttons: weiß mit rotem Rand */
.fc .fc-button-primary {
    background-color: #ffffff !important;
    background-image: none !important;
    border: 1px solid var(--primary) !important;
    color: var(--primary) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-weight: 600;
    font-size: 12px;
}

/* Hover auf nicht-aktiven Buttons */
.fc .fc-button-primary:hover {
    background-color: #fdf1f0 !important;
    background-image: none !important;
    border-color: var(--primary-hover) !important;
    color: var(--primary-hover) !important;
}

/* Aktiver Button: rot ausgefüllt */
.fc .fc-button-primary.fc-button-active,
.fc .fc-button-primary:not(:disabled):active {
    background-color: var(--primary) !important;
    background-image: none !important;
    border-color: var(--primary-hover) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

/* Heute-Button: immer rot */
.fc .fc-today-button:not(:disabled) {
    background-color: var(--primary) !important;
    background-image: none !important;
    border-color: var(--primary-hover) !important;
    color: #ffffff !important;
}

.fc .fc-today-button:not(:disabled):hover {
    background-color: var(--primary-hover) !important;
}

/* Disabled */
.fc .fc-button-primary:disabled {
    background-color: #eeeeee !important;
    background-image: none !important;
    border-color: #cccccc !important;
    color: #999999 !important;
}

/* =============================================================
   8. FOOTER – bg-light, weiß, Links rot
   ============================================================= */

footer.bg-light {
    background-color: #ffffff !important;
    border-top: 3px solid var(--primary) !important;
    padding: 12px 0;
}

footer.bg-light a,
footer.bg-light a.link-primary,
footer.bg-light a:link,
footer.bg-light a:visited {
    color: #C13B33 !important;
    text-decoration: none;
}

footer.bg-light a:hover {
    color: #9e2e27 !important;
    text-decoration: underline;
}

/* =============================================================
   9. TABELLEN
   ============================================================= */

.table thead th,
.table thead td {
    background-color: var(--primary);
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    border-color: var(--primary-hover);
}

/* =============================================================
   10. FLATPICKR
   ============================================================= */

.flatpickr-months .flatpickr-month,
.flatpickr-weekdays,
span.flatpickr-weekday {
    background: var(--primary) !important;
    color: #ffffff !important;
}

.flatpickr-day.selected,
.flatpickr-day.selected:hover {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #ffffff !important;
}

.flatpickr-day.today {
    border-color: var(--primary) !important;
}

/* =============================================================
   11. SCROLLBAR
   ============================================================= */

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { background: #cccccc; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #aaaaaa; }
