/*
 * oovacances.com - design (redesign 2026-10, Bootstrap 5.3). docs/migration/REDESIGN.md §3.
 * Tokens from the oovacances logo (app-legacy/web/images/logo.png, measured): navy "Vacances" #001d65,
 * pink "OO" #fe136a, blue wave #0057c2, yellow sun #ffc900. Same structure as the 321 suite (321voyages):
 * navy for structure and text, blue for every action, pale surfaces; the brand pink is the accent of the
 * owners' side (publish an ad) and of the kickers; the sun yellow is decoration only.
 */
:root {
    /* Palette */
    --oov-navy: #001d65;            /* headings, nav, strong type, footer (16.0:1 on white) */
    --oov-text: #14213d;            /* body copy */
    --oov-muted: #55627a;           /* secondary copy (5.9:1 on white) */
    --oov-blue: #0057c2;            /* brand blue: links, primary buttons (white on it 6.7:1) */
    --oov-blue-hover: #00479f;
    --oov-blue-active: #003c87;
    --oov-blue-dark: #00479f;       /* selected days of the date picker (white on it 8.4:1) */
    --oov-blue-light: #8fc1ff;      /* accent on the navy surfaces (hero title, footer titles) */
    --oov-pink: #fe136a;            /* brand pink: kickers' dash, icons, large accents (non-text or large only: 3.8:1) */
    --oov-pink-dark: #d1004f;       /* pink buttons and pink small text (white on it 5.5:1) */
    --oov-pink-hover: #b00043;
    --oov-pink-soft: #ffe7f0;
    --oov-sun: #ffc900;             /* decoration only (sun of the logo), never text */
    --oov-surface: #edf4fd;         /* pale blue: icon circles, chips, hover */
    --oov-section: #f6f8fb;         /* alternate section background */
    --oov-warm: #fff8e6;            /* warm tint, rarely (owners' band highlights) */
    --oov-line: #dbe3ee;
    --oov-line-soft: #e8edf4;

    /* Shapes and depth */
    --radius-chip: 999px;
    --radius-control: 10px;
    --card-radius: 16px;
    --radius-panel: 20px;
    --shadow-soft: 0 1px 2px rgba(0, 29, 101, .05), 0 2px 10px rgba(0, 29, 101, .06);
    --shadow-hover: 0 2px 4px rgba(0, 29, 101, .06), 0 12px 28px rgba(0, 29, 101, .12);
    --shadow-menu: 0 4px 10px rgba(0, 29, 101, .08), 0 14px 30px rgba(0, 29, 101, .12);
    --focus-ring: 0 0 0 3px rgba(0, 87, 194, .35);
    --header-h: 72px;
    --site-max: 1200px;

    --bs-primary: var(--oov-blue);
    --bs-primary-rgb: 0, 87, 194;
    --bs-link-color: var(--oov-blue);
    --bs-link-color-rgb: 0, 87, 194;
    --bs-link-hover-color: var(--oov-blue-hover);
    --bs-link-hover-color-rgb: 0, 71, 159;
    --bs-body-bg: #fff;
    --bs-body-color: var(--oov-text);
    --bs-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --bs-border-radius: var(--radius-control);
    --bs-border-color: var(--oov-line);
    --bs-emphasis-color: var(--oov-navy);
}

body { -webkit-font-smoothing: antialiased; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
.bi { vertical-align: -.125em; flex-shrink: 0; }
.skip-link { position: absolute; top: .5rem; left: .5rem; z-index: 2000; padding: .5rem 1rem; background: #fff; border-radius: var(--radius-control); }
h1, h2, h3, h4, .h1, .h2, .h3, .h4, .h5 { color: var(--oov-navy); letter-spacing: -.01em; }

.container { --bs-gutter-x: 2rem; }
@media (min-width: 1200px) { .container { max-width: var(--site-max); } }
.container.narrow { max-width: 860px; }

a:focus-visible, button:focus-visible, .btn:focus-visible, [tabindex]:focus-visible, summary:focus-visible { outline: 3px solid var(--oov-blue); outline-offset: 2px; box-shadow: none; }
.site-footer a:focus-visible, .hero a:focus-visible, .owner-band a:focus-visible { outline-color: #fff; }
.hero .hero-search a:focus-visible, .hero .hero-search button:focus-visible { outline-color: var(--oov-blue); }

/* Buttons: blue is the action colour; pink is the owners' call to action (publish). */
.btn { font-weight: 600; border-radius: var(--radius-control); }
.btn-primary {
    --bs-btn-color: #fff; --bs-btn-bg: var(--oov-blue); --bs-btn-border-color: var(--oov-blue);
    --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--oov-blue-hover); --bs-btn-hover-border-color: var(--oov-blue-hover);
    --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--oov-blue-active); --bs-btn-active-border-color: var(--oov-blue-active);
    --bs-btn-disabled-bg: var(--oov-blue); --bs-btn-disabled-border-color: var(--oov-blue);
    --bs-btn-focus-shadow-rgb: 0, 87, 194;
    font-weight: 700;
}
.btn-outline-primary {
    --bs-btn-color: var(--oov-blue); --bs-btn-bg: #fff; --bs-btn-border-color: #b5cff0;
    --bs-btn-hover-color: var(--oov-blue-hover); --bs-btn-hover-bg: var(--oov-surface); --bs-btn-hover-border-color: var(--oov-blue);
    --bs-btn-active-color: var(--oov-blue-hover); --bs-btn-active-bg: var(--oov-surface); --bs-btn-active-border-color: var(--oov-blue);
    --bs-btn-focus-shadow-rgb: 0, 87, 194;
}
.btn-owner-cta {
    --bs-btn-color: #fff; --bs-btn-bg: var(--oov-pink-dark); --bs-btn-border-color: var(--oov-pink-dark);
    --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--oov-pink-hover); --bs-btn-hover-border-color: var(--oov-pink-hover);
    --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--oov-pink-hover); --bs-btn-active-border-color: var(--oov-pink-hover);
    --bs-btn-focus-shadow-rgb: 209, 0, 79;
    font-weight: 700;
}

/* Header: white, logo left, words on desktop, offcanvas below lg. */
.site-header { background: #fff; border-bottom: 1px solid var(--oov-line-soft); }
.site-header .navbar { --bs-navbar-padding-y: 2px; min-height: var(--header-h); }
.site-header .container { gap: 1rem; flex-wrap: nowrap; }
.site-header .navbar-brand { padding: 0; margin: 0; flex-shrink: 0; line-height: 0; }
.site-header .navbar-brand img { width: 178px; height: auto; display: block; }
.site-header .navbar-toggler { border: 0; font-size: 1.6rem; color: var(--oov-navy); padding: .35rem .5rem; border-radius: var(--radius-control); }
.site-header .navbar-toggler:focus { box-shadow: var(--focus-ring); }
.site-header .navbar-nav { gap: .25rem; }
.site-header .nav-link { color: var(--oov-navy); font-weight: 600; font-size: .97rem; border-radius: var(--radius-control); padding: .55rem .8rem !important; display: flex; align-items: center; white-space: nowrap; }
.site-header .nav-link > .bi:first-child { font-size: 1.05rem; margin-right: .45rem !important; }
.site-header .nav-link.dropdown-toggle::after { border-top-width: .3em; border-left-width: .28em; border-right-width: .28em; margin-left: .4em; opacity: .7; }
.site-header .nav-link:hover, .site-header .nav-link.show { background: var(--oov-surface); color: var(--oov-navy); text-decoration: none; }
.site-header .nav-link.active { color: var(--oov-blue); box-shadow: inset 0 -2px 0 var(--oov-pink); }
.site-header .dropdown-menu { border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); box-shadow: var(--shadow-menu); padding: .6rem; }
.site-header .dropdown-item { border-radius: 8px; padding: .42rem .75rem; font-size: .94rem; color: var(--oov-text); display: flex; align-items: center; }
.site-header .dropdown-item .bi { color: var(--oov-blue); }
.site-header .dropdown-item:hover, .site-header .dropdown-item:focus { background: var(--oov-surface); color: var(--oov-navy); }
.site-header .dropdown-header { font-weight: 700; text-transform: uppercase; font-size: .72rem; letter-spacing: .06em; color: var(--oov-muted); }
.dropdown-columns { display: grid; grid-template-columns: 1fr 1fr; }
.btn-owner { display: inline-flex; align-items: center; border: 1px solid var(--oov-line); background: #fff; color: var(--oov-navy); padding: .35rem .9rem .35rem .7rem; line-height: 1.1; text-align: left; }
.btn-owner .bi { font-size: 1.6rem; color: var(--oov-blue); }
.btn-owner-label { display: block; font-weight: 700; font-size: .92rem; }
.btn-owner-sub { display: block; font-weight: 500; font-size: .76rem; color: var(--oov-muted); }
.btn-owner:hover { background: var(--oov-surface); border-color: #b5cff0; color: var(--oov-navy); text-decoration: none; }
.favorites-link { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; color: var(--oov-navy); font-size: 1.25rem; flex-shrink: 0; }
.favorites-link:hover { background: var(--oov-surface); color: var(--oov-pink-dark); }
.favorites-count { position: absolute; top: .1rem; right: 0; min-width: 1.15rem; height: 1.15rem; padding: 0 .3rem; border-radius: 999px; background: var(--oov-pink-dark); color: #fff; font-size: .68rem; font-weight: 700; line-height: 1.15rem; text-align: center; }
.favorites-count-inline { position: static; margin-left: .4rem; }
.favorites-count[hidden] { display: none; }
.header-actions { display: flex; align-items: center; gap: .25rem; margin-left: auto; }
@media (min-width: 992px) {
    .header-actions { display: none; }
    .site-header .offcanvas { flex-grow: 0; margin-left: auto; }
    .dropdown-menu-wide { min-width: 30rem; }
    .nav-item-owner { margin-left: .5rem; }
}
@media (max-width: 991.98px) {
    .site-header .offcanvas { max-width: 22rem; }
    .site-header .offcanvas-body .nav-link { padding: .75rem .75rem !important; font-size: 1.05rem; }
    .site-header .dropdown-menu { box-shadow: none; border: 0; background: var(--oov-section); margin: .25rem 0 .5rem; }
    .nav-item-owner { margin-top: 1rem; }
    .nav-item-owner .btn-owner { width: 100%; padding: .7rem .9rem; }
}
@media (max-width: 575.98px) {
    .site-header .navbar-brand img { width: 150px; }
}

/* Location suggestions */
.location-search { position: relative; }
.ls-results {
    position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 1060; margin: 0; padding: .35rem;
    background: #fff; border: 1px solid var(--oov-line-soft); border-radius: 12px; box-shadow: var(--shadow-menu); max-height: 22rem; overflow-y: auto; text-align: left;
}
.ls-option { display: flex; align-items: center; gap: .75rem; padding: .5rem .65rem; border-radius: 8px; cursor: pointer; }
.ls-option.is-active, .ls-option:hover { background: var(--oov-surface); }
.ls-name { font-weight: 600; color: var(--oov-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ls-type { margin-left: auto; flex-shrink: 0; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--oov-blue); background: var(--oov-surface); border-radius: 6px; padding: .15rem .5rem; }
.ls-empty { padding: .6rem .75rem; font-size: .9rem; color: var(--oov-muted); }

/* Hero: the stone house with its pool (legacy hero photo); a navy gradient behind the copy on the left. */
.hero { position: relative; z-index: 2; color: #fff; background: var(--oov-navy); isolation: isolate; }
.hero-media { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.hero-media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 60% 60%; }
.hero::before {
    content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background: linear-gradient(90deg, rgba(0, 29, 101, .88) 0%, rgba(0, 29, 101, .8) 34%, rgba(0, 29, 101, .55) 55%, rgba(0, 29, 101, .15) 72%, rgba(0, 29, 101, 0) 85%);
}
.hero-inner { padding-top: 3rem; padding-bottom: 3.25rem; }
.hero-eyebrow { display: inline-flex; align-items: center; font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; background: rgba(0, 29, 101, .55); border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; padding: .35rem .9rem; margin-bottom: 1rem; }
.hero-eyebrow .bi { color: var(--oov-sun); }
.hero-title { color: #fff; font-weight: 800; font-size: clamp(2.1rem, 3.6vw, 3.25rem); line-height: 1.06; letter-spacing: -.02em; margin-bottom: .8rem; max-width: 40rem; text-shadow: 0 2px 14px rgba(0, 10, 40, .35); }
.hero-lead { font-size: clamp(1rem, 1.2vw, 1.15rem); line-height: 1.55; max-width: 36rem; margin-bottom: 1.1rem; text-shadow: 0 1px 10px rgba(0, 10, 40, .5); }
.hero-trust { display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; margin: 0 0 1.6rem; font-weight: 600; font-size: .93rem; text-shadow: 0 1px 8px rgba(0, 10, 40, .55); }
.hero-trust li { display: flex; align-items: center; gap: .55rem; }
.hero-trust-icon { display: inline-flex; align-items: center; justify-content: center; width: 2.1rem; height: 2.1rem; border-radius: 50%; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 201, 0, .7); color: var(--oov-sun); text-shadow: none; }
.hero-search { background: #fff; color: var(--oov-text); border-radius: var(--radius-panel); box-shadow: 0 2px 6px rgba(0, 10, 40, .08), 0 16px 36px rgba(0, 10, 40, .18); padding: 1.1rem 1.35rem 1.35rem; max-width: 52rem; }
.hero-search-title { font-size: 1.1rem; font-weight: 800; margin-bottom: .8rem; }

/* Search form */
.search-fields { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.25fr) minmax(0, 1fr) auto; gap: .75rem; align-items: end; }
@media (max-width: 991.98px) { .search-fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .search-field-location, .search-submit { grid-column: 1 / -1; } }
.search-field .form-label, .search-advanced .form-label { font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--oov-muted); margin-bottom: .3rem; }
/* OOV-UX-02: the travellers' label is a <span> (it names a button): block like the <label>s so that the labels align. */
.search-field > .form-label { display: block; }
.field-with-icon { position: relative; }
.field-with-icon .field-icon { position: absolute; left: .85rem; top: 50%; transform: translateY(-50%); color: var(--oov-blue); pointer-events: none; font-size: 1.05rem; }
.field-with-icon .form-control, .field-with-icon .form-select { padding-left: 2.5rem; }
.search-form .form-control, .search-form .form-select { min-height: 3.1rem; border-color: var(--oov-line); background-color: #fff; font-size: 1rem; }
.search-form .form-control:focus, .search-form .form-select:focus { border-color: var(--oov-blue); box-shadow: var(--focus-ring); }
.btn-search { min-height: 3.1rem; padding-inline: 1.6rem; white-space: nowrap; }
.search-advanced { margin-top: .5rem; }
.btn-filters { padding-left: 0; font-weight: 600; color: var(--oov-blue); }
@media (max-width: 767.98px) {
    .search-fields { grid-template-columns: 1fr; }
    .btn-search { width: 100%; }
}
@media (max-width: 991.98px) {
    .hero::before { background: linear-gradient(180deg, rgba(0, 29, 101, .55) 0%, rgba(0, 29, 101, .82) 45%, rgba(0, 29, 101, .95) 100%); }
    .hero-inner { padding-top: 2rem; padding-bottom: 2rem; }
}

/* Sections */
.section { padding: 3.5rem 0; }
.section-alt { background: var(--oov-section); }
.section-head { max-width: 46rem; margin-bottom: 1.5rem; }
.section-kicker { display: inline-flex; align-items: center; gap: .6rem; font-size: .8rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--oov-pink-dark); margin-bottom: .4rem; }
.section-kicker::before { content: ""; width: 1.6rem; height: 3px; border-radius: 3px; background: var(--oov-pink); }
.section-kicker-light { color: #fff; }
.section-kicker-light::before { background: var(--oov-sun); }
.section-title { font-weight: 800; font-size: clamp(1.55rem, 2.4vw, 2.1rem); line-height: 1.15; margin-bottom: .5rem; }
.section-title span, .owner-band-title span, .page-title span { color: var(--oov-blue); }
.section-lead { color: var(--oov-muted); font-size: 1.05rem; margin-bottom: 0; }
.section-text { color: var(--oov-text); max-width: 62rem; margin-bottom: 1.75rem; }

/* Ad cards */
.ad-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; margin: 0; }
@media (max-width: 1199.98px) { .ad-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .ad-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; } }
@media (max-width: 479.98px) { .ad-grid { grid-template-columns: minmax(0, 1fr); } }
.ad-card { position: relative; height: 100%; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); box-shadow: var(--shadow-soft); overflow: hidden; transition: box-shadow .15s ease, transform .15s ease; }
.ad-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }
.ad-card-media { position: relative; aspect-ratio: 4 / 3; background: #eef2f8; overflow: hidden; min-height: 0; }
.ad-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ad-card-type { position: absolute; left: .7rem; bottom: .7rem; background: rgba(255, 255, 255, .94); color: var(--oov-navy); font-size: .74rem; font-weight: 700; border-radius: 999px; padding: .2rem .65rem; }
.ad-card-fav { position: absolute; z-index: 2; top: .6rem; right: .6rem; width: 2.3rem; height: 2.3rem; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .94); color: var(--oov-navy); display: inline-flex; align-items: center; justify-content: center; font-size: 1.05rem; box-shadow: 0 1px 4px rgba(0, 10, 40, .15); }
.ad-card-fav:hover { color: var(--oov-pink-dark); }
.ad-card-fav .fav-on { display: none; }
.ad-card-fav.selected { color: var(--oov-pink); }
.ad-card-fav.selected .fav-on { display: inline; }
.ad-card-fav.selected .fav-off { display: none; }
.ad-card-body { padding: .85rem 1rem 1rem; display: flex; flex-direction: column; flex: 1; }
.ad-card-place { font-size: .82rem; font-weight: 600; color: var(--oov-muted); margin-bottom: .25rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad-card-place .bi { color: var(--oov-pink); }
.ad-card-title { font-size: 1rem; font-weight: 700; line-height: 1.3; margin-bottom: .5rem; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ad-card-title a { color: var(--oov-navy); }
.ad-card-title a:hover { text-decoration: none; color: var(--oov-blue); }
.ad-card-type .bi { color: var(--oov-pink); }
.ad-card-facts { display: flex; flex-wrap: wrap; gap: .3rem .85rem; list-style: none; padding: 0; margin: 0 0 .6rem; font-size: .84rem; color: var(--oov-muted); }
.ad-card-facts li { display: inline-flex; align-items: center; gap: .3rem; white-space: nowrap; }
.ad-card-facts .bi { color: var(--oov-blue); }
@media (max-width: 575.98px) { .ad-card-facts { gap: .2rem .6rem; font-size: .8rem; } }
.ad-card-price { margin: auto 0 0; font-size: 1.1rem; color: var(--oov-navy); }
.ad-card-price .text-muted { font-size: .86rem; }
/* UX-ANNONCES-01A (R189-R191): price wording, highlights and the card of an ad without photo. */
.ad-card-price { font-size: 1rem; line-height: 1.35; }
.ad-card-price strong { font-size: 1.1rem; }
.ad-card-price-note { display: block; font-size: .8rem; color: var(--oov-muted); }
.ad-card-price-note::first-letter { text-transform: uppercase; }
.ad-card-price-sep { display: none; }
.ad-card-price-none { font-size: .88rem; color: var(--oov-muted); }
.ad-card-highlights { display: flex; flex-wrap: wrap; gap: .3rem; margin: 0 0 .6rem; padding: 0; list-style: none; }
.ad-card-highlights li { display: inline-flex; align-items: center; font-size: .78rem; font-weight: 600; color: var(--oov-navy); background: var(--oov-surface); border-radius: 999px; padding: .15rem .6rem; }
.ad-card-highlights .bi { color: var(--oov-blue); }
.ad-card-nophoto { position: absolute; left: 0; right: 0; bottom: 2.9rem; text-align: center; font-size: .82rem; font-weight: 600; color: #4f5d75; display: flex; align-items: center; justify-content: center; pointer-events: none; }

/* List pages (register R37) */
.page-head-listing { padding-bottom: 1.25rem; }
.page-head-listing .page-title { font-size: clamp(1.6rem, 2.6vw, 2.2rem); }
.listing-search-band { background: #fff; border-bottom: 1px solid var(--oov-line-soft); padding: 1rem 0; }
.listing-search { background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--radius-panel); box-shadow: var(--shadow-soft); padding: 1rem 1.15rem; }
.listing-search-toggle { width: 100%; display: flex; align-items: center; border: 1px solid var(--oov-line); background: #fff; color: var(--oov-navy); padding: .7rem 1rem; }
.listing-search-toggle:not(.collapsed) { margin-bottom: .75rem; }
.listing-container { padding-top: 1.75rem; padding-bottom: 3rem; }
.listing-with-filters { display: grid; grid-template-columns: 18.5rem minmax(0, 1fr); gap: 1.75rem; align-items: start; }
@media (max-width: 991.98px) { .listing-with-filters { grid-template-columns: minmax(0, 1fr); gap: 0; } }
.listing-sidebar { position: sticky; top: calc(var(--header-h) + 1rem); }
@media (max-width: 991.98px) { .listing-sidebar { position: static; } }
@media (min-width: 992px) {
    .listing-filters { background: var(--oov-section); border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); padding: 1rem; max-height: calc(100vh - var(--header-h) - 2rem); overflow-y: auto; }
    .listing-filters .offcanvas-body { padding: 0; display: block; }
}
.listing-filters-title { align-items: center; font-weight: 800; color: var(--oov-navy); margin-bottom: .6rem; }
.listing-filters-title .bi, .listing-filters .offcanvas-title .bi { color: var(--oov-pink); }
.filter-group { border-bottom: 1px solid var(--oov-line); padding: .45rem 0; }
.filter-group summary { cursor: pointer; font-weight: 700; color: var(--oov-navy); font-size: .95rem; padding: .25rem 0; list-style: none; display: flex; align-items: center; gap: .4rem; }
.filter-group summary::-webkit-details-marker { display: none; }
.filter-group summary::after { content: ""; margin-left: auto; width: .5rem; height: .5rem; border-right: 2px solid var(--oov-muted); border-bottom: 2px solid var(--oov-muted); transform: rotate(45deg); transition: transform .15s ease; }
.filter-group[open] summary::after { transform: rotate(-135deg); }
.filter-badge { display: inline-block; min-width: 1.3rem; padding: 0 .35rem; border-radius: 999px; background: var(--oov-blue); color: #fff; font-size: .72rem; text-align: center; }
.filter-options { padding: .3rem 0 .4rem; font-size: .92rem; }
.filter-options .form-check { margin-bottom: .2rem; }
.filter-actions { position: sticky; bottom: 0; padding-top: .8rem; background: inherit; display: grid; gap: .25rem; text-align: center; }
.listing-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin-bottom: 1.25rem; }
.listing-filters-toggle { border: 1px solid var(--oov-line); background: #fff; color: var(--oov-navy); }
.listing-count { margin: 0; color: var(--oov-muted); }
.listing-count strong { color: var(--oov-navy); font-size: 1.1rem; }
.listing-sort { margin-left: auto; min-width: 14rem; }
.listing-sort .form-select { min-height: 2.6rem; }
@media (max-width: 575.98px) { .listing-sort { margin-left: 0; width: 100%; } }
.ad-grid-listing { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1199.98px) { .ad-grid-listing { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 991.98px) { .ad-grid-listing { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .ad-grid-listing { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 479.98px) { .ad-grid-listing { grid-template-columns: minmax(0, 1fr); } }
.listing-pager { margin-top: 2rem; }
.pagination { --bs-pagination-color: var(--oov-blue); --bs-pagination-active-bg: var(--oov-blue); --bs-pagination-active-border-color: var(--oov-blue); --bs-pagination-border-color: var(--oov-line); --bs-pagination-hover-bg: var(--oov-surface); --bs-pagination-focus-box-shadow: var(--focus-ring); gap: .3rem; }
.pagination .page-link { border-radius: var(--radius-control) !important; font-weight: 600; min-width: 2.5rem; text-align: center; display: inline-flex; align-items: center; justify-content: center; }
.listing-empty { text-align: center; background: var(--oov-section); border: 1px dashed var(--oov-line); border-radius: var(--card-radius); padding: 2.25rem 1.5rem; }
.listing-empty-icon { font-size: 2.4rem; color: var(--oov-pink); margin-bottom: .75rem; }
.listing-empty-title { font-weight: 800; color: var(--oov-navy); font-size: 1.15rem; }
.listing-empty-subtitle { font-weight: 700; color: var(--oov-navy); margin: 1.25rem 0 .6rem; }
.chip-count { margin-left: .4rem; font-size: .75rem; color: var(--oov-muted); font-weight: 700; }
.listing-seo p { max-width: 62rem; }
.sublocation-list { columns: 4 12rem; column-gap: 1.5rem; margin: 0; font-size: .93rem; }
.sublocation-list li { padding: .12rem 0; break-inside: avoid; }

/* Favourites */
.favorites-body { padding-top: 2rem; padding-bottom: 3rem; }
.favorites-note { color: var(--oov-muted); margin: 2rem 0 0; max-width: 52rem; }

/* Search and filter controls (register R40-R42) */
.form-label-optional { font-weight: 500; text-transform: none; letter-spacing: 0; }
.date-range-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; }
[data-date-range].is-enhanced .date-range-inputs { display: block; }
.guests-toggle { display: flex; align-items: center; gap: .55rem; text-align: left; min-height: 3.1rem; cursor: pointer; position: relative; padding-left: 2.5rem; }
.guests-toggle .field-icon { position: absolute; left: .85rem; color: var(--oov-blue); font-size: 1.05rem; }
.guests-toggle span { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.guests-chevron { color: var(--oov-muted); font-size: .8rem; }
.guests-menu { width: 19rem; padding: .9rem 1rem; border-radius: var(--card-radius); border: 1px solid var(--oov-line-soft); box-shadow: var(--shadow-menu); }
.stepper { display: grid; grid-template-columns: 1fr auto 3rem auto; align-items: center; gap: .4rem; padding: .45rem 0; }
.stepper + .stepper { border-top: 1px solid var(--oov-line-soft); }
.stepper-label strong { display: block; color: var(--oov-navy); }
.stepper-label small { color: var(--oov-muted); }
.stepper-btn { width: 2.4rem; height: 2.4rem; border-radius: 50%; border: 1px solid var(--oov-line); background: #fff; color: var(--oov-blue); font-size: 1.2rem; font-weight: 700; line-height: 1; }
.stepper-btn:hover:not(:disabled) { border-color: var(--oov-blue); background: var(--oov-surface); }
.stepper-btn:disabled { opacity: .4; }
.stepper-input { width: 3rem; text-align: center; border: 0; font-weight: 700; color: var(--oov-navy); -moz-appearance: textfield; appearance: textfield; background: transparent; }
.stepper-input::-webkit-outer-spin-button, .stepper-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.guests-note { font-size: .78rem; color: var(--oov-muted); margin: .5rem 0 0; }
.chip-field { border: 0; padding: 0; margin: .85rem 0 0; min-width: 0; }
.chip-field legend { float: none; width: auto; font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--oov-muted); margin-bottom: .35rem; }
.chip-scroller { display: flex; gap: .4rem; overflow-x: auto; padding: .1rem .1rem .45rem; scrollbar-width: thin; scroll-snap-type: x proximity; }
.chip-scroller > * { flex-shrink: 0; scroll-snap-align: start; }
.chip-row { display: flex; flex-wrap: wrap; gap: .4rem; }
.btn-chip { --bs-btn-padding-y: .38rem; --bs-btn-padding-x: .85rem; --bs-btn-font-size: .88rem; --bs-btn-font-weight: 600; --bs-btn-border-radius: var(--radius-chip);
    --bs-btn-color: var(--oov-navy); --bs-btn-bg: #fff; --bs-btn-border-color: var(--oov-line);
    --bs-btn-hover-color: var(--oov-navy); --bs-btn-hover-bg: var(--oov-surface); --bs-btn-hover-border-color: #b5cff0;
    --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--oov-blue); --bs-btn-active-border-color: var(--oov-blue);
    min-height: 2.3rem; display: inline-flex; align-items: center; white-space: nowrap; }
.btn-check:checked + .btn-chip { color: #fff; background: var(--oov-blue); border-color: var(--oov-blue); }
.btn-check:focus-visible + .btn-chip { outline: 3px solid var(--oov-blue); outline-offset: 2px; box-shadow: none; }
.btn-chip-sm { --bs-btn-padding-y: .25rem; --bs-btn-padding-x: .65rem; --bs-btn-font-size: .82rem; min-height: 2rem; }
@media (pointer: coarse) { .btn-chip, .btn-chip-sm { min-height: 2.75rem; } }
.advanced-grid { display: grid; grid-template-columns: repeat(3, minmax(0, auto)); gap: 0 1.5rem; justify-content: start; }
@media (max-width: 767.98px) { .advanced-grid { grid-template-columns: 1fr; } }
.surface-inputs { display: flex; align-items: center; gap: .4rem; }
.surface-inputs .form-control { width: 6rem; min-height: 2.5rem; }

.filter-legend { font-weight: 700; color: var(--oov-navy); font-size: .95rem; float: none; width: auto; margin-bottom: .2rem; }
.filter-hint { font-size: .76rem; color: var(--oov-muted); font-weight: 500; }
.filter-price { border: 0; border-bottom: 1px solid var(--oov-line); margin: 0; padding: .45rem 0 .8rem; min-width: 0; }
.price-range-output { font-weight: 700; color: var(--oov-blue); margin: 0 0 .25rem; font-size: .92rem; }
.price-range-track { position: relative; height: 2rem; }
.price-range-track::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 4px; margin-top: -2px; border-radius: 4px; background: var(--oov-line); }
.price-range-fill { position: absolute; top: 50%; height: 4px; margin-top: -2px; border-radius: 4px; background: var(--oov-blue); left: 0; right: 0; }
.price-range-track .form-range { position: absolute; inset: 0; height: 2rem; background: transparent; pointer-events: none; }
.price-range-track .form-range::-webkit-slider-runnable-track { background: transparent; }
.price-range-track .form-range::-moz-range-track { background: transparent; }
.price-range-track .form-range::-webkit-slider-thumb { pointer-events: auto; width: 1.4rem; height: 1.4rem; margin-top: -.45rem; background: #fff; border: 2px solid var(--oov-blue); box-shadow: var(--shadow-soft); }
.price-range-track .form-range::-moz-range-thumb { pointer-events: auto; width: 1.25rem; height: 1.25rem; background: #fff; border: 2px solid var(--oov-blue); }
.price-range-track .form-range:focus-visible::-webkit-slider-thumb { box-shadow: var(--focus-ring); }
.price-range-track .form-range:focus-visible::-moz-range-thumb { box-shadow: var(--focus-ring); }
.price-range-numbers { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin: .35rem 0; font-size: .8rem; color: var(--oov-muted); }
.input-euro { display: flex; align-items: center; gap: .3rem; }
.input-euro .form-control { min-width: 0; }

.active-filters { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: -.4rem 0 1rem; }
.chip-active { background: var(--oov-blue); color: #fff; padding: .3rem .75rem; font-size: .84rem; }
.chip-active .bi { color: #fff; font-size: .7rem; }
.chip-active:hover { background: var(--oov-blue-hover); color: #fff; }
.chip-clear { font-size: .84rem; font-weight: 600; margin-left: .25rem; }
.listing-notice { display: flex; align-items: flex-start; background: var(--oov-warm); border: 1px solid #f3dfa6; border-radius: 12px; padding: .65rem .9rem; font-size: .9rem; color: var(--oov-text); }
.listing-notice .bi { color: #a36d00; margin-top: .15rem; flex-shrink: 0; }
.btn-sort { border: 1px solid var(--oov-line); background: #fff; color: var(--oov-navy); min-height: 2.6rem; }
.btn-sort:hover, .btn-sort.show { background: var(--oov-surface); color: var(--oov-navy); }
.listing-sort .dropdown-menu { border-radius: 12px; box-shadow: var(--shadow-menu); border: 1px solid var(--oov-line-soft); padding: .35rem; }
.listing-sort .dropdown-item { border-radius: 8px; font-size: .92rem; }
.listing-sort .dropdown-item.active { background: var(--oov-surface); color: var(--oov-blue); font-weight: 700; }
.listing-sort { min-width: 0; }
@media (max-width: 575.98px) { .listing-sort { width: auto; margin-left: auto; } }

/* Mobile list: sticky compact search bar, offcanvas filters with a sticky results button. */
@media (max-width: 767.98px) {
    .listing-search-band { position: sticky; top: var(--header-h); z-index: 1010; padding: .5rem 0; box-shadow: 0 2px 8px rgba(0, 29, 101, .06); }
    .listing-search-band .collapse.show, .listing-search-band .collapsing { max-height: calc(100vh - var(--header-h) - 4rem); overflow-y: auto; }
    .listing-search-toggle { padding: .55rem .9rem; }
}
@media (max-width: 991.98px) {
    .listing-filters .offcanvas-body { padding-bottom: 0; }
    .filter-actions { position: sticky; bottom: 0; background: #fff; margin: 0 -1rem; padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--oov-line-soft); box-shadow: 0 -4px 12px rgba(0, 29, 101, .06); }
}

/* Card photo slider (register R44) */
/* OOV-CARD-01: above the title's stretched link (Bootstrap .stretched-link::after, z-index 1, later in the card), so the
   arrows, the photo links and swipes reach the slider. Two classes: Swiper's own stylesheet (.swiper { z-index: 1 }),
   added by card-slider.js after this file, must not win on order. */
.ad-card-media .ad-card-slider { position: relative; z-index: 2; width: 100%; height: 100%; }
.ad-card-slider .swiper-slide { display: block; height: 100%; }
.ad-card-slider .swiper-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ad-card-slider .swiper-pagination { bottom: .5rem; }
.ad-card-slider .swiper-pagination-bullet { background: #fff; opacity: .7; }
.ad-card-slider .swiper-pagination-bullet-active { opacity: 1; }
.ad-card-nav { position: absolute; z-index: 3; top: 50%; transform: translateY(-50%); width: 2rem; height: 2rem; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--oov-navy); display: inline-flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .15s ease; box-shadow: 0 1px 4px rgba(0, 10, 40, .2); }
.ad-card-prev { left: .5rem; }
.ad-card-next { right: .5rem; }
.ad-card:hover .ad-card-nav, .ad-card-nav:focus-visible { opacity: 1; }
.ad-card-nav.swiper-button-disabled { visibility: hidden; }
@media (hover: none) { .ad-card-nav { display: none; } }
.ad-card-type, .ad-card-fav { z-index: 3; }

/* Owners' band */
.owner-band { background: var(--oov-navy); color: #fff; padding: 3rem 0; position: relative; overflow: hidden; }
.owner-band::after { content: ""; position: absolute; right: -6rem; top: -6rem; width: 18rem; height: 18rem; border-radius: 50%; background: radial-gradient(circle, rgba(255, 201, 0, .35), rgba(255, 201, 0, 0) 70%); pointer-events: none; }
.owner-band-inner { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 2rem; align-items: center; position: relative; z-index: 1; }
.owner-band-title { color: #fff; font-weight: 800; font-size: clamp(1.6rem, 2.6vw, 2.2rem); }
.owner-band-title span { color: var(--oov-blue-light); }
.owner-band p { color: rgba(255, 255, 255, .9); max-width: 40rem; }
.owner-band-points { margin: 0; display: grid; gap: .8rem; font-weight: 600; }
.owner-band-points li { background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .16); border-radius: 12px; padding: .8rem 1rem; display: flex; align-items: center; }
.owner-band-points .bi { color: var(--oov-sun); font-size: 1.15rem; }
@media (max-width: 767.98px) { .owner-band-inner { grid-template-columns: 1fr; } }

/* Benefits */
.benefit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; margin: 0; }
@media (max-width: 767.98px) { .benefit-grid { grid-template-columns: 1fr; } }
.benefit { background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); padding: 1.4rem; box-shadow: var(--shadow-soft); }
.benefit-icon { display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; border-radius: 14px; background: var(--oov-surface); color: var(--oov-blue); font-size: 1.35rem; margin-bottom: .9rem; }
.benefit:nth-child(2) .benefit-icon { background: var(--oov-pink-soft); color: var(--oov-pink-dark); }
.benefit:nth-child(3) .benefit-icon { background: var(--oov-warm); color: #a36d00; }
.benefit-title { font-size: 1.1rem; font-weight: 700; }
.benefit p { color: var(--oov-muted); margin: 0; }
.why-more p, .why-more li { color: var(--oov-text); }

/* Inspiration themes */
.theme-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; margin: 0; }
@media (max-width: 991.98px) { .theme-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 479.98px) { .theme-grid { grid-template-columns: 1fr; } }
.theme-card { position: relative; height: 100%; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); overflow: hidden; box-shadow: var(--shadow-soft); transition: box-shadow .15s ease; }
.theme-card:hover { box-shadow: var(--shadow-hover); }
.theme-card img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.theme-card-body { padding: 1rem 1.1rem 1.2rem; display: flex; flex-direction: column; flex: 1; }
.theme-card-title { font-size: 1.1rem; font-weight: 800; display: flex; align-items: center; }
.theme-card-title .bi { color: var(--oov-pink); }
.theme-card-title a { color: var(--oov-navy); }
.theme-card-body p { font-size: .9rem; color: var(--oov-muted); }
.theme-card-cta { margin-top: auto; font-weight: 700; color: var(--oov-blue); font-size: .92rem; }

/* Chips (regions, countries, error links) */
.chip-list { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; }
.chip { display: inline-flex; align-items: center; padding: .45rem .9rem; border-radius: var(--radius-chip); background: var(--oov-surface); color: var(--oov-navy); font-weight: 600; font-size: .9rem; border: 1px solid transparent; }
.chip .bi { color: var(--oov-blue); }
.chip:hover { background: #dce9fb; text-decoration: none; color: var(--oov-navy); }
.chip-outline { background: #fff; border-color: var(--oov-line); }

/* Homepage sections (HOME-01, registers R182-R188). */
/* Fewer ad cards below 1200 and 768 px. The hidden cards are lazy (no image request while hidden) and their sliders
   are built only near the viewport (card-slider.js), so a hidden card costs its markup only. */
@media (max-width: 1199.98px) { .home-ads-featured .ad-grid > li:nth-child(n+7), .home-ads-new .ad-grid > li:nth-child(n+4) { display: none; } }
@media (max-width: 767.98px) { .home-ads-featured .ad-grid > li:nth-child(n+5), .home-ads-new .ad-grid > li:nth-child(n+3) { display: none; } }
.home-count { margin: 0; color: var(--oov-muted); font-size: .9rem; font-weight: 600; }
.page-home .chip .chip-count { margin-left: .2rem; }
.home-situations { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; margin: 0; }
@media (max-width: 991.98px) { .home-situations { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; } }
.home-situation { position: relative; height: 100%; background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); overflow: hidden; box-shadow: var(--shadow-soft); transition: box-shadow .15s ease; }
.home-situation:hover { box-shadow: var(--shadow-hover); }
.home-situation img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.home-situation-body { padding: .85rem 1rem 1rem; }
.home-situation-title { font-size: 1.1rem; font-weight: 800; display: flex; align-items: center; margin-bottom: .2rem; }
.home-situation-title .bi { color: var(--oov-pink); flex-shrink: 0; }
.home-situation-title a { color: var(--oov-navy); }
@media (max-width: 575.98px) { .home-situation-title { font-size: 1rem; } .home-situation-body { padding: .7rem .8rem .8rem; } .home-situation .home-count { font-size: .85rem; } }
.home-regions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 0 0 .5rem; }
@media (max-width: 767.98px) { .home-regions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; } }
.home-region { display: flex; flex-direction: column; justify-content: space-between; gap: .35rem; height: 100%; padding: 1rem 1.1rem; background: var(--oov-surface); border: 1px solid transparent; border-radius: var(--card-radius); color: var(--oov-navy); transition: background .15s ease; }
.home-region:hover { background: #dce9fb; color: var(--oov-navy); text-decoration: none; }
.home-region-name { display: flex; align-items: flex-start; font-weight: 800; font-size: 1.05rem; line-height: 1.25; }
.home-region-name .bi { color: var(--oov-pink); flex-shrink: 0; margin-top: .15rem; }
@media (max-width: 575.98px) { .home-region { padding: .8rem .85rem; } .home-region-name { font-size: .95rem; } }
.home-subtitle { font-size: 1.1rem; font-weight: 700; margin: 1.5rem 0 .75rem; }
.home-benefits { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1199.98px) { .home-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .home-benefits { grid-template-columns: minmax(0, 1fr); } }
.home-benefits .benefit:nth-child(4) .benefit-icon { background: var(--oov-surface); color: var(--oov-navy); }
.owner-band-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.5rem; }
.owner-band-link { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.owner-band-link:hover { color: var(--oov-blue-light); }
.testimonials-reviews { margin-top: 1.5rem; padding: 1rem 1.1rem; border-radius: 12px; background: var(--oov-surface); }
.testimonials-reviews-title { display: flex; align-items: center; font-weight: 700; color: var(--oov-navy); margin-bottom: .35rem; }
.testimonials-reviews-title .bi { color: var(--oov-blue); }
.testimonials-reviews p:not(.testimonials-reviews-title) { font-size: .92rem; margin-bottom: .4rem; }
.testimonials-reviews a { font-weight: 600; font-size: .92rem; }
/* Hero trust points: as wide as the title, so that they stay on the darker part of the photo overlay. */
.page-home .hero-trust { max-width: 40rem; }
/* Hero on phones (HOME-01 follow-up, measured 2026-10-14): compact copy so that the whole search card fits the first
   screen of a 390x844 phone. The eyebrow repeats the H1 ("entre particuliers"); the form itself is unchanged. */
@media (max-width: 575.98px) {
    .page-home .hero-eyebrow { display: none; }
    .page-home .hero-inner { padding-top: 1.1rem; padding-bottom: 1.25rem; }
    .page-home .hero-title { font-size: 1.9rem; margin-bottom: .5rem; }
    .page-home .hero-lead { font-size: .95rem; margin-bottom: .65rem; }
    .page-home .hero-trust { gap: .25rem 1rem; font-size: .85rem; margin-bottom: .85rem; }
    .page-home .hero-trust-icon { width: 1.4rem; height: 1.4rem; }
    .page-home .hero-search { padding: .9rem 1rem; }
    .page-home .hero-search-title { font-size: 1rem; margin-bottom: .5rem; }
}
/* Very narrow phones (375 px, e.g. 375x667): the trust points are drawn under the search card so that "Rechercher" is
   in the first screen. Visual order only: the HTML order (and so the reading order) is unchanged, and the list holds no
   focusable element, so the keyboard order is unchanged too. */
@media (max-width: 389.98px) {
    .page-home .hero-inner { display: flex; flex-direction: column; }
    .page-home .hero-trust { order: 1; margin: .9rem 0 0; }
}
/* Destinations on phones and small tablets: the other regions and the countries behind "Voir toutes les destinations"
   (Bootstrap collapse; from 768 px on the list is always open and the button hidden: d-md-block / d-md-none). */
.home-destinations-toggle .bi { transition: transform .15s ease; }
.home-destinations-toggle:not(.collapsed) .bi { transform: rotate(180deg); }
.home-destinations-toggle.collapsed .home-toggle-open, .home-destinations-toggle:not(.collapsed) .home-toggle-closed { display: none; }
/* R199: the homepage form has no accommodation row; the card closes on the fields with the same inner spacing. */
@media (min-width: 576px) { .page-home .hero-search { padding-bottom: 1.1rem; } }
.region-columns { columns: 3 16rem; column-gap: 2rem; }
.region-block { break-inside: avoid; margin-bottom: 1.4rem; }
.region-name { font-weight: 800; font-size: 1.05rem; margin-bottom: .35rem; }
.region-name a { color: var(--oov-navy); }
.region-departments { margin: 0; font-size: .92rem; }
.region-departments li { padding: .1rem 0; }
.dept-code { color: var(--oov-muted); font-size: .8rem; font-weight: 600; }

/* Inner pages */
.page-head { background: linear-gradient(180deg, var(--oov-surface) 0%, #fff 100%); border-bottom: 1px solid var(--oov-line-soft); padding: 1.25rem 0 2rem; }
.breadcrumb { font-size: .86rem; margin-bottom: 1.1rem; --bs-breadcrumb-divider-color: var(--oov-muted); --bs-breadcrumb-item-active-color: var(--oov-muted); }
.breadcrumb a { color: var(--oov-blue); font-weight: 600; }
.page-title { font-weight: 800; font-size: clamp(1.8rem, 3vw, 2.5rem); line-height: 1.12; margin-bottom: .5rem; }
.page-lead { color: var(--oov-muted); font-size: 1.08rem; max-width: 52rem; margin-bottom: 0; }
.static-body { padding-top: 2.25rem; padding-bottom: 3.5rem; }
.prose { font-size: 1.02rem; line-height: 1.7; }
.prose h2 { font-size: 1.45rem; font-weight: 800; margin: 2rem 0 .75rem; }
.prose h3 { font-size: 1.2rem; font-weight: 700; margin: 1.6rem 0 .6rem; }
.prose h4 { font-size: 1.05rem; font-weight: 700; margin: 1.3rem 0 .5rem; }
.prose > :first-child { margin-top: 0; }
.legal-list { display: grid; grid-template-columns: max-content 1fr; gap: .35rem 1.25rem; background: var(--oov-section); border: 1px solid var(--oov-line-soft); border-radius: 12px; padding: 1rem 1.25rem; }
.legal-list dt { font-weight: 600; color: var(--oov-navy); }
.legal-list dd { margin: 0; }
@media (max-width: 575.98px) { .legal-list { grid-template-columns: 1fr; } .legal-list dd { margin-bottom: .4rem; } }
.aside-card { background: var(--oov-section); border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); padding: 1.2rem 1.3rem; margin-bottom: 1rem; }
.aside-title { font-weight: 800; color: var(--oov-navy); display: flex; align-items: center; margin-bottom: .6rem; }
.aside-title .bi { color: var(--oov-pink); }
.aside-card li { padding: .2rem 0; }
.contact-form .form-control { min-height: 2.9rem; }
.thankyou-card { display: flex; gap: 1.25rem; align-items: flex-start; background: var(--oov-section); border-radius: var(--card-radius); padding: 1.5rem; }
.thankyou-icon { font-size: 2.4rem; color: #198754; line-height: 1; }
.faq-accordion { --bs-accordion-border-color: var(--oov-line-soft); --bs-accordion-border-radius: var(--card-radius); --bs-accordion-inner-border-radius: var(--card-radius); --bs-accordion-active-bg: var(--oov-surface); --bs-accordion-active-color: var(--oov-navy); --bs-accordion-btn-focus-box-shadow: var(--focus-ring); }
.faq-accordion .accordion-item { margin-bottom: .6rem; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); overflow: hidden; }
.faq-accordion .accordion-button { font-weight: 700; color: var(--oov-navy); font-size: 1.02rem; }
.faq-accordion .accordion-body { line-height: 1.65; }
.faq-accordion .accordion-body > :last-child { margin-bottom: 0; }

/* Publish landing */
.publish-hero { background: linear-gradient(180deg, var(--oov-pink-soft) 0%, #fff 100%); padding: 1.25rem 0 3rem; }
.publish-hero-img { width: 100%; height: auto; border-radius: var(--radius-panel); box-shadow: var(--shadow-hover); }
.steps { counter-reset: none; display: grid; gap: .75rem; margin-bottom: 1.25rem; }
.steps li { display: flex; gap: .9rem; align-items: center; background: #fff; border: 1px solid var(--oov-line-soft); border-radius: 12px; padding: .85rem 1rem; box-shadow: var(--shadow-soft); }
.step-number { flex-shrink: 0; width: 2.2rem; height: 2.2rem; border-radius: 50%; background: var(--oov-pink-dark); color: #fff; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; }

/* Search page */
.search-hero { position: relative; z-index: 2; color: #fff; background: var(--oov-navy); isolation: isolate; }
.search-hero-media { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.search-hero-media img { width: 100%; height: 100%; object-fit: cover; }
.search-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0, 29, 101, .78), rgba(0, 29, 101, .9)); }
.search-hero-inner { padding-top: 1.25rem; padding-bottom: 3rem; }
.search-hero .breadcrumb a, .search-hero .breadcrumb { color: #fff; --bs-breadcrumb-divider-color: rgba(255, 255, 255, .7); --bs-breadcrumb-item-active-color: rgba(255, 255, 255, .85); }

/* Error and gone pages */
.error-page { padding: 3.5rem 0 4rem; background: linear-gradient(180deg, var(--oov-surface) 0%, #fff 60%); }
.error-card { max-width: 42rem; margin: 0 auto; text-align: center; background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--radius-panel); box-shadow: var(--shadow-soft); padding: 2.5rem 1.75rem; }
.error-code { font-size: clamp(3.5rem, 9vw, 5.5rem); font-weight: 900; line-height: 1; margin-bottom: .75rem; background: linear-gradient(90deg, var(--oov-pink) 0%, var(--oov-blue) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.error-heading { font-weight: 800; font-size: clamp(1.5rem, 3vw, 2rem); }
.error-text { color: var(--oov-muted); font-size: 1.05rem; }
.error-links { max-width: 42rem; margin: 2rem auto 0; text-align: center; }
.error-links-title { font-weight: 700; color: var(--oov-navy); }

/* Footer: navy, link columns, legal row. */
.site-footer { background: var(--oov-navy); color: rgba(255, 255, 255, .86); margin-top: 0; }
.site-footer a { color: #fff; }
.site-footer a:hover { color: var(--oov-blue-light); }
.footer-logo { display: inline-block; background: #fff; border-radius: 12px; padding: .5rem .75rem; line-height: 0; }
.footer-title { color: #fff; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; font-size: .78rem; margin-bottom: .75rem; }
.site-footer li { padding: .2rem 0; }
.social-link { display: inline-flex; align-items: center; justify-content: center; width: 2.3rem; height: 2.3rem; border-radius: 50%; background: rgba(255, 255, 255, .1); color: #fff; }
.social-link:hover { background: rgba(255, 255, 255, .2); color: #fff; }
.footer-bottom { border-top: 1px solid rgba(255, 255, 255, .14); }
.footer-legal .list-inline-item:not(:last-child) { margin-right: 1rem; }
/* R202 (OOV-UX-02): the "© OOVacances" link sits inside a sentence: underlined so that it is not told apart by colour
   alone (axe link-in-text-block; colours unchanged). */
.footer-copyright a { text-decoration: underline; text-underline-offset: .2em; }

/* Ad page (MIG-010, register R47): mobile first; the booking box is a right column from 992 px, a sticky bar below. */
.ad-head { background: linear-gradient(180deg, var(--oov-surface) 0%, #fff 100%); padding: 1rem 0 1rem; }
.ad-head .breadcrumb { margin-bottom: .75rem; flex-wrap: nowrap; overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
.ad-head .breadcrumb::-webkit-scrollbar { display: none; }
/* UX-ANNONCES-01B: the items keep their width (they used to shrink and overlap on phones); the line scrolls. */
.ad-head .breadcrumb-item { flex-shrink: 0; }
.ad-owner-title { font-size: clamp(1.05rem, 1.6vw, 1.2rem); font-weight: 700; color: var(--oov-navy); line-height: 1.3; margin: .1rem 0 .35rem; overflow-wrap: anywhere; }
@media (max-width: 575.98px) { .ad-head { padding-bottom: .75rem; } .ad-layout { padding-top: .75rem; } .ad-summary { font-size: .9rem; gap: .25rem .9rem; } }
.ad-summary { display: flex; flex-wrap: wrap; gap: .3rem 1.1rem; margin: .5rem 0 0; color: var(--oov-navy); font-weight: 600; font-size: .95rem; }
.ad-summary li { display: inline-flex; align-items: center; gap: .4rem; }
.ad-summary .bi { color: var(--oov-blue); }
.ad-head-row { display: flex; gap: 1rem; align-items: flex-start; justify-content: space-between; }
.ad-kicker { display: inline-flex; align-items: center; font-size: .78rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--oov-pink-dark); margin-bottom: .35rem; }
.ad-title { font-weight: 800; font-size: clamp(1.45rem, 3vw, 2.2rem); line-height: 1.15; margin-bottom: .4rem; }
.ad-place { color: var(--oov-muted); font-weight: 600; margin: 0; }
.ad-place .bi { color: var(--oov-pink); }
.ad-head-actions { display: flex; gap: .4rem; flex-shrink: 0; }
.btn-icon { width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1px solid var(--oov-line); background: #fff; color: var(--oov-navy); display: inline-flex; align-items: center; justify-content: center; padding: 0; font-size: 1.15rem; }
.btn-icon:hover, .btn-icon.show { background: var(--oov-surface); color: var(--oov-navy); }
.btn-icon .fav-on { display: none; }
.btn-icon.selected { color: var(--oov-pink); }
.btn-icon.selected .fav-on { display: inline; }
.btn-icon.selected .fav-off { display: none; }
.share-menu { border-radius: 12px; box-shadow: var(--shadow-menu); border: 1px solid var(--oov-line-soft); padding: .35rem; }
.share-menu .dropdown-item { border-radius: 8px; display: flex; align-items: center; }
.share-menu .bi { color: var(--oov-blue); }

.ad-gallery-section { padding-bottom: .5rem; }
.ad-gallery { position: relative; }
.ad-gallery-main { border-radius: var(--card-radius); overflow: hidden; background: #eef2f8; aspect-ratio: 3 / 2; max-height: 34rem; width: 100%; }
.ad-gallery-main .swiper-slide { height: 100%; }
.ad-gallery-open { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.ad-gallery-open img, .ad-gallery-empty img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ad-gallery-nav { position: absolute; z-index: 3; top: 50%; transform: translateY(-50%); width: 2.6rem; height: 2.6rem; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .94); color: var(--oov-navy); display: inline-flex; align-items: center; justify-content: center; box-shadow: var(--shadow-soft); }
.ad-gallery-prev { left: .75rem; }
.ad-gallery-next { right: .75rem; }
.ad-gallery-nav.swiper-button-disabled { opacity: .35; }
@media (hover: none) { .ad-gallery-nav { display: none; } }
.ad-gallery-main .swiper-pagination { left: .75rem; bottom: .75rem; width: auto; background: rgba(0, 29, 101, .7); color: #fff; font-size: .8rem; font-weight: 700; border-radius: 999px; padding: .15rem .6rem; }
.ad-gallery-count { position: absolute; z-index: 3; right: .75rem; bottom: .75rem; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .95); color: var(--oov-navy); font-weight: 700; font-size: .85rem; padding: .4rem .85rem; display: inline-flex; align-items: center; box-shadow: var(--shadow-soft); }
.ad-gallery-thumbs { margin-top: .5rem; }
.ad-gallery-thumbs .swiper-slide { width: 6.5rem; aspect-ratio: 3 / 2; border-radius: 8px; overflow: hidden; opacity: .6; cursor: pointer; border: 2px solid transparent; }
.ad-gallery-thumbs .swiper-slide-thumb-active { opacity: 1; border-color: var(--oov-blue); }
.ad-gallery-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* R201 (OOV-UX-02): the layout Swiper's stylesheet gives the gallery, from the first paint. swiper.min.css comes with the
   page script (~2 s on a slow phone): until then the slides were stacked and the main photo drawn at its natural ratio,
   then re-laid out, which browsers report as a late LCP; the thumbnails (visible after load on every width) appeared
   late too. Same rules as Swiper 11 (track, slide width, 8 px thumbnail spacing = spaceBetween in ad-page.js). */
.ad-gallery-main, .ad-gallery-thumbs { position: relative; overflow: hidden; }
.ad-gallery-main .swiper-wrapper, .ad-gallery-thumbs .swiper-wrapper { position: relative; display: flex; width: 100%; height: 100%; box-sizing: content-box; }
.ad-gallery-main .swiper-slide { flex-shrink: 0; width: 100%; }
.ad-gallery-thumbs .swiper-slide { flex-shrink: 0; margin-right: 8px; }
@media (max-width: 575.98px) { .ad-gallery-section:has(.ad-gallery-main) { margin-left: calc(var(--bs-gutter-x, 1.5rem) * -.5); margin-right: calc(var(--bs-gutter-x, 1.5rem) * -.5); } .ad-gallery-main { border-radius: 0; } }
/* UX-ANNONCES-01B: the gallery sits in the main column; from 992 px it is about 16:10 and at most ~470 px high, so
   that the title, the photos, the price and the contact button share the first screen at 1440 x 900. */
@media (min-width: 992px) { .ad-gallery-main { aspect-ratio: 16 / 10; max-height: min(29.5rem, calc(100vh - 25rem)); min-height: 20rem; } }
.ad-gallery-empty { display: flex; align-items: center; gap: .75rem; width: 100%; padding: 1rem 1.25rem; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); background: var(--oov-section); }
.ad-gallery-empty-icon { flex-shrink: 0; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: #fff; color: var(--oov-muted); display: inline-flex; align-items: center; justify-content: center; font-size: 1.15rem; }
.ad-gallery-empty-text { margin: 0; color: var(--oov-muted); font-weight: 600; }

.ad-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; padding-top: 1.25rem; padding-bottom: 2.5rem; }
@media (min-width: 992px) { .ad-layout { grid-template-columns: minmax(0, 1fr) 22.5rem; gap: 2.5rem; } }
.ad-section { padding: 1.4rem 0; border-bottom: 1px solid var(--oov-line-soft); }
.ad-section:first-child { padding-top: 0; }
.ad-section-title { font-size: 1.3rem; font-weight: 800; margin-bottom: .85rem; }
.ad-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin: 0; }
@media (min-width: 768px) { .ad-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ad-facts li { display: flex; align-items: center; gap: .65rem; background: var(--oov-section); border: 1px solid var(--oov-line-soft); border-radius: 12px; padding: .6rem .75rem; min-width: 0; }
.ad-facts small { display: block; font-size: .74rem; color: var(--oov-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
.ad-facts strong { display: block; color: var(--oov-navy); font-size: .95rem; overflow: hidden; text-overflow: ellipsis; }
.ad-fact-icon { flex-shrink: 0; width: 2.3rem; height: 2.3rem; border-radius: 50%; background: var(--oov-surface); color: var(--oov-blue); display: inline-flex; align-items: center; justify-content: center; font-size: 1.05rem; }
.ad-name { font-weight: 700; color: var(--oov-navy); font-size: 1.08rem; }
.ad-description { line-height: 1.7; overflow-wrap: anywhere; }
.ad-description > :last-child { margin-bottom: 0; }
/* Long descriptions: collapsed after 12 lines when scripts run (App\Ad\AdPage::descriptionCollapse(), ad-page.js). */
.ad-description-toggle { display: none; align-items: center; margin-top: .5rem; padding: .25rem 0; border: 0; background: none; color: var(--oov-blue); font-weight: 700; text-decoration: underline; text-underline-offset: .2em; }
.ad-description-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.ad-description-toggle.is-fit { visibility: hidden; }
@media (scripting: enabled) {
    .ad-description[data-collapse="all"]:not(.is-expanded) { max-height: calc(1.7em * 12); overflow: hidden; -webkit-mask-image: linear-gradient(#000 calc(100% - 3.4em), transparent); mask-image: linear-gradient(#000 calc(100% - 3.4em), transparent); }
    .ad-description[data-collapse="all"] + .ad-description-toggle { display: inline-flex; }
}
@media (scripting: enabled) and (max-width: 991.98px) {
    .ad-description[data-collapse="mobile"]:not(.is-expanded) { max-height: calc(1.7em * 12); overflow: hidden; -webkit-mask-image: linear-gradient(#000 calc(100% - 3.4em), transparent); mask-image: linear-gradient(#000 calc(100% - 3.4em), transparent); }
    .ad-description[data-collapse="mobile"] + .ad-description-toggle { display: inline-flex; }
}
.ad-description.is-fit { -webkit-mask-image: none; mask-image: none; }
.ad-ref { margin: 1rem 0 0; font-size: .85rem; color: var(--oov-muted); }
.ad-ref + .ad-ref { margin-top: .25rem; }
.chip-static { cursor: default; }
.chip-static:hover { background: var(--oov-surface); }
.ad-amenities { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.1rem 2rem; }
@media (min-width: 768px) { .ad-amenities { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ad-amenity-title { font-size: 1rem; font-weight: 700; display: flex; align-items: center; margin-bottom: .45rem; }
.ad-amenity-title .bi { color: var(--oov-pink); font-size: 1.15rem; }
.ad-amenity-list { margin: 0; display: grid; gap: .25rem; font-size: .95rem; }
.ad-amenity-list .bi { color: #198754; }
.ad-rates-price { font-size: 1.05rem; }
.ad-rates-table { max-width: 36rem; --bs-table-bg: transparent; }
.ad-rates-table th, .ad-rates-table td { padding: .55rem .75rem; }
.ad-rates-table thead th { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--oov-muted); }
.ad-rates-table td { font-weight: 700; color: var(--oov-navy); text-align: right; }
.ad-rates-table thead th:not(:first-child) { text-align: right; }
.ad-rates-note { background: var(--oov-section); border-radius: 12px; padding: .75rem 1rem; margin-bottom: .75rem; font-size: .95rem; overflow-wrap: anywhere; }
.ad-rates-disclaimer { display: flex; align-items: flex-start; background: var(--oov-warm); border: 1px solid #f3dfa6; border-radius: 12px; padding: .65rem .9rem; font-size: .9rem; margin: 0; }
.ad-rates-disclaimer .bi { color: #a36d00; margin-top: .2rem; }
.host-card { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.host-avatar { flex-shrink: 0; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: linear-gradient(135deg, var(--oov-blue) 0%, var(--oov-navy) 100%); color: #fff; font-weight: 800; font-size: 1.4rem; display: inline-flex; align-items: center; justify-content: center; }
.host-info { flex: 1; min-width: 12rem; }
.host-name { font-weight: 800; color: var(--oov-navy); font-size: 1.1rem; margin-bottom: .15rem; }
.host-meta { display: flex; flex-wrap: wrap; gap: .25rem 1rem; color: var(--oov-muted); font-size: .9rem; margin: 0; }
.host-meta .bi { color: var(--oov-blue); }
.host-card-lg .host-avatar { width: 4.5rem; height: 4.5rem; font-size: 1.8rem; }
.host-card-lg .page-title { margin-bottom: .3rem; }
.ad-report { margin: 1rem 0 0; }
.ad-report .btn-link { color: var(--oov-muted); padding-left: 0; }

.ad-aside { min-width: 0; }
.booking-card { background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--radius-panel); box-shadow: var(--shadow-hover); padding: 1.25rem; }
@media (min-width: 992px) { .booking-card { position: sticky; top: calc(var(--header-h) + 1rem); } }
.booking-price strong { display: block; font-size: 1.6rem; font-weight: 800; color: var(--oov-navy); line-height: 1.1; }
.booking-price span { display: block; color: var(--oov-muted); font-size: .85rem; }
.booking-price .booking-weekly { color: var(--oov-text); font-size: .92rem; margin-top: .35rem; }
.booking-price .booking-indicative { color: var(--oov-text); font-size: .9rem; margin-top: .35rem; }
.booking-price .booking-indicative-note { font-size: .8rem; margin-top: .2rem; }
.booking-price strong.booking-price-none { font-size: 1.25rem; }
.booking-price .booking-price-none + span { margin-top: .35rem; }
.booking-title { font-size: 1.05rem; font-weight: 800; margin: 1rem 0 .65rem; padding-top: .9rem; border-top: 1px solid var(--oov-line-soft); }
.booking-field { margin-bottom: .75rem; }
.booking-field .form-label { font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--oov-muted); margin-bottom: .3rem; display: block; }
.booking-field .form-control { min-height: 3rem; }
.booking-field .guests-menu { width: 100%; }
.booking-note { font-size: .85rem; color: var(--oov-muted); margin: .25rem 0 .85rem; }
.booking-note .bi { color: var(--oov-blue); }
.booking-form .btn + .booking-note { margin: .6rem 0 0; }
.booking-form .booking-contact { margin: .1rem 0 .9rem; }
.booking-phone { margin-top: .6rem; }
.booking-phone-number { font-size: 1.15rem; letter-spacing: .03em; }
.booking-phone-result { font-size: .85rem; color: var(--oov-muted); margin: .4rem 0 0; }
.booking-safety { font-size: .8rem; color: var(--oov-muted); margin: .9rem 0 0; }
.booking-safety .bi { color: #198754; }
.booking-bar { display: none; }
@media (max-width: 991.98px) {
    .booking-bar { display: flex; align-items: center; justify-content: space-between; gap: .75rem; position: sticky; bottom: 0; z-index: 1020; background: #fff; border-top: 1px solid var(--oov-line-soft); box-shadow: 0 -4px 14px rgba(0, 29, 101, .1); padding: .65rem 1rem calc(.65rem + env(safe-area-inset-bottom)); }
    .booking-bar-price strong { display: block; color: var(--oov-navy); font-size: 1.1rem; line-height: 1.1; }
    .booking-bar-price a { font-size: .85rem; font-weight: 600; text-decoration: underline; }
}
.ad-similar .section-title { font-size: clamp(1.3rem, 2.2vw, 1.7rem); margin-bottom: 1.25rem; }

.ad-video { position: relative; aspect-ratio: 16 / 9; border-radius: var(--card-radius); overflow: hidden; background: var(--oov-navy); }
.ad-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ad-video-play { position: absolute; inset: 0; width: 100%; border: 0; background: linear-gradient(135deg, var(--oov-navy) 0%, var(--oov-blue) 100%); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; font-weight: 700; }
.ad-video-icon { font-size: 3.5rem; }
.ad-video-play small { font-weight: 500; opacity: .85; }

/* Dialogs of the ad page: contact, abuse report, photo viewer. */
.ad-dialog { width: min(40rem, calc(100vw - 1.5rem)); max-height: calc(100dvh - 1.5rem); border: 0; border-radius: var(--radius-panel); padding: 0; box-shadow: var(--shadow-menu); color: var(--oov-text); }
.ad-dialog::backdrop, .ad-viewer::backdrop { background: rgba(0, 18, 60, .6); }
.ad-dialog-body { padding: 1.25rem 1.35rem 1.35rem; }
.ad-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; color: var(--oov-navy); }
.ad-dialog-head .bi { color: var(--oov-pink); }
.ad-dialog-ad { font-weight: 600; color: var(--oov-muted); margin-bottom: .75rem; }
.ad-dialog-stay { display: flex; align-items: center; background: var(--oov-surface); border-radius: 10px; padding: .5rem .75rem; font-weight: 600; color: var(--oov-navy); }
.ad-dialog-stay[hidden] { display: none; }
.ad-dialog-stay .bi { color: var(--oov-blue); }
.ad-dialog-note { font-size: .82rem; color: var(--oov-muted); margin: 1rem 0 .75rem; }
/* MIG-015 (R103): anti-fraud notice, honeypot (off-screen, never focused), ALTCHA row. */
.ad-dialog-fraud { color: #7a4b00; background: #fff8e6; border-radius: .5rem; padding: .5rem .65rem; margin-top: 0; }
.form-hp { position: absolute !important; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.altcha-row altcha-widget { display: block; max-width: 100%; }
.host-response { color: var(--oov-muted); }
.ad-dialog-actions { display: flex; justify-content: flex-end; gap: .5rem; flex-wrap: wrap; }
/* UX-ANNONCES-01B (R197): the dialog scrolls under a sticky head and sticky actions (safe areas on phones). */
.ad-dialog { overscroll-behavior: contain; scroll-padding: 5rem 0 6rem; }
.ad-dialog .ad-dialog-head { position: sticky; top: 0; z-index: 2; background: #fff; margin: -1.25rem -1.35rem .75rem; padding: 1rem 1.35rem .75rem; border-bottom: 1px solid var(--oov-line-soft); }
.ad-dialog .ad-dialog-actions { position: sticky; bottom: 0; z-index: 2; background: #fff; margin: 0 -1.35rem -1.35rem; padding: .75rem 1.35rem max(.75rem, env(safe-area-inset-bottom)); border-top: 1px solid var(--oov-line-soft); }
.ad-dialog-stay-edit { margin-top: .6rem; border: 1px solid var(--oov-line-soft); border-radius: 10px; padding: .5rem .75rem; }
.ad-dialog-stay-edit > summary { cursor: pointer; font-weight: 600; color: var(--oov-blue); }
.ad-dialog-stay-edit > summary .bi { color: var(--oov-blue); }
.ad-dialog-stay-edit[open] > summary { margin-bottom: .25rem; }
.ad-dialog-stay-edit .form-label { font-size: .85rem; margin-bottom: .2rem; }
@media (max-width: 575.98px) { .ad-dialog .ad-dialog-head { padding-top: max(1rem, env(safe-area-inset-top)); } .ad-dialog .ad-dialog-actions .btn { flex: 1 1 auto; } }
/* R195: long amenities lists fold on phones (JavaScript adds .is-foldable; every item stays in the HTML). */
.ad-amenities-toggle { margin-top: 1rem; }
.ad-amenities-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
@media (min-width: 768px) { .ad-amenities-toggle { display: none; } }
@media (max-width: 767.98px) { .ad-amenities.is-foldable:not(.is-open) > .ad-amenity-group:nth-child(n+3) { display: none; } }
@media (max-width: 575.98px) { .ad-dialog { width: 100vw; max-width: 100vw; max-height: 100dvh; height: 100dvh; margin: 0; border-radius: 0; } }
.ad-viewer { width: 100vw; height: 100dvh; max-width: 100vw; max-height: 100dvh; margin: 0; padding: 0; border: 0; background: #0b1020; color: #fff; }
.ad-viewer[open] { display: flex; flex-direction: column; }
.ad-viewer-bar { display: flex; align-items: center; justify-content: space-between; padding: .75rem 1rem; }
.ad-viewer-counter { font-weight: 700; }
.ad-viewer-close { border: 0; background: rgba(255, 255, 255, .12); color: #fff; width: 2.75rem; height: 2.75rem; border-radius: 50%; font-size: 1.1rem; }
.ad-viewer-swiper { flex: 1; width: 100%; min-height: 0; }
.ad-viewer-swiper .swiper-slide { display: flex; align-items: center; justify-content: center; }
.ad-viewer-swiper img { max-width: 100%; max-height: 100%; object-fit: contain; }
.ad-viewer-nav { position: absolute; z-index: 3; top: 50%; transform: translateY(-50%); width: 3rem; height: 3rem; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .14); color: #fff; font-size: 1.2rem; }
.ad-viewer-prev { left: 1rem; }
.ad-viewer-next { right: 1rem; }
.ad-viewer-nav.swiper-button-disabled { opacity: .3; }
.ad-viewer-close:focus-visible, .ad-viewer-nav:focus-visible { outline-color: #fff; }

/* Owner page (register R53) */
.owner-head .host-card { margin-top: .25rem; }

/* MIG-014: owner preview banner of the ad page (R76), host photo and presentation (R73) */
.preview-banner { background: var(--oov-navy); color: #fff; padding: .75rem 0; }
.preview-banner .badge { vertical-align: middle; }
.host-avatar-photo { object-fit: cover; padding: 0; }
.host-bio { margin: .75rem 0 0; color: var(--oov-text); white-space: normal; }

/* PRICE-3 (register R94): ad page configurator, rates table, fees and conditions, 12-month availability calendar. */
.booking-price .booking-from, .booking-price .booking-unit { display: inline; }
.booking-price .booking-from + strong { display: inline; }
.booking-fresh { font-size: .82rem; color: var(--oov-muted); margin: -.3rem 0 .75rem; }
.booking-fresh .bi { color: #198754; }
.booking-hint { font-size: .8rem; color: var(--oov-muted); margin: .35rem 0 0; min-height: 1.2em; }
.booking-options { margin-bottom: .75rem; }
.booking-options .form-label { font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--oov-muted); }
.booking-quote { min-height: 4.5rem; margin: .25rem 0 .9rem; padding: .75rem .9rem; background: var(--oov-section); border-radius: 12px; font-size: .92rem; transition: opacity .15s; }
.booking-configurator.is-loading .booking-quote { opacity: .55; }
.booking-quote-empty { margin: 0; color: var(--oov-muted); }
.booking-quote-empty .bi { color: var(--oov-blue); }
.quote-nights { font-weight: 700; color: var(--oov-navy); margin: 0 0 .4rem; }
.quote-lines { margin: 0; }
.quote-line { display: flex; justify-content: space-between; gap: .75rem; padding: .3rem 0; border-bottom: 1px dashed var(--oov-line); }
.quote-line .quote-amount { white-space: nowrap; font-weight: 600; }
.quote-line.is-discount .quote-amount { color: #146c43; }
.quote-line.is-info .quote-amount { color: var(--oov-muted); font-weight: 400; }
.quote-detail { display: block; font-size: .8rem; color: var(--oov-muted); }
.quote-total { display: flex; justify-content: space-between; margin: .5rem 0 0; font-size: 1.15rem; font-weight: 800; color: var(--oov-navy); }
.quote-deposit, .quote-note { font-size: .8rem; color: var(--oov-muted); margin: .35rem 0 0; }
.quote-refused { border-left: 4px solid #d97706; padding-left: .65rem; }
.quote-refused-title { font-weight: 700; color: var(--oov-navy); margin: 0 0 .25rem; }
.quote-errors { margin: 0; padding-left: 1.1rem; }
.quote-alt-title { font-size: .85rem; font-weight: 700; margin: .65rem 0 .35rem; }
.quote-alts { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0; }
.quote-alt { min-height: 44px; flex-direction: column; align-items: flex-start; line-height: 1.2; text-align: left; cursor: pointer; }
.quote-alt:hover, .quote-alt:focus-visible { border-color: var(--oov-blue); background: var(--oov-surface); }
.quote-alt-total { font-size: .8rem; font-weight: 500; color: var(--oov-muted); }
.quote-error { color: #b02a37; margin: 0; }
@media (min-width: 992px) { .booking-configurator { max-height: calc(100vh - var(--header-h) - 2rem); overflow-y: auto; overscroll-behavior: contain; } }
.booking-bar-price span { color: var(--oov-muted); font-size: .8rem; }
.booking-bar-price strong + span { display: inline; }
/* UX-ANNONCES-01B: "À partir de" / "Dès" above, then the amount and its unit on one line. */
.booking-bar-price { line-height: 1.25; min-width: 0; }
.booking-bar-price > span:first-child { display: block; }
.booking-bar-price strong:not(:first-child) { display: inline; }
.booking-bar-price a { display: block; margin-top: .1rem; }
/* R200: tablets show "Contacter" (primary) and "Vérifier les disponibilités" (secondary) together in the bar. */
@media (min-width: 576px) and (max-width: 991.98px) {
    .booking-bar [data-bar-check] { --bs-btn-bg: #fff; --bs-btn-color: var(--oov-blue); --bs-btn-border-color: var(--oov-blue); --bs-btn-hover-bg: var(--oov-surface); --bs-btn-hover-color: var(--oov-blue); --bs-btn-hover-border-color: var(--oov-blue); margin-left: auto; }
}
.ad-dialog-quote { display: flex; align-items: center; background: var(--oov-warm); border-radius: 10px; padding: .5rem .75rem; margin-top: .5rem; font-weight: 600; color: var(--oov-navy); }
.ad-dialog-quote[hidden] { display: none; }

.ad-rates-wrap { margin-bottom: .75rem; }
.ad-rates-periods { max-width: none; }
.ad-rates-periods th[scope="row"] { font-weight: 600; text-align: left; }
.ad-rate-name { display: block; color: var(--oov-navy); font-weight: 700; }
.ad-rate-dates, .ad-rate-package { display: block; font-size: .8rem; font-weight: 400; color: var(--oov-muted); }
.ad-rates-periods td { white-space: nowrap; }
.ad-rates-periods td:last-child { white-space: normal; font-weight: 500; font-size: .85rem; }
.ad-rates-periods tr.is-closed td { color: var(--oov-muted); font-weight: 600; }
@media (max-width: 767.98px) {
    .ad-rates-periods thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .ad-rates-periods tr { display: block; border: 1px solid var(--oov-line-soft); border-radius: 12px; padding: .5rem .75rem; margin-bottom: .6rem; }
    .ad-rates-periods th[scope="row"], .ad-rates-periods td { display: flex; justify-content: space-between; gap: .75rem; border: 0; padding: .2rem 0; text-align: right; white-space: normal; }
    .ad-rates-periods th[scope="row"] { display: block; text-align: left; }
    .ad-rates-periods td::before { content: attr(data-label); font-weight: 500; color: var(--oov-muted); text-align: left; }
}
.ad-terms { display: grid; gap: 1rem; margin-top: 1.25rem; }
@media (min-width: 768px) { .ad-terms { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ad-terms-title { font-size: 1rem; font-weight: 800; color: var(--oov-navy); margin-bottom: .5rem; }
.ad-terms-title .bi { color: var(--oov-pink); }
.ad-terms-list li { padding: .3rem 0; border-bottom: 1px solid var(--oov-line-soft); font-size: .93rem; }

.ad-availability-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.ad-availability-nav { display: flex; gap: .4rem; }
.ad-availability-nav[hidden] { display: none; }
.ad-availability-fresh { font-size: .88rem; color: var(--oov-muted); margin: 0 0 .5rem; }
.ad-availability-fresh .bi { color: #198754; }
.ad-availability-legend { display: flex; gap: 1.25rem; font-size: .85rem; margin: 0 0 .5rem; }
.ad-availability-legend li { display: flex; align-items: center; gap: .4rem; }
.cal-swatch { display: inline-block; width: 1.1rem; height: 1.1rem; border-radius: 4px; border: 1px solid var(--oov-line); }
.ad-availability-months { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(15rem, 1fr); gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .5rem; margin-bottom: .75rem; scrollbar-width: thin; }
@media (min-width: 768px) { .ad-availability-months { grid-auto-columns: calc((100% - 2rem) / 3); } }
.ad-availability-months:focus-visible { outline: 2px solid var(--oov-blue); outline-offset: 2px; }
.cal-month { scroll-snap-align: start; content-visibility: auto; contain-intrinsic-size: auto 16rem; }
.ad-section#disponibilites, .ad-section#tarifs { content-visibility: auto; contain-intrinsic-size: auto 40rem; }
.cal-month-title { font-size: .95rem; font-weight: 700; color: var(--oov-navy); margin: 0 0 .35rem; text-align: center; }
.cal-grid { width: 100%; border-collapse: separate; border-spacing: 2px; table-layout: fixed; font-size: .82rem; text-align: center; }
.cal-grid th { font-weight: 600; color: var(--oov-muted); font-size: .72rem; padding: .15rem 0; }
.cal-grid td { height: 2rem; border-radius: 6px; }
.cal-grid .d-free, .cal-swatch.d-free { background: #e6f4ea; color: #0f5132; font-weight: 600; }
.cal-grid .d-taken, .cal-swatch.d-taken { background: repeating-linear-gradient(135deg, #f1f3f6 0 4px, #e2e6ec 4px 8px); color: var(--oov-muted); text-decoration: line-through; }
/* UX-ANNONCES-01B: past and unknown days stay plain text (not interactive), now 4.8:1 on white (was 2.3:1). */
.cal-grid .d-past, .cal-grid .d-unknown { color: #687386; }

/* PRICE-4 (register R96): dated lists: stay price and availability badge on the cards, "à confirmer" group. */
.ad-card-stay { font-size: 1rem; }
.ad-card-badge { display: flex; align-items: center; width: fit-content; margin-top: .3rem; padding: .15rem .55rem; border-radius: var(--radius-chip); background: var(--oov-section); color: var(--oov-muted); font-size: .76rem; font-weight: 600; }
.ad-card-badge-free { background: #e6f4ea; color: #0f5132; }
.listing-group-head { margin: 2rem 0 1rem; padding-top: 1.25rem; border-top: 1px solid var(--oov-line-soft); }
.listing-group-title { font-size: 1.2rem; font-weight: 800; color: var(--oov-navy); margin-bottom: .35rem; }
.listing-group-title .bi { color: var(--oov-blue); }
.listing-group-text { color: var(--oov-muted); margin: 0; }

/* MIG-015: request summary, conversations (traveller page and owner area), confirmation steps. */
.request-summary { background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); padding: 1rem 1.1rem; margin-bottom: 1.25rem; }
.request-summary p { margin-bottom: .4rem; }
.request-summary .bi { color: var(--oov-blue); }
.request-ad { font-weight: 700; }
.request-quote-lines summary { cursor: pointer; font-size: .9rem; color: var(--oov-blue); }
.request-quote-lines table { font-size: .88rem; margin-top: .4rem; }
.conversation-messages { display: grid; gap: .75rem; margin: 0 0 1.5rem; }
.conversation-message { background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); padding: .85rem 1rem; max-width: 92%; }
.conversation-message.is-mine { background: #eef5ff; border-color: #cfe0fb; margin-left: auto; }
.conversation-meta { font-size: .82rem; color: var(--oov-muted); margin-bottom: .35rem; }
.conversation-text { overflow-wrap: anywhere; white-space: normal; }
.conversation-reply { background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); padding: 1rem 1.1rem; }
.contact-step { background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); padding: 1.5rem 1.25rem; }
.contact-step-icon { font-size: 2.25rem; color: var(--oov-blue); margin-bottom: .5rem; line-height: 1; }
.contact-step-icon .bi { width: 2.25rem; height: 2.25rem; }
.contact-step-list { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .5rem; color: var(--oov-muted); }
.contact-step-list .bi { color: var(--oov-blue); }

/* REVIEW-1 (R120): verified reviews — card and head rating, ad page block, review form, charter. Stars are graphics
   doubled by the figure in text ("4,8"), never the only carrier of the rating. */
.review-star, .review-stars .is-on { color: #e8a200; }
.review-stars { display: inline-flex; gap: .1rem; color: var(--oov-line); }
.ad-card-rating { display: flex; align-items: center; gap: .3rem; font-size: .86rem; color: var(--oov-muted); margin: -.25rem 0 .45rem; }
.ad-card-rating strong { color: var(--oov-navy); }
.ad-rating { margin: .35rem 0 0; font-size: .95rem; }
.ad-rating a { display: inline-flex; align-items: center; gap: .35rem; color: var(--oov-navy); }
.ad-rating a span, .ad-rating a { text-decoration: none; }
.ad-rating a:hover { text-decoration: underline; }
.host-rating .bi { color: #e8a200 !important; }
.reviews-summary { display: grid; gap: 1.25rem; align-items: center; background: var(--oov-section); border-radius: var(--card-radius); padding: 1.25rem; }
@media (min-width: 768px) { .reviews-summary { grid-template-columns: 11rem 1fr; padding: 1.5rem; } }
.reviews-score { text-align: center; }
.reviews-average { margin: 0; color: var(--oov-navy); line-height: 1; }
.reviews-average strong { font-size: 2.75rem; font-weight: 800; }
.reviews-average span { font-size: 1.1rem; color: var(--oov-muted); }
.reviews-count { margin: 0; font-weight: 600; color: var(--oov-muted); font-size: .92rem; }
.reviews-bars { margin: 0; display: grid; gap: .55rem; }
.reviews-bar { display: grid; grid-template-columns: minmax(8rem, 1fr) 2fr; gap: .75rem; align-items: center; }
.reviews-bar dt { font-weight: 600; font-size: .9rem; color: var(--oov-text); }
.reviews-bar dd { margin: 0; display: flex; align-items: center; gap: .6rem; }
.reviews-bar-track { flex: 1; height: .45rem; border-radius: 999px; background: var(--oov-line); overflow: hidden; }
.reviews-bar-fill { display: block; height: 100%; border-radius: 999px; background: var(--oov-navy); }
.reviews-bar-value { font-weight: 700; font-size: .9rem; min-width: 2rem; text-align: right; color: var(--oov-navy); }
.reviews-info { font-size: .88rem; color: var(--oov-muted); margin: 1rem 0; }
.reviews-info .bi { color: var(--oov-blue); }
.reviews-sort { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-bottom: .5rem; }
.reviews-sort-label { font-size: .85rem; font-weight: 700; color: var(--oov-muted); margin-right: .25rem; }
.reviews-sort .chip { font-size: .85rem; padding: .35rem .8rem; text-decoration: none; }
.reviews-sort .chip.active { background: var(--oov-blue); color: #fff; }
.reviews-pages { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-top: 1rem; }
.review { padding: 1.25rem 0; border-bottom: 1px solid var(--oov-line-soft); }
.review:last-child { border-bottom: 0; }
.review-head { display: flex; gap: .75rem; align-items: center; margin-bottom: .5rem; }
.review-avatar { flex: 0 0 2.5rem; height: 2.5rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--oov-surface); color: var(--oov-navy); font-weight: 800; }
.review-author { font-size: 1rem; font-weight: 700; margin: 0; }
.review-meta { display: flex; flex-wrap: wrap; gap: .1rem .9rem; margin: 0; font-size: .84rem; color: var(--oov-muted); }
.review-rating { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; margin: 0 0 .5rem; }
.review-rating strong { color: var(--oov-navy); }
.review-source { display: inline-flex; align-items: center; font-size: .8rem; font-weight: 600; padding: .15rem .6rem; border-radius: 999px; background: var(--oov-surface); color: var(--oov-navy); }
.review-source-owner_invite { background: var(--oov-warm); }
.review-source .bi { color: var(--oov-blue); }
.review-body { overflow-wrap: anywhere; }
.review-reply { margin: .75rem 0 0 1rem; padding: .75rem 1rem; border-left: 3px solid var(--oov-blue); background: var(--oov-section); border-radius: 0 var(--radius-control) var(--radius-control) 0; }
.review-reply-meta { font-size: .86rem; margin: 0 0 .25rem; color: var(--oov-navy); }
.review-reply-body { font-size: .95rem; overflow-wrap: anywhere; }
.review-actions { margin: .25rem 0 0; }
.review-actions .btn-link { padding-left: 0; color: var(--oov-muted); font-weight: 600; }
.review-stay { font-weight: 600; color: var(--oov-navy); }
.review-panel { background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); padding: 1.25rem; margin-bottom: 1.25rem; box-shadow: var(--shadow-soft); }
.review-panel-title { font-size: 1.15rem; font-weight: 700; margin-bottom: 1rem; }
.rating-field { border: 0; padding: 0; margin: 0 0 1rem; min-width: 0; }
.rating-field legend { float: none; width: auto; font-size: 1rem; font-weight: 600; margin-bottom: .25rem; }
.rating-grid { display: grid; gap: 0 1.5rem; }
@media (min-width: 576px) { .rating-grid { grid-template-columns: 1fr 1fr; } }
.rating-stars { display: inline-flex; gap: .15rem; }
.rating-stars label { cursor: pointer; font-size: 1.85rem; line-height: 1; padding: .2rem; color: var(--oov-line); border-radius: 6px; min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.rating-stars:has(input:checked) label { color: #e8a200; }
.rating-stars input:checked + label ~ label { color: var(--oov-line); }
.rating-stars input:focus-visible + label { outline: 3px solid var(--oov-blue); outline-offset: 1px; }
.rating-stars:hover label { color: #e8a200; }
.rating-stars label:hover ~ label { color: var(--oov-line); }
.rating-field.is-invalid .rating-stars { outline: 2px solid #dc3545; border-radius: 8px; }

/* Homepage testimonials (R129): site testimonials, no rating. */
.testimonials-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 2rem; align-items: start; }
.testimonials-intro .section-lead { margin-bottom: 1.25rem; }
.testimonial-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin: 0; }
.testimonial { position: relative; height: 100%; margin: 0; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--oov-line-soft); border-radius: var(--card-radius); padding: 1.4rem; box-shadow: var(--shadow-soft); }
.testimonial-quote-icon { position: absolute; top: 1rem; right: 1.1rem; color: var(--oov-pink); font-size: 1.6rem; opacity: .35; }
.testimonial-text { margin: 0 0 1.1rem; padding-right: 2.25rem; color: var(--oov-text); }
.testimonial-text p { margin: 0; }
.testimonial-author { margin-top: auto; display: flex; align-items: center; gap: .75rem; }
.testimonial-author strong { display: block; color: var(--oov-navy); }
.testimonial-author small { display: block; color: var(--oov-muted); }
.testimonial-initial { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--oov-surface); color: var(--oov-blue); font-weight: 800; font-size: 1.1rem; }
.testimonial-grid li:nth-child(even) .testimonial-initial { background: var(--oov-pink-soft); color: var(--oov-pink-dark); }
@media (max-width: 991.98px) { .testimonials-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 575.98px) { .testimonial-grid { grid-template-columns: minmax(0, 1fr); } }
