/* =========================================================
   ALCES Offres — styles
   Palette alignée sur le site : blanc, texte noir, accent vert olive.
   La typographie est héritée du thème (Salient) pour se fondre.
   ========================================================= */

.alces-offres,
.alces-single {
    --alces-accent: #A3C93F;
    --alces-accent-dark: #86A82E;
    --alces-ink: #16181c;
    --alces-muted: #6c7075;
    --alces-line: #e6e6e2;
    --alces-bg-soft: #f7f7f4;
    color: var(--alces-ink);
    box-sizing: border-box;
}

.alces-offres *,
.alces-single * {
    box-sizing: border-box;
}

/* ---------- Mise en page liste ---------- */
.alces-offres-layout {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 32px;
    align-items: start;
}

/* ---------- Découpage grille + carte ---------- */
.alces-offres-split {
    display: grid;
    grid-template-columns: 1fr;
    gap: 28px;
    align-items: start;
}

/* Quand une carte est présente, on passe la zone en 2 colonnes : liste + carte */
.alces-offres.has-map .alces-offres-split {
    grid-template-columns: minmax(0, 1fr) 360px;
}

/* Cartes un peu plus compactes quand la liste partage la place avec la carte */
.alces-offres.has-map .alces-offres-grille {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}

.alces-offres-carte-panneau {
    position: sticky;
    top: 100px;
}

.alces-offres-carte {
    height: 620px;
    border: 1px solid var(--alces-line);
    background: var(--alces-bg-soft);
    z-index: 0;
}

/* Leaflet : garder les contrôles sous le header sticky du site si besoin */
.alces-offres-carte .leaflet-pane,
.alces-offres-carte .leaflet-control {
    z-index: 1;
}

/* ---------- Filtres ---------- */
.alces-filtres {
    position: sticky;
    top: 100px;
    border: 1px solid var(--alces-line);
    padding: 22px;
}

/* Onglets Achat / Location */
.alces-operation-tabs {
    display: flex;
    border: 1px solid var(--alces-line);
    overflow: hidden;
}

.alces-operation-tab {
    flex: 1;
    margin: 0 !important;
    text-align: center;
    cursor: pointer;
}

.alces-operation-tab input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.alces-operation-tab span {
    display: block;
    padding: 9px 6px;
    font-size: 13px;
    color: var(--alces-muted);
    background: #fff;
    transition: background-color .15s ease, color .15s ease;
}

.alces-operation-tab + .alces-operation-tab {
    border-left: 1px solid var(--alces-line);
}

.alces-operation-tab input:checked + span {
    background: var(--alces-ink);
    color: #fff;
}

.alces-operation-tab input:focus-visible + span {
    outline: 2px solid var(--alces-accent);
    outline-offset: -2px;
}

.alces-filtre-groupe {
    margin-bottom: 20px;
}

.alces-filtre-groupe label {
    display: block;
    font-size: 12px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--alces-muted);
    margin-bottom: 8px;
}

.alces-filtres select,
.alces-filtres input[type="number"] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--alces-line);
    background: #fff;
    color: var(--alces-ink);
    font-size: 14px;
    border-radius: 0;
    -webkit-appearance: none;
    appearance: none;
}

.alces-filtres select:focus,
.alces-filtres input:focus {
    outline: 2px solid var(--alces-accent);
    outline-offset: 1px;
    border-color: var(--alces-accent);
}

/* Texte des menus déroulants toujours en noir (par-dessus le thème Salient) */
.alces-filtres select,
.alces-filtres select:hover,
.alces-filtres select:focus,
.alces-filtres select option {
    color: #16181c !important;
    background-color: #fff !important;
}

/* Option survolée / sélectionnée : forcer texte noir sur fond clair
   (tentative pour les menus natifs, selon le navigateur) */
.alces-filtres select option:hover,
.alces-filtres select option:focus,
.alces-filtres select option:checked,
.alces-filtres select option:active {
    color: #16181c !important;
    background-color: #f0f0ec !important;
    -webkit-text-fill-color: #16181c !important;
}

/* Faux menus déroulants stylés par le thème (Salient / plugins de select).
   On cible les conteneurs d'options personnalisés et leur état survolé/actif. */
.alces-filtres .nice-select .option,
.alces-filtres .selectize-dropdown .option,
.alces-filtres .chosen-results li,
.alces-filtres .select2-results__option,
.nsel-dropdown li,
.nested-select-menu li,
ul.select-options li {
    color: #16181c !important;
}

.alces-filtres .nice-select .option:hover,
.alces-filtres .nice-select .option.selected,
.alces-filtres .selectize-dropdown .option:hover,
.alces-filtres .selectize-dropdown .option.active,
.alces-filtres .chosen-results li.highlighted,
.alces-filtres .select2-results__option--highlighted,
.nsel-dropdown li:hover,
.nested-select-menu li:hover,
ul.select-options li:hover {
    color: #16181c !important;
    background-color: #f0f0ec !important;
}

.alces-filtre-range {
    display: flex;
    align-items: center;
    gap: 8px;
}

.alces-filtre-range span {
    color: var(--alces-muted);
}

.alces-filtre-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 26px;
}

/* ---------- Boutons ---------- */
.alces-btn {
    display: inline-block;
    text-align: center;
    padding: 12px 20px;
    font-size: 13px;
    letter-spacing: .06em;
    text-transform: uppercase;
    cursor: pointer;
    border: 1px solid transparent;
    text-decoration: none;
    transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}

.alces-btn-plein {
    background: var(--alces-accent);
    color: #16181c;
    border-color: var(--alces-accent);
}

/* Force le texte en noir par-dessus les styles du thème (Salient) */
.alces-btn-plein,
.alces-btn-plein:link,
.alces-btn-plein:visited,
.alces-btn-plein:hover,
.alces-btn-plein:focus,
.alces-btn-plein:active {
    color: #16181c !important;
}

/* Auto-submit actif : on masque le bouton Appliquer (JS gère l'actualisation). */
.alces-filtres-form.alces-auto-actif .alces-filtre-submit {
    display: none;
}

.alces-btn-plein:hover {
    background: var(--alces-accent-dark);
    border-color: var(--alces-accent-dark);
    color: #16181c;
}

.alces-btn-lien {
    background: transparent;
    color: var(--alces-ink);
    border-color: var(--alces-line);
}

.alces-btn-lien:hover {
    border-color: var(--alces-ink);
}

/* ---------- Barre résultats ---------- */
.alces-offres-barre {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--alces-line);
}

.alces-offres-count {
    font-size: 13px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--alces-muted);
}

/* ---------- Grille de cartes ---------- */
.alces-offres-grille {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 26px;
}

.alces-carte {
    background: #fff;
    border: 1px solid var(--alces-line);
    overflow: hidden;
    transition: box-shadow .2s ease, transform .2s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.alces-carte:hover {
    box-shadow: 0 12px 30px rgba(0, 0, 0, .08);
    transform: translateY(-2px);
}

/* ---- Média + carrousel ---- */
.alces-carte-media {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--alces-bg-soft);
    flex-shrink: 0;
}

.alces-carte-track {
    display: flex;
    height: 100%;
    transition: transform .35s ease;
}

.alces-carte-slide {
    flex: 0 0 100%;
    height: 100%;
    display: block;
}

.alces-carte-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.alces-carte-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: rgba(22, 24, 28, .85);
    color: #fff;
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 5px 10px;
    z-index: 2;
}

.alces-carte-avant {
    position: absolute;
    top: 12px;
    right: 12px;
    background: var(--alces-accent);
    color: #16181c;
    font-size: 11px;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: 5px 10px;
    z-index: 2;
}

/* Flèches du carrousel */
.alces-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, .9);
    color: #16181c;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 3;
    padding: 0;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .18);
    opacity: 0;
    transition: opacity .2s ease, background-color .2s ease;
}

.alces-carte:hover .alces-nav {
    opacity: 1;
}

.alces-nav:hover {
    background: #fff;
}

.alces-nav:focus-visible {
    opacity: 1;
    outline: 2px solid var(--alces-accent);
    outline-offset: 2px;
}

.alces-prev {
    left: 10px;
}

.alces-next {
    right: 10px;
}

/* Points de pagination */
.alces-dots {
    position: absolute;
    bottom: 10px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    gap: 6px;
    z-index: 3;
}

.alces-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, .55);
    padding: 0;
    cursor: pointer;
    box-shadow: 0 0 2px rgba(0, 0, 0, .3);
    transition: background-color .2s ease;
}

.alces-dot.actif {
    background: #fff;
}

/* ---- Corps ---- */
.alces-carte-corps {
    padding: 16px 18px 12px;
    flex: 1 0 auto;
}

.alces-carte-titre-lien {
    text-decoration: none;
    color: inherit;
}

.alces-carte-titre {
    font-size: 17px;
    line-height: 1.3;
    margin: 0 0 6px;
}

.alces-carte-titre-lien:hover .alces-carte-titre {
    color: var(--alces-accent-dark);
}

.alces-carte-ville {
    margin: 0;
    font-size: 13px;
    color: var(--alces-muted);
}

/* ---- Barre bas : prix | surface ---- */
.alces-carte-footer {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid var(--alces-line);
}

.alces-carte-footer > div {
    padding: 14px 18px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.alces-carte-surface {
    border-left: 1px solid var(--alces-line);
}

.alces-carte-prix-label,
.alces-carte-surface-label {
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--alces-muted);
}

.alces-carte-prix-valeur,
.alces-carte-surface-valeur {
    font-size: 17px;
    font-weight: 600;
}

/* ---------- Vide ---------- */
.alces-offres-vide {
    padding: 40px;
    border: 1px dashed var(--alces-line);
    text-align: center;
    color: var(--alces-muted);
}

/* ---------- Pagination ---------- */
.alces-pagination {
    display: flex;
    gap: 6px;
    margin-top: 40px;
    justify-content: center;
}

.alces-page {
    min-width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--alces-line);
    text-decoration: none;
    color: var(--alces-ink);
    font-size: 14px;
}

.alces-page:hover {
    border-color: var(--alces-ink);
}

.alces-page.actif {
    background: var(--alces-ink);
    color: #fff;
    border-color: var(--alces-ink);
}

/* ---------- Toggle filtres (mobile) ---------- */
.alces-filtres-toggle {
    display: none;
    width: 100%;
    margin-bottom: 20px;
    padding: 14px;
    background: var(--alces-ink);
    color: #fff;
    border: none;
    font-size: 13px;
    letter-spacing: .06em;
    text-transform: uppercase;
    cursor: pointer;
}

/* =========================================================
   Page détail
   ========================================================= */
.alces-single-inner {
    max-width: 1100px;
    margin: 0 auto;
    padding: 40px 20px 80px;
}

.alces-retour {
    display: inline-block;
    margin-bottom: 24px;
    font-size: 13px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--alces-muted);
    text-decoration: none;
}

.alces-retour:hover {
    color: var(--alces-ink);
}

.alces-single-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 28px;
}

.alces-single-badge {
    display: inline-block;
    background: rgba(22, 24, 28, .85);
    color: #fff;
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 5px 10px;
    margin-bottom: 12px;
}

.alces-single-titre {
    margin: 0;
    font-size: 30px;
    line-height: 1.2;
}

.alces-single-lieu {
    margin: 8px 0 0;
    color: var(--alces-muted);
    font-size: 15px;
}

.alces-single-prix {
    text-align: right;
}

.alces-single-prix-label {
    display: block;
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--alces-muted);
}

.alces-single-prix-valeur {
    font-size: 26px;
    font-weight: 600;
}

/* ---------- Galerie ---------- */
.alces-galerie {
    margin-bottom: 40px;
}

.alces-galerie-principale {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--alces-bg-soft);
    border: 1px solid var(--alces-line);
}

.alces-galerie-principale img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.alces-galerie-miniatures {
    display: flex;
    gap: 10px;
    margin-top: 10px;
    flex-wrap: wrap;
}

.alces-miniature {
    width: 90px;
    height: 66px;
    padding: 0;
    border: 1px solid var(--alces-line);
    background: none;
    cursor: pointer;
    overflow: hidden;
}

.alces-miniature img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.alces-miniature.actif {
    outline: 2px solid var(--alces-accent);
    outline-offset: -1px;
}

/* ---------- Grille contenu / contact ---------- */
.alces-single-grid {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 40px;
    align-items: start;
}

.alces-bloc {
    margin-bottom: 34px;
}

.alces-bloc-titre {
    font-size: 14px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--alces-muted);
    margin: 0 0 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--alces-line);
}

.alces-caracs {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px 24px;
}

.alces-caracs li {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.alces-caracs span {
    font-size: 12px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--alces-muted);
}

.alces-caracs strong {
    font-size: 16px;
    font-weight: 600;
}

.alces-descriptif {
    line-height: 1.7;
}

.alces-prestations {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.alces-prestations li {
    background: var(--alces-bg-soft);
    border: 1px solid var(--alces-line);
    padding: 8px 14px;
    font-size: 14px;
}

/* ---------- Diagnostic ---------- */
.alces-diag {
    display: flex;
    gap: 30px;
}

.alces-diag-item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.alces-diag-lettre {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
    color: #16181c;
}

.alces-diag-label {
    font-size: 13px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--alces-muted);
}

/* ---------- Carte géo ---------- */
.alces-carte-geo {
    aspect-ratio: 16 / 9;
    border: 1px solid var(--alces-line);
    overflow: hidden;
}

.alces-carte-geo iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

/* ---------- Contact ---------- */
.alces-single-contact {
    position: sticky;
    top: 100px;
}

.alces-contact-carte {
    border: 1px solid var(--alces-line);
    padding: 26px;
}

.alces-contact-titre {
    font-size: 14px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--alces-muted);
    margin: 0 0 16px;
}

.alces-contact-nom {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 12px;
}

.alces-contact-carte p {
    margin: 0 0 8px;
}

.alces-contact-carte a {
    color: var(--alces-accent-dark);
    text-decoration: none;
}

.alces-contact-carte a:hover {
    text-decoration: underline;
}

.alces-contact-cta {
    margin-top: 16px;
    width: 100%;
}

.alces-contact-cta:hover {
    text-decoration: none;
}

/* Prix mis en avant dans les caractéristiques de la fiche */
.alces-carac-prix strong {
    color: var(--alces-accent-dark);
    font-size: 18px;
}

/* =========================================================
   Responsive
   ========================================================= */
/* Carte : sous la liste sur écrans intermédiaires */
@media (max-width: 1100px) {
    .alces-offres.has-map .alces-offres-split {
        grid-template-columns: 1fr;
    }
    .alces-offres-carte-panneau {
        position: static;
        order: 2;
    }
    .alces-offres-carte {
        height: 380px;
    }
}

@media (max-width: 900px) {
    .alces-offres-layout {
        grid-template-columns: 1fr;
    }
    .alces-filtres-toggle {
        display: block;
    }
    .alces-filtres {
        position: static;
        display: none;
    }
    .alces-filtres.ouvert {
        display: block;
    }
    .alces-single-grid {
        grid-template-columns: 1fr;
    }
    .alces-single-contact {
        position: static;
    }
}

@media (max-width: 560px) {
    .alces-single-titre {
        font-size: 24px;
    }
    .alces-single-header {
        flex-direction: column;
        align-items: flex-start;
    }
    .alces-single-prix {
        text-align: left;
    }
    .alces-caracs {
        grid-template-columns: 1fr;
    }
}

/* Accessibilité : respect du mode mouvement réduit */
@media (prefers-reduced-motion: reduce) {
    .alces-carte,
    .alces-carte-media img,
    .alces-carte-track,
    .alces-nav,
    .alces-dot,
    .alces-btn {
        transition: none;
    }
}