/* ==========================================================================
 * TBC Product Accordion — Frontend Styles
 * ========================================================================== */

/* ---- Accordion container ---- */
.lf-pa-accordion {
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: 100%;
}

/* ---- Individual item wrapper ---- */
.lf-pa-item {
	border-radius: 6px;
	overflow: hidden;
	transition:
		box-shadow var(--lf-pa-panel-duration, 350ms) cubic-bezier(0.4, 0, 0.2, 1),
		border-color var(--lf-pa-panel-duration, 350ms) ease;
}

/* ---- Title bar (summary) ---- */
.lf-pa-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 14px 20px;
	background-color: #202020;
	border: none;
	border-left: 4px solid #cba533;
	border-radius: 6px;
	cursor: pointer;
	outline: none;
	list-style: none;
	transition:
		background-color 0.2s ease,
		border-color 0.2s ease,
		border-radius var(--lf-pa-panel-duration, 350ms) cubic-bezier(0.4, 0, 0.2, 1);
}

.lf-pa-header .lf-pa-icon,
.lf-pa-header .lf-pa-title,
.lf-pa-header .lf-pa-subtitle,
.lf-pa-header .lf-pa-price,
.lf-pa-header .lf-pa-toggle {
	transition: color 0.2s ease;
}

.lf-pa-header .lf-pa-icon svg,
.lf-pa-header .lf-pa-toggle svg {
	transition: fill 0.2s ease;
}

.lf-pa-header::-webkit-details-marker {
	display: none;
}

.lf-pa-header:focus-visible {
	outline: 2px solid #cba533;
	outline-offset: 2px;
}

/* ---- Header — left side (icon + text) ---- */
.lf-pa-header__left {
	display: flex;
	align-items: center;
	gap: 0;
	pointer-events: none;
}

/* ---- Item icon ---- */
.lf-pa-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #cba533;
	font-size: 32px;
	margin-right: 16px;
	flex-shrink: 0;
}

.lf-pa-icon svg {
	width: 32px;
	height: 32px;
	fill: currentColor;
}

/* ---- Text block ---- */
.lf-pa-text {
	display: flex;
	flex-direction: column;
	text-align: left;
	min-width: 0;
}

/* ---- Price hidden (None): more room for heading + subheading ---- */
.lf-pa-accordion--no-price .lf-pa-header__left {
	flex: 1;
	min-width: 0;
}

.lf-pa-accordion--no-price .lf-pa-text {
	flex: 1;
	max-width: 100%;
}

.lf-pa-accordion--no-price .lf-pa-title,
.lf-pa-accordion--no-price .lf-pa-subtitle {
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: break-word;
}

.lf-pa-accordion--no-price .lf-pa-header__right {
	margin-left: 12px;
}

.lf-pa-accordion--no-price .lf-pa-price {
	display: none;
}

/* ---- Heading ---- */
.lf-pa-title {
	font-weight: 700;
	font-size: 18px;
	line-height: 1.3;
	color: #ffffff;
}

/* ---- Subheading ---- */
.lf-pa-subtitle {
	font-size: 14px;
	line-height: 1.4;
	color: #b0b0b0;
	margin-top: 2px;
}

/* ---- Header — right side (price + toggle) ---- */
.lf-pa-header__right {
	display: flex;
	align-items: center;
	gap: 8px;
	pointer-events: none;
	flex-shrink: 0;
	margin-left: 16px;
}

/* ---- Price ---- */
.lf-pa-price {
	font-weight: 700;
	font-size: 16px;
	color: #cba533;
	white-space: nowrap;
}

/* ---- Toggle icon ---- */
.lf-pa-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #ffffff;
	font-size: 16px;
	transition: transform 0.3s ease;
}

.lf-pa-toggle svg {
	width: 16px;
	height: 16px;
	fill: currentColor;
}

/* Show/hide toggle icons based on state */
.lf-pa-item .lf-pa-toggle--open {
	display: none;
}

.lf-pa-item .lf-pa-toggle--closed {
	display: inline-flex;
}

details.lf-pa-item[open] .lf-pa-toggle--open {
	display: inline-flex;
}

details.lf-pa-item[open] .lf-pa-toggle--closed {
	display: none;
}

/* Nested container (direct child of <details>, same as core Nested Accordion). Do not set display — Elementor owns flex/block on `.e-con`. */
details.lf-pa-item > .e-con {
	width: 100%;
	min-height: 0;
	overflow: hidden;
}

/*
 * Smooth panel height (Chrome 131+, Safari 17.4+, Firefox 131+).
 * `interpolate-size` + `::details-content` + `@starting-style` — see MDN ::details-content.
 * JS adds `.lf-pa-accordion--suppress-first-panel-transition` briefly so a default-open item
 * does not animate on first paint.
 */
.lf-pa-accordion details.lf-pa-item {
	interpolate-size: allow-keywords;
}

.lf-pa-accordion details.lf-pa-item::details-content {
	height: 0;
	overflow: clip;
	transition:
		height var(--lf-pa-panel-duration, 350ms) cubic-bezier(0.4, 0, 0.2, 1),
		content-visibility var(--lf-pa-panel-duration, 350ms) allow-discrete;
}

.lf-pa-accordion details.lf-pa-item[open]::details-content {
	height: auto;
}

@starting-style {
	.lf-pa-accordion details.lf-pa-item[open]::details-content {
		height: 0;
	}
}

.lf-pa-accordion details.lf-pa-item::details-content :where(.e-con) {
	min-height: 0;
}

.lf-pa-accordion--suppress-first-panel-transition details.lf-pa-item::details-content {
	transition: none !important;
}

@media (prefers-reduced-motion: reduce) {
	.lf-pa-accordion details.lf-pa-item::details-content {
		transition-duration: 0.001ms !important;
	}

	.lf-pa-accordion--suppress-first-panel-transition details.lf-pa-item::details-content {
		transition: none !important;
	}
}

/* ---- Open state ---- */
details.lf-pa-item[open] {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
}

details.lf-pa-item[open] .lf-pa-header {
	border-radius: 6px 6px 0 0;
}

/* ---- Responsive ---- */
@media (max-width: 767px) {
	.lf-pa-header {
		flex-wrap: wrap;
		gap: 8px;
	}

	.lf-pa-header__left {
		flex: 1;
		min-width: 0;
	}

	.lf-pa-header__right {
		margin-left: auto;
	}

	.lf-pa-title {
		font-size: 16px;
	}

	.lf-pa-subtitle {
		font-size: 13px;
	}
}

/* ---- WooCommerce add to cart inside accordion content ---- */
.lf-pa-accordion .add_to_cart_inline{
	border: 0 !important;
	padding:0 !important;
}
.lf-pa-accordion a.add_to_cart_button,.lf-pa-accordion button.add_to_cart_button,
.lf-pa-accordion button.single_add_to_cart_button {
	background-color: var(--e-global-color-primary);
	width: 100%;
	text-align: center;
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
	padding-left: 1rem;
	padding-right: 1rem;
	border-radius: 0.25rem;
	font-size: 1.125rem;
	line-height: 1.75rem;
	color: rgb(17 24 39 / 1);
	transition-duration: 200ms;
	text-transform: uppercase;
	margin: 0 !important;
	border-color: var(--e-global-color-primary);
}

.lf-pa-accordion a.add_to_cart_button:hover,.lf-pa-accordion button.add_to_cart_button:hover,
.lf-pa-accordion button.single_add_to_cart_button:hover{
	 color: var(--e-global-color-secondary);
    background-color: var(--e-global-color-accent);
	border-color: var(--e-global-color-accent);
}

.lf-pa-accordion .wc-bookings-booking-form {
    border: 0px solid #ddd;
	padding: 0;
}

.lf-pa-accordion .wc-bookings-booking-form fieldset {
    border: 0;
    padding: 0;
}

.lf-pa-accordion .wc-bookings-date-picker .ui-datepicker td .ui-state-default {
    background-image: none !important;
    border: none;
    color: #2b2b2b !important;
    margin: 0;
    font-weight: normal;
    text-align: center;
    background: linear-gradient(145deg, #e6b800, #d4a600);
    color: #fff;
    cursor: pointer;
/*     box-shadow: 0 4px 10px rgba(230, 184, 0, 0.3); */
    width: 42px;
    height: 42px;
    line-height: 1.3;
    border-radius: 50%;
    margin: 10px auto;
    font-weight: 600;
    transition: 0.2s;
    opacity: 1 !important;
	box-shadow: 0 0px 4px rgba(230, 184, 0, 0.3);
}

.not_bookable span.ui-state-default, .not_bookable_by_rules span.ui-state-default {
    cursor: default !important;
}

.lf-pa-accordion .ui-datepicker-current-day a.ui-state-default.ui-state-active, .lf-pa-accordion .wc-bookings-date-picker .ui-datepicker td.bookable a.ui-state-default{
	color: #fff !important;
}

.lf-pa-accordion .wc-bookings-date-picker .ui-datepicker td {
    border-top: 0px solid #e6e6e6;
    border-right: 0px solid #e6e6e6;
}

.lf-pa-accordion .wc-bookings-date-picker .ui-datepicker td.bookable-range .ui-state-default{
    transform: scale(1.05);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.3) !important;
}
.lf-pa-accordion .bookable:hover a.ui-state-default {
    transform: translateY(-2px);
}

.lf-pa-accordion .wc-bookings-date-picker .ui-widget-content {
    border: none;
    background: #fff;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .1);
}

.lf-pa-accordion .wc-bookings-date-picker .ui-datepicker-header{
	background-image: none !important;
	background: #000 !important;
}
.lf-pa-accordion .wc-bookings-date-picker .ui-datepicker .ui-datepicker-prev, .lf-pa-accordion .wc-bookings-date-picker .ui-datepicker .ui-datepicker-next {
    top: -1px;
    background: #000;
}

.lf-pa-accordion .ui-state-disabled, .lf-pa-accordion .ui-widget-content .ui-state-disabled, .lf-pa-accordion .ui-widget-header .ui-state-disabled {
    opacity: .7;
    filter: Alpha(Opacity=70);
    background-image: none;
}

.lf-pa-accordion .wc-bookings-booking-form .block-picker {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    zoom: 1;
    min-height: 30px;
    display: flex;
    flex-wrap: wrap;
    column-gap: 2px;
    row-gap: 5px;
}

.lf-pa-accordion .wc-bookings-booking-form .block-picker li:nth-child(odd) a {
    border-radius: 999px;
    background: #eee;
    font-weight: bold;
    border: none;
    cursor: pointer;
    margin: 0 auto;
    width: 100% !important;
}

.lf-pa-accordion .wc-bookings-booking-form .block-picker li:nth-child(even) a {
    border-radius: 999px;
    background: #eee;
    font-weight: bold;
    border: none;
    cursor: pointer;
    margin: 0 auto;
    width: 100% !important;
}

.lf-pa-accordion .wc-bookings-booking-form .block-picker {
    margin: 30px 0;
    column-gap: 20px;
    row-gap: 20px;
}

.lf-pa-accordion .wc-bookings-booking-form .block-picker li {
   min-width: 29%;
}

.lf-pa-accordion .wc-bookings-booking-form .block-picker li:nth-child(odd) a, .lf-pa-accordion .wc-bookings-booking-form .block-picker li:nth-child(even) a {
background: #fff;
    font-weight: 600;
    border: 1px solid #ccc;
color: #454545 !important;

}
.lf-pa-accordion .wc-bookings-booking-form .block-picker li a:hover {
color: #fff !important
}

.lf-pa-accordion .wc-bookings-booking-form label {
    font-size: 14px;
}

.lf-pa-accordion  select#wc_bookings_field_resource {
    margin-top: 12px;
}

@media (max-width: 767px) {
.lf-pa-accordion  .tbc-booking-container {
	width: 100% !important;
}
}
@media (max-width: 540px) {
	
.lf-pa-accordion .wc-bookings-booking-form .block-picker {
    justify-content: center;
}
	
}