.page-wrapper #partenaires-section h3,
.block-wrapper#partenaires-section h3 {
  color: #3f51b5 !important; 
  margin-left: 10px;
}

@media (min-width: 992px) {
  body .page-wrapper #partenaires-section .slider-btn.prev,
  body #partenaires-section .slider-btn.prev,
  body .page-wrapper #partenaires-section .partenaire .slider-btn.prev,
  body #partenaires-section .partenaire .slider-btn.prev,
  .page-wrapper #partenaires-section .slider-btn.prev,
  .block-wrapper#partenaires-section .slider-btn.prev,
  #partenaires-section .partenaire .slider-btn.prev {
    left: 5px !important; 
    right: auto !important;
    top: 50% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    position: absolute !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 30px !important;  
    height: 30px !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1000 !important;
    pointer-events: auto !important; 
    cursor: pointer !important;
    background-color: rgba(255, 255, 255, 0.9) !important;
    border: 1px solid #e0e0e0 !important;
  }
}

#partenaires-section .slider-btn:disabled,
.page-wrapper #partenaires-section .slider-btn:disabled {
  opacity: 0.5 !important;
  pointer-events: auto !important; 
}

@media (min-width: 992px) {
  body .page-wrapper #partenaires-section .slider-btn.next,
  body #partenaires-section .slider-btn.next,
  body .page-wrapper #partenaires-section .partenaire .slider-btn.next,
  body #partenaires-section .partenaire .slider-btn.next,
  .page-wrapper #partenaires-section .slider-btn.next,
  .block-wrapper#partenaires-section .slider-btn.next,
  #partenaires-section .partenaire .slider-btn.next {
    right: 5px !important; 
    left: auto !important;
    top: 50% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    position: absolute !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 30px !important;  
    height: 30px !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1000 !important;
    pointer-events: auto !important; 
    cursor: pointer !important;
  }
}
#partenaires-section .partenaire,
.page-wrapper #partenaires-section .partenaire,
.block-wrapper#partenaires-section .partenaire,
body .page-wrapper #partenaires-section .partenaire {
  position: relative !important;
  overflow: visible !important; 
}

#partenaires-section .footer-logo,
.page-wrapper #partenaires-section .footer-logo,
.block-wrapper#partenaires-section .footer-logo {
  height: 120px !important; 
}
/* ============================================
   ALIGNEMENT VERTICAL RIGOUREUX - CAPTURE 1
   ============================================ */

/* Structure principale avec marges latérales */
body.body-color {
  margin: 0 !important;
  padding: 0 !important;
  background-image: url("/images/new-banner/body.png");
  background-repeat: repeat;
  background-position: 0 0;
  background-attachment: fixed;
  background-size: auto;
  min-height: 100vh;
  position: relative;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  overflow-x: hidden !important;
  left: 0 !important;
  right: 0 !important;
  padding-bottom: 0 !important;
  box-sizing: border-box !important;
}
html {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

/* Image par-dessus la couleur verte - Couvre toute la page y compris le footer */
body.body-color::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url("/images/new-banner/body.png");
  background-repeat: repeat;
  background-position: 0 0;
  background-attachment: fixed;
  background-size: auto;
  z-index: -1; 
  pointer-events: none;
  opacity: 0.1;
  height: 100%;
  min-height: 100vh;
}

/* Wrapper principal qui contient tout le contenu - Centré avec largeur max */
.page-wrapper {
  position: relative;
  z-index: 1;
  background: transparent;
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  padding: 0 !important; 
  box-sizing: border-box;
  overflow: visible !important;
  isolation: auto !important;
  transform: none !important;
}

body .page-wrapper > .header-default {
  position: relative;
  z-index: 1;
  transform: none !important;
  isolation: auto !important;
}

/* Les sections ont un fond blanc pour le contenu central */
.page-wrapper > section:not(.ts-newslatter),
.page-wrapper > header,
.page-wrapper > .top-nav,
.page-wrapper > .header-middle,
.page-wrapper > .header-default,
.page-wrapper > .block-wrapper {
  background: white;
  position: relative;
  z-index: 1; 
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important; 
  box-sizing: border-box;
}

.page-wrapper > .ts-newslatter,
.page-wrapper > section.ts-newslatter {
  background: #f5f5f5 !important;
  position: relative;
  z-index: 1;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;
}

/* Tous les containers - déjà dans page-wrapper donc pas besoin de max-width */
.page-wrapper .container,
.page-wrapper .container-fluid {
  width: 100% !important;
  max-width: 100% !important; 
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 15px !important; 
  padding-right: 15px !important; 
  box-sizing: border-box !important;
}

.page-wrapper .top-nav .container {
  padding-right: 0 !important;
  padding-left: 15px !important;
}

/* Force l'élimination complète de tout espace à droite pour la topbar */
.page-wrapper > .top-nav,
.page-wrapper > .top-nav .container,
.page-wrapper > .top-nav .container > * {
  padding-right: 0 !important;
  margin-right: 0 !important;
}

/* Assurer l'alignement vertical de toutes les sections - Elles sont maintenant dans page-wrapper */
.page-wrapper > section,
.page-wrapper > .section,
.page-wrapper > .block-wrapper,
.page-wrapper > header,
.page-wrapper > .top-nav,
.page-wrapper > .header-middle,
.page-wrapper > .header-default,
.page-wrapper > .ts-newslatter,
.page-wrapper > section.ts-newslatter {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;
  position: relative;
  left: 0;
  right: 0;
}

.page-wrapper > .top-nav {
  background-color: #f8f8f8 !important;
  margin: 0 !important;
  padding: 10px 0;
  display: flex;
  align-items: center;
  min-height: 45px;
  border-bottom: none;
}

.top-nav .container {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  padding-left: 15px !important;
  padding-right: 0 !important; 
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  box-sizing: border-box !important;
  margin-right: 0 !important;
}

/* ============================================
   CORRECTION BOOTSTRAP - PADDING INVISIBLE AU HOVER
   ============================================ */

/* CORRECTION : La zone cliquable de top-nav-right ne doit pas dépasser son contenu */
.page-wrapper > .top-nav .container .top-nav-right {
  width: fit-content !important; 
  min-width: 0 !important; 
  max-width: fit-content !important;
  box-sizing: content-box !important; 
  padding: 0 !important; 
  margin: 0 !important; 
}

.page-wrapper > .top-nav .container .top-nav-right .phone-img {
  padding: 0 !important; 
  margin: 0 !important; 
  border: 0 !important; 
  outline: none !important;
  box-shadow: none !important;
  display: block !important; 
}

.page-wrapper > .header-middle {
  background: white;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  overflow: hidden; 
}

.header-middle .container {
  padding: 0 !important;
  width: 100% !important;
  margin: 0 !important;
}

.header-middle .row {
  margin: 0 !important;
  width: 100% !important;
}

.header-middle .col-lg-12 {
  padding: 0 !important;
  width: 100% !important;
}

/* Correction spécifique pour que la bannière occupe toute la largeur à droite */
.page-wrapper > .header-middle .banner-img {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden; 
}

.page-wrapper > .header-middle .banner-img a {
  display: block;
  width: 100%;
  overflow: hidden; 
}

.page-wrapper > .header-middle .banner-img img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto;
  display: block;
  margin: 0;
  transform-origin: center; 
}

.page-wrapper > .header-middle .banner-img img:hover {
  transform: scale(1.05);
}

/* ============================================
   FLASH INFOS SECTION - Prend toute la largeur blanche
   ============================================ */

/* Navigation - Alignement vertical */
.page-wrapper > .header-default {
  background: white;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  border-bottom: none !important;
}

.page-wrapper > .header-default::after,
.page-wrapper > .header-default::before {
  display: none !important;
  content: none !important;
}

/* Assurer que le container du header-default prend 100% de largeur pour le flash info */
.page-wrapper > .header-default .container {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin: 0 !important;
}

/* Assurer que la row prend 100% de largeur */
.page-wrapper > .header-default .container .row {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Assurer que col-lg-12 prend 100% de largeur sans padding */
.page-wrapper > .header-default .container .row .col-lg-12 {
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Flash Infos Section - Le fond prend toute la largeur blanche */
.page-wrapper > .header-default .container .row .col-lg-12 .ts-breaking-news,
.page-wrapper > .header-default .ts-breaking-news {
  background-color: #f5f5f5 !important;
  border-bottom: none !important; 
  padding: 15px 0 !important;
  margin: 0 !important;
  width: 100% !important; 
  display: flex;
  align-items: center;
  min-height: 45px;
  box-sizing: border-box;
  position: relative !important; 
}

.page-wrapper
  > .header-default
  .container
  .row
  .col-lg-12
  .ts-breaking-news::after,
.page-wrapper > .header-default .ts-breaking-news::after {
  content: "";
  display: block;
  width: 95%;
  height: 2px;
  background-color: #cccccc;
  position: absolute;
  align-items: center;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.ts-breaking-news {
  background-color: #f5f5f5 !important;
  border-bottom: none !important; 
  padding: 15px 0 !important;
  margin: 0 auto;
  display: flex;
  align-items: center;
  min-height: 45px;
  position: relative !important; 
}

.ts-breaking-news::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #cccccc;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  border: none;
  margin: 0;
  padding: 0;
}

/* ============================================
   BARRE DE NAVIGATION - ALIGNEMENT VERTICAL
   ============================================ */

/* Pousser la barre de navigation vers le bas */
.page-wrapper > .header-default .navigation,
.page-wrapper > .header-default .ts-main-menu,
.page-wrapper > .header-default .nav-menus-wrapper {
  margin-top: 15px !important;
  border-bottom: none !important;
}

/* Supprimer complètement tout HR ou bordure après la navigation */
.page-wrapper > .header-default .navigation::after,
.page-wrapper > .header-default .navigation::before,
.page-wrapper > .header-default .ts-main-menu::after,
.page-wrapper > .header-default .ts-main-menu::before,
.page-wrapper > .header-default .ts-menu-sticky::after,
.page-wrapper > .header-default .ts-menu-sticky::before,
.page-wrapper > .header-default .nav-menus-wrapper::after,
.page-wrapper > .header-default .nav-menus-wrapper::before {
  display: none !important;
  content: none !important;
}

/* CRITIQUE: S'assurer que la navigation et ses conteneurs permettent aux dropdowns de s'afficher */
.page-wrapper > .header-default .navigation,
.page-wrapper > .header-default .ts-main-menu,
.page-wrapper > .header-default .ts-menu-sticky,
.page-wrapper > .header-default .nav-menus-wrapper,
.page-wrapper > .header-default .nav-menu,
body .page-wrapper > .header-default .ts-menu-sticky.sticky .navigation,
body .page-wrapper > .header-default .ts-menu-sticky.sticky .ts-main-menu,
body .page-wrapper > .header-default .ts-menu-sticky.sticky .nav-menus-wrapper,
body .page-wrapper > .header-default .ts-menu-sticky.sticky .nav-menu,
body .page-wrapper > .header-default .ts-menu-sticky.sticky .container,
body .page-wrapper > .header-default .ts-menu-sticky.sticky .row {
  overflow: visible !important; 
}

.page-wrapper > .header-default .nav-menu > li,
body .page-wrapper > .header-default .ts-menu-sticky .nav-menu > li,
body .page-wrapper > .header-default .ts-menu-sticky.sticky .nav-menu > li {
  position: relative !important; 
}

/* CRITIQUE: Zone hover étendue sur les items de menu pour maintenir le dropdown ouvert */
.page-wrapper > .header-default .nav-menu > li:hover,
body .page-wrapper > .header-default .ts-menu-sticky .nav-menu > li:hover,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky.sticky
  .nav-menu
  > li:hover {
  position: relative !important;
}

/* ============================================
   DESIGN MODERNE POUR LES MENUS DÉROULANTS
   ============================================ */
/* CRITIQUE: Dropdowns - z-index très élevé pour être au-dessus de tout */
/* IMPORTANT: Ces règles s'appliquent uniquement quand le dropdown est affiché (géré par JS) */
.page-wrapper > .header-default .nav-menu > li .nav-dropdown,
.page-wrapper > .header-default .nav-dropdown,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky
  .nav-menu
  > li
  .nav-dropdown,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky.sticky
  .nav-menu
  > li
  .nav-dropdown {
  position: absolute !important;
  z-index: 9999999999 !important; 
  top: 100% !important; 
  left: 0 !important;
  margin-top: 0 !important;
  overflow: visible !important; 
  min-width: 220px !important; 
  background-color: #ffffff !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08) !important;
  border: none !important; 
  border-radius: 8px !important; 
  margin-top: 0 !important; 
  padding: 8px 0 !important; 
  visibility: inherit !important;
  transform: none !important;
  pointer-events: auto !important;
  animation: dropdownFadeIn 0.3s ease-out !important;
  -webkit-animation: dropdownFadeIn 0.3s ease-out !important;
}

/* Zone invisible pour combler l'espace entre le menu parent et le dropdown */
.page-wrapper > .header-default .nav-menu > li .nav-dropdown::before,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky
  .nav-menu
  > li
  .nav-dropdown::before,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky.sticky
  .nav-menu
  > li
  .nav-dropdown::before {
  content: "" !important;
  position: absolute !important;
  top: -10px !important; 
  left: -10px !important; 
  right: -10px !important; 
  height: 10px !important; 
  background: transparent !important;
  pointer-events: auto !important;
  z-index: 1 !important;
}

/* Animation d'apparition pour les dropdowns */
@keyframes dropdownFadeIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@-webkit-keyframes dropdownFadeIn {
  from {
    opacity: 0;
    -webkit-transform: translateY(-10px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}

/* Items du dropdown - Design moderne */
.page-wrapper > .header-default .nav-menu > li .nav-dropdown > li,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky
  .nav-menu
  > li
  .nav-dropdown
  > li,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky.sticky
  .nav-menu
  > li
  .nav-dropdown
  > li {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
  float: none !important;
  clear: both !important;
  pointer-events: auto !important;
  z-index: 1 !important;
}

/* Liens du dropdown - Design moderne et épuré */
.page-wrapper > .header-default .nav-menu > li .nav-dropdown > li > a,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky
  .nav-menu
  > li
  .nav-dropdown
  > li
  > a,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky.sticky
  .nav-menu
  > li
  .nav-dropdown
  > li
  > a {
  width: 100% !important;
  padding: 12px 24px !important; 
  display: block !important;
  text-decoration: none !important;
  float: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #333333 !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
  -webkit-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
  position: relative !important;
  line-height: 1.5 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  z-index: 1 !important;
}

/* Hover sur les liens du dropdown - Design moderne avec couleur du footer */
.page-wrapper > .header-default .nav-menu > li .nav-dropdown > li:hover > a,
.page-wrapper > .header-default .nav-menu > li .nav-dropdown > li.focus > a,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky
  .nav-menu
  > li
  .nav-dropdown
  > li:hover
  > a,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky.sticky
  .nav-menu
  > li
  .nav-dropdown
  > li:hover
  > a {
  background-color: #00944f !important; 
  color: #ffffff !important; 
  padding-left: 28px !important; 
  transform: translateX(
    4px
  ) !important;
}

/* Séparateur moderne entre les items (optionnel) */
.page-wrapper
  > .header-default
  .nav-menu
  > li
  .nav-dropdown
  > li:not(:last-child)::after,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky
  .nav-menu
  > li
  .nav-dropdown
  > li:not(:last-child)::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 24px !important;
  right: 24px !important;
  height: 1px !important;
  background-color: #f0f0f0 !important;
  opacity: 0.5 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* Assurer que la navigation prend toute la largeur et respecte l'alignement vertical */
.page-wrapper > .header-default .navigation,
.page-wrapper > .header-default .ts-main-menu {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 15px !important;  
  padding-right: 15px !important;
  box-sizing: border-box !important;
}

/* Hover des éléments de la navbar - Utiliser la couleur verte du footer */
.page-wrapper > .header-default .nav-menu > li > a:hover,
body .page-wrapper > .header-default .ts-menu-sticky .nav-menu > li > a:hover,
body
  .page-wrapper
  > .header-default
  .ts-menu-sticky.sticky
  .nav-menu
  > li
  > a:hover {
  background-color: #00944f !important; 
  background: #00944f !important; 
  color: #fff !important; 
}

/* Assurer que nav-menus-wrapper respecte l'alignement vertical et horizontal */
.page-wrapper > .header-default .nav-menus-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  display: flex !important; 
  flex-direction: row !important; 
  align-items: center !important; 
  justify-content: flex-start !important; 
}

  /* Assurer que nav-menu (les liens de navigation) respectent l'alignement vertical et horizontal */
.page-wrapper > .header-default .nav-menu {
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  display: flex !important; 
  align-items: center !important;
  flex-wrap: nowrap !important; 
  list-style: none !important;
  order: 1 !important; 
}

.page-wrapper > .header-default .nav-menu > li {
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  float: none !important; 
  display: inline-flex !important; 
  align-items: center !important;
  vertical-align: middle !important;
}

/* Assurer que right-menu respecte l'alignement vertical et horizontal */
.page-wrapper > .header-default .right-menu {
  margin: 0 !important;
  margin-left: auto !important; 
  padding: 0 !important;
  box-sizing: border-box !important;
  display: flex !important; 
  align-items: center !important;
  flex-shrink: 0 !important; 
  list-style: none !important;
  float: none !important;
  order: 2 !important; 
}

.page-wrapper > .header-default .right-menu > li {
  float: none !important; 
  display: inline-flex !important;
  align-items: center !important;
}

/* Assurer que header-search respecte l'alignement vertical */
.page-wrapper > .header-default .header-search {
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Assurer que search-section respecte l'alignement vertical et horizontal */
.page-wrapper > .header-default .search-section {
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  height: 60px !important;
}

/* Assurer que search-input et search-btn respectent l'alignement vertical */
.page-wrapper > .header-default .search-input,
.page-wrapper > .header-default .search-btn {
  margin: 0 !important;
  box-sizing: border-box !important;
  vertical-align: middle !important;
}

/* Alignement horizontal parfait */
.page-wrapper > .header-default .right-menu .header-search .search-section {
  height: 60px !important;
  display: flex !important;
  align-items: center !important;
}

/* Toutes les sections de contenu - Alignement vertical */
.page-wrapper > .block-wrapper,
.page-wrapper > .ts-newslatter,
.page-wrapper > section.ts-newslatter {
  margin: 0 !important;
  padding: 15px 0 !important; 
  padding-top: 65px !important; 
  padding-bottom: 30px !important; 
  width: 100% !important;
  position: relative !important;
  border-top: none !important;
  overflow: visible !important; 
  box-sizing: border-box !important;
 }

 /* Exception ciblée: Bannière Signalis (supprimer uniquement l'espace du bas) */
 .page-wrapper > #signalis-banner,
 .page-wrapper > .block-wrapper:has(img[src*="banner-signalis"]),
 .block-wrapper:has(img[src*="banner-signalis"]) {
   padding-bottom: 0 !important;
   margin-bottom: 0 !important;
 }

 /* HR supprimé après la navbar */
 .page-wrapper > .block-wrapper::before {
   display: none !important; 
   content: none !important;
 }

/* HR conservé uniquement pour newsletter et sections spécifiques si nécessaire */
.page-wrapper > .ts-newslatter::before,
.page-wrapper > section.ts-newslatter::before {
  content: "";
  display: block;
  width: 95%;
  height: 2px;
  background-color: #cccccc;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  border: none;
  margin: 0;
  padding: 0;
}

/* Marge en bas pour les images dans block-wrapper */
.page-wrapper > .block-wrapper img,
.page-wrapper > .block-wrapper .banner-img,
.page-wrapper > .block-wrapper .item {
  margin-bottom: 20px !important; 
}

 #signalis-banner img,
 #signalis-banner .banner-img,
 .page-wrapper > #signalis-banner img,
 .page-wrapper > #signalis-banner .banner-img {
   margin-bottom: 0 !important;
 }

.block-wrapper .container,
.page-wrapper > .ts-newslatter .container,
.page-wrapper > section.ts-newslatter .container {
  width: 100%;
}

/* Section principale de contenu */
.page-wrapper .main-content-section {
  margin: 0 !important;
  padding: 30px 15px !important;
  position: relative !important; 
  border: none !important; 
  border-bottom: none !important; 
  border-top: none !important; 
}

/* HR en bas de la section main-content-section */
.page-wrapper .main-content-section::after {
  content: "";
  display: block;
  width: 95%;
  height: 2px;
  background-color: #cccccc;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  border: none;
  margin: 0;
  padding: 0;
}

/* Formation section - Alignement vertical */
.page-wrapper .formation-section {
  margin: 0 !important;
  padding: 30px 15px;
}

/* Download section - Alignement vertical */
.page-wrapper .download-section {
  margin: 0 !important;
  padding: 20px 15px;
}

/* Partenaires section - Alignement vertical */
.page-wrapper #partenaires-section,
.page-wrapper .block-wrapper#partenaires-section,
.block-wrapper#partenaires-section {
  margin: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 8px 0 !important;        
  padding-top: 4px !important;     
  padding-bottom: 12px !important;  
  position: relative !important;
  overflow: hidden !important; 
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  display: block !important;
  background-color: #f5f5f5 !important; 
}

.page-wrapper .partenaire,
.page-wrapper #partenaires-section .partenaire,
.block-wrapper#partenaires-section .partenaire {
  margin: 0 auto !important;
  padding: 10px 50px !important; 
  background-color: #ffffff !important; 
  overflow: visible !important; 
  position: relative !important;
  max-width: 95% !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

.page-wrapper #partenaires-section .container,
.block-wrapper#partenaires-section .container {
  overflow: visible !important;
  position: relative !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* RÈGLES D'ALIGNEMENT DU FOOTER SUPPRIMÉES - Voir footer-fix.css */

/* Séparateurs - Alignement vertical */
.page-wrapper .separator {
  width: 100%;
  margin: 0;
  background: #e0e0e0;
  border: none;
}

/* Assurer que les rows sont bien contenues */
.row {
  margin-left: -15px;
  margin-right: -15px;
  display: flex;
  flex-wrap: wrap;
}

/* ============================
   MÉDIATHÈQUE - Amélioration layout
   ============================ */
/* Conteneur global: plus d'air autour du contenu */
.page-wrapper .mediatheque-section .main-video-container {
  padding: 20px 18px !important;
}

/* Forcer la row à aligner les colonnes sur la même hauteur et créer un léger écart visuel */
.page-wrapper .mediatheque-section .main-video-container > .row {
  align-items: stretch !important;
  flex-wrap: nowrap !important;
  gap: 0 !important;
}

/* Colonne de gauche (vidéo principale) occupe toute la hauteur disponible */
.page-wrapper .mediatheque-section .main-video-container .col-lg-7,
.page-wrapper .mediatheque-section .main-video-container .col-lg-8 {
  display: flex;
}

.page-wrapper .mediatheque-section .main-video-container .main-video-player {
  width: 100%;
  display: flex;
  flex-direction: column;
  height: auto !important; /* la hauteur est définie en JS */
}

/* Vignette principale: occupe toute la hauteur de son parent */
.page-wrapper
  .mediatheque-section
  .main-video-container
  .main-video-player
  > div {
  width: 100%;
  height: 100% !important; /* 100% du parent = 400px */
  background-size: cover !important;
  background-position: center !important;
}

/* Colonne de droite (petites vidéos): SUPPRIME tous les paddings pour expansion maximale */
.page-wrapper .mediatheque-section .main-video-container .col-lg-5,
.page-wrapper .mediatheque-section .main-video-container .col-lg-4 {
  padding-left: 0 !important;
  padding-right: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  background-color: #e5e7e6 !important;
  flex: 1 1 auto !important;
  max-width: none !important;
  min-width: 0 !important;
  width: auto !important;
  margin-left: auto !important;
  overflow-x: hidden !important;
}

/* Liste des petites vidéos: occupe toute la hauteur ET largeur - SUPPRIME tous les paddings */
.page-wrapper .mediatheque-section .small-videos {
  flex: 1 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

/* Chaque item: aligné, avec espace vertical fixe */
.page-wrapper .mediatheque-section .small-video-item {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  margin-bottom: var(--thumb-gap) !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.page-wrapper .mediatheque-section .small-video-item:last-child {
  margin-bottom: 0 !important;
}

/* Vignettes: agrandies pour occuper mieux l'espace */
.page-wrapper .mediatheque-section .small-video-item > div:first-child {
  width: 170px !important;
  height: 100px !important;
  border-radius: 6px !important;
  background-size: cover !important;
  background-position: center !important;
  flex-shrink: 0 !important;
  position: relative !important;
  cursor: pointer !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Carte texte: style complet avec fond blanc, shadow, bordure arrondie - agrandie */
.page-wrapper .mediatheque-section .small-video-item > div:last-child {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  display: block !important;
  padding: 12px 14px !important;
  margin-left: 12px !important;
  margin-right: 0 !important;
  background: #e5e7e6 !important; /* même fond gris que la section médiathèque */
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
  align-items: flex-start !important;
}

/* Texte dans la carte: surcharge tous les styles inline */
.page-wrapper .mediatheque-section .small-video-item h6 {
  font-size: 12px !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  color: #0066cc !important;
  font-weight: 600 !important;
  font-family: "Arial", sans-serif !important;
  word-wrap: break-word !important;
  overflow-wrap: anywhere !important;
  hyphens: auto !important;
  display: block !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  max-height: none !important;
}

/* Guillemets typographiques auto autour des titres miniatures */
.page-wrapper .mediatheque-section .small-video-item h6::before {
  content: "\201C";
  color: inherit;
  margin-right: 2px;
}
.page-wrapper .mediatheque-section .small-video-item h6::after {
  content: "\201D"; /* ” */
  color: inherit;
  margin-left: 2px;
}

.page-wrapper .mediatheque-section .section-header img {
  width: 85% !important; /* agrandi de 75% à 85% */
  max-width: 550px !important; /* agrandi de 480px à 550px */
  min-width: 200px;
}

/* Réglages responsives pour éviter la casse */
@media (max-width: 1200px) {
  .page-wrapper .mediatheque-section .main-video-container .main-video-player {
    height: auto !important;
  }
  .page-wrapper
    .mediatheque-section
    .main-video-container
    .main-video-player
    > div {
    height: 100% !important;
  }
}

@media (max-width: 992px) {
  .page-wrapper .mediatheque-section .main-video-container > .row {
    gap: 0;
  }
  .page-wrapper .mediatheque-section .main-video-container .main-video-player,
  .page-wrapper
    .mediatheque-section
    .main-video-container
    .main-video-player
    > div {
    min-height: 0;
  }
  .page-wrapper .mediatheque-section .small-video-item > div:first-child {
    width: 140px !important;
    height: 100px !important;
  }
}

/* ==========================================
   Fond gris global (comme Flash Info) pour toutes les sections
   Le background gris continue depuis le topbar jusqu'à la Newsletter
   ========================================== */
.page-wrapper > section:not(.ts-newslatter),
.page-wrapper > header,
.page-wrapper > .top-nav,
.page-wrapper > .header-middle,
.page-wrapper > .header-default,
.page-wrapper > .block-wrapper,
.page-wrapper .main-content-section,
.page-wrapper .formation-section,
.page-wrapper .download-section {
  background-color: #f5f5f5 !important;
}

/* Newsletter - RÈGLE FORTE pour garantir le background gris */
.page-wrapper > .ts-newslatter,
.page-wrapper > section.ts-newslatter,
.page-wrapper .ts-newslatter,
.ts-newslatter,
.ts-newslatter.newsletter-modern,
section.ts-newslatter,
section.newsletter-modern {
  background-color: #f5f5f5 !important;
  background: #f5f5f5 !important; /* Double protection - background et background-color */
}

/* Section Partenaires - Fond blanc */
.page-wrapper #partenaires-section,
.page-wrapper .block-wrapper#partenaires-section,
.block-wrapper#partenaires-section {
  background-color: #f5f5f5 !important; /* fond gris section */
}

.page-wrapper #partenaires-section .partenaire,
.page-wrapper .block-wrapper#partenaires-section .partenaire,
.block-wrapper#partenaires-section .partenaire {
  background-color: #ffffff !important; /* cadre blanc interne */
}

/* Les containers internes héritent aussi du fond pour supprimer le blanc résiduel */
.page-wrapper > section .container,
.page-wrapper > header .container,
.page-wrapper > .top-nav .container,
.page-wrapper > .header-middle .container,
.page-wrapper > .header-default .container,
.page-wrapper > .block-wrapper .container,
.page-wrapper .main-content-section .container,
.page-wrapper .formation-section .container,
.page-wrapper .download-section .container,
.page-wrapper > .ts-newslatter .container,
.page-wrapper .ts-newslatter .container,
.page-wrapper > section.ts-newslatter .container,
.ts-newslatter .container,
.ts-newslatter.newsletter-modern .container {
  background-color: #f5f5f5 !important;
}

/* Exception pour la section partenaires - fond blanc */
.page-wrapper #partenaires-section .container,
.page-wrapper .block-wrapper#partenaires-section .container,
.block-wrapper#partenaires-section .container {
  background-color: transparent !important; /* laisse voir le gris */
}

.page-wrapper #partenaires-section .partenaire,
.page-wrapper .block-wrapper#partenaires-section .partenaire,
.block-wrapper#partenaires-section .partenaire {
  background-color: #ffffff !important; /* cadre blanc */
}

/* ==========================================
   Barre de navigation: fond gris uniforme
   ========================================== */
.page-wrapper > .header-default,
.page-wrapper > .header-default .navigation,
.page-wrapper > .header-default .ts-main-menu,
.page-wrapper > .header-default .nav-menus-wrapper {
  background-color: #f5f5f5 !important;
}

/* CRITIQUE: La navbar sticky doit passer au-dessus de la topbar quand elle devient sticky */
/* La topbar reste visible en haut, mais la navbar sticky passe au-dessus quand elle devient sticky */
.top-nav,
.header-box-transprent,
.top-bar {
  position: relative;
  z-index: 1; /* z-index bas pour passer sous la navbar sticky (999999999) quand elle devient sticky */
}

/* Mais quand la navbar sticky est active, elle doit être au-dessus du contenu qui scroll */
/* La topbar reste au-dessus car elle est statique en haut */

/* Empêche les ancêtres de créer un nouveau contexte de positionnement
   qui casserait position: fixed de la navbar sticky */
body .page-wrapper,
body .page-wrapper > .header-default {
  transform: none !important;
  /* Ne pas créer de contexte de stacking qui limiterait la navbar sticky */
  isolation: auto !important;
}

/* CRITIQUE: Tous les éléments de contenu qui scrollent doivent avoir un z-index inférieur à la navbar */
/* Cela garantit qu'ils passent en dessous lors du scroll */
/* RÈGLE GLOBALE: TOUS les éléments après la navbar doivent avoir z-index <= 0 */
/* Exception: header-default peut avoir z-index: 1 car il contient la navbar */
.page-wrapper > .header-default {
  z-index: 1 !important;
}

/* TOUS les autres éléments directs de page-wrapper doivent avoir z-index: 0 */
.page-wrapper > section,
.page-wrapper > .block-wrapper,
.page-wrapper > .featured-slider,
.page-wrapper > .post-list-item,
.page-wrapper > .mediatheque-section,
.page-wrapper > .communique-section,
.page-wrapper > #more-news-section,
.page-wrapper > .ts-newslatter {
  position: relative;
  z-index: 0 !important; /* z-index TRÈS bas (0) pour passer sous la navbar sticky (z-index: 999999999) */
  /* S'assurer qu'aucun enfant ne peut créer un contexte de stacking supérieur */
  isolation: auto !important;
}

/* CRITIQUE: S'assurer qu'aucun élément dans block-wrapper ne dépasse le z-index de la navbar */
/* Règle spécifique pour les éléments qui pourraient avoir un z-index élevé */
/* RÈGLE GLOBALE: TOUS les enfants de block-wrapper doivent avoir z-index <= 0 */
.page-wrapper > .block-wrapper *,
.page-wrapper > .block-wrapper .container,
.page-wrapper > .block-wrapper .row,
.page-wrapper > .block-wrapper [class*="col-"],
.page-wrapper > .block-wrapper .owl-carousel,
.page-wrapper > .block-wrapper .ts-grid-box,
.page-wrapper > .block-wrapper .item,
.page-wrapper > .block-wrapper .post-content,
.page-wrapper > .block-wrapper .overlay-post-content,
.page-wrapper > section *,
.page-wrapper > .featured-slider *,
.page-wrapper > .post-list-item * {
  position: relative;
  z-index: 0 !important; /* Forcer un z-index TRÈS bas (0) pour rester sous la navbar (999999) */
  /* S'assurer qu'ils ne créent pas de contexte de stacking supérieur */
  isolation: auto !important;
}

/* Exception: Les boutons de navigation du featured-slider doivent avoir un z-index élevé pour être visibles */
.page-wrapper > .featured-slider .owl-nav,
.page-wrapper > .featured-slider .owl-nav *,
.page-wrapper #featured-slider .owl-nav,
.page-wrapper #featured-slider .owl-nav * {
  z-index: 100 !important; /* z-index élevé pour être au-dessus du contenu */
  position: relative !important;
}

/* Carousels et sliders doivent aussi passer sous la navbar */
.page-wrapper .owl-carousel,
.page-wrapper .featured-slider,
.page-wrapper .ts-grid-box,
.page-wrapper .slider-container {
  position: relative;
  z-index: 1 !important; /* z-index bas pour passer sous la navbar sticky */
}

/* Styles pour les boutons de navigation du slider formation (slider-container) */
/* Correspondant à la capture 2 : boutons gris clair avec chevrons blancs */
/* Styles des boutons de navigation - Desktop uniquement */
@media (min-width: 992px) {
  .formation-card .slider-container .nav-btn,
  .slider-container .nav-btn,
  .formation-section .slider-container .nav-btn,
  .page-wrapper .formation-section .slider-container .nav-btn {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: #ffffff !important; /* Fond blanc */
    color: #000000 !important; /* Chevrons noirs */
    width: 35px !important; /* Réduit de 40px à 35px */
    height: 35px !important; /* Réduit de 40px à 35px */
    border-radius: 50% !important;
    display: flex !important; /* Forcer l'affichage */
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 10000 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.3) !important;
    border: none !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

@media (min-width: 992px) {
  .formation-card .slider-container .nav-btn.prev,
  .slider-container .nav-btn.prev,
  .formation-section .slider-container .nav-btn.prev {
    left: 0 !important; /* Collé au bord gauche */
  }

  .formation-card .slider-container .nav-btn.next,
  .slider-container .nav-btn.next,
  .formation-section .slider-container .nav-btn.next {
    right: 0 !important; /* Collé au bord droit */
  }

  .formation-card .slider-container .nav-btn svg,
  .slider-container .nav-btn svg,
  .formation-section .slider-container .nav-btn svg {
    width: 18px !important; /* Réduit de 24px à 18px */
    height: 18px !important; /* Réduit de 24px à 18px */
    stroke: #000000 !important; /* Chevrons noirs */
    color: #000000 !important;
  }

  .formation-card .slider-container .nav-btn:hover,
  .slider-container .nav-btn:hover,
  .formation-section .slider-container .nav-btn:hover {
    background: #f0f0f0 !important; /* Gris clair au survol */
    transform: translateY(-50%) scale(1.05) !important;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.4) !important;
  }
}

/* Masquer les dots (indicateurs) du slider */
.formation-card .slider-container .dots,
.slider-container .dots,
.formation-section .slider-container .dots,
.page-wrapper .formation-section .slider-container .dots {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
}

/* Forcer l'affichage des boutons même avec les sélecteurs checked - Desktop uniquement */
@media (min-width: 992px) {
  #slide1:checked ~ .slider-container .nav-btn.prev[data-slide="1"],
  #slide1:checked ~ .slider-container .nav-btn.next[data-slide="1"],
  #slide2:checked ~ .slider-container .nav-btn.prev[data-slide="2"],
  #slide2:checked ~ .slider-container .nav-btn.next[data-slide="2"],
  #slide3:checked ~ .slider-container .nav-btn.prev[data-slide="3"],
  #slide3:checked ~ .slider-container .nav-btn.next[data-slide="3"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* S'assurer que le slider-container permet la visibilité des boutons */
.formation-card .slider-container,
.formation-section .slider-container {
  position: relative !important;
  overflow: visible !important;
}

/* Navigation sticky: fond gris uniquement (position gérée plus bas) */
.ts-menu-sticky.sticky {
  background-color: #f5f5f5 !important;
}
.ts-menu-sticky.sticky .nav-menus-wrapper {
  background-color: #f5f5f5 !important;
}

/* Forcer la visibilité/affichage même avec animations de thème */
.ts-menu-sticky.sticky,
.ts-menu-sticky.sticky.fade_down_effect {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  min-height: 60px;
}

/* CRITIQUE: Garantir que la navbar sticky est TOUJOURS visible */
body .page-wrapper > .header-default .ts-menu-sticky.sticky {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  /* S'assurer qu'elle n'est jamais cachée */
  clip: auto !important;
  clip-path: none !important;
}

/* ======= SOLUTION ROBUSTE: STICKY dans le wrapper aligné ======= */
/* Base: non sticky reste dans le flux */
body .page-wrapper > .header-default .ts-menu-sticky {
  position: relative !important;
  width: 100% !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  box-sizing: border-box !important;
}

/* État sticky: règles redondantes supprimées - voir règle finale ci-dessous (ligne 1008) */

body .page-wrapper > .header-default .ts-menu-sticky .container,
body .page-wrapper > .header-default .ts-menu-sticky .navigation,
body .page-wrapper > .header-default .ts-menu-sticky .ts-main-menu,
body .page-wrapper > .header-default .ts-menu-sticky .nav-menus-wrapper {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  box-sizing: border-box !important;
}

/* RÈGLE UNIQUE ET FINALE - Navbar sticky alignée verticalement */
/* Cette règle est la plus spécifique et gagne sur toutes les autres */
/* IMPORTANT: La navbar sticky doit être fixée au viewport, mais alignée avec .page-wrapper */
/* CRITIQUE: position: fixed sort l'élément du flux normal et du contexte de stacking du parent */
body .page-wrapper > .header-default .ts-menu-sticky.sticky {
  position: fixed !important;
  top: 0 !important; /* valeur par défaut, surchargée par media queries ci-dessous */
  z-index: 999999999 !important; /* z-index EXTRÊMEMENT élevé pour être au-dessus de TOUT (même style.css a 99999999999) */
  width: 100% !important;
  max-width: 1200px !important; /* même largeur que .page-wrapper */
  left: 50% !important; /* Centrage avec transform */
  transform: translateX(
    -50%
  ) !important; /* Centrage précis avec .page-wrapper */
  margin-left: 0 !important; /* Pas de margin pour le centrage */
  margin-right: 0 !important;
  box-sizing: border-box !important;
  background-color: #f5f5f5 !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  /* CRITIQUE: Créer un nouveau contexte de stacking indépendant du parent */
  isolation: isolate !important;
  /* S'assurer qu'elle est au-dessus de tout le contenu qui scroll */
  will-change: transform !important;
  /* FORCER la navbar à rester au-dessus même des éléments avec position: relative */
  pointer-events: auto !important;
  /* IMPORTANT: Ne pas utiliser contain car cela limite le positionnement des dropdowns enfants */
  /* contain: layout style paint supprimé pour permettre aux dropdowns de s'afficher correctement */
  overflow: visible !important; /* Permettre aux dropdowns de dépasser */
  /* CRITIQUE: Garantir que la navbar est TOUJOURS visible et jamais cachée */
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  height: auto !important;
  min-height: 60px !important;
  max-height: none !important;
  clip: auto !important;
  clip-path: none !important;
}

/* CRITIQUE: La navbar sticky doit commencer à top: 0 dès qu'on scroll */
/* IMPORTANT: Préserver le transform: translateX(-50%) pour le centrage */
/* La navbar sticky commence au début de la page (top: 0) et passe au-dessus de la topbar */
@media (min-width: 1200px) {
  body .page-wrapper > .header-default .ts-menu-sticky.sticky {
    top: 0 !important; /* Commence au début de la page, pas sous la topbar */
    transform: translateX(-50%) !important; /* Préserver le centrage */
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  body .page-wrapper > .header-default .ts-menu-sticky.sticky {
    top: 0 !important; /* Commence au début de la page, pas sous la topbar */
    transform: translateX(-50%) !important; /* Préserver le centrage */
  }
}
@media (max-width: 991.98px) {
  body .page-wrapper > .header-default .ts-menu-sticky.sticky {
    top: 0 !important; /* Commence au début de la page, pas sous la topbar */
    transform: translateX(-50%) !important; /* Préserver le centrage */
  }
}

/* Évite que le contenu passe sous la barre fixée */
.page-wrapper {
  scroll-padding-top: 60px;
}

/* Réserver l'espace sous la barre sticky pour empêcher le recouvrement */
body.sticky-active .page-wrapper {
  padding-top: 60px !important;
}
@media (min-width: 1200px) {
  body.sticky-active .page-wrapper {
    padding-top: 60px !important;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  body.sticky-active .page-wrapper {
    padding-top: 52px !important;
  }
}
@media (max-width: 991.98px) {
  body.sticky-active .page-wrapper {
    padding-top: 45px !important;
  }
}

/* Contenus internes: contrainte et padding identiques au reste */
body .page-wrapper > .header-default .ts-menu-sticky.sticky .container,
body .page-wrapper > .header-default .ts-menu-sticky.sticky .navigation,
body .page-wrapper > .header-default .ts-menu-sticky.sticky .ts-main-menu,
body .page-wrapper > .header-default .ts-menu-sticky.sticky .nav-menus-wrapper {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  box-sizing: border-box !important;
}

/* Exception : row dans header-middle ne doit pas avoir de marges négatives */
.page-wrapper > .header-middle .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ============================================
   AJUSTEMENT PIXEL-PERFECT POUR LE DESIGN
   ============================================ */
/* Règles générales pour les colonnes Bootstrap */
.row > [class*="col-"] {
  padding-left: 15px;
  padding-right: 15px;
}

/* ============================================
   AJUSTEMENT PIXEL-PERFECT POUR LE DESIGN
   Analyse frontend design pro - Espacements précis
   ============================================ */
/* CRITIQUE: Ajustement pixel-perfect pour la page d'accueil */
/* Container dans block-wrapper - Padding précis */
.page-wrapper > .block-wrapper .container {
  padding-left: 15px !important;
  padding-right: 15px !important;
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}

/* Row dans block-wrapper - Marges nulles pour alignement parfait */
.page-wrapper > .block-wrapper .container .row {
  margin-left: -15px !important; /* Compense le padding des colonnes */
  margin-right: -15px !important;
  box-sizing: border-box !important;
}

/* Colonnes dans block-wrapper - Espacement précis et uniforme */
.page-wrapper > .block-wrapper .container .row > [class*="col-"] {
  padding-left: 15px !important;
  padding-right: 15px !important;
  /* S'assurer que les colonnes sont parfaitement alignées */
  box-sizing: border-box !important;
  position: relative !important;
}

/* Colonne carousel (col-lg-6) - Ajustement précis */
.page-wrapper > .block-wrapper .container .row > .col-lg-6 {
  padding-left: 15px !important;
  padding-right: 15px !important;
  /* S'assurer que la colonne carousel est parfaitement alignée */
  box-sizing: border-box !important;
}

/* Colonne ACTUALITÉS (col-lg-3) - Ajustement précis */
.page-wrapper > .block-wrapper .container .row > .col-lg-3 {
  padding-left: 15px !important;
  padding-right: 15px !important;
  /* S'assurer que la colonne ACTUALITÉS est parfaitement alignée */
  box-sizing: border-box !important;
}

/* Colonne profil/navigation (col-lg-3) - Ajustement précis */
.page-wrapper > .block-wrapper .container .row > .col-lg-3:last-child {
  padding-left: 15px !important;
  padding-right: 15px !important;
  /* S'assurer que la colonne profil est parfaitement alignée */
  box-sizing: border-box !important;
}

/* Exception : colonnes dans header-middle ne doivent pas avoir de padding */
.page-wrapper > .header-middle .row > [class*="col-"] {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Alignement vertical strict pour tous les éléments flex */
.mediatheque-section,
.communique-section {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* Assurer l'alignement vertical des éléments dans les colonnes */
.cooperation-item,
.formation-card,
.agenda-item {
  width: 100%;
}

/* =============================
   COMMUNIQUÉ – Répartition verticale
   ============================= */
.page-wrapper .communique-section {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
  border: 1px solid #e0e0e0 !important;
}

.page-wrapper .communique-section .documents-list {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important; /* répartir les éléments pour occuper l'espace */
  gap: 10px !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

.page-wrapper .communique-section .document-item {
  flex: 0 0 auto !important;
}

/* Media queries pour responsivité tout en gardant l'alignement */
@media (max-width: 1200px) {
  .page-wrapper,
  .container,
  section,
  .section,
  .block-wrapper {
    max-width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }
}

@media (max-width: 768px) {
  body.body-color::before {
    background-size: 100px 150px, 120px 180px, 80px 120px;
  }
}

/* Fix pour éviter les débordements horizontaux */
* {
  box-sizing: border-box;
}

html {
  margin: 0 !important;
  padding: 0 !important;
  width: 100%;
  overflow-x: hidden;
}

/* Garantir que tous les éléments de contenu sont alignés verticalement */
.page-wrapper #featured-slider,
.page-wrapper .post-list-item,
.page-wrapper .profile-card,
.page-wrapper .mediatheque-section,
.page-wrapper .communique-section,
.page-wrapper .download-grid,
.page-wrapper .formation-grid,
.page-wrapper #more-news-section {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

/* S'assurer que le featured-slider permet aux boutons de navigation d'être visibles */
.page-wrapper #featured-slider,
.page-wrapper > .featured-slider {
  overflow: visible !important;
  position: relative !important;
}

/* S'assurer que les conteneurs parents permettent la visibilité des boutons */
.page-wrapper .block-wrapper:has(#featured-slider),
.page-wrapper .block-wrapper .container:has(#featured-slider),
.page-wrapper .block-wrapper .row:has(#featured-slider),
.page-wrapper .block-wrapper .col-lg-6:has(#featured-slider) {
  overflow: visible !important;
  position: relative !important;
}

/* Alternative pour les navigateurs qui ne supportent pas :has() */
.page-wrapper .block-wrapper.mt-15 {
  overflow: visible !important;
}

.page-wrapper .block-wrapper.mt-15 .container,
.page-wrapper .block-wrapper.mt-15 .row,
.page-wrapper .block-wrapper.mt-15 .col-lg-6 {
  overflow: visible !important;
  position: relative !important;
}

/* ================================
   MÉDIATHÈQUE – OVERRIDES FINAUX
   ================================ */
/* Le parent de la section est le canvas gris (annule le style inline) */
.page-wrapper .mediatheque-section {
  background: #e5e7e6 !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
  border: 1px solid #e0e0e0 !important;
}

/* Supprimer les gouttières qui créent du blanc */
.page-wrapper .mediatheque-section > .container {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: transparent !important;
}
.page-wrapper .mediatheque-section > .container > .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Colonne miniatures collée à droite, sans vide - FORCE l'expansion */
.page-wrapper .mediatheque-section .main-video-container {
  padding: 20px 0 20px 18px !important; /* pas de padding droit */
  width: 100% !important; /* force largeur complète */
  border-bottom: none !important; /* supprime le border-bottom */
  border-top: none !important; /* supprime le border-top */
}
.page-wrapper .mediatheque-section .main-video-container > .row {
  flex-wrap: nowrap !important; /* empêche le retour à la ligne */
  width: 100% !important; /* force largeur complète */
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.page-wrapper .mediatheque-section .main-video-container .col-lg-7,
.page-wrapper .mediatheque-section .main-video-container .col-lg-8 {
  flex: 0 0 62% !important; /* agrandit la vidéo principale */
  max-width: 62% !important;
}
.page-wrapper .mediatheque-section .main-video-container .col-lg-5,
.page-wrapper .mediatheque-section .main-video-container .col-lg-4 {
  margin-left: auto !important;
  padding-right: 0 !important; /* pas de padding droit */
  padding-left: 0 !important; /* pas de padding gauche */
  background: transparent !important;
  flex: 1 1 auto !important; /* CHANGE: prend tout l'espace restant */
  max-width: none !important; /* CHANGE: supprime la limite de 38% */
  min-width: 0 !important; /* autorise le shrink si nécessaire */
  overflow-x: hidden !important; /* empêche tout débordement */
}

/* Nettoyage des anciens overrides redondants supprimés pour éviter les conflits */

/* ================================
   MÉDIATHÈQUE SLIDER - Navigation
   ================================ */
/* Slider container */
.page-wrapper .mediatheque-slider {
  position: relative !important;
  overflow: hidden !important;
}

.page-wrapper .mediatheque-slider-container {
  position: relative !important;
  width: 100% !important;
  overflow: hidden !important;
}

.page-wrapper .mediatheque-slides-wrapper {
  display: flex !important;
  transition: transform 0.5s ease-in-out !important;
  width: 100% !important;
}

.page-wrapper .mediatheque-slide {
  min-width: 100% !important;
  flex-shrink: 0 !important;
  display: block !important;
}

/* Flèches de navigation - Positionnées aux angles comme dans le design - Desktop uniquement */
@media (min-width: 992px) {
  .page-wrapper .mediatheque-nav-btn {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border: 1px solid #e0e0e0 !important;
    width: 48px !important;
    height: 48px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 100 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
    padding: 0 !important;
    margin: 0 !important;
  }
}

@media (min-width: 992px) {
  .page-wrapper .mediatheque-nav-btn:hover {
    background: rgba(255, 255, 255, 1) !important;
    transform: translateY(-50%) scale(1.1) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
  }

  .page-wrapper .mediatheque-nav-btn svg {
    width: 20px !important;
    height: 20px !important;
    color: #333 !important;
    stroke: #333 !important;
  }

  .page-wrapper .mediatheque-nav-prev {
    left: 15px !important;
  }

  .page-wrapper .mediatheque-nav-next {
    right: 15px !important;
  }
}

/* Supprimer complètement les dots de pagination s'ils existent */
.page-wrapper .mediatheque-slider .dots,
.page-wrapper .mediatheque-slider .owl-dots,
.page-wrapper .mediatheque-slider-container .dots {
  display: none !important;
}

/* Supprimer les dots pour more-news-slider (section PHOTOS) */
#more-news-section .owl-dots,
#more-news-slider .owl-dots,
#more-news-section .owl-dots,
.page-wrapper #more-news-section .owl-dots,
.page-wrapper #more-news-slider .owl-dots {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
}

/* Ajustement de la hauteur pour 4 miniatures */
.page-wrapper .mediatheque-section {
  /* Variables pour miniatures */
  --thumb-height: 100px;
  --thumb-gap: 12px; /* espace réduit entre miniatures */
}

/* Modifier le font-weight du texte "Déclaration de patrimoine" en medium uniquement dans la section médiathèque */
/* Cibler le div qui contient le texte dans les miniatures vidéo */
.page-wrapper
  .mediatheque-section
  .main-video-container
  div[style*="font-size: 10px"],
.page-wrapper
  .mediatheque-section
  .main-video-container
  div[style*="letter-spacing: 0.6px"],
.page-wrapper
  .mediatheque-section
  .small-video-item
  > div:last-child
  > div:first-child {
  font-weight: 700 !important;
}

/* La hauteur de .main-video-player est maintenant pilotée en JS pour matcher
   exactement la somme des 3 miniatures (marges incluses). */

/* Colonne miniatures: alignement top sans décalage */
.page-wrapper .mediatheque-section .col-lg-5 {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

.page-wrapper .mediatheque-section .small-videos {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Espace entre miniatures contrôlé par la variable */
.page-wrapper .mediatheque-section .small-video-item {
  margin-bottom: var(--thumb-gap) !important;
}
.page-wrapper .mediatheque-section .small-video-item:last-child {
  margin-bottom: 0 !important;
}

/* Assurer l'alignement vertical de la section médiathèque avec le reste de la page */
.page-wrapper .main-content-section {
  display: flex !important;
  align-items: stretch !important;
}

.page-wrapper .main-content-section > .container {
  display: flex !important;
  flex-direction: column !important;
}

.page-wrapper .main-content-section > .container > .row {
  display: flex !important;
  align-items: stretch !important;
  flex: 1 !important;
}

.page-wrapper .mediatheque-section {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

.page-wrapper .mediatheque-slider-container {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}

/* ================================
   MORE-NEWS-SECTION (PHOTOS)
   ================================ */
/* Alignement vertical de la section photos - MÊME padding que les autres block-wrapper */
#more-news-section,
.page-wrapper #more-news-section,
.block-wrapper#more-news-section {
  margin: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 15px 0 !important;
  padding-top: 32px !important;
  padding-bottom: 15px !important;
  min-height: 400px !important;
  position: relative !important;
  overflow: visible !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  display: block !important;
}

/* HR */
#more-news-section::before,
.page-wrapper #more-news-section::before,
.block-wrapper#more-news-section::before {
  content: "" !important;
  display: block !important;
  width: 95% !important;
  height: 2px !important;
  background-color: #cccccc !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 1 !important;
}

/* Container-fluid */
#more-news-section .container-fluid,
.page-wrapper #more-news-section .container-fluid {
  padding-left: 25px !important;
  padding-right: 25px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

/* Flèches de navigation */
#more-news-section {
  position: relative !important;
  overflow: visible !important;
}

#more-news-section .container-fluid {
  position: relative !important;
  overflow: visible !important;
}

/* Boutons Médiathèque images */
@media (min-width: 992px) {
  #more-news-section .more-news-nav-btn,
  .page-wrapper #more-news-section .more-news-nav-btn,
  #more-news-section .container-fluid .more-news-nav-btn {
    position: absolute !important;
    top: 20px !important;
    transform: none !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border: 1px solid #e0e0e0 !important;
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 10000 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
    padding: 0 !important;
    margin: 0 !important;
  }
}

#more-news-section .more-news-nav-btn svg {
  width: 13px !important;
  height: 13px !important;
  color: #333 !important;
  stroke: #333 !important;
  stroke-width: 2.5 !important;
}

#more-news-section .more-news-nav-btn:hover,
.page-wrapper #more-news-section .more-news-nav-btn:hover {
  background: rgba(255, 255, 255, 1) !important;
  transform: scale(1.1) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

/* Positionnement des flèches */
#more-news-section .more-news-nav-prev,
.page-wrapper #more-news-section .more-news-nav-prev,
#more-news-section .container-fluid .more-news-nav-prev {
  left: auto !important;
  right: 75px !important;
  top: 20px !important;
}

#more-news-section .more-news-nav-next,
.page-wrapper #more-news-section .more-news-nav-next,
#more-news-section .container-fluid .more-news-nav-next {
  right: 35px !important;
  top: 20px !important;
}

/* Assurer que le container du slider est bien positionné */
#more-news-section .ts-grid-box,
.page-wrapper #more-news-section .ts-grid-box {
  position: relative !important;
}

#more-news-section #more-news-slider,
.page-wrapper #more-news-section #more-news-slider {
  position: relative !important;
  margin-top: 50px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Supprimer spécifiquement les dots pour owl-carousel dans more-news-section */
#more-news-section .owl-carousel .owl-dots,
#more-news-section #more-news-slider .owl-dots,
.page-wrapper #more-news-section .owl-carousel .owl-dots,
.page-wrapper #more-news-section #more-news-slider .owl-dots,
.ts-grid-box .owl-dots,
#more-news-section .ts-grid-box .owl-dots {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ============================================
   MÉDIATHÈQUE IMAGE - DESIGN PIXEL-PERFECT
   ============================================ */

/* 1. Banner "Médiathèque image" */
@media (min-width: 992px) {
  #more-news-section .ts-title-wrapper,
  .page-wrapper #more-news-section .ts-title-wrapper {
    padding: 0 !important;
    margin: 0 !important;
    margin-bottom: 0 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    top: 12px !important;
    left: 0 !important;
    z-index: 20 !important;
    min-width: auto !important;
    height: auto !important;
    overflow: visible !important;
  }

  #more-news-section .mediatheque-banner,
  .page-wrapper #more-news-section .mediatheque-banner,
  #more-news-section .ts-title-wrapper .mediatheque-banner,
  #more-news-section .ts-title-wrapper img.mediatheque-banner,
  #more-news-section .ts-title-wrapper img.title-image,
  #more-news-section img.mediatheque-banner,
  #more-news-section img.title-image.mediatheque-banner {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: auto !important;
    max-width: 320px !important; /* Réduit de 440px à 320px */
    max-height: 60px !important; /* Limite la hauteur */
    height: auto !important;
    transform: none !important;
    z-index: 20 !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.25) !important;
    border-top-left-radius: 0 !important;
    border-bottom-right-radius: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    object-fit: contain !important; /* Préserve les proportions */
    overflow: visible !important;
  }
}

/* 2. Uniformiser la taille de toutes les cartes - Réduites */
#more-news-section #more-news-slider .item,
.page-wrapper #more-news-section #more-news-slider .item {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  margin: 8px !important; /* Réduit de 10px à 8px */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  width: 100% !important;
  height: 240px !important; /* Hauteur fixe pour toutes les cartes */
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important; /* pas d'espace interne */
  background: transparent !important; /* pas de fond qui crée un bandeau */
}

#more-news-section #more-news-slider .item .ts-post-thumb,
.page-wrapper #more-news-section #more-news-slider .item .ts-post-thumb {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  overflow: hidden !important;
  width: 100% !important;
  height: 100% !important;
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

#more-news-section #more-news-slider .item .ts-post-thumb > a,
.page-wrapper #more-news-section #more-news-slider .item .ts-post-thumb > a {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

#more-news-section #more-news-slider .item .ts-post-thumb img,
.page-wrapper #more-news-section #more-news-slider .item .ts-post-thumb img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  transition: transform 0.3s ease !important;
  filter: brightness(0.85) !important;
}

/* Fallbacks pour d'autres wrappers d'image éventuels */
#more-news-section #more-news-slider .item .post-thumb,
#more-news-section #more-news-slider .item .post-media,
.page-wrapper #more-news-section #more-news-slider .item .post-thumb,
.page-wrapper #more-news-section #more-news-slider .item .post-media {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
}

#more-news-section #more-news-slider .item .post-thumb img,
#more-news-section #more-news-slider .item .post-media img,
.page-wrapper #more-news-section #more-news-slider .item .post-thumb img,
.page-wrapper #more-news-section #more-news-slider .item .post-media img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}

/* Ajouter un overlay sombre léger sur les images */
#more-news-section #more-news-slider .item .ts-post-thumb::before,
.page-wrapper
  #more-news-section
  #more-news-slider
  .item
  .ts-post-thumb::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: rgba(
    0,
    0,
    0,
    0.15
  ) !important; /* Léger fond noir (15% d'opacité) */
  z-index: 1 !important;
  pointer-events: none !important;
}

/* 3. Texte et date sur l'image en bas (overlay) */
#more-news-section #more-news-slider .item .overlay-post-content,
.page-wrapper #more-news-section #more-news-slider .item .overlay-post-content {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.85) 0%,
    rgba(0, 0, 0, 0.5) 60%,
    transparent 100%
  ) !important;
  color: #fff !important;
  padding: 20px 15px 15px !important;
  transition: all 0.3s ease !important;
  z-index: 10 !important;
  margin: 0 !important;
}

#more-news-section #more-news-slider .item .overlay-post-content .post-title,
.page-wrapper
  #more-news-section
  #more-news-slider
  .item
  .overlay-post-content
  .post-title {
  font-size: 13px !important;
  font-weight: 400 !important;
  margin: 0 0 8px 0 !important;
  line-height: 1.4 !important;
  color: #fff !important;
}

#more-news-section #more-news-slider .item .overlay-post-content .post-title a,
.page-wrapper
  #more-news-section
  #more-news-slider
  .item
  .overlay-post-content
  .post-title
  a {
  color: #fff !important;
  text-decoration: none !important;
  transition: color 0.3s ease !important;
}

#more-news-section
  #more-news-slider
  .item
  .overlay-post-content
  .post-date-info,
.page-wrapper
  #more-news-section
  #more-news-slider
  .item
  .overlay-post-content
  .post-date-info {
  font-size: 11px !important;
  font-weight: 400 !important;
  color: #fff !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
}

#more-news-section
  #more-news-slider
  .item
  .overlay-post-content
  .post-date-info
  i,
.page-wrapper
  #more-news-section
  #more-news-slider
  .item
  .overlay-post-content
  .post-date-info
  i {
  font-size: 11px !important;
  color: #fff !important;
  margin: 0 !important;
}

/* S'assurer que le container-fluid et ts-grid-box n'ajoutent pas de padding qui décale le banner */
/* Le padding-left est géré plus haut pour les cartes, mais le banner doit rester collé à gauche */
#more-news-section .container-fluid,
.page-wrapper #more-news-section .container-fluid {
  padding-top: 0 !important; /* Pas de padding en haut pour que le banner soit collé */
  position: relative !important;
}

/* Exception : le banner doit être positionné par rapport à la section, pas au container-fluid */
#more-news-section .ts-title-wrapper,
.page-wrapper #more-news-section .ts-title-wrapper {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important; /* Collé au bord gauche de la section, pas du container-fluid */
  z-index: 20 !important;
  padding: 0 !important;
  margin: 0 !important;
}

#more-news-section .ts-grid-box,
.page-wrapper #more-news-section .ts-grid-box {
  padding: 0 !important;
  margin: 0 !important;
  position: relative !important;
}

/* Augmenter la hauteur du conteneur orange (ts-grid-box-highlight) pour plus d'espace */
#more-news-section .ts-grid-box-highlight,
.page-wrapper #more-news-section .ts-grid-box-highlight {
  padding: 15px 30px 25px 30px !important; /* Encore réduit : 15px en haut, 25px en bas, 30px sur les côtés */
  min-height: 280px !important; /* Hauteur minimale légèrement réduite */
}

/* Supprimer la redondance - déjà défini plus haut */

/* Correction supplémentaire pour l'alignement vertical global */
.page-wrapper > section,
.page-wrapper > .block-wrapper {
  vertical-align: top !important;
}

/* ============================================
   CAROUSEL FEATURED-SLIDER - AJUSTEMENTS PIXEL-PERFECT
   ============================================ */
/* 1. Supprimer UNIQUEMENT les tags "ACTIVITE DE DECLARATION", "GENERALITES", etc. (ts-orange-bg) */
/* La date (ts-green-bg) sera réaffichée plus bas */
.page-wrapper #featured-slider .post-cat.ts-orange-bg {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 2. Positionner le texte en bas du carousel */
.page-wrapper #featured-slider .overlay-post-content {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  margin-bottom: 0 !important; /* Supprimer le margin-bottom négatif */
  z-index: 2 !important; /* Au-dessus du gradient */
  overflow: visible !important; /* Permettre à la date de s'afficher */
}

/* Bordure orange juste à gauche du texte, proche du texte, centrée verticalement par rapport au texte */
.page-wrapper #featured-slider .overlay-post-content::before {
  content: "" !important;
  position: absolute !important;
  left: 24px !important; /* Proche du texte (même padding-left que post-content) */
  /* Centrer verticalement par rapport au texte */
  /* Le texte commence à top: 24px (padding-top) et a une hauteur approximative */
  /* On centre la bordure de 40px de hauteur par rapport au texte */
  top: 50% !important; /* Centre vertical du overlay-post-content */
  transform: translateY(-50%) !important; /* Centrer la bordure elle-même */
  margin-top: -10px !important; /* Ajustement pour centrer par rapport au texte (pas au container) */
  height: 40px !important; /* Petite hauteur */
  width: 4px !important; /* Largeur de la bordure */
  background-color: #ff6e0d !important; /* Couleur orange (ts-orange-bg) */
  z-index: 1 !important;
}

/* 3. Ajuster le padding du post-content pour un espacement précis */
/* Le padding-bottom sera ajusté plus bas pour laisser de l'espace pour la date */
.page-wrapper #featured-slider .overlay-post-content .post-content {
  padding: 24px 24px 35px !important; /* Padding précis avec espace pour la date en bas */
  position: relative !important; /* Pour positionner la date en bas */
  overflow: visible !important; /* Permettre à la date de s'afficher */
}

/* 4. Positionner la date juste en bas du texte */
.page-wrapper #featured-slider .overlay-post-content .post-title {
  margin-bottom: 10px !important; /* Espacement précis entre texte et date */
}

/* S'assurer que le titre est bien positionné */
.page-wrapper #featured-slider .overlay-post-content .post-title.lg {
  margin-bottom: 10px !important;
  font-size: 14px !important; /* Taille de police cohérente */
}

/* 5. Supprimer complètement la date qui s'affiche en haut (post-cat.ts-green-bg) */
.page-wrapper #featured-slider .item .post-cat.ts-green-bg {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 5b. Ajouter la date juste en bas du texte dans overlay-post-content */
/* Utilisation d'un élément réel (span.post-date-bottom) au lieu d'un pseudo-élément */
/* Positionner la date par rapport à overlay-post-content pour qu'elle soit visible */
.page-wrapper
  #featured-slider
  .overlay-post-content
  .post-content
  .post-date-bottom,
.page-wrapper #featured-slider .post-content .post-date-bottom,
#featured-slider .overlay-post-content .post-content .post-date-bottom,
#featured-slider .post-content .post-date-bottom,
.page-wrapper #featured-slider .post-date-bottom,
.page-wrapper #featured-slider .overlay-post-content .post-date-bottom {
  display: block !important;
  position: absolute !important;
  bottom: 8px !important; /* Juste en bas du texte */
  left: 24px !important; /* Aligné avec le texte (même padding-left) */
  color: #d2d2d2 !important;
  font-size: 14px !important;
  z-index: 10 !important; /* z-index élevé pour être au-dessus */
  line-height: 1.5 !important;
  white-space: nowrap !important;
  visibility: visible !important;
  opacity: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  /* Forcer l'affichage */
  pointer-events: auto !important;
  /* S'assurer que la date n'est pas masquée */
  clip: auto !important;
  clip-path: none !important;
}

/* Style pour l'icône de l'horloge dans la date */
.page-wrapper
  #featured-slider
  .overlay-post-content
  .post-content
  .post-date-bottom
  i,
.page-wrapper #featured-slider .post-content .post-date-bottom i,
#featured-slider .overlay-post-content .post-content .post-date-bottom i,
#featured-slider .post-content .post-date-bottom i {
  margin-right: 6px !important;
  font-size: 14px !important;
  color: #d2d2d2 !important;
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* S'assurer que la date est bien positionnée par rapport à overlay-post-content */
.page-wrapper #featured-slider .item {
  position: relative !important;
}

/* Ajuster le padding-bottom du post-content pour laisser de l'espace pour la date */
/* Le texte doit avoir assez d'espace en bas pour que la date soit visible */
.page-wrapper #featured-slider .overlay-post-content .post-content {
  padding-bottom: 30px !important; /* Espace pour le texte + marge, la date sera juste en bas */
}

/* Style pour l'icône de l'horloge dans la date */
.page-wrapper #featured-slider .item .post-cat.ts-green-bg i {
  margin-right: 6px !important;
  font-size: 14px !important;
  color: #d2d2d2 !important;
}

/* Style pour le span dans la date */
.page-wrapper #featured-slider .item .post-cat.ts-green-bg span {
  color: #d2d2d2 !important;
  font-size: 14px !important;
}

/* 6. Flèches de navigation - Poussées vers les bords, blanches et encore plus petites - Desktop uniquement */
/* RÈGLES ULTRA-SPÉCIFIQUES pour surcharger style.css */
@media (min-width: 992px) {
  .page-wrapper #featured-slider .owl-nav,
  #featured-slider .owl-nav,
  .page-wrapper .block-wrapper #featured-slider .owl-nav,
  body .page-wrapper #featured-slider .owl-nav {
    position: absolute !important;
    top: 50% !important;
    width: 100% !important;
    transform: translateY(-50%) !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    justify-content: space-between !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    pointer-events: none !important;
    z-index: 9999 !important; /* z-index TRÈS élevé pour être au-dessus de tout */
    left: 0 !important;
    right: 0 !important;
  }

  .page-wrapper #featured-slider .owl-nav .owl-prev,
  #featured-slider .owl-nav .owl-prev,
  .page-wrapper .block-wrapper #featured-slider .owl-nav .owl-prev,
  body .page-wrapper #featured-slider .owl-nav .owl-prev {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 50px !important; /* Augmenté pour meilleure visibilité */
    height: 50px !important; /* Augmenté pour meilleure visibilité */
    font-size: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    background: rgba(
      255,
      255,
      255,
      0.95
    ) !important; /* Légèrement transparent pour meilleur contraste */
    color: #333333 !important;
    border-radius: 50% !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3) !important; /* Ombre plus prononcée */
    z-index: 10000 !important;
    border: 2px solid rgba(255, 255, 255, 0.8) !important; /* Bordure plus visible */
    position: absolute !important;
    left: 15px !important; /* Légèrement plus éloigné du bord */
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  .page-wrapper #featured-slider .owl-nav .owl-next,
  #featured-slider .owl-nav .owl-next,
  .page-wrapper .block-wrapper #featured-slider .owl-nav .owl-next,
  body .page-wrapper #featured-slider .owl-nav .owl-next {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 50px !important; /* Augmenté pour meilleure visibilité */
    height: 50px !important; /* Augmenté pour meilleure visibilité */
    font-size: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    background: rgba(
      255,
      255,
      255,
      0.95
    ) !important; /* Légèrement transparent pour meilleur contraste */
    color: #333333 !important;
    border-radius: 50% !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3) !important; /* Ombre plus prononcée */
    z-index: 10000 !important;
    border: 2px solid rgba(255, 255, 255, 0.8) !important; /* Bordure plus visible */
    position: absolute !important;
    right: 15px !important; /* Légèrement plus éloigné du bord */
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  /* Styles pour les icônes FontAwesome dans les boutons de navigation */
  .page-wrapper #featured-slider .owl-nav .owl-prev i,
  .page-wrapper #featured-slider .owl-nav .owl-next i,
  #featured-slider .owl-nav .owl-prev i,
  #featured-slider .owl-nav .owl-next i,
  .page-wrapper .block-wrapper #featured-slider .owl-nav .owl-prev i,
  .page-wrapper .block-wrapper #featured-slider .owl-nav .owl-next i {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-size: 18px !important;
    color: #333333 !important;
    line-height: 1 !important;
    width: auto !important;
    height: auto !important;
    font-family: "FontAwesome" !important;
  }

  /* Hover effect pour les boutons de navigation */
  .page-wrapper #featured-slider .owl-nav .owl-prev:hover,
  .page-wrapper #featured-slider .owl-nav .owl-next:hover {
    background: rgba(255, 255, 255, 1) !important; /* Blanc opaque au survol */
    transform: translateY(-50%) scale(1.1) !important; /* Conserver le centrage vertical */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4) !important; /* Ombre plus prononcée au survol */
  }

  .page-wrapper #featured-slider .owl-nav .owl-prev:hover i,
  .page-wrapper #featured-slider .owl-nav .owl-next:hover i {
    color: #000000 !important;
  }

  /* S'assurer que le conteneur owl-carousel a position relative pour les boutons absolus */
  .page-wrapper #featured-slider.owl-carousel,
  #featured-slider.owl-carousel,
  .page-wrapper .block-wrapper #featured-slider.owl-carousel {
    position: relative !important;
    overflow: visible !important;
    z-index: 1 !important;
  }

  /* FORCER la création et l'affichage des boutons même s'ils n'existent pas encore */
  .page-wrapper #featured-slider::before {
    content: "" !important;
  }

  /* S'assurer que les boutons ne sont jamais masqués */
  .page-wrapper #featured-slider .owl-nav button,
  #featured-slider .owl-nav button,
  .page-wrapper #featured-slider .owl-nav .owl-prev,
  .page-wrapper #featured-slider .owl-nav .owl-next {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Forcer l'affichage des boutons même si Owl Carousel les cache par défaut */
  .page-wrapper #featured-slider.owl-carousel .owl-nav,
  #featured-slider.owl-carousel .owl-nav {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* S'assurer que les boutons sont créés même avec un seul item */
  .page-wrapper #featured-slider.owl-carousel.owl-loaded .owl-nav,
  #featured-slider.owl-carousel.owl-loaded .owl-nav {
    display: flex !important;
  }

  /* Règle pour forcer l'affichage même si disabled */
  .page-wrapper #featured-slider .owl-nav .owl-prev.disabled,
  .page-wrapper #featured-slider .owl-nav .owl-next.disabled {
    display: flex !important;
    visibility: visible !important;
    opacity: 0.5 !important;
    pointer-events: auto !important;
  }

  /* RÈGLE ULTIME : Forcer l'affichage des boutons avec tous les sélecteurs possibles */
  body
    .page-wrapper
    .block-wrapper
    .container
    .row
    .col-lg-6
    #featured-slider
    .owl-nav,
  body .page-wrapper #featured-slider .owl-nav,
  body #featured-slider .owl-nav {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    z-index: 99999 !important;
  }

  body
    .page-wrapper
    .block-wrapper
    .container
    .row
    .col-lg-6
    #featured-slider
    .owl-nav
    .owl-prev,
  body
    .page-wrapper
    .block-wrapper
    .container
    .row
    .col-lg-6
    #featured-slider
    .owl-nav
    .owl-next,
  body .page-wrapper #featured-slider .owl-nav .owl-prev,
  body .page-wrapper #featured-slider .owl-nav .owl-next,
  body #featured-slider .owl-nav .owl-prev,
  body #featured-slider .owl-nav .owl-next {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    z-index: 100000 !important;
  }
}

/* Override pour s'assurer que block-wrapper n'a pas de marges qui décalent */
/* ATTENTION: Cette règle entre en conflit avec la règle plus haut (ligne 438) qui définit padding-top: 65px */
/* On garde la règle plus haut mais on s'assure que overflow est visible */
.page-wrapper .block-wrapper#more-news-section {
  overflow: visible !important; /* Permet aux flèches de dépasser */
}

/* S'assurer que toutes les sections sont alignées verticalement */
.page-wrapper > section:not(.ts-footer),
.page-wrapper > .block-wrapper:not(.ts-footer),
.page-wrapper > .ts-newslatter,
.page-wrapper > section.ts-newslatter {
  display: block !important;
  vertical-align: top !important;
  /* vertical-align top pour l'alignement vertical strict */
}

/* RÈGLES D'ALIGNEMENT DU FOOTER SUPPRIMÉES - Voir footer-fix.css */

/* ==========================================
   NEWSLETTER SECTION - Alignement vertical (MÊME que les autres sections)
   ========================================== */
/* NOTE: Les règles de base (padding, margin, background) sont déjà définies plus haut */
/* avec les autres sections (.page-wrapper > .block-wrapper) */

/* Container Newsletter - Alignement vertical (MÊME que les autres containers) */
.page-wrapper .ts-newslatter .container,
.ts-newslatter.newsletter-modern .container,
.page-wrapper .ts-newslatter.newsletter-modern .container,
.page-wrapper > .ts-newslatter .container,
.page-wrapper > section.ts-newslatter .container {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  box-sizing: border-box !important;
}

/* Row Newsletter - Alignement vertical */
.page-wrapper .ts-newslatter .row,
.ts-newslatter.newsletter-modern .row,
.page-wrapper .ts-newslatter.newsletter-modern .row,
.page-wrapper > .ts-newslatter .row,
.page-wrapper > section.ts-newslatter .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Assurer que tous les textes de la Newsletter utilisent la même couleur grise */
.ts-newslatter h2,
.ts-newslatter .newsletter-title,
.newsletter-modern h2,
.newsletter-modern .newsletter-title,
.ts-newslatter .ts-newslatter-content h2,
.ts-newslatter .newsletter-content h2 {
  color: #8a8a8a !important; /* Même gris que le body */
}

.ts-newslatter p,
.ts-newslatter .newsletter-description,
.newsletter-modern p,
.newsletter-modern .newsletter-description,
.ts-newslatter .ts-newslatter-content p,
.ts-newslatter .newsletter-content p {
  color: #8a8a8a !important; /* Même gris que le body */
}

.ts-newslatter .newsletter-icon,
.newsletter-modern .newsletter-icon,
.ts-newslatter .newsletter-icon-wrapper i,
.newsletter-modern .newsletter-icon-wrapper i {
  color: #8a8a8a !important; /* Même gris que le body */
}

/* Placeholders - Même gris que le body */
.ts-newslatter input::placeholder,
.ts-newslatter input::-webkit-input-placeholder,
.ts-newslatter input:-ms-input-placeholder,
.ts-newslatter input::-ms-input-placeholder,
.newsletter-modern input::placeholder,
.newsletter-modern input::-webkit-input-placeholder,
.newsletter-modern input:-ms-input-placeholder,
.newsletter-modern input::-ms-input-placeholder {
  color: #8a8a8a !important; /* Même gris que le body */
}

/* Exception pour les inputs en focus - texte noir pour la lisibilité */
.ts-newslatter input:focus,
.newsletter-modern input:focus,
.ts-newslatter .newsletter-input:focus,
.newsletter-modern .newsletter-input:focus {
  color: #232323 !important;
}

/* Exception pour le bouton - texte blanc */
.ts-newslatter .newsletter-submit-btn,
.newsletter-modern .newsletter-submit-btn,
.ts-newslatter .newsletter-submit-wrapper button,
.newsletter-modern .newsletter-submit-wrapper button {
  color: #ffffff !important;
}