/**
 * Biens Activimmo — maquette reprise de GLCD (glcd-sales/assets/css/frontend.css),
 * reportee sur les variables de couleur de RR Core. Les deux themes partagent
 * les memes noms de variables, donc la carte prend automatiquement la charte.
 *
 * Chargee uniquement quand la feuille du plugin Activimmo est chargee
 * (voir includes/enqueue.php).
 */

/* -------------------------------------------------------------------------
   Largeur du contenu.
   page.css contraint .page-article a var(--content-width, 800px) : c'est une
   largeur de lecture, pensee pour les articles de blog. Une grille de biens et
   une fiche en deux colonnes y etouffent. Sur les pages Activimmo — et
   uniquement la, puisque cette feuille n'y est chargee que la — on rend au
   conteneur la pleine largeur du site.
   ------------------------------------------------------------------------- */
body .page-article {
    max-width: var(--container-max, 1280px);
}

/* ---------- Compteur de resultats ---------- */
.rr-bv-count {
    color: var(--color-text-muted, #777);
    font-size: .95rem;
    margin: 0 0 1.25rem;
}

/* ---------- Grille de cartes ---------- */
.rr-bv-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
}

.rr-bv-card {
    background: var(--color-bg-elevated, #fff);
    border: 1px solid var(--color-border-light, #ececec);
    border-radius: 14px;
    overflow: hidden;
    transition: transform .2s, box-shadow .2s;
}

.rr-bv-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .12);
}

.rr-bv-card__link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.rr-bv-card__media {
    position: relative;
    aspect-ratio: 4 / 3;
    background: var(--color-bg-muted, #eee);
}

.rr-bv-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Badge transaction (Vente / Location), en haut a gauche. */
.rr-bv-badge {
    position: absolute;
    top: .6rem;
    left: .6rem;
    background: var(--color-primary, #2f6f4f);
    color: #fff;
    font-size: .75rem;
    font-weight: 600;
    padding: .2rem .55rem;
    border-radius: 5px;
}

/* Type de bien, en bas a gauche. */
.rr-bv-card__type {
    position: absolute;
    bottom: .6rem;
    left: .6rem;
    background: rgba(0, 0, 0, .6);
    color: #fff;
    font-size: .75rem;
    font-weight: 600;
    padding: .2rem .55rem;
    border-radius: 5px;
}

.rr-bv-card__body {
    padding: 1rem 1.1rem 1.2rem;
}

.rr-bv-card__price {
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--color-primary, #2f6f4f);
    margin: 0 0 .25rem;
}

.rr-bv-card__title {
    font-size: 1.05rem;
    margin: 0 0 .4rem;
    line-height: 1.3;
}

.rr-bv-card__location {
    display: flex;
    align-items: center;
    gap: .3rem;
    color: var(--color-text-muted, #777);
    font-size: .9rem;
    margin: 0 0 .7rem;
}

.rr-bv-card__specs {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin: 0;
    padding: 0;
    font-size: .9rem;
    color: var(--color-text-muted, #777);
}

.rr-bv-card__specs strong {
    color: var(--color-text, #222);
}

/* ---------- Pagination ---------- */
.rr-bv-pagination {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: .4rem;
    margin-top: 2.5rem;
}

.rr-bv-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 .6rem;
    border-radius: 8px;
    text-decoration: none;
    border: 1px solid var(--color-border, #d7d7d7);
    color: var(--color-text, #222);
}

.rr-bv-pagination .page-numbers.current {
    background: var(--color-primary, #2f6f4f);
    color: #fff;
    border-color: var(--color-primary, #2f6f4f);
}

.rr-bv-pagination .page-numbers.dots {
    border-color: transparent;
    min-width: 1.5rem;
}

/* ---------- Etat vide ---------- */
.rr-bv-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 3rem 1rem;
}

.rr-bv-empty p {
    color: var(--color-text-muted, #777);
    margin-bottom: 1rem;
}

/* =========================================================================
   Fiche detaillee — reprise de glcd-sales (sections « Layout fiche »,
   « Specs », « Sidebar prix », « Agent » et « Boutons »).
   Le carrousel garde les classes .activimmo-carousel du plugin, dont le
   script assets/detail-gallery.js pilote le defilement et la lightbox ;
   on se contente d'en arrondir le cadre.
   ========================================================================= */

.rr-bv-single {
    max-width: var(--container-max-width, 1200px);
    margin: 0 auto;
    padding: 2rem 1.25rem 4rem;
    color: var(--color-text, #222);
}

.rr-bv-single__back {
    display: inline-block;
    margin-bottom: 1.25rem;
    color: var(--color-text-muted, #777);
    text-decoration: none;
    font-size: .9rem;
}

.rr-bv-single__back:hover { color: var(--color-primary, #2f6f4f); }

/* ---------- Galerie ---------- */
.rr-bv-single__gallery { margin-bottom: 2rem; }

.rr-bv-single__gallery .activimmo-carousel__viewport {
    border-radius: 14px;
    overflow: hidden;
    background: var(--color-bg-muted, #eee);
}

/* ---------- Layout ---------- */
.rr-bv-single__layout {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 2.5rem;
    align-items: start;
}

@media (max-width: 900px) {
    .rr-bv-single__layout { grid-template-columns: 1fr; }
}

/* ---------- En-tete ---------- */
.rr-bv-single__tags {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-bottom: .75rem;
}

.rr-bv-tag {
    font-size: .8rem;
    font-weight: 600;
    padding: .25rem .6rem;
    border-radius: 999px;
    background: var(--color-bg-alt, #f2f2f2);
    color: var(--color-text, #222);
}

.rr-bv-tag--muted { color: var(--color-text-muted, #777); }

.rr-bv-tag--accent {
    background: var(--color-accent, #d68a00);
    color: #fff;
}

.rr-bv-single__title {
    font-family: var(--font-family-heading, inherit);
    font-size: clamp(1.6rem, 3vw, 2.3rem);
    margin: 0 0 .4rem;
}

.rr-bv-single__location { color: var(--color-text-muted, #777); margin: 0 0 .25rem; }
.rr-bv-single__ref { font-size: .85rem; color: var(--color-text-light, #999); margin: 0; }

/* ---------- Specs cles ---------- */
.rr-bv-single__specs {
    list-style: none;
    margin: 1.5rem 0;
    padding: 1.25rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    gap: 1rem;
    background: var(--color-bg-alt, #f7f7f7);
    border-radius: 12px;
}

.rr-bv-single__spec { text-align: center; }

.rr-bv-single__spec-value {
    display: block;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--color-primary, #2f6f4f);
}

.rr-bv-single__spec-label {
    display: block;
    font-size: .8rem;
    color: var(--color-text-muted, #777);
    margin-top: .15rem;
}

/* ---------- Sections ---------- */
.rr-bv-single__section { margin: 2rem 0; }

.rr-bv-single__section h2 {
    font-family: var(--font-family-heading, inherit);
    font-size: 1.3rem;
    margin: 0 0 1rem;
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--color-border-light, #eee);
}

.rr-bv-single__description { line-height: 1.7; }

.rr-bv-single__feature-group {
    font-size: .95rem;
    font-weight: 700;
    margin: 1.25rem 0 .6rem;
    color: var(--color-text-muted, #777);
}

.rr-bv-single__features {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: .6rem;
}

.rr-bv-single__feature { display: flex; align-items: center; gap: .5rem; }
.rr-bv-single__feature svg { color: var(--color-primary, #2f6f4f); flex: 0 0 auto; }

/* ---------- Colonne laterale ---------- */
.rr-bv-single__sidebar {
    position: sticky;
    top: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

@media (max-width: 900px) {
    .rr-bv-single__sidebar { position: static; }
}

.rr-bv-pricebox {
    background: var(--color-bg-elevated, #fff);
    border: 1px solid var(--color-border, #e2e2e2);
    border-radius: 14px;
    padding: 1.5rem;
}

.rr-bv-pricebox__price {
    font-family: var(--font-family-heading, inherit);
    font-size: 2rem;
    font-weight: 800;
    color: var(--color-primary, #2f6f4f);
    margin: 0;
}

.rr-bv-pricebox__charges {
    list-style: none;
    margin: 1rem 0 0;
    padding: 1rem 0 0;
    border-top: 1px solid var(--color-border-light, #eee);
}

.rr-bv-pricebox__charges li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .3rem 0;
    font-size: .9rem;
}

.rr-bv-pricebox__charges span { color: var(--color-text-muted, #777); }

/* ---------- Contact ---------- */
.rr-bv-contact {
    background: var(--color-bg-alt, #f7f7f7);
    border-radius: 14px;
    padding: 1.5rem;
}

.rr-bv-contact__heading {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--color-text-muted, #777);
    margin: 0 0 .9rem;
}

.rr-bv-contact__actions { display: flex; flex-direction: column; gap: .6rem; }

/* ---------- Boutons ---------- */
.rr-bv-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    width: 100%;
    padding: .7rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background .2s, color .2s, border-color .2s;
}

.rr-bv-btn--primary { background: var(--color-primary, #2f6f4f); color: #fff; }
.rr-bv-btn--primary:hover { background: var(--color-primary-dark, #265a40); }

.rr-bv-btn--ghost {
    background: transparent;
    color: var(--color-primary, #2f6f4f);
    border-color: var(--color-border, #d7d7d7);
}

.rr-bv-btn--ghost:hover { border-color: var(--color-primary, #2f6f4f); }

.rr-bv-btn--whatsapp { background: #25d366; color: #fff; }
.rr-bv-btn--whatsapp:hover { background: #1ebe5b; }

/* =========================================================================
   Ajouts fiche enrichie : badges, pastilles, groupes replies, carte,
   prix natif secondaire, biens similaires.
   ========================================================================= */

/* ---------- Variantes de badges ----------
   L'ordre visuel suit l'importance commerciale : « key » pour ce qui
   conditionne l'achat (accessible aux etrangers, PDS), « accent » pour les
   mentions rares et distinctives, « sea » pour le rapport a la mer. */
.rr-bv-tag--key {
    background: var(--color-primary, #2f6f4f);
    color: #fff;
}

.rr-bv-tag--sea {
    background: color-mix(in srgb, var(--color-info, #3b82f6) 15%, transparent);
    color: var(--color-info, #3b82f6);
}

.rr-bv-tag--plain {
    background: transparent;
    border: 1px solid var(--color-border, #d7d7d7);
    color: var(--color-text-muted, #777);
}

/* ---------- Pastilles (energie, proximites) ---------- */
.rr-bv-single__pills {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.rr-bv-pill {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem .75rem;
    border-radius: 999px;
    background: var(--color-bg-alt, #f7f7f7);
    border: 1px solid var(--color-border-light, #ececec);
    font-size: .9rem;
}

.rr-bv-pill svg { color: var(--color-text-muted, #777); flex: 0 0 auto; }

.rr-bv-pill--energy {
    background: color-mix(in srgb, var(--color-success, #10b981) 10%, transparent);
    border-color: color-mix(in srgb, var(--color-success, #10b981) 30%, transparent);
}

.rr-bv-pill--energy svg { color: var(--color-success, #10b981); }

/* ---------- Groupes de caracteristiques replies ---------- */
.rr-bv-details {
    border-bottom: 1px solid var(--color-border-light, #eee);
    padding: .25rem 0;
}

.rr-bv-details__summary {
    cursor: pointer;
    padding: .6rem 0;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: .5rem;
    list-style: none;
}

.rr-bv-details__summary::-webkit-details-marker { display: none; }

.rr-bv-details__summary::before {
    content: '▸';
    color: var(--color-text-muted, #777);
    transition: transform .15s;
}

.rr-bv-details[open] > .rr-bv-details__summary::before { transform: rotate(90deg); }

.rr-bv-details__count {
    margin-left: auto;
    font-size: .8rem;
    font-weight: 500;
    color: var(--color-text-muted, #777);
    background: var(--color-bg-alt, #f2f2f2);
    border-radius: 999px;
    padding: .1rem .5rem;
}

.rr-bv-details .rr-bv-single__features { padding-bottom: .9rem; }

/* ---------- Localisation ---------- */
.rr-bv-single__map-note {
    font-size: .85rem;
    color: var(--color-text-muted, #777);
    margin: -.5rem 0 .8rem;
}

.rr-bv-map {
    height: 380px;
    border-radius: 12px;
    overflow: hidden;
    background: var(--color-bg-muted, #eee);
}

/* ---------- Prix natif secondaire ----------
   Affiche sous le prix converti quand la liste est normalisee dans une autre
   devise : le catalogue melange EUR, MUR et USD. */
/* Programme neuf : « A partir de » en surtitre discret au-dessus du prix. */
.rr-bv-card__price-from {
    display: block;
    font-size: .78rem;
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--color-text-muted, #777);
}

.rr-bv-card__price-native {
    display: block;
    font-size: .85rem;
    font-weight: 500;
    color: var(--color-text-muted, #777);
}

.rr-bv-pricebox__mandat {
    font-size: .85rem;
    color: var(--color-text-muted, #777);
    margin: .25rem 0 0;
}

/* ---------- Localisation en tete de fiche ---------- */
.rr-bv-single__location {
    display: flex;
    align-items: center;
    gap: .35rem;
}

/* ---------- Biens similaires ----------
   La grille par defaut demarre a 280px ; dans ce bloc de bas de page on
   resserre pour tenir quatre cartes sur une ligne en desktop. */
.rr-bv-single__similar .rr-bv-grid {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 1rem;
}

/* =========================================================================
   Galerie — mise en page reprise de glcd-sales (gallery__main + thumbs).
   ========================================================================= */

.rr-bv-gallery { margin-bottom: 2rem; }

.rr-bv-gallery__main {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background: var(--color-bg-muted, #eee);
}

.rr-bv-gallery__main-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    cursor: zoom-in;
}

/* Etat « aucune photo servie » : aujourd'hui le cas de tout le catalogue,
   l'hebergeur d'images d'Activimmo repondant 200 avec un corps vide. Un fond
   neutre et une mention valent mieux qu'une icone d'image cassee. */
.rr-bv-gallery__empty {
    display: none;
    position: absolute;
    inset: 0;
    align-items: center;
    justify-content: center;
    margin: 0;
    color: var(--color-text-muted, #777);
    font-size: .9rem;
}

.rr-bv-gallery.is-empty .rr-bv-gallery__main-img { display: none; }
.rr-bv-gallery.is-empty .rr-bv-gallery__empty { display: flex; }
.rr-bv-gallery.is-empty .rr-bv-gallery__thumbs { display: none; }

.rr-bv-gallery__thumbs {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
    gap: .5rem;
    margin-top: .6rem;
}

.rr-bv-gallery__thumb {
    padding: 0;
    border: 2px solid transparent;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    background: var(--color-bg-muted, #eee);
    aspect-ratio: 1 / 1;
}

.rr-bv-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rr-bv-gallery__thumb.is-active { border-color: var(--color-primary, #2f6f4f); }

/* ---------- Lightbox ---------- */
.rr-bv-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, .92);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
}

.rr-bv-lightbox[hidden] { display: none; }

.rr-bv-lightbox__img {
    max-width: 90vw;
    max-height: 85vh;
    object-fit: contain;
    border-radius: 8px;
}

.rr-bv-lightbox__nav,
.rr-bv-lightbox__close {
    background: rgba(255, 255, 255, .12);
    color: #fff;
    border: 0;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    font-size: 1.6rem;
    line-height: 1;
    cursor: pointer;
    flex: 0 0 auto;
}

.rr-bv-lightbox__nav:hover,
.rr-bv-lightbox__close:hover { background: rgba(255, 255, 255, .25); }

.rr-bv-lightbox__close { position: absolute; top: 1.25rem; right: 1.25rem; }

.rr-bv-lightbox__counter {
    position: absolute;
    bottom: 1.25rem;
    left: 0;
    right: 0;
    text-align: center;
    color: #fff;
    font-size: .9rem;
    margin: 0;
}

/* ---------- Carte : absence de photo ----------
   Meme logique que la galerie : le fond neutre de la carte fait office de
   placeholder, on y ajoute une mention discrete. */
.rr-bv-card__media::after {
    content: attr(data-empty-label);
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-muted, #999);
    font-size: .8rem;
    opacity: 0;
    transition: opacity .2s;
}

.rr-bv-card__media.is-empty::after { opacity: 1; }