/**
 * Booking / Terminbuchung – zentrale Styles
 * Verwendet CSS-Variablen aus style.css (--color-primary, --color-footer-bg, etc.)
 */

/* ============================================
   Info-Box (Footer-Farben für Hinweise)
   ============================================ */
.booking-info-box {
    background-color: var(--color-footer-bg);
    color: var(--color-footer-text);
}
.booking-info-box h5,
.booking-info-box p,
.booking-info-box ol,
.booking-info-box li,
.booking-info-box small {
    color: var(--color-footer-text);
}
.booking-info-box a {
    color: var(--color-footer-text) !important;
    text-decoration: underline;
}

/* ============================================
   Card-Header (Primärfarbe)
   ============================================ */
.booking-card-header-primary {
    background-color: var(--color-primary) !important;
    color: #fff !important;
    border: 0;
}
.booking-card-header-primary h5,
.booking-card-header-primary .card-title {
    color: #fff !important;
}

/* ============================================
   Card-Header (Footer-Farben)
   ============================================ */
.booking-card-header-footer {
    background-color: var(--color-footer-bg) !important;
    color: var(--color-footer-text) !important;
    border: 0;
}
.booking-card-header-footer h5,
.booking-card-header-footer .card-title {
    color: var(--color-footer-text) !important;
}

/* ============================================
   Termin-Karte (volle Karte mit Primärfarbe)
   ============================================ */
.booking-term-card {
    background-color: var(--color-primary);
    color: #fff;
    border: 0;
}
.booking-term-card h5 {
    color: #fff !important;
}
.booking-term-card .badge {
    background-color: rgba(255, 255, 255, 0.3);
    color: #fff;
}

/* ============================================
   Appointment-Liste Header
   ============================================ */
.booking-appointment-list-header {
    background-color: var(--color-primary);
    color: #fff;
}
.booking-appointment-list-header h5 {
    color: #fff !important;
}


/* ============================================
   Sidebar-Cards: Textfarbe explizit
   ============================================ */
.booking-card-text {
    color: var(--color-text) !important;
}
.booking-card-body,
.booking-card-body ul {
    color: var(--color-text) !important;
}

/* ============================================
   Button Primary (explizit für Buchungsseiten)
   ============================================ */
.booking-btn-primary {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

/* ============================================
   Icons
   ============================================ */
.booking-icon-lg {
    font-size: 4rem;
}
.booking-icon-xl {
    font-size: 5rem;
}

/* ============================================
   Meine Termine – Layout
   ============================================ */
.booking-main-col {
    overflow-wrap: break-word;
}

/* ============================================
   Datumsauswahl (Flatpickr)
   ============================================ */
.booking-date-input {
    font-size: 1.25rem !important;
    padding: 0.75rem 1rem !important;
}
.flatpickr-calendar {
    font-size: 16px !important;
}
.flatpickr-day {
    font-size: 1rem !important;
    min-height: 2.5rem !important;
    line-height: 2.5rem !important;
}
.flatpickr-months .flatpickr-month {
    height: 3rem !important;
}
.flatpickr-current-month {
    font-size: 1.1rem !important;
    padding-top: 0.5rem !important;
}
.flatpickr-weekdays {
    font-size: 0.95rem !important;
}
.flatpickr-day.flatpickr-disabled {
    color: #ccc !important;
    cursor: not-allowed !important;
}

/* ============================================
   Booking-Response (Logo)
   ============================================ */
.booking-logo-img {
    max-height: 64px;
}