/* Large Calendar Widget - [pf_booking_form] */

/* Booking Form Container - Full Experience */
.pf-booking-container {
    max-width: 1200px;
    margin: 1.5rem auto;
    font-family: Arial, Helvetica, sans-serif;
}

/* Large Calendar Section */
.pf-booking-calendar {
    margin-bottom: 2rem;
    text-align: center;
    height: auto; /* Let content determine height */
    min-height: unset; /* Remove any height restrictions */
}

.pf-booking-calendar h3 {
    color: #333;
    font-size: 1.75rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.pf-booking-calendar p {
    color: #666;
    font-size: 1rem;
    margin-bottom: 1.5rem;
}

/* Calendar Navigation Buttons - Modern Design */
.pf-calendar-navigation {
    position: relative;
    margin: 0 auto 2rem;
    max-width: 320px; /* Begrenzt die Container-Breite */
    height: 40px; /* Fixed height for absolute positioning */
}

.pf-nav-btn {
    position: absolute !important;
    top: 0;
    width: 40px !important;
    height: 40px !important;
    border: 1px solid #d4a574 !important;
    border-radius: 6px !important;
    background: white !important;
    color: #b8956a !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0 !important; /* Versteckt Text */
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.pf-nav-btn.prev {
    left: -50px; /* Links außerhalb */
}

.pf-nav-btn.next {
    right: -50px; /* Rechts außerhalb */
}

/* Moderne CSS-Icons */
.pf-nav-btn::after {
    content: '' !important;
    width: 6px !important;
    height: 6px !important;
    border: 2px solid currentColor !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
    transform: rotate(-45deg) !important;
    display: block !important;
}

.pf-nav-btn.next::after {
    transform: rotate(135deg) !important;
}

.pf-nav-btn:hover {
    background: #b8956a !important;
    color: white !important;
    transform: scale(1.05) !important;
    box-shadow: 0 2px 8px rgba(184, 149, 106, 0.3) !important;
}

.pf-nav-btn:disabled {
    background: #f5f5f5 !important;
    color: #ccc !important;
    cursor: not-allowed !important;
    transform: none !important;
    box-shadow: none !important;
}

.pf-calendar-widget {
    text-align: center;
    width: auto; /* Container adapts to calendar width */
    display: inline-block; /* Enable auto-width behavior */
    height: auto; /* Auto height for natural calendar expansion */
    min-height: unset; /* Remove height constraints */
}

/* Inline Calendar Specific Styles */
.pf-inline-calendar {
    width: 100%;
    max-width: 100%;
    height: auto; /* Allow natural height expansion */
    min-height: unset; /* Remove height constraints */
}

/* Make calendar months expand to full width */
.pf-inline-calendar .flatpickr-months {
    width: 100%;
}

.pf-inline-calendar .flatpickr-innerContainer {
    width: 100%;
}

.pf-inline-calendar .flatpickr-rContainer {
    width: 100%;
}

/* Ensure days have adequate spacing for full width */
.pf-inline-calendar .flatpickr-days {
    width: 100%;
}

.pf-inline-calendar .dayContainer {
    width: 100%;
    max-width: 100%;
}

.pf-inline-calendar .flatpickr-day {
    flex: 1;
    max-width: none;
}

/* Selected Dates Display */
.pf-selected-dates {
    background: #f8f6f3;
    border: 1px solid #d4a574;
    padding: 1.5rem;
    margin: 1.5rem 0;
    text-align: center;
}

.pf-date-selection {
    display: flex;
    justify-content: center;
    gap: 2rem;
    flex-wrap: wrap;
}

.pf-date-item {
    font-size: 1rem;
    color: #333;
}

.pf-date-item strong {
    font-weight: 500;
    color: #b8956a;
}

/* Live Price Display */
.pf-live-price {
    margin: 1.5rem 0;
    text-align: center;
}

.pf-price-loading {
    background: #f9f9f9;
    border: 1px solid #e5e7eb;
    padding: 1rem;
    color: #666;
    font-style: italic;
}

.pf-price-success {
    background: #ecfeff;
    border: 1px solid #06b6d4;
    padding: 1.5rem;
    color: #0e7490;
}

.pf-price-header {
    font-size: 1rem;
    margin-bottom: 0.5rem;
}

.pf-price-total {
    font-size: 2rem;
    font-weight: 500;
    color: #b8956a;
    margin: 0.5rem 0;
}

.pf-price-details {
    font-size: 0.9rem;
    color: #666;
}

.pf-price-error {
    background: #fee2e2;
    border: 1px solid #fecaca;
    padding: 1rem;
    color: #dc2626;
}

/* Price Breakdown Styling */

/* Toggle Button */
.pf-price-breakdown-toggle {
    margin-top: 1rem;
    text-align: center;
}

.pf-toggle-btn {
    background: transparent;
    border: 1px solid #b8956a;
    color: #b8956a;
    padding: 8px 16px;
    font-size: 0.9rem;
    cursor: pointer;
    border-radius: 4px;
    font-family: Arial, Helvetica, sans-serif;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.pf-toggle-btn:hover {
    background: #b8956a;
    color: white;
}

.pf-toggle-icon {
    transition: transform 0.3s ease;
    font-size: 0.8rem;
}

.pf-toggle-icon.pf-rotated {
    transform: rotate(180deg);
}

/* Breakdown Container */
.pf-price-breakdown {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
    margin-top: 0.5rem;
}

.pf-price-breakdown.pf-expanded {
    max-height: 500px; /* Generous max-height for animation */
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

/* Breakdown Header */
.pf-breakdown-header {
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    color: #333 !important;
    margin-bottom: 0.75rem !important;
    text-align: left !important;
    display: block !important;
    visibility: visible !important;
}

/* Breakdown Sections */
.pf-breakdown-section {
    margin-bottom: 0.75rem;
}

/* Breakdown Lines */
.pf-breakdown-line {
    font-family: Arial, Helvetica, sans-serif !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    padding: 0.4rem 0 !important;
    font-size: 0.9rem !important;
    border-bottom: 1px solid #f0f0f0 !important;
    visibility: visible !important;
}

.pf-breakdown-line:last-child {
    border-bottom: none;
}

.pf-breakdown-desc {
    font-family: Arial, Helvetica, sans-serif !important;
    flex: 1 !important;
    color: #555 !important;
    line-height: 1.4 !important;
    display: inline !important;
    visibility: visible !important;
}

.pf-breakdown-dates {
    font-family: Arial, Helvetica, sans-serif !important;
    display: block !important;
    color: #888 !important;
    font-size: 0.8rem !important;
    margin-top: 0.2rem !important;
    font-style: italic !important;
    visibility: visible !important;
}

.pf-breakdown-amount {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 500 !important;
    color: #333 !important;
    white-space: nowrap !important;
    margin-left: 1rem !important;
    display: inline !important;
    visibility: visible !important;
}

/* Subtotal */
.pf-breakdown-subtotal {
    font-family: Arial, Helvetica, sans-serif !important;
    display: flex !important;
    justify-content: space-between !important;
    padding: 0.6rem 0 !important;
    font-size: 0.9rem !important;
    font-weight: 500 !important;
    border-top: 1px solid #d4a574 !important;
    border-bottom: 1px solid #d4a574 !important;
    visibility: visible !important;
    margin: 0.5rem 0;
    color: #666;
}

/* Total */
.pf-breakdown-total {
    font-family: Arial, Helvetica, sans-serif !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 0.75rem 0 !important;
    font-size: 1rem !important;
    border-top: 2px solid #b8956a !important;
    margin-top: 0.75rem !important;
    color: #b8956a !important;
    visibility: visible !important;
}

/* Error State */
.pf-breakdown-error {
    color: #dc2626;
    font-style: italic;
    font-size: 0.9rem;
    text-align: center;
    padding: 1rem 0;
}

/* Saturday-Only Booking: Simple Saturday Highlighting */
.pf-preferred-saturday {
    border: 2px solid #d4a574 !important;
    border-radius: 4px !important;
    position: relative;
    font-weight: 500 !important;
    background: rgba(212, 165, 116, 0.08) !important;
}

