/* Search, map first (Signature §4.4). */
.site-main--search, .site-main--search .search-page { max-inline-size: none; padding: 0; }
/* --search-inset: the header's content edge. */
.search-layout { --search-inset: max(.75rem, (100cqi - var(--rym-container-max)) / 2 + var(--rym-gutter)); --search-panel: calc(clamp(24rem, 44vw, 46rem) + var(--search-inset) - .75rem); container-type: inline-size; position: relative; display: grid; grid-template-columns: minmax(0, var(--search-panel)) minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); block-size: calc(100dvh - var(--rym-sticky-offset)); overflow: clip; }
.search-layout__map { grid-area: 1 / 1 / -1 / -1; position: relative; z-index: 0; min-block-size: 0; }
.search-map__frame, .search-map__canvas { block-size: 100%; }
.search-layout__results { grid-area: 2 / 1; z-index: var(--rym-z-sheet); min-block-size: 0; overflow-y: auto; overscroll-behavior: contain; margin: 0 0 .75rem; margin-inline-start: var(--search-inset); padding: 1.5rem 1.5rem 2rem; border-radius: 1.5rem; background-color: var(--rym-color-bg); box-shadow: var(--rym-shadow-4); scrollbar-width: thin; scrollbar-color: var(--rym-hairline-strong) transparent; }
.search-layout__results[data-sheet="full"] { grid-column: 1 / -1; margin-inline-end: var(--search-inset); }
:is([data-role="result-list"], .result-skeleton) { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15.5rem), 1fr)); gap: 2.5rem 1.25rem; margin: 0; padding: 0; list-style: none; }

.search-layout__filters { grid-area: 1 / 1 / 2 / -1; z-index: calc(var(--rym-z-sheet) + 1); padding: .75rem var(--search-inset); pointer-events: none; }
.search-layout__filters:has([data-collapsed="false"]) { z-index: calc(var(--rym-z-header) + 1); }
.search-filters { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; inline-size: fit-content; max-inline-size: 100%; }
.search-filters > * { pointer-events: auto; }
.filter-group--stay { display: grid; grid-auto-flow: column; align-items: center; margin: 0; padding: .25rem .5rem; border: 0; border-radius: 99rem; background-color: var(--rym-glass-solid); box-shadow: var(--rym-shadow-4); }
.filter-group--stay .field-row { display: contents; }
.filter-group--stay .field { display: grid; gap: .125rem; margin: 0; padding: .25rem 1rem; border-inline-end: 1px solid var(--rym-color-border); }
.filter-group--stay .field:last-child { border: 0; }
.filter-group--stay .field:focus-within { border-radius: 99rem; background-color: #fff; }
.filter-group--stay .field__label { font-size: .75rem; }
.filter-group--stay .field__control { inline-size: 100%; min-block-size: 1.75rem; padding: 0; border: 0; background: none; font-weight: 600; }
.search-filters__toggle, .search-filters__toggle:is(:hover, :focus-visible) { min-block-size: 3rem; background-color: var(--rym-glass-solid); color: var(--rym-color-text); box-shadow: var(--rym-shadow-2); }
.search-filters__toggle[aria-expanded="true"] { background-color: var(--rym-color-text); color: #fff; }
@supports (backdrop-filter: blur(1px)) {
	:is(.filter-group--stay, .search-filters__toggle:not([aria-expanded="true"]), .search-map__note) { background-color: var(--rym-glass); backdrop-filter: var(--rym-glass-blur); }
}
.search-filters__count { min-inline-size: 1.375rem; padding: .25rem .375rem; border-radius: 99rem; background-color: var(--rym-color-coral-text); color: #fff; font-size: .75rem; line-height: 1; }

/* Drawer: the veil takes no press (search.js closes it). */
:is(#rym-more-filters[data-collapsed="true"], [data-role][hidden]) { display: none; }
#rym-more-filters { position: fixed; inset-block: 0; inset-inline-end: 0; z-index: var(--rym-z-header); display: grid; align-content: start; gap: 1.5rem; inline-size: min(30rem, 100%); overflow-y: auto; overscroll-behavior: contain; padding: 0 1.5rem; background-color: var(--rym-color-bg); box-shadow: var(--rym-shadow-4); animation: rym-drawer-in var(--rym-duration-panel) var(--rym-ease-drawer); }
:dir(rtl) #rym-more-filters { --rym-drawer-from: -100%; }
@keyframes rym-drawer-in { from { transform: translateX(var(--rym-drawer-from, 100%)); } }
.search-layout__filters:has([data-collapsed="false"])::before { content: ""; position: fixed; inset: 0; background-color: rgb(15 36 56 / 28%); animation: rym-fade-in var(--rym-duration-panel) var(--rym-ease-out); }
html:has(#rym-more-filters[data-collapsed="false"]) { overflow: hidden; }
:is(.search-filters__head, .search-filters__actions) { position: sticky; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-inline: -1.5rem; padding: 1rem 1.5rem; background-color: var(--rym-color-bg); }
.search-filters__head { inset-block-start: 0; border-block-end: 1px solid var(--rym-color-border); }
.search-filters__heading { margin: 0; font: var(--rym-font-weight-serif) 1.75rem/1.1 var(--rym-font-display); }
.search-filters__close { display: grid; place-items: center; inline-size: 44px; block-size: 44px; border: 0; border-radius: 50%; background-color: var(--rym-color-surface); color: inherit; }
.search-filters__actions { inset-block-end: 0; border-block-start: 1px solid var(--rym-color-border); }
.search-filters__submit { flex: auto; }
.filter-group { display: grid; gap: .75rem; min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.filter-group + .filter-group { padding-block-start: 1.5rem; border-block-start: 1px solid var(--rym-color-border); }
.filter-group__legend { float: inline-start; inline-size: 100%; padding: 0; font-weight: 700; }
.filter-group__legend + * { clear: both; }
.filter-group__hint { margin: 0; color: var(--rym-color-text-muted); font-size: .875rem; }

.search-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .5rem .75rem; margin-block-end: 1.5rem; padding-block-end: 1rem; border-block-end: 1px solid var(--rym-color-border); }
.search-summary, .search-toolbar__controls { display: contents; }
.search-summary p { margin: 0; max-inline-size: none; }
.search-summary .search-summary__count { grid-area: 1 / 1; font: var(--rym-font-weight-serif) var(--rym-font-size-h2-compact)/var(--rym-line-height-display) var(--rym-font-display); letter-spacing: var(--rym-letter-spacing-serif); }
.search-summary__number:not(:lang(ar)) { font-style: italic; }
:is(.search-toolbar, .search-summary, .search-toolbar__controls) > * { grid-column: 1 / -1; }
.search-summary__stay { font-weight: 600; }
.search-summary__note { color: var(--rym-color-text-muted); font-size: .875rem; }
.search-toolbar .field__control { min-block-size: 44px; padding-inline: 1rem 2rem; border-radius: 99rem; background-color: #fff; }
.search-toolbar .search-toolbar__map-toggle { grid-area: 1 / 2; min-block-size: 44px; border: 1px solid var(--rym-color-border-strong); background-color: transparent; color: var(--rym-color-text); white-space: nowrap; }
@media (hover: hover) and (pointer: fine) {
	.search-toolbar__map-toggle:hover { background-color: var(--rym-color-text); color: #fff; }
}
.search-quick { order: -1; display: flex; flex-wrap: wrap; gap: .5rem; margin-block: .5rem .25rem; }
.search-quick .chip:not([aria-pressed="true"]) { border-color: var(--rym-hairline-strong); background-color: transparent; }
.search-sheet__handle { display: none; }

/* Busy: dimmed, then skeleton (search.js). */
.search-results > * { transition: opacity var(--rym-dur-1) var(--rym-ease-out); }
.search-results[aria-busy="true"] > :not(.result-skeleton) { opacity: .5; }
.search-results.is-loading > :not(.result-skeleton) { display: none; }
.skeleton-card { display: grid; gap: .5rem; }
.skeleton-card > :first-child { aspect-ratio: 4 / 3; margin-block-end: .5rem; border-radius: 1.25rem; }
.skeleton-card > * + * { block-size: .875rem; inline-size: 85%; }
.skeleton-card > :last-child { inline-size: 55%; }

.search-results [data-role="search-error"] { margin-block-end: 1rem; border: 0; animation: rym-rise-in var(--rym-dur-2) var(--rym-ease-out); }
@keyframes rym-rise-in { from { opacity: 0; transform: translateY(-8px); } }

/* --search-bar: the bar's height (search.js). */
.search-map .leaflet-top { inset-block-start: var(--search-bar, 5rem); }
.search-map__area, .search-map__reset { position: absolute; inset-block-start: calc(var(--search-bar, 5rem) + .5rem); inset-inline-start: 50%; z-index: var(--rym-z-map-controls); display: inline-flex; align-items: center; min-block-size: 44px; padding-inline: 1rem; border-radius: 99rem; box-shadow: var(--rym-shadow-4); translate: -50%; }
:dir(rtl) :is(.search-map__area, .search-map__reset) { translate: 50%; }
.search-map__area { background-color: var(--rym-color-text); color: #fff; animation: rym-rise-in var(--rym-dur-2) var(--rym-ease-out); }
.search-map__reset { inset-block-start: calc(var(--search-bar, 5rem) + 1rem + 44px); }
/* Beside the results panel, the map buttons centre on the part of the map the panel leaves visible. */
/* Large screens (final fixes): the map area fills the viewport under the 76 px header and meets the footer flush. */
@media (min-width: 64rem) {
	.search-layout { block-size: calc(100dvh - 4.75rem); }
	.site-main--search + .site-footer { margin-block-start: 0; }
}
@media (min-width: 64rem) { .search-map__area, .search-map__reset { inset-inline-start: calc((100% + var(--search-panel)) / 2); } }
a.search-map__reset { background-color: var(--rym-glass-solid); color: var(--rym-color-text); font-weight: 700; text-decoration: none; }
.search-map__note { position: absolute; inset-block-end: 10px; inset-inline-end: 10px; z-index: var(--rym-z-map-controls); max-inline-size: none; margin: 0; padding: .25rem .75rem; border-radius: 99rem; background-color: var(--rym-glass-solid); font-size: .75rem; white-space: nowrap; }

/* The map notes and the attribution: one column of glass pills, 10 px from the edge and from each other (Leaflet's
   control margins). The approximate-locations note only over pins. */
.search-map:has(.leaflet-marker-pane:empty) .search-map__note { display: none; }
.search-map .leaflet-control-attribution { margin: 0 10px 10px; padding: .125rem .625rem; border-radius: 99rem; background-color: var(--rym-glass-solid); }
@media (min-width: 64rem) { .search-map:not(:has(.leaflet-marker-pane:empty)):dir(ltr) .leaflet-right.leaflet-bottom, .search-map:not(:has(.leaflet-marker-pane:empty)):dir(rtl) .leaflet-left.leaflet-bottom { inset-block-end: 2.25rem; } }

@media (max-width: 63.99rem) {
	.search-layout { grid-template-columns: minmax(0, 1fr); }
	.search-layout__filters { padding: .5rem; }
	.search-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: .25rem; inline-size: auto; padding: .25rem; border-radius: 1.25rem; background-color: var(--rym-glass-solid); box-shadow: var(--rym-shadow-4); pointer-events: auto; }
	.filter-group--stay { display: contents; }
	.search-filters .filter-group--stay .field { padding: .25rem .75rem; border-radius: 1rem; background-color: #fff; border: 0; }
	.search-filters .filter-group--stay .field:focus-within { box-shadow: inset 0 0 0 2px var(--rym-color-text); }
	/* Keyword on the first row, « Filtres » a chip at its end. */
	.search-filters { position: relative; }
	.filter-group--stay > .field:has([name="q"]) { order: -2; grid-column: 1 / -1; }
	.search-filters:has(> .search-filters__toggle:not([hidden])) .field:has([name="q"]) { padding-inline-end: 10rem; }
	.filter-group--stay > :is(.field--city, .field:last-child) { order: -1; }
	.filter-group--stay:not(:has(.field--city)) > .field:last-child { grid-column: 1 / -1; }
	.search-filters .search-filters__toggle { position: absolute; inset-block-start: .5rem; inset-inline-end: .5rem; min-block-size: 2.75rem; padding-inline: .875rem; border-radius: 99rem; white-space: nowrap; background-color: var(--rym-color-surface); box-shadow: none; }
	.search-quick { flex-wrap: nowrap; overflow-x: auto; margin-inline: -1rem; padding-inline: 1rem; scrollbar-width: none; }
	.search-layout__results { grid-column: 1 / -1; margin: 0; padding: 0 1rem; border-end-start-radius: 0; border-end-end-radius: 0; transform: translateY(var(--sheet-offset, 0%)); transition: transform var(--rym-duration-sheet) var(--rym-ease-drawer); }
	.search-layout__results[data-sheet="peek"] { --sheet-offset: calc(100% - var(--sheet-peek, 9.75rem)); }
	.search-layout__results[data-sheet="half"] { --sheet-offset: 45%; }
	.search-layout__results[data-sheet="full"] { --sheet-offset: 0%; margin: 0; }
	.search-layout__results.is-dragging { transition: none; }
	.search-sheet__handle { position: sticky; inset-block-start: 0; z-index: 1; display: flex; justify-content: center; inline-size: 100%; min-block-size: 44px; margin: 0; padding: 0; border: 0; background-color: var(--rym-color-bg); cursor: grab; touch-action: none; }
	.search-sheet__handle::before { content: ""; align-self: center; inline-size: 2.5rem; block-size: .3rem; border-radius: 99rem; background-color: var(--rym-color-border-strong); }
	.search-toolbar { margin-block-end: .5rem; }
	.search-summary .search-summary__count { font-size: 1.125rem; }
	.search-toolbar .search-toolbar__map-toggle { padding-inline: .75rem; font-size: .9375rem; }
	.search-toolbar .field--inline { flex-wrap: nowrap; }
	.search-toolbar .field__control { flex: auto; min-inline-size: 0; }
	/* One row under the filter bar: the note at the reading start, the zoom pill (horizontal) at the end; search.js
	   fits the pins below that row. The attribution and the dev note sit above the peeking sheet. */
	.search-map__note { inset-block: calc(var(--search-bar, 5rem) + 10px) auto; inset-inline: 10px auto; max-inline-size: calc(100% - 7.5rem); border-radius: .75rem; white-space: normal; }
	.search-map .leaflet-control-zoom { display: flex; }
	.search-map .leaflet-control-zoom.leaflet-bar a:first-child { border-block-end: 0; border-inline-end: 1px solid var(--rym-hairline); }
	.search-map .leaflet-bottom { inset-block-end: calc(var(--sheet-peek, 9.75rem) + .25rem); }
}

/* .map-marker: 0 high at the point; .map-pin above, moved by --nudge, --stack (map.js). */
.leaflet-marker-icon.map-marker { left: var(--nudge, 0px); outline: none; inline-size: max-content; block-size: 0; translate: -50%; }
/* Wow §2.4: navy pills with a cream hairline, coral when hovered, focused, linked to the hovered card or selected. */
.map-pin { position: relative; display: inline-flex; align-items: center; min-block-size: 2rem; padding: .25rem .8125rem; border-radius: 99rem; background-color: var(--rym-color-pin-bg); color: var(--rym-color-pin-text); font-size: .8125rem; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: .01em; white-space: nowrap; cursor: pointer; box-shadow: 0 0 0 1.5px rgb(255 253 248 / 90%), 0 6px 16px rgb(15 36 56 / 24%); transform: translateY(calc(-100% - 8px - var(--stack, 0px))); transform-origin: 50% 0; transition: scale var(--rym-dur-1) var(--rym-ease-out); }
.map-pin::after { content: ""; position: absolute; inset-block-start: 100%; inset-inline-start: 50%; inline-size: .625rem; block-size: .625rem; margin: -.3125rem 0 0 -.3125rem; border-radius: 0 0 2px; background-color: inherit; transform: rotate(45deg); }
.map-pin, .map-cluster { animation: rym-pin-in var(--rym-dur-2) var(--rym-ease-out) backwards; }
@keyframes rym-pin-in { from { opacity: 0; scale: .6; } }
:is(.map-marker.is-active, .map-marker:focus-visible, .map-marker.is-selected) .map-pin { background-color: var(--rym-color-pin-active-bg); color: var(--rym-color-pin-active-text); scale: 1.08; }
.map-marker.is-selected .map-pin { scale: 1.12; box-shadow: 0 0 0 2px var(--rym-brand-cream), 0 8px 20px rgb(15 36 56 / 30%); }
.map-marker:focus-visible .map-pin { outline: var(--rym-focus-width) solid var(--rym-color-ink); outline-offset: 3px; }
/* A tag with no free place (map.js spread): a 12 px navy dot with a cream ring in a 24 px target (WCAG 2.5.8) on its
   point; its price comes back when it is hovered, focused, linked to the hovered card or selected. */
.map-marker.is-compact:not(.is-active, .is-selected, :focus-visible) .map-pin { min-block-size: 1.5rem; inline-size: 1.5rem; padding: 0; background: radial-gradient(circle, var(--rym-color-pin-bg) 0 5px, var(--rym-brand-cream) 5.5px 7px, transparent 7.5px); box-shadow: none; font-size: 0; transform: translateY(-50%); }
.map-marker.is-compact:not(.is-active, .is-selected, :focus-visible) .map-pin::after { content: none; }
/* Cluster bubbles: an ink disc, serif count, cream ring and a soft halo; coral like the pins when hovered or focused. */
.map-cluster-marker { outline: none; }
.map-cluster { display: grid; place-items: center; inline-size: 3rem; block-size: 3rem; border-radius: 50%; background-color: var(--rym-color-pin-bg); color: var(--rym-color-pin-text); font-family: var(--rym-font-display); font-size: 1.375rem; font-weight: var(--rym-font-weight-serif); line-height: 1; font-variant-numeric: lining-nums; translate: -50% -50%; cursor: pointer; box-shadow: 0 0 0 2px var(--rym-brand-cream), 0 0 0 10px rgb(15 36 56 / 14%), 0 8px 20px rgb(15 36 56 / 24%); transition: scale var(--rym-dur-1) var(--rym-ease-out); }
.map-cluster-marker:focus-visible .map-cluster { background-color: var(--rym-color-pin-active-bg); color: var(--rym-color-pin-active-text); outline: var(--rym-focus-width) solid var(--rym-color-ink); outline-offset: 12px; }
@media (hover: hover) and (pointer: fine) {
	.map-marker:hover .map-pin { background-color: var(--rym-color-pin-active-bg); color: var(--rym-color-pin-active-text); scale: 1.08; }
	.map-cluster-marker:hover .map-cluster { background-color: var(--rym-color-pin-active-bg); color: var(--rym-color-pin-active-text); scale: 1.06; }
}
.map-popup { display: grid; gap: .25rem; font-size: .875rem; }
.map-popup a { padding-block: .75rem; font-weight: 700; }
