/* La Manga Studio - skin for [hbfwc_search_form] to match the hero booking-widget pattern.
 * Targets the plugin's existing markup (`#hbfwc-availability-filter__form` + `.availability-filter__*`)
 * and re-skins it to look like the placeholder `.booking-widget` card.
 * One rule per line. Tokens via :root from inc/imp-styles.php.
 */

/* Lift the hero's `overflow:hidden` (from .wp-block-cover) so the absolutely-positioned guests dropdown can extend below the hero box. Scoped to covers that actually contain our form. */
.wp-block-cover:has(#hbfwc-availability-filter__form) {overflow:visible;}

/* Outer card */
#hbfwc-availability-filter__form {margin:0;padding:8px;width:100%;max-width:920px;box-sizing:border-box;display:grid;grid-template-columns:1fr 1fr auto;gap:0;background:#FFFFFF;border:0;border-radius:0;box-shadow:0 24px 70px rgba(26,20,16,0.35);align-items:stretch;position:relative;z-index:5;}

/* Each cell */
#hbfwc-availability-filter__form > div {width:auto;margin:0;padding:14px 20px;border:0;border-right:1px solid var(--imp-color-border);box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;cursor:pointer;transition:background var(--imp-duration) var(--imp-ease);}
#hbfwc-availability-filter__form > div:hover {background:var(--imp-color-bg-alt);}

/* Labels */
#hbfwc-availability-filter__form h4.availability-filter__label {display:block;font-family:var(--imp-font-body);font-size:10px;line-height:1;letter-spacing:3px;text-transform:uppercase;color:var(--imp-color-text-muted);font-weight:600;margin:0 0 6px;padding:0;}

/* Values */
#hbfwc-availability-filter__form .availability-filter__content {font-family:var(--imp-font-body);font-size:15px;line-height:1.2;font-weight:600;color:var(--imp-color-text);cursor:pointer;}
#hbfwc-availability-filter__form .availability-filter__content .availability-filter__content_span {display:inline;margin:0;padding:0;border:0;}
#hbfwc-availability-filter__form .availability-filter__content .availability-filter__content_span + .availability-filter__content_span {margin-left:6px;padding-left:6px;border-left:1px solid var(--imp-color-border);}

/* Submit cell - button takes full height */
#hbfwc-availability-filter__form .availability-filter__button {padding:0;border-right:0;cursor:default;align-items:stretch;}
#hbfwc-availability-filter__form .availability-filter__button:hover {background:transparent;}
#hbfwc-availability-filter__form .availability-filter__button button.hbfwc-filter-button {background:var(--imp-color-primary);color:#FFFFFF;border:0;border-radius:0;padding:0 40px;font-family:var(--imp-font-body);font-size:12px;font-weight:700;letter-spacing:3px;text-transform:uppercase;cursor:pointer;min-height:56px;width:auto;transition:background var(--imp-duration) var(--imp-ease);}
#hbfwc-availability-filter__form .availability-filter__button button.hbfwc-filter-button:hover,
#hbfwc-availability-filter__form .availability-filter__button button.hbfwc-filter-button:focus {background:var(--imp-color-primary-dark);color:#FFFFFF;}

/* Last left-side cell - no right border */
#hbfwc-availability-filter__form .availability-filter__room {border-right:0;}

/* Guests / rooms dropdown - opens when plugin JS adds .hbfwc-activated to the room cell */
#hbfwc-availability-filter__form .availability-filter__room .availability-filter__dd {position:absolute;top:calc(100% + 8px);right:0;min-width:260px;background:#FFFFFF;border:1px solid var(--imp-color-border);box-shadow:0 18px 50px rgba(26,20,16,0.18);padding:18px;display:none;z-index:20;}
#hbfwc-availability-filter__form .availability-filter__room.hbfwc-activated .availability-filter__dd {display:block;}
#hbfwc-availability-filter__form .availability-filter__room .availability-filter__dd > div {padding:8px 0;border:0;border-bottom:1px solid var(--imp-color-border);display:flex;align-items:center;justify-content:space-between;gap:12px;}
#hbfwc-availability-filter__form .availability-filter__room .availability-filter__dd > div:last-child {border-bottom:0;}
#hbfwc-availability-filter__form .availability-filter__room .availability-filter__dd label {font-family:var(--imp-font-body);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--imp-color-text-muted);font-weight:600;margin:0;}
#hbfwc-availability-filter__form .availability-filter__room .availability-filter__dd input[type=number] {width:80px;padding:8px 10px;border:1px solid var(--imp-color-border);background:#FFFFFF;font-family:var(--imp-font-body);font-size:14px;color:var(--imp-color-text);border-radius:0;}

/* Mobile - stack to 2-col grid like the placeholder did */
@media (max-width:768px) {
	#hbfwc-availability-filter__form {grid-template-columns:1fr 1fr;}
	#hbfwc-availability-filter__form > div {border-right:0;border-bottom:1px solid var(--imp-color-border);}
	#hbfwc-availability-filter__form .availability-filter__dates {grid-column:1 / -1;}
	#hbfwc-availability-filter__form .availability-filter__room {grid-column:1 / -1;}
	#hbfwc-availability-filter__form .availability-filter__button {grid-column:1 / -1;border-bottom:0;}
	#hbfwc-availability-filter__form .availability-filter__button button.hbfwc-filter-button {width:100%;padding:16px;}
	#hbfwc-availability-filter__form .availability-filter__room .availability-filter__dd {right:auto;left:0;width:100%;}
}

/* Mini-cart sidebar "x" (remove item) — plugin hides it (opacity:0 + translateX) and only reveals on hover. Force it always visible so guests can always discover the remove control. !important to beat the desktop media-query override inside the plugin CSS (which has higher specificity via the nested rule). */
li.hbfwc-mini-cart__item .hbfwc_remove_item {opacity:1 !important;transform:none !important;}

