@import url('blog.css');
@import url('menus.css');
@import url('dropfiles.css');
@import url('sp-portfolio.css');

/* Page 404 */ 

.error-page {
  position: relative;
  z-index: 0;
}

.error-page::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5); /* Opacité du overlay */
  z-index: 1;
}

.error-page > * {
  position: relative;
  z-index: 2;
}

.error-code {
    color: #ffffff !important;
}

html.error-page .error-message {
    font-size: 2.5rem;
    margin-bottom: 3rem;
    color: #ffffff;
}

/* Controllers carousel */

.sppb-carousel-inner>.sppb-item {
    padding: 30px 0px 30px 0px;
}

.sppb-carousel-indicators li {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 5px;
    margin-left: 5px;
    text-indent: -999px;
    border: 2px solid #862436;
    border-radius: 50px;
    cursor: pointer;
    background-color: #862436;
    transition: .2s;
}

.sppb-carousel-indicators .active {
    margin-right: 5px;
    margin-left: 5px;
    width: 20px;
    height: 20px;
    background-color: #fff;
}

/* Typographie des titres - Heading */

h1, h1 span, h2, h2 span, h3, h3 span, h4, h4 span, h5, h5 span, h6, h6 span {
    font-family: Taviraj,serif!important;
    font-weight: 700!important;
    /*line-height: 1.15 !important;*/
}

/* Taille de la police Body selon les tailles d'écran */

body {
  font-size: clamp(16px, 1.2vw, 18px);
  line-height: 1.5;
}

/* Taille de la police des titres selon la taille de l'écran par type de "Heading" */

/*h1 { font-size: clamp(32px, 3.6vw, 64px); }
h2 { font-size: clamp(30px, 3vw, 42px); }
h3 { font-size: clamp(24px, 2.4vw, 38px); }
h4 { font-size: clamp(22px, 2.4vw, 32px); }
h5 { font-size: clamp(20px, 2vw, 24px); }
h6 { font-size: clamp(14px, 2.4vw, 18px); }*/

h1 { font-size: clamp(32px, 3.6vw, 64px); }
h2 { font-size: clamp(28px, 3vw, 42px); }
h3 { font-size: clamp(24px, 2.4vw, 36px); }
h4 { font-size: clamp(20px, 2vw, 30px); }
h5 { font-size: clamp(18px, 1.8vw, 24px); }
h6 { font-size: clamp(16px, 1.6vw, 20px); }

/* Style du fond de la flêche Scroll Up */

.sp-scroll-up {
    background: #862436;
    margin-bottom: 50px;
    margin-right: 15px;
}

.sp-scroll-up a:link {
    color: #fff;
}

/* Style OSMap en deux colonnes */

.osmap-items ul li {
    white-space: normal;
    margin-right: 20px;
}

/* Met en gras "Professions :" */
#osmap-li-uid-menuitem-557 > span.osmap-item-url {
  font-weight: bold;
}

/* Style des éléments suivants (sous-items de Professions) */
#osmap-li-uid-menuitem-557 ~ li {
  list-style-type: square;
  margin-left: 1.2em;    /* Retrait global */
  padding-left: 0.4em;   /* Réduction de l’espace entre la puce et le texte */
}

/* Supprimer tout éventuel text-indent qui repousserait trop le texte */
#osmap-li-uid-menuitem-557 ~ li::marker {
  font-size: 0.8em;      /* Optionnel : réduit un peu la taille de la puce */
  padding-right: 0.2em;  /* Rapproche la puce du texte */
}

/* Style liste articles de la catégorie Dernières nouvelles */

body.dernieres-nouvelles .article-list h2 {
    font-size: clamp(24px, 2.4vw, 38px) !important;
}

.article-info>span {
    font-size: 1rem;
}

.article-list .article {
    position: relative;
    margin-bottom: 50px;
    padding: 30px;
    border: 1px solid #eee;
    border-radius: 8px;
    background: #fafafa;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.article-list .article img {
    background-color: #fff;   /* fond blanc autour de l’image */
    padding: 8px;             /* espace intérieur = marge blanche */
    border-radius: 4px;       /* optionnel : coins arrondis */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); /* ombre douce */
}

.article-list .article .read-time {
    display: none;
}

/* Fin - Style liste articles de la catégorie Dernières nouvelles */

/* Style du lien de menu comme "séparateur" */

.sp-megamenu-parent>li>a, .sp-megamenu-parent>li>span {
    display: inline-block;
    padding: 0 15px;
    line-height: 24px;
    font-size: 16px;
    margin: 0;
    font-weight: 500 !important;
    color: #fff;
}

/* Style bouton "Primary" */

.btn-primary, .sppb-btn-primary {
    border-color: #862535;
    background-color: #862535;
    color: #ffffff;
    font-weight: 700;
    font-size: 18px;
    padding: 5px 10px;
    border-radius: 5px;
}

/* Taille police du menu horizontal principal */

.sp-megamenu-parent>li>a, .sp-megamenu-parent>li>span {
    display: inline-block;
    padding: 0 15px;
    line-height: 24px;
    font-size: 16px;
    margin: 0;
    font-weight: 500 !important;
}

/* Menu Burger et Offcanvas-menu*/

/* Espace haut de l'écran pour burger menu */

.com-finder>*+*, .com-finder__results>*+* {
    margin-top: 0;
}

.burger-icon {
    width: 40px;
    cursor: pointer;
}

.burger-icon>span {
    display: block;
    height: 4px;
    background-color: #ffffff;
    margin: 8px 0;
    transition: background-color 0.3s ease-in, opacity 0.3s ease-in, transform 0.3s ease-in;
}

/* Opacity des menus offcanvas */

.offcanvas-menu .offcanvas-inner ul.menu>li>a, .offcanvas-menu .offcanvas-inner ul.menu>li>span {
    opacity: 1 !important;
}

/* Opacity des informations de contact offcanvas */

.offcanvas-menu .offcanvas-inner .sp-contact-info>li>a, .offcanvas-menu .offcanvas-inner .social-icons>li>a {
    opacity: 1;
}

/* Transformation du menu burger en X */

.offcanvas-active .burger-icon>span:nth-child(1), #modal-menu-toggler.active .burger-icon>span:nth-child(1) {
    transform: translate(0, 18px) rotate(-45deg);
}

.offcanvas-menu .offcanvas-inner .sp-contact-info, .offcanvas-menu .offcanvas-inner .social-icons {
    font-size: 18px;
}

.sp-contact-info li {
    display: inline-block;
    margin: 0px 10px 0px 0px;
    font-size: 100%;
    white-space: nowrap;
    color: #ffffff;
}

.sp-contact-info li:hover {
    display: inline-block;
    margin: 0px 10px 0px 0px;
    font-size: 100%;
    white-space: nowrap;
    color: #F0B462;
}

.offcanvas-menu .offcanvas-inner .sp-contact-info>li>a, .offcanvas-menu .offcanvas-inner .social-icons>li>a:hover {
    color: #F0B462;
    font-weight: 700;
}

.offcanvas-menu {
    background-color: #ffffff00;
    color: #2d2d2d;
}

/* RSSocial module */

.rssocial-icons .rssocial-link, .rssocial-icons-sharing .rssocial-link {
     padding: 0px; 
}

.rssocial-icons {
   display: flex;
   justify-content: left;
   flex-wrap: nowrap;
   gap: 25px;
   padding: 0;
   margin: 0;
}

ul.social-icons li,
.footer-social li {
     list-style: none;
}

#rssocial-ul-125 {
  display: flex;
  justify-content: center;
  align-items: center;
}

#rssocial-125 #rssocial-mail-icon.rssocial-link {
    margin-bottom: 15px;
}

/* Ligne orange dans le footer */

#sp-footer .container-inner {
    padding: 30px 0;
    border-top: 2px solid #F0B462;
}

#sp-menu ul.social-icons a {
    color: #ffffff;
}

#sp-menu ul.social-icons a:hover {
    color: #000000;
}

.sp-page-builder .page-content [id^="section-id-"] {
min-height: 100px !important;
}

/* Couleur de fond sur les textes - utilisation de span pour le formatage */

.cnfs-bg-text span {
  background: #f0b462;
  display: inline-block;
  margin-top: -1px;
  padding: 0 20px;
}

h1.cnfs-bg-text span {
  box-shadow: 20px 1px 0 2px #f0b462,0 1px 0 2px #f0b462;
}

/* Icone de recherche */

/* Style par défaut de l'icône */
.sp-megamenu-parent > li:last-child > a {
  font-size: 0 !important;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 46px;
  height: 46px;
  border: 2px solid white;
  border-radius: 50%;
  transition: all 0.3s ease;
  padding-left: 8px;
  padding-right: 0px;
  margin-right: 15px;
  margin-left: 20px;
}

/* Icône Font Awesome */
.sp-megamenu-parent > li:last-child > a:before {
  content: "\f002";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 16px;
  color: white;
  transition: color 0.3s ease;
}

/* Effet hover */
.sp-megamenu-parent > li:last-child > a:hover {
  background-color: #f0b462;
  border-color: #f0b462;
}

.sp-megamenu-parent > li:last-child > a:hover:before {
  color: black;
}



/* Menu - mobile */

#sp-header {
  height: 105px;
  width: 100%;
  position: relative;
  z-index: 99;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.1);
  animation: spFadeIn 0.5s;
}

@media (max-width: 991px) {
    #sp-header {
        padding-top: 26px !important;
    }
}