/* Pays-de-Clerval v2 — pages intérieures
   Les vues historiques (Bootstrap + styles intégrés) sont réalignées sur le nouveau design.
   Préfixe body.v2 : passe devant les <style> et pages_contenu.css des vues. */

body.v2 { display: flex; flex-direction: column; min-height: 100vh; font-family: var(--texte); font-size: 1.0625rem; color: var(--encre); }
body.v2 > main { flex: 1; }
body.v2 .entete .nav { display: block; flex-wrap: nowrap; }
@media (max-width: 860px) {
  body.v2 .entete .nav { display: none; }
  body.v2 .entete .nav.ouverte { display: block; }
}
body.v2 .container { max-width: 1240px; padding-inline: var(--gouttiere); }

/* Fil d'Ariane */
body.v2 .breadcrumb { display: block; height: auto; line-height: 1.4; margin: 0; padding: 14px 0; background: var(--fond-2); border-bottom: 1px solid var(--ligne); font-size: .95rem; color: var(--encre-2); }
body.v2 .breadcrumb a { color: var(--sapin); font-weight: 700; text-decoration: none; }
body.v2 .breadcrumb a:hover { text-decoration: underline; }

/* Fond des pages */
body.v2 .bg-gris-clair, body.v2 .bg-page { background: #fff; padding-bottom: clamp(48px, 7vw, 88px); }

/* Titres */
body.v2 main h1, body.v2 #contenupage h1 {
  font: 700 clamp(2.2rem, 4vw, 3.2rem)/1 var(--titre); text-transform: uppercase; letter-spacing: .02em;
  color: var(--sapin); background: none; padding: 0; margin: 8px 0 28px; text-wrap: balance;
}
body.v2 main h1::after { content: none; }
body.v2 #contenupage h2, body.v2 main .col-lg-9 h2, body.v2 main .col-md-9 h2, body.v2 main .col-md-8 h2, body.v2 main .col-md-12 > h2 {
  font: 700 clamp(1.6rem, 2.6vw, 2rem)/1.05 var(--titre); text-transform: uppercase; letter-spacing: .03em; color: var(--encre); margin: 40px 0 16px;
}
body.v2 #contenupage h3 { font: 700 1.35rem/1.2 var(--texte); color: var(--encre); margin: 28px 0 12px; }
body.v2 #contenupage h4, body.v2 #contenupage h5 { font: 700 1.1rem/1.3 var(--texte); color: var(--encre); }

/* Texte des pages (contenu saisi dans l'éditeur) */
body.v2 #contenupage { font-family: var(--texte); font-size: 1.0625rem; line-height: 1.65; color: var(--encre); max-width: 75ch; padding-bottom: 24px; }
body.v2 #contenupage p, body.v2 #contenupage li { font-size: inherit; color: inherit; }
body.v2 #contenupage p { margin: 0 0 1em; }
body.v2 #contenupage a { color: var(--sapin); text-decoration: underline; text-underline-offset: .18em; }
body.v2 #contenupage a:hover { color: var(--sapin-fonce); text-decoration-thickness: 2px; }
body.v2 #contenupage img { border-radius: var(--rayon); margin: 8px 0 20px; height: auto; }
body.v2 #contenupage blockquote, body.v2 #contenupage .blockquote { border: 0; margin: 24px 0; padding: 18px 22px; background: var(--mousse); border-radius: var(--rayon); }
body.v2 #contenupage table { border: 0; border-collapse: collapse; width: 100%; font-size: .98rem; }
body.v2 #contenupage th, body.v2 main table.table th, body.v2 main table.dataTable thead th {
  background: var(--fond-2); color: var(--encre); border: 0; border-bottom: 2px solid var(--sapin); padding: 10px 12px; text-align: left; font-weight: 700;
}
body.v2 #contenupage td, body.v2 main table.dataTable tbody td { border: 0; border-bottom: 1px solid var(--ligne); padding: 10px 12px; vertical-align: top; }
body.v2 main table.dataTable { border-collapse: collapse !important; }
body.v2 .dataTables_wrapper { font-size: .95rem; color: var(--encre-2); }
body.v2 .dataTables_wrapper .dataTables_filter input, body.v2 .dataTables_wrapper select { border: 1px solid #b9c7bf; border-radius: var(--rayon); padding: 6px 10px; }
body.v2 .dataTables_wrapper .dataTables_paginate .paginate_button.current { background: var(--sapin) !important; color: #fff !important; border-color: var(--sapin) !important; border-radius: var(--rayon); }

/* Menu latéral (rubrique, catégories) */
body.v2 .card-menu-page { background: var(--sapin); border: 0; border-radius: var(--rayon); overflow: hidden; margin-top: 24px; font-family: var(--texte); }
body.v2 .card-menu-page .card-header { background: none; border: 0; color: var(--soleil); font: 700 1.2rem/1 var(--titre); text-transform: uppercase; letter-spacing: .08em; text-align: left; padding: 20px 20px 12px; }
body.v2 .card-menu-page .list-group { border-radius: 0; }
body.v2 .card-menu-page .list-group-item { background: none; border: 0; border-top: 1px solid rgb(255 255 255 / .14); color: #fff; font-weight: 400; padding: 0; }
body.v2 .card-menu-page .list-group-item a { display: block; padding: 11px 20px; color: #fff; text-decoration: none; }
body.v2 .card-menu-page .list-group-item:hover { background: var(--sapin-clair); color: #fff; }
body.v2 .card-menu-page .list-group-item a:hover { text-decoration: underline; text-decoration-color: var(--soleil); }
body.v2 .card-menu-page .list-group-item.active { background: var(--sapin-fonce); font-weight: 700; }
body.v2 .card-menu-page .list-group-item.active::before { content: none; }
body.v2 .card-menu-page .list-group-item.active a { box-shadow: inset 4px 0 0 var(--soleil); }
body.v2 .card-menu-page br { display: none; }

/* Cartes (articles, albums, fiches) */
body.v2 main .card { border: 1px solid var(--ligne); border-radius: var(--rayon); overflow: hidden; box-shadow: none; transition: box-shadow .3s cubic-bezier(.16,1,.3,1); }
body.v2 main .card:hover { box-shadow: var(--ombre); }
body.v2 main .card:not(.card-menu-page) .card-header { background: var(--fond-2); border-bottom: 1px solid var(--ligne); font-weight: 700; }
body.v2 main .card-img-top { aspect-ratio: 16 / 10; object-fit: contain; background: var(--fond-2); }
body.v2 main .card-title { font: 700 1.15rem/1.25 var(--texte); text-transform: none; margin: 4px 0 8px; }
body.v2 main .card-text { font-family: var(--texte); font-size: .98rem; color: var(--encre-2); }
body.v2 main .card-footer { background: none; border-top: 0; padding: 0 16px 16px; }
body.v2 main .card-footer img, body.v2 main .btn img { display: none; }

/* Boutons Bootstrap → boutons du site */
body.v2 main .btn, body.v2 main .btn-sm {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: 700 1rem/1.2 var(--texte);
  padding: 11px 18px; border-radius: var(--rayon); border: 2px solid var(--sapin); background: var(--sapin); color: #fff; text-transform: none;
}
body.v2 main .btn-sm { font-size: .92rem; padding: 8px 14px; }
body.v2 main .btn:hover { background: var(--sapin-fonce); border-color: var(--sapin-fonce); color: #fff; }
body.v2 main .btn-outline-dark, body.v2 main .btn-light { background: transparent; color: var(--sapin); }
body.v2 main .btn-outline-dark:hover, body.v2 main .btn-light:hover { background: var(--mousse); color: var(--sapin); }

/* Formulaires */
body.v2 main label { font-weight: 700; font-size: .95rem; margin: 14px 0 6px; }
body.v2 main .form-control, body.v2 main .form-select {
  font: inherit; font-size: 1rem; padding: 11px 14px; border: 1px solid #b9c7bf; border-radius: var(--rayon); background-color: #fff; color: var(--encre);
}
body.v2 main .form-control::placeholder { color: #66716b; }
body.v2 main .form-control:focus, body.v2 main .form-select:focus { border-color: var(--sapin); box-shadow: 0 0 0 3px rgb(23 72 58 / .18); outline: none; }
body.v2 main .text-danger { color: #a23a24 !important; }
body.v2 main .alert-info { background: var(--mousse); border: 0; color: var(--encre); border-radius: var(--rayon); }
body.v2 main .alert-success { background: #dff3e7; border: 0; color: #14532d; border-radius: var(--rayon); }
body.v2 main .alert-danger { background: #fbe4de; border: 0; color: #7a2412; border-radius: var(--rayon); }

/* Pagination */
body.v2 main .pagination .page-link { color: var(--sapin); border-color: var(--ligne); }
body.v2 main .pagination .active .page-link, body.v2 main .pagination .page-item.active .page-link { background: var(--sapin); border-color: var(--sapin); color: #fff; }

/* Carrousel des articles */
body.v2 main .carousel { border-radius: var(--rayon); overflow: hidden; background: var(--fond-2); }

/* Encadré coordonnées (contact, colonne de droite) */
body.v2 main address { font-style: normal; line-height: 1.6; }

/* Logo décoratif sous les colonnes : inutile dans le nouveau design */
body.v2 main .d-flex.justify-content-center.mt-5 > img[src*="logo"] { display: none; }

@media (max-width: 991px) {
  body.v2 .card-menu-page { margin-top: 32px; }
}

/* Boutons à l'intérieur du contenu : pas le style des liens */
body.v2 #contenupage a.btn, body.v2 main a.btn { color: #fff; text-decoration: none; }
body.v2 #contenupage a.btn-outline-dark, body.v2 #contenupage a.btn-light, body.v2 main a.btn-outline-dark, body.v2 main a.btn-light { color: var(--sapin); }
body.v2 main table .btn { white-space: normal; font-size: .9rem; padding: 8px 12px; }

/* Téléphone : le contenu d'abord, le menu de rubrique ensuite */
@media (max-width: 991px) {
  body.v2 main .order-lg-1 { order: 1; }
  body.v2 main .order-lg-2 { order: 2; }
}

/* Images du contenu : en ligne, pour respecter l'alignement saisi dans l'éditeur
   (centré, à droite) et les blocs « text-center » comme les fiches des élus */
body.v2 #contenupage img { display: inline-block; vertical-align: middle; max-width: 100%; }
body.v2 #contenupage .text-center img, body.v2 #contenupage [style*="text-align: center"] img, body.v2 #contenupage [style*="text-align:center"] img { margin-inline: auto; }
/* Photos rondes (élus) : un vrai cercle, même si la photo n'est pas carrée */
body.v2 #contenupage img.rounded-circle { width: 140px; height: 140px; aspect-ratio: 1; object-fit: cover; object-position: 50% 30%; }
