/*
 * VJR 221 -- Modernisation premium (22/08/2026)
 * Audit design/dev/editorial complet : nav, rythme vertical, fiches annuaire
 * plein-cadre, sidebar encyclopedie allegee, cartes annuaire, filtres FacetWP.
 * Additif pur -- ne retire ni ne modifie aucune regle existante.
 */

/* ============================================================
   1. FIX NAV -- "Communaute" tronque en "Commun" a ~1280-1440px
   Cause mesuree : .main-nav contraint a ~498px alors qu'il faut
   ~800px pour les 6 items. On redonne la place au nav et on
   compacte les actions (compte / recherche / CTA) a ce palier.
   ============================================================ */
@media (max-width: 1500px) and (min-width: 1025px) {
  header .wrap {
    gap: 10px !important;
  }
  .main-nav {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    gap: 6px !important;
    overflow: visible !important;
  }
  .main-nav .nav-trigger {
    font-size: 12.6px !important;
    letter-spacing: 0 !important;
    white-space: nowrap;
  }
  .header-actions {
    gap: 4px !important;
  }
  .header-account-btn {
    padding-left: 10px !important;
    padding-right: 10px !important;
    font-size: 12.5px !important;
  }
  .header-cta {
    padding-left: 12px !important;
    padding-right: 12px !important;
    font-size: 12.5px !important;
  }
}

@media (max-width: 1220px) and (min-width: 1025px) {
  /* En dessous de ~1220px, meme compacte le nav ne tient plus a cote
     d'un CTA texte complet : on reduit le CTA a une forme courte. */
  .header-cta { padding-left: 10px !important; padding-right: 10px !important; }
}

/* ============================================================
   2. RYTHME VERTICAL -- sections qui se lisaient comme des trous
   vides (padding 120px + 2 tons de creme quasi identiques).
   On resserre le padding et on cree une vraie respiration visuelle
   (liseret + leger degrade) aux jonctions de section.
   ============================================================ */
.tg-section {
  padding-top: clamp(56px, 7vw, 88px) !important;
  padding-bottom: clamp(56px, 7vw, 88px) !important;
  position: relative;
}
.tg-section + .tg-section::before {
  content: "";
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: min(120px, 30%);
  height: 3px;
  border-radius: var(--radius-full, 9999px);
  background: linear-gradient(90deg, transparent, var(--vjr-safran, #E5A324), transparent);
  opacity: 0.55;
}
.tg-section.tg-alt {
  background: linear-gradient(180deg, var(--vjr-creme, #FBF5E8) 0%, var(--vjr-sable, #F4E9D6) 100%) !important;
}

/* Meme resserrement sur les heros d'archive (annuaire, rubriques). */
.vjr-directory-hero, .tg-archive-hero {
  padding-top: clamp(48px, 6vw, 72px) !important;
  padding-bottom: clamp(48px, 6vw, 72px) !important;
}

/* ============================================================
   3. FICHE ANNUAIRE -- plein cadre assume (pas de sidebar sur ce
   gabarit, deja le comportement existant a ce palier : on le
   confirme comme un choix de design "fiche produit focalisee",
   pattern Google Business / TripAdvisor) + habillage du nouveau
   bloc resume genere par le filtre the_content cote PHP.
   ============================================================ */
.vjr-directory-single .vjr-single-content {
  max-width: 880px;
  margin-left: auto;
  margin-right: auto;
}

.vjr-fiche-resume {
  background: var(--card-bg, #fff);
  border: 1px solid var(--border-color, var(--vjr-sable-deep, #EADCC0));
  border-left: 4px solid var(--vjr-savane, #123322);
  border-radius: var(--radius-lg, 12px);
  padding: 1.25rem 1.5rem;
  margin: 1.5rem 0;
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(13,27,42,.04));
}
.vjr-fiche-resume__type {
  display: inline-block;
  font-family: var(--font-display, 'Unbounded', sans-serif);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--vjr-savane, #123322);
  background: var(--vjr-vert-pale, #E3EFE7);
  border-radius: var(--radius-full, 9999px);
  padding: 0.3rem 0.85rem;
  margin-bottom: 0.75rem;
}
.vjr-fiche-resume__activites {
  margin: 0;
  line-height: 1.65;
  color: var(--text, #1F2937);
}
.vjr-fiche-resume__extra {
  list-style: none;
  margin: 0.9rem 0 0;
  padding: 0.75rem 0 0;
  border-top: 1px dashed var(--border-color, var(--vjr-sable-deep, #EADCC0));
  display: grid;
  gap: 0.35rem;
  font-size: 0.9rem;
  color: var(--text-secondary, #475569);
}
.vjr-fiche-resume__extra strong { color: var(--text, #1F2937); }

/* ============================================================
   4. SIDEBAR ENCYCLOPEDIE -- gardee (deja sticky), mais
   reordonnee (utile d'abord, monetisation/newsletter en bas) et
   allegee visuellement pour ne pas nuire a la lecture longue.
   Ordre cible : Rubriques -> Reseaux sociaux -> Signaler une
   erreur -> Recherche -> Publicite -> Soutenir -> Newsletter.
   ============================================================ */
.vjr-single-main:not(.vjr-directory-single) .vjr-page-sidebar {
  display: flex !important;
}
.vjr-single-main:not(.vjr-directory-single) .vjr-page-sidebar > .vjr-sidebar-box:nth-child(2) { order: 1; } /* Rubriques */
.vjr-single-main:not(.vjr-directory-single) .vjr-page-sidebar > .vjr-sidebar-box--social { order: 2; }
.vjr-single-main:not(.vjr-directory-single) .vjr-page-sidebar > .vjr-sidebar-box:nth-child(6) { order: 3; } /* Signaler une erreur */
.vjr-single-main:not(.vjr-directory-single) .vjr-page-sidebar > .vjr-sidebar-box--search { order: 4; }
.vjr-single-main:not(.vjr-directory-single) .vjr-page-sidebar > .vjr-sidebar-box:nth-child(3) { order: 5; opacity: .92; } /* Publicite */
.vjr-single-main:not(.vjr-directory-single) .vjr-page-sidebar > .vjr-sidebar-box:nth-child(4) { order: 6; } /* Soutenir */
.vjr-single-main:not(.vjr-directory-single) .vjr-page-sidebar > .vjr-sidebar-box--vert { order: 7; }

.vjr-page-sidebar .vjr-sidebar-box {
  border-radius: var(--radius-lg, 12px) !important;
}

/* ============================================================
   5. BLOCS PUBLICITE -- moins intrusifs (encyclopedie ET annuaire),
   surtout quand ils arrivent avant le premier paragraphe de contenu.
   ============================================================ */
.vjr-pub-banner, [class*="pub-banner"] {
  opacity: 0.9;
  transform: scale(0.97);
  transform-origin: top center;
}
.entry-content > .vjr-pub-banner:first-child,
.vjr-page-body > .vjr-pub-banner:first-child {
  margin-bottom: 2rem !important;
}

/* ============================================================
   6. CARTES ANNUAIRE -- coherence des badges + lisibilite.
   ============================================================ */
.vjr-article-card {
  transition: transform .18s ease, box-shadow .18s ease;
}
.vjr-article-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg, 0 10px 24px rgba(13,27,42,.12));
}
.vjr-article-card__call {
  font-weight: 600;
}

/* ============================================================
   7. FILTRES ANNUAIRE (FacetWP) -- plus respirants, plus premium.
   ============================================================ */
.vjr-facets-bar {
  border-radius: var(--radius-lg, 12px);
  background: var(--card-bg, #fff);
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(13,27,42,.04));
}
.facetwp-facet.facetwp-type-checkboxes .facetwp-checkbox {
  border-radius: var(--radius-md, 8px);
  transition: background .15s ease;
}
.facetwp-facet.facetwp-type-checkboxes .facetwp-checkbox:hover {
  background: var(--vjr-sable, #F4E9D6);
}
.facetwp-dropdown, select {
  border-radius: var(--radius-md, 8px) !important;
}


/* ============================================================
   8. CARTE INTEGREE (fiches annuaire avec GPS verifie)
   ============================================================ */
.vjr-fiche-map {
  margin: 0 0 1.5rem;
  border-radius: var(--radius-lg, 12px);
  overflow: hidden;
  border: 1px solid var(--border-color, var(--vjr-sable-deep, #EADCC0));
  box-shadow: var(--shadow-sm, 0 1px 2px rgba(13,27,42,.04));
  background: var(--card-bg, #fff);
}
.vjr-fiche-map iframe {
  width: 100%;
  height: 260px;
  border: 0;
  display: block;
}
.vjr-fiche-map__link {
  display: block;
  padding: 0.6rem 1rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--vjr-savane, #123322);
  text-decoration: none;
  border-top: 1px solid var(--border-color, var(--vjr-sable-deep, #EADCC0));
}
.vjr-fiche-map__link:hover { color: var(--vjr-terre, #BE5A21); }