/**
 * Floating Booking Section Styles
 *
 * @package TourWidely
 */

.tourwidely-floating-booking {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--tw-color-background);
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
    z-index: 9999;
    transform: translateY(100%);
    transition: transform 0.3s ease-in-out;
}

.tourwidely-floating-booking.is-visible {
    transform: translateY(0);
}

.tourwidely-floating-booking-content {
    max-width: var(--tw-container-width);
    margin: 0 auto;
    padding: var(--tw-spacing-md) var(--tw-spacing-xl);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--tw-spacing-xl);
}

.tourwidely-floating-booking-info {
    flex: 1;
}

.tourwidely-floating-booking-title {
    margin: 0;
    font-size: var(--tw-font-size-large);
    font-weight: var(--tw-font-weight-bold);
    color: var(--tw-color-text);
    font-family: var(--tw-font-family);
}

/* New styles for booking details */
.tourwidely-floating-booking-details {
    margin-top: 10px;
    display: block; /* Ensure it's visible by default */
}

.tourwidely-floating-booking-date,
.tourwidely-floating-booking-travelers {
    margin: 0;
    font-size: var(--tw-font-size-small);
    color: var(--tw-color-text-light);
    font-family: var(--tw-font-family);
    line-height: 1.4;
}

/* Package details styles */
.tourwidely-floating-booking-package {
    margin-top: var(--tw-spacing-xs);
    font-size: 14px;
    margin: 5px 0;
    color: var(--tw-color-text);
    font-weight: var(--tw-font-weight-medium);
}

/* Initial pricing display styles */
.tourwidely-floating-booking-pricing {
    margin-top: var(--tw-spacing-xs);
}

.tourwidely-floating-booking-pricing .pricing-display {
    font-size: var(--tw-font-size-small);
    color: var(--tw-color-primary);
    font-weight: var(--tw-font-weight-medium);
}

/* Live total price display styles */
.tourwidely-floating-booking-total-price {
    margin-top: var(--tw-spacing-xs);
    font-size: var(--tw-font-size-small);
    color: var(--tw-color-success);
    font-weight: var(--tw-font-weight-bold);
}

.tourwidely-floating-booking-pickup {
    font-size: var(--tw-font-size-xs);
    color: var(--tw-color-text-light);
    margin-top: 2px;
}

.tourwidely-floating-booking-action {
    flex-shrink: 0;
}

.tourwidely-floating-booking-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--tw-spacing-md) var(--tw-spacing-xl);
    background: var(--tw-color-primary);
    color: var(--tw-color-white);
    border: none;
    border-radius: var(--tw-border-radius-md);
    font-size: var(--tw-font-size-base);
    font-weight: var(--tw-font-weight-medium);
    font-family: var(--tw-font-family);
    cursor: pointer;
    transition: background-color 0.2s ease-in-out;
    white-space: nowrap;
}

.tourwidely-floating-booking-btn:hover {
    background: var(--tw-color-primary-hover);
}

/* Book Now button specific styles */
.tourwidely-book-now-btn {
    background: var(--tw-color-success);
}

.tourwidely-book-now-btn:hover {
    background: var(--tw-color-primary-hover);
}

/* Responsive Styles */
@media (max-width: 768px) {
    .tourwidely-floating-booking-content {
        padding: var(--tw-spacing-sm) var(--tw-spacing-md);
        gap: var(--tw-spacing-md);
    }

    .tourwidely-floating-booking-title {
        font-size: var(--tw-font-size-base);
    }

    .tourwidely-floating-booking-btn {
        padding: var(--tw-spacing-sm) var(--tw-spacing-lg);
        font-size: var(--tw-font-size-small);
    }
    
    .tourwidely-floating-booking-details {
        margin-top: var(--tw-spacing-xxs);
    }
    
    .tourwidely-floating-booking-date,
    .tourwidely-floating-booking-travelers {
        font-size: var(--tw-font-size-xs);
    }
    
    /* Package details responsive styles */
    .tourwidely-floating-booking-package {
        font-size: var(--tw-font-size-xs);
    }
    
    /* Pricing responsive styles */
    .tourwidely-floating-booking-pricing .pricing-display {
        font-size: var(--tw-font-size-xs);
    }
    
    .tourwidely-floating-booking-total-price {
        font-size: var(--tw-font-size-xs);
    }
    
    .tourwidely-floating-booking-pickup {
        display: none; /* Hide pickup time on mobile to save space */
    }
}