/* === Resa DKW minimal search styles (inline fallback) === */
.resa-results { margin: 2rem 0; }
.resa-card { padding: 1rem; border: 1px solid #e2e2e2; border-radius: 8px; margin-bottom: 1rem; }
.resa-card h3 { margin: 0 0 .5rem; }
.resa-pill { display:inline-block; padding:.35rem .65rem; border-radius:999px; border:1px solid #ddd; background:#f7f7f7; cursor:pointer; margin:.25rem .25rem 0 0; }
.resa-pill.active { border-color:#333; background:#fff; }
.resa-plan-pills--single p{ display:none !important; margin:0 !important; padding:0 !important; }

/* Hide blocks only while search is active */
body.resa-search-active .resa-hide-on-search { display: none !important; }

/* If you prefer ARIA-driven hiding (JS sets aria-hidden="true") */
.resa-hide-on-search[aria-hidden="true"] { display: none !important; }

/* Card meta (ACF fields) shown under prices */
.resa-card-meta { margin-top: 0.5rem; color: #333; font-size: .95em; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.resa-card-meta span { background: #f3f4f6; padding: 4px 8px; border-radius: 6px; border: 1px solid #e6e7e8; color: #111; }
.resa-package-length { font-weight: 600; color: #064e3b; }

/* Blocked package card appearance */
.resa-package-blocked { opacity: 0.6; background: #fafafa; border-color: #eee; }
.resa-select--blocked { background: #f8d7da; border: 1px solid #f5c2c7; color: #74232a; padding: .35rem .65rem; border-radius: 6px; }

/* Card notes (informational / advisory / blocked) */
.resa-card-note { margin-top:8px; padding:8px; position:relative; border-radius:6px; font-size:.95em; }
.resa-card-note--bedding { border:1px solid #e6f0ff; background:#f1f8ff; color:#0b3b6f; }
.resa-card-note--blocked { border:1px solid #f5c6cb; background:#fff1f2; color:#66101f; }
.resa-package-note { margin-top:6px; color:#b36; font-size:.95em; }

/* Dismiss button for notes */
.resa-note-dismiss { position:absolute; right:8px; top:6px; background:transparent; border:0; color:inherit; font-weight:700; cursor:pointer; }

/* Force single page pill horizontal layout on non-mobile widths (high specificity) */
@media (min-width:640px){
	form.resa-single-form .resa-plan-pills, .resa-single-root form .resa-plan-pills { display:flex !important; flex-wrap:wrap !important; gap:8px !important; }
	form.resa-single-form .resa-plan-pills .resa-pill, .resa-single-root form .resa-plan-pills .resa-pill { display:inline-flex !important; }
}

/* Extra high-specificity rule for single shortcode pills */
@media (min-width:640px){
	.resa-plan-pills--single { display:flex !important; flex-wrap:wrap !important; gap:8px !important; }
	.resa-plan-pills--single .resa-pill { display:inline-flex !important; }

	/* Thumbnail rules for search cards */
	.resa-card-thumb{width:400px;height:300px;object-fit:cover;display:block;margin-bottom:8px}

	/* Responsive layout: float thumbnail on larger viewports and stack on mobile */
	.resa-card { overflow: hidden; }
	.resa-card .resa-card-thumb{float:left;margin-right:16px}
	.resa-card .resa-prices{overflow:hidden}

	/* Thumb wrapper provides an intrinsic aspect-ratio and responsive width */
	.resa-card-thumb-wrap{width:400px;flex:0 0 400px;aspect-ratio:4/3;overflow:hidden;display:block;margin-bottom:8px}
	.resa-card-thumb-wrap .resa-card-thumb{width:100%;height:100%;object-fit:cover;display:block}

	@media (max-width:640px){
		.resa-card-thumb-wrap{width:100%;flex:0 0 auto;margin:0 auto 12px}
		.resa-card .resa-card-thumb{float:none}
		/* On small screens prefer contained images centered rather than cover which may crop left/right */
		.resa-card-thumb-wrap .resa-card-thumb{object-fit:contain;object-position:center center}
	}
}