/**
 *
 * Feuille de style css pour les particularités stylistiques du layout atm.
 *
 */

:root {
  --tertiary-color: #ce7807; /* ajout seulement */
}

/**************/
/*** Common ***/
/**************/
.no-padding {
  padding: 0 !important;
}

.display-none {
  display: none !important;
}

/*
.text-transform-capitalize {
  text-transform: capitalize !important;
}

.text-color-primary-color {
  color: var(--primary-color) !important;
}
*/

/*************/
/*** Login ***/
/*************/
/* Sélectionne la balise <article class="contextual-region" typeof="schema:Person" about="/en/user/1"> qui apparaît après le login
   dans l'url https://news-pro.ddev.site/fr/user/1?check_logged_in=1 */
article.contextual-region[typeof="schema:Person"][about$="/user/1"] {
  padding-top: 30px;
}

/**************/
/*** Header ***/
/**************/
#header-4 .main-menu {
  /* margin: 30px 0; */
  margin: 20px 0 15px 0;
}

#header-4 #block-news-pro-branding {
  width: 350px;
}

/* Pour centrer le menu en version normal */
#header-4 #navbar_top4 > .container {
  flex-flow: column;
}
/* Pour déclaler le menu en version scrollée */
#header-4 #navbar_top4.fixed-top > .container {
  flex-flow: nowrap;
}

/* Pour le formatage du header dans liste des actualités sans région géographique */
#block-news-pro-content
  .taxonomy_term-page_actualites_region_divers
  .view-header,
#block-news-pro-content
  .taxonomy_term-page_actualites_region_others
  .view-header {
  font-size: 28px;
  line-height: 35px;
  font-family: var(--secondary-font);
  font-weight: 400;
  color: var(--heading-color);
  margin-top: 20px;
  margin-bottom: 50px;
  /* margin-bottom: 0; */
  text-align: center;
}

/* Pour ne pas mettre sur deux ligne le titre "Breaking News" */
.header-1-news-ticker-title {
  min-width: 125px;
}
/* Pour ne pas décaller les flèches de la "Breaking News" */
.owl-stage-outer {
  max-width: 840px;
}
/* Pour centrer les flèches de la "Breaking News" */
#header-1-news-ticker .owl-nav {
  top: -5px;
}

/* Pour supprimer le voile à droite de l'input de la search */
#header-4 .togglesearch-1 {
  width: 245px;
}

/* On supprime toutes les propriété de cette classe pour ne préserver que sa fonction programmatique */
#header-4 .header-4-search.info-menu-mobile .searchbar {
  position: initial;
  cursor: initial;
  display: initial;
  color: initial;
  align-items: initial;
  justify-content: initial;
  width: initial;
  border-radius: initial;
  height: initial;
  border: initial;
}

/**************/
/*** Search ***/
/**************/
.search-result-date {
  text-transform: capitalize;
}

/*********************/
/*** Breaking News ***/
/*********************/
/* Fix pour que les pages s'affichent bien lorsqu'il n'y a pas de breaking news */
#block-views-block-breaking-news-block-1:not(:has(.breaking-new-item)) {
  margin-top: 230px;
}

/* Fix pour que la page search s'affiche bien lorsqu'il n'y a une breaking news */
/* S'il y a une breaking news on ne met pas de margin-top dans la div search_page */
body:has(#block-views-block-breaking-news-block-1) #search_page {
  margin-top: 0 !important;
}

/*********************/
/*** About Us ***/
/*********************/
/* Fix pour que la page about us s'affiche bien */
#about-us {
  padding-top: 0;
}

/****************/
/*** Sidebar ***/
/****************/
/* Pas d'affichage des images dans la version compact */
.sidebar-style-6-compact .sidebar-content .lastest-news-img {
  display: none;
}

.homepage_6-most_viewd p small.text-muted,
.homepage_6-must_read p small.text-muted,
.homepage_6-latest_news p small.text-muted,
.homepage_6-latest_news_more p small.text-muted {
  font-size: 12px;
  /* text-transform: uppercase; */
  text-transform: capitalize;
  letter-spacing: 0.6px;
  line-height: 20px;
  font-weight: 400;
}

.homepage_6-most_viewd .card:not(:first-child) {
  margin-top: 1rem;
}
.homepage_6-most_viewd .card-title,
.homepage_6-most_viewd .card-body a h5 {
  margin-bottom: 0;
}
.homepage_6-most_viewd .card-title a {
  font-weight: 500;
  color: var(--primary-color);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-size: 13px;
}
.homepage_6-most_viewd .card-title > a:hover,
.homepage_6-most_viewd .card-title > a:focus {
  color: var(--tertiary-color) !important;
}

/**************/
/*** Footer ***/
/**************/
.footer-logo {
  width: auto;
}
.footer-logo img {
  height: 80px;
}

.footer-must-see ul li a {
  color: #b3b3b3;
  font-family: "Open Sans";
  vertical-align: super;
}
.footer-must-see ul li {
  margin-bottom: 6px;
}

.footer-follow-us li i {
  text-align: center;
  width: 30px;
  height: 30px;
  color: #fff;
  border: 1px solid;
  border-radius: 50%;
  padding: 8px;
  font-size: 13px;
  transition: all 0.25s ease-in-out;
}
.footer-follow-us li i:hover {
  color: var(--primary-color) !important;
}
.footer-follow-us li {
  display: inline-block;
  margin-right: 12px;
}

/*****************/
/*** Header Ad ***/
/*****************/
#block-news-pro-headerad-2, /* Pour la home page */
#block-news-pro-headeraden-2, /* Pour la home page */
#block-news-pro-headeradfr-2, /* Pour la home page */
#block-news-pro-headerad,
#block-news-pro-headeraden,
#block-news-pro-headeradfr {
  /* Pour les pages d'article */
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
  padding-top: 20px;
}

/* Pas de padding-bottom pour les .google-ad.random-ad-container s'il sont dans le header ad */
#block-news-pro-headerad-2 .google-ad.random-ad-container,
#block-news-pro-headeraden-2 .google-ad.random-ad-container,
#block-news-pro-headeradfr-2 .google-ad.random-ad-container {
  padding-bottom: 0 !important;
}

/*
  On n'affiche pas la header ad dans la banner interne (inner) de la page de taxonomy et d'article.
  Car cette banner est déjà affichée dans la région "Article Banner".
  DEPRECATED - La header ad est affichée maintenant dans la partie outer et non inner comme avant.
*/
/*
#article-page #block-news-pro-headerad-2,
#article-page #block-news-pro-headeraden-2,
#article-page #block-news-pro-headeradfr-2,
#taxonomy-page #block-news-pro-headerad-2,
#taxonomy-page #block-news-pro-headeraden-2,
#taxonomy-page #block-news-pro-headeradfr-2 {
  display: none;
}
*/

/* Pas de détourage de la pub pour les header ad */
#block-news-pro-headerad-2 .ad-card-header, /* Pour la home page */
#block-news-pro-headeraden-2 .ad-card-header, /* Pour la home page */
#block-news-pro-headeradfr-2 .ad-card-header, /* Pour la home page */
#block-news-pro-headerad .ad-card-header,
#block-news-pro-headeraden .ad-card-header,
#block-news-pro-headeradfr .ad-card-header {
  /* Pour les page d'article */
  display: none;
}

/* Pas de header ad si elle est vide */
#block-news-pro-headerad-2:has(.ad-card.empty-ad),
#block-news-pro-headeraden-2:has(.ad-card.empty-ad),
#block-news-pro-headeradfr-2:has(.ad-card.empty-ad) {
  display: none;
}

/***********/
/*** Ads ***/
/***********/
.sidebar-style-6-compact .google-ad {
  width: fit-content;
  height: fit-content;
  margin: auto;
}

.ad-card {
  border-width: 1px;
  border-style: solid;
  border-color: rgb(111, 104, 109);
}
/* Pas de détourage de la pub pour les header ad */
#block-news-pro-headerad-2 .ad-card,  /* Pour la home page */
#block-news-pro-headeraden-2 .ad-card,  /* Pour la home page */
#block-news-pro-headeradfr-2 .ad-card,  /* Pour la home page */
#block-news-pro-headerad .ad-card,
#block-news-pro-headeraden .ad-card,
#block-news-pro-headeradfr .ad-card {
  /* Pour les page d'article */
  border: 0;
}

/* Les tailles des emplacements publicitaires selon les régions */
.ad-card img {
  width: 100%;
}

.atm-region-sidebar-first .ad-card img,
.atm-region-sidebar-small-screen .ad-card img {
  max-height: 250px;
  max-width: 215px;
}

.atm-region-sidebar-second .ad-card img {
  max-height: 150px;
  max-width: 215px;
}

.ad-card-header {
  color: rgb(255, 255, 255);
  /* height: 15px; */
  font-size: 0.8em;
  font-weight: bold;
  /* line-height: 0.8em; */
  /* text-transform: none; */
  text-align: left;
  padding: 0 5px;
  /* padding: 6px 5px 0px; */
  background: rgb(107, 100, 105);
  border-width: 1px;
  border-style: solid;
  border-color: rgb(111, 104, 109);
  /* border-image: initial; */
}
/* Pas de détourage de la pub pour les header ad */
#block-news-pro-headerad-2 .ad-card-header, /* Pour la home page */
#block-news-pro-headeraden-2 .ad-card-header, /* Pour la home page */
#block-news-pro-headeradfr-2 .ad-card-header, /* Pour la home page */
#block-news-pro-headerad .ad-card-header,
#block-news-pro-headeraden .ad-card-header,
#block-news-pro-headeradfr .ad-card-header {
  /* Pour les page d'article */
  display: none;
}

.ad-card-header .ad-card-header-icon {
  width: 14px;
  height: 12px;
  float: right;
  margin-top: 4px;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='12' viewBox='0 0 70 60'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='5' d='M 20,57.5 h 27.5 v -35 h -45 v 35 h 27.5 Z'/%3E%3Cpath fill='none' transform='translate(15,-20)' stroke='%23ffffff' stroke-width='5' d='M 35,57.5 h 17.5 v -35 h -45 v 17.5'/%3E%3C/svg%3E") !important;
}

/* Pas de padding-bottom sur le parent .google-ad.random-ad-container dans le cas où l'espace publicitaire est vide */
.google-ad.random-ad-container:has(> .ad-card.empty-ad) {
  padding-bottom: 0 !important;
  display: none;
}

/*****************/
/*** Home Page ***/
/*****************/
#block-news-pro-featurednewsatm section.trending-news {
  padding: 0;
}

/*
  Doit correspondre avec :
    .taxonomy_term-page_actualites_region .view-header h2,
    .banner-text h2 {
      ...
    }
*/
#block-news-pro-featurednewsatm section.trending-news .heading-1 {
  margin-top: 25px;
}

/* Pour l'image de l'article de manchette */
#featured-news.featured-news--a-la-une .featured-news-news-top-news-img,
#featured-news-1.featured-news--a-la-une .featured-news-news-top-news-img {
  /* height: 400px; */
  /* height: 350px; */
  height: auto;
  max-height: 350px;
  overflow: hidden;
}

/* Dans le cas où l'agenda est vide */
.homepage_6-agenda .view-empty {
  text-align: center;
  font-style: italic;
  margin-bottom: 30px;
}

.home-1-card-img-small {
  height: 110px !important;
}

/**************/
/*** Search ***/
/**************/
.search-errors {
  color: var(--primary-color);
  font-style: italic;
}

/****************/
/*** Articles ***/
/****************/
/* Pour que la largeur de l'article soit de 526px comme pour l'ancien layout. Facilite la migration des articles depuis l'ancien site */
#post-classic .container {
  padding: 0 12px;
}

/* Pour mettre sous forme de ligne et non de colonne les icônes de partage dans les articles */
#post-classic .post-classic-social > #block-addtoanybuttons > .addtoany_list,
.article-atm .post-classic-social > #block-addtoanybuttons > .addtoany_list {
  flex-direction: row;
}
#post-classic .post-classic-social,
.article-atm .post-classic-social {
  max-width: 100%;
}

/* Pour supprimer les paddings à droite et à gauche des articles */
#post-classic #post-classic > .container,
.article-atm #post-classic > .container {
  padding-right: 0;
  padding-left: 0;
}
#post-classic #post-classic #post-classic-content,
.article-atm #post-classic #post-classic-content {
  width: 100%;
}

.post-classic-title,
.page-title-classic {
  padding: 0;
}

#post-classic-1 .page-title-classic h1 {
  font-family: var(--secondary-font);
  font-size: 1.75rem;
  font-weight: 600;
  color: var(--heading-color);
  letter-spacing: 1.75px;
  line-height: 35px;
  margin-bottom: 15px;
}

#post-classic-1 .page-title-classic .date {
  color: var(--gray);
  text-transform: capitalize;
  font-weight: 400;
  line-height: 20px;
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
  font-size: 13px;
  font-family: var(--primary-font);
  letter-spacing: 0.5px;
}

#post-classic-1 .page-title-classic .category {
  font-size: 14px;
  font-family: var(--primary-font);
  color: var(--primary-color);
  text-transform: uppercase;
  font-weight: 500;
  line-height: 20px;
  margin-bottom: 12px;
  letter-spacing: 0.5px;
}

/* Pour les liens */
#post-classic-1 .page-title-classic .category a,
#search_page .search-result-type.category a {
  color: var(--primary-color);
}
#post-classic-1 .page-title-classic .category a:hover,
#search_page .search-result-type.category a:hover,
#post-classic-1 .page-title-classic .category a:focus,
#search_page .search-result-type.category a:focus {
  color: var(--tertiary-color) !important;
}

/* Pour supprimer le padding dans les articles de chaque côté */
/*
#post-classic-1 > .container, // Pour le titre
#post-classic > .container {  // Pour le contenu
  padding: 0;
}
*/

/* Pour le titre */
#post-classic-1 > .container {
  padding: 0;
}

/* Pour l'image de l'entête de l'article */
#post-classic-1 .post-classic-img {
  /* height: 400px; */
  /* height: 350px; */
  height: auto;
  text-align: center;
  /* max-height: 350px; */
  /* overflow: hidden; */
}
#post-classic-1 .post-classic-img img {
  max-height: 350px;
  width: unset;
}

/*********************************/
/*** Liste d'articles & Banner ***/
/*********************************/
#featured-news h6.card-title {
  /* display: inline-block; */
  display: block;
  margin-bottom: 0;
}
#featured-news h5.card-article-title {
  margin-top: 5px;
}
#featured-news .card-text {
  text-transform: capitalize;
}
/*
#featured-news .card-body .separator {
  margin-left: 2px;
  margin-right: 2px;
}
*/
/* Pour surcharger le style css associé à la balise <a> car le titre a été mis dans une balise <a> */
#featured-news h6.card-title > a {
  color: unset;
  font-size: unset;
}
#featured-news h6.card-title > a:hover,
#featured-news h6.card-title > a:focus {
  color: var(--tertiary-color) !important;
}

/* Pour que la css de bootstrap ne prenne pas le dessus */
.featured-news-news-top-news-content
  .featured-news-news-top-news-content-top
  h5
  a {
  color: var(--primary-color);
  font-size: 16px;
}
.featured-news-news-top-news-content
  .featured-news-news-top-news-content-top
  h3
  a {
  font-family: var(--secondary-font);
}

.taxonomy-term.vocabulary-geography > h2 {
  font-family: var(--primary-font);
  font-weight: 400;
  font-size: 28px;
  line-height: 35px;
  margin-bottom: 44px;
}
.taxonomy-term.vocabulary-geography > .content {
  display: none;
}

/* Pour le header des titre des termes de taxonomy liés à une région géographique */
.taxonomy_term-page_actualites_region .view-header h2,
.banner-text h2 {
  font-size: 28px;
  line-height: 35px;
  font-family: var(--secondary-font);
  font-weight: 400;
  color: var(--heading-color);

  /*
    Doit correspondre avec :
      #block-news-pro-featurednewsatm section.trending-news .heading-1 {
        ...
      }
  */
  margin-top: 25px;
  /* margin-bottom: 50px; */
  margin-bottom: 0;
  text-align: center;
}
/*
.taxonomy_term-page_actualites_region .view-header hr,
.banner-container hr {
  margin: 20px 0 30px;
}
*/

/**************/
/*** Banner ***/
/**************/
.banner {
  /* suppression de tous les attributs css définis dans style.css */
  all: unset;
}

.banner::after {
  /* suppression de tous les attributs css définis dans style.css */
  all: unset;
}

.banner-container {
  padding: 0 !important;
}

/************************************/
/*** Lastest News dans la sidebar ***/
/************************************/
/* Pour tasser un peu l'affichage des latest news */
.sidebar-style-5 .sidebar-content {
  margin-bottom: 30px;
}
.sidebar-style-5 .sidebar-content .lastest-news {
  padding: 0 !important;
}
.sidebar-style-5 .sidebar-content hr {
  margin: 0.5rem 0;
}
.sidebar-style-5 .lastest-news h5 {
  margin-bottom: 5px;
  line-height: 20px;
}

/* Pour l'affichage du pays */
.sidebar-style-5 .lastest-news a {
  display: inline-block;
  color: var(--primary-color);
}
.sidebar-style-5 .lastest-news a:hover,
.sidebar-style-5 .lastest-news a:focus {
  color: var(--tertiary-color) !important;
}

/************************************/
/*** Agenda dans la sidebar ***/
/************************************/
.lastest-news {
  color: var(--primary-color);
  font-size: 15px;
}

.lastest-news .title::first-letter,
.lastest-news .agenda-date::first-letter {
  text-transform: uppercase;
  /* text-transform: capitalize; */
}

/*********************************/
/*** Liste d'articles & Banner ***/
/*********************************/
/* On tasse un peu la pagination */
.pagination li a {
  width: 50px;
  height: 50px;
  margin: 4px 4px;
}

/* On change la taille et l'orientation de la flèche next et prev */
.pagination li.next a svg {
  transform: rotate(-90deg);
  height: 17px;
  width: 17px;
}
.pagination li.prev a svg {
  transform: rotate(90deg);
  height: 17px;
  width: 17px;
}

/* On traite next et end ainsi que prev et first de la même manière */
.pagination li.next:hover a,
.pagination li.prev:hover a {
  background: var(--primary-color);
  color: #fff !important;
}

.pagination li.next a,
.pagination li.prev a {
  border: 1px solid var(--primary-color) !important;
  width: 50px;
  height: 50px;
  letter-spacing: unset;

  color: var(--secondary-color);
  font-size: 15px;
  font-weight: 500;
  font-family: var(--primary-font);
}

/************************************/
/*** Section : le-magazine-online ***/
/************************************/
#le-magazine-online .sidebar-content ul {
  margin-bottom: 0;
}

#le-magazine-online .sidebar-content ul li a {
  font-size: 15px;
  color: var(--heading-color);
}

/**************************/
/*** Pour le responsive ***/
/**************************/

@media (max-width: 991.5px) {
  /* Pour ne pas afficher de barres de scroll inutiles dans le menu responsive */
  #header-4 .collapse.navbar-collapse {
    overflow: auto !important;
  }

  /* Pour l'icone search en mode mobile */
  #header-4 .header-4-search.info-menu-mobile {
    font-size: 25px;
  }

  /* Fix pour que les pages s'affichent bien lorsqu'il n'y a pas de breaking news */
  #block-views-block-breaking-news-block-1:not(:has(.breaking-new-item)) {
    margin-top: 160px;
  }
  /* Fix pour afficher un peu de margin-top à la breaking news dans le cas ou elle ne contient pas de news et qu'il y a une header ad */
  /* #block-views-block-breaking-news-block-1:not(:has(+ #block-news-pro-headeradfr-2 .empty-ad)) { */
  #block-views-block-breaking-news-block-1:not(:has(.breaking-new-item)):not(:has(+ #block-news-pro-headerad-2 .empty-ad)),
  #block-views-block-breaking-news-block-1:not(:has(.breaking-new-item)):not(:has(+ #block-news-pro-headeraden-2 .empty-ad)),
  #block-views-block-breaking-news-block-1:not(:has(.breaking-new-item)):not(:has(+ #block-news-pro-headeradfr-2 .empty-ad)) {
    margin-top: 190px !important;
  }

  /* Fix pour réduire la hauteur de section breaking news en mode responsive */
  #header-1-news-ticker .d-lg-flex {
    padding-top: 15px;
    padding-bottom: 0;
    height: 120px;
  }
  .header-1-news-ticker-wapper {
    padding: 0px 11px 0px 20px;
  }
  #header-1-news-ticker .owl-nav {
    top: 29px;
  }

}

@media (max-width: 768px) {
  .home-1-card-img-small img {
    object-fit: contain !important;
  }
}

@media (max-width: 591px) {
  /* Fix pour réduire la hauteur de section breaking news en mode responsive */
  #header-1-news-ticker .d-lg-flex {
    height: 167px !important;
  }
}