/* Frontend styling for WooCommerce Rental Booking */
.wc-rental-booking-fields {
    margin: 2em 0;
    padding: 1.5em;
    background-color: #f9f9f9; /* Slightly lighter background */
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    clear: both; /* Ensure it clears floats */
}

.wc-rental-booking-fields h3 {
    margin-top: 0;
    margin-bottom: 1em; /* More space after heading */
    color: #333;
    font-size: 1.2em; /* Slightly larger heading */
}

/* Styling for form rows if using them */
.wc-rental-booking-fields .form-row {
    padding: 3px; /* Override default WC form-row padding if too much */
    margin: 0 0 10px; /* Space below rows */
}
.wc-rental-booking-fields .form-row-first {
    clear: left;
}
.wc-rental-booking-fields .form-row-last {
    /* Styles for last item in a row if needed */
}
.wc-rental-booking-fields .clear {
    clear: both;
}


.wc-rental-booking-fields .wc-rental-date-picker input[type="text"], 
.wc-rental-booking-fields .wc-rental-time-slot-field select {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc; /* Slightly darker border */
    border-radius: 4px;
    box-sizing: border-box; /* Include padding and border in the element's total width and height */
    margin-bottom: 10px; /* Space below individual fields */
}
/* Target specific input fields generated by woocommerce_form_field */
.wc-rental-booking-fields input.rental-date-input,
.wc-rental-booking-fields select.rental-time-slot-select {
     /* Styles already applied above, this is just for specificity if needed */
}


.wc-rental-price-notice {
    margin: 1em 0;
    padding: 0.75em 1em;
    background-color: #e9f7ef;
    border-left: 4px solid #2ecc71; /* Green accent */
    color: #1a532e; /* Darker green text for better contrast */
    font-size: 0.95em;
}
.wc-rental-price-notice .rental-price-unit {
    font-style: italic;
}


/* jQuery UI Datepicker Customizations */
.ui-datepicker {
    background: #ffffff;
    border: 1px solid #c8c8c8;
    padding: 0; /* Remove default padding if header/content handles it */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    z-index: 100 !important; /* Ensure it's on top */
}

.ui-datepicker-header {
    background-color: #0073aa; /* Default blue, overridden by PHP dynamic style */
    color: #ffffff;
    border-bottom: 1px solid #005a87; /* Slightly darker border for header */
    padding: 8px 0;
    font-weight: bold;
}
.ui-datepicker-prev, .ui-datepicker-next {
    cursor: pointer;
    color: #ffffff !important; /* Ensure prev/next icons are visible */
}
.ui-datepicker-prev:hover, .ui-datepicker-next:hover {
    background-color: transparent !important; /* Prevent hover background if not desired */
    border: none !important;
    opacity: 0.8;
}
.ui-datepicker-title {
    line-height: 1.8em; /* Adjust line height for title */
}

/* Active (selected) date - will be overridden by PHP dynamic color for product-specific color */
.ui-datepicker td .ui-state-active,
.ui-datepicker td .ui-state-active.ui-state-hover {
    background: #0073aa !important; /* Fallback if dynamic style fails */
    border-color: #005a87 !important; /* Fallback */
    color: #ffffff !important;
    opacity: 1;
}

/* Disabled dates (non-operating, past, etc.) */
.ui-datepicker td.ui-state-disabled.wc-rental-disabled-date .ui-state-default {
    background: #f0f0f0 !important;
    color: #ababab !important;
    opacity: 0.7;
    cursor: not-allowed;
}
/* Holidays marked as closed */
.ui-datepicker td.wc-rental-holiday-closed .ui-state-default {
    background: #fee !important; /* Light red for closed holidays */
    color: #c00 !important;
    text-decoration: line-through;
}
/* Holidays with special hours (just an indicator) */
.ui-datepicker td.wc-rental-holiday-special .ui-state-default {
    background: #fff0e0 !important; /* Light orange for special holidays */
    color: #a0522d !important; /* Sienna */
}

.ui-datepicker td .ui-state-default {
    text-align: center;
}
.ui-datepicker td {
    padding: 1px; /* Reset padding if needed */
}