/* ============================================
   Custom Harmonisation - FlyPix SAV
   Fond blanc, blocs centrés, police Arial
   Rendu identique local / serveur distant
   ============================================ */

/* 0. POLICE ARIAL - Uniforme sur tout le site (pas de dépendance Google Fonts) */
html,
body,
#s5_body,
input,
button,
select,
textarea,
.readon, .btn, .button, .readmore a, .pagenav a,
h1, h2, h3, h4, h5, h6,
#s5_menu_wrap, #s5_nav, #subMenusContainer,
#s5_breadcrumb_font_login_wrap, #s5_footer_area1,
.item-page, .item_title, .item_introtext,
.module_round_box, .s5_mod_h3, .s5_h3_first, .s5_h3_last,
#s5_responsive_mobile_sidebar, .flex-caption,
label, .inputbox, .custom, .moduletable {
  font-family: Arial, Helvetica, sans-serif !important;
}

/* Cohérence du rendu local/serveur - anti-aliasing uniforme */
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* 1. FOND BLANC - TOUTES LES PAGES */
html {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

body {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

#s5_body {
  background: #ffffff !important;
}

#s5_body_padding,
#s5_responsive_mobile_sidebar_body_wrap,
#s5_responsive_mobile_sidebar_body_wrap_inner {
  background: #ffffff !important;
}

/* 2. LARGEUR HARMONISÉE - 1200px sur TOUTES les pages */
#s5_main_wrapper,
.s5_wrap,
#s5_content_body_wrap,
#s5_columns_wrap_inner,
#s5_top_row2_area_inner,
#s5_center_area_inner,
#s5_bottom_row2_area_inner,
#s5_bottom_row3_area_inner {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#s5_main_wrapper {
  width: 96% !important;
}

.s5_wrap {
  width: 96% !important;
}

/* Harmonisation des paddings des blocs */
#s5_top_row2_wrap,
#s5_center_area1,
#s5_bottom_row2_wrap,
#s5_bottom_row3_wrap {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

#s5_component_wrap_inner {
  padding: 24px 24px 32px !important;
  max-width: 100%;
}

.module_round_box_outer {
  margin-bottom: 24px !important;
}

/* 3. HARMONISATION DES MENUS - positions et espacements uniformes */
#s5_menu_wrap {
  padding: 16px 24px !important;
}

#s5_menu_inner {
  text-align: center !important;
}

#s5_nav {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  list-style: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

#s5_nav li {
  padding: 12px 18px !important;
  margin: 0 !important;
}

#s5_nav li a {
  text-decoration: none !important;
  font-weight: 500 !important;
}

/* Menu mobile sidebar - harmonisation */
#s5_responsive_mobile_sidebar_menu_wrap h3 {
  padding: 12px 20px !important;
  margin: 0 !important;
}

/* 4. Breadcrumb / bandeau supérieur */
#s5_breadcrumb_font_login_wrap {
  padding: 20px 24px !important;
  text-align: center !important;
  background: #f8f9fa !important;
  border-bottom: 1px solid #e9ecef !important;
}

/* Override inline style - texte lisible sur fond clair */
#s5_breadcrumb_font_login_wrap h4,
#s5_breadcrumb_font_login_wrap .custom h4 {
  color: #212b6b !important;
  margin: 0 0 12px 0 !important;
}

#s5_breadcrumb_font_login_wrap .moduletable {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
}

#je_socialicons {
  display: flex !important;
  justify-content: center !important;
  gap: 8px !important;
}

/* 5. DESIGN HARMONISÉ - Ombres et bordures légères */
.s5_body_shadow {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
  -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
  -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

.module_round_box {
  border-radius: 8px !important;
  overflow: hidden !important;
}

/* Pied de page harmonisé */
#s5_footer_area1 {
  padding: 24px !important;
  text-align: center !important;
  background: #f8f9fa !important;
  border-top: 1px solid #e9ecef !important;
}

#s5_footer_area1 p {
  margin: 0 auto !important;
  max-width: 900px !important;
}

/* Bloc bottom row 3 - menus footer harmonisés */
#s5_bottom_row3 {
  padding: 24px 0 !important;
}

#s5_pos_bottom_row3_1,
#s5_pos_bottom_row3_2 {
  margin-bottom: 16px !important;
}

/* Liens du footer harmonisés */
#s5_bottom_row3 .module_round_box ul.menu li {
  padding: 6px 0 !important;
}

#s5_bottom_row3 .module_round_box ul.menu a {
  padding: 4px 0 !important;
}

/* 6. Contenu principal - meilleure lisibilité */
.item-page {
  line-height: 1.6 !important;
}

.item-page h2 {
  margin-top: 28px !important;
  margin-bottom: 12px !important;
  padding-bottom: 8px !important;
}

/* 7. Zone top row 1 - fond cohérent */
#s5_top_row1_area1 {
  background: #ffffff !important;
}

/* 8. Sections avec fond blanc */
#s5_top_row2_area1,
#s5_center_area1,
#s5_bottom_row2_area1,
#s5_bottom_row3_area1 {
  background: #ffffff !important;
}

#s5_top_row2_area2,
#s5_center_area2,
#s5_bottom_row2_area2,
#s5_bottom_row3_area2 {
  background: #ffffff !important;
}

/* 9. Flexslider / slideshow */
.flexslider {
  border-radius: 8px !important;
  overflow: hidden !important;
}

/* 11. Bloc Newsletter - masqué */
.module_round_box_outer:has(.acymailing_module),
.module_round_box_outer:has(form[id^="formAcymailing"]) {
  display: none !important;
}

/* 12. Liens réseaux sociaux - masquer Facebook, Twitter, LinkedIn, Google+ */
#je_socialicons .icon1,
#je_socialicons .icon3,
#je_socialicons .icon8 {
  display: none !important;
}

/* Boutons de partage (fb-like, fb-send, twitter, linkedin) */
.jo-social-share,
#fb-root,
.jo_send {
  display: none !important;
}

/* Masquer le titre "Vous aimez? Partagez!" (partage réseaux sociaux) */
h4.share-social-header {
  display: none !important;
}

/* 10. Responsive - ajustements */
@media screen and (max-width: 970px) {
  #s5_menu_wrap {
    flex-direction: column !important;
    align-items: center !important;
  }
  
  #s5_nav {
    justify-content: center !important;
  }
  
  #s5_nav li {
    padding: 10px 14px !important;
  }
}

@media screen and (max-width: 750px) {
  #s5_pos_bottom_row3_1,
  #s5_pos_bottom_row3_2 {
    width: 100% !important;
    min-width: 100% !important;
  }
}

/* Cohérence local/serveur - désactiver les polices externes pour rendu identique */
/* Arial (police système) s'affiche identiquement partout, sans chargement réseau */