/* AGRI: police globale du site - Proxima Nova (remplace Metropolitano) */
@font-face {
    font-family: 'Proxima Nova';
    src: url('assets/fonts/ProximaNova-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Proxima Nova';
    src: url('assets/fonts/ProximaNova-Regular.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Proxima Nova';
    src: url('assets/fonts/ProximaNova-Regular.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
h1, h2, .video_title, .jws-heading-title, .elementor-heading-title {
    font-weight: 700 !important;
}
/* AGRI: police secondaire du site - Heebo (charte graphique, texte) */
@font-face {
    font-family: 'Heebo';
    src: url('assets/fonts/Heebo-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Heebo';
    src: url('assets/fonts/Heebo-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Heebo';
    src: url('assets/fonts/Heebo-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Heebo';
    src: url('assets/fonts/Heebo-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Heebo';
    src: url('assets/fonts/Heebo-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Heebo';
    src: url('assets/fonts/Heebo-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Heebo';
    src: url('assets/fonts/Heebo-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
/*
Theme Name: StreamVid Child
Theme URI: https://streamvid.jwsuperthemes.com
Template: streamvid
Author: the JWSThemes team
Author URI: https://jwsuperthemes.com
Description: StreamVid is a WordPress video streaming theme with an attention-grabbing style that will capture everyone's attention right away. It is a tool with numerous useful features and ready-made page layouts for launching websites quickly. It is a WordPress streaming video with a paid subscription that has excellent and cutting-edge capabilities to operate and maintain a live broadcast. It also includes the WooCommerce plugin, allowing you to sell any item on your website. Additionally, StreamVid has a ton of ad slots for revenue generation.
Tags: one-column,flexible-header,accessibility-ready,custom-colors,custom-menu,custom-logo,editor-style,featured-images,footer-widgets,rtl-language-support,sticky-post,threaded-comments,translation-ready
Version: 6.9.6
Updated: 2026-08-15 16:55:00
*/

:root {
  --main: #7ED957;
  --secondary: #a3714e;
  --light: #ffffff;
  --dark: #000000;
  --heading: #ffffff;
  --body: #cccdd2;
  --body2: #a1a0a1;
  --bodybg: #00031c;
  --btn-bgcolor: #9e61ff;
  --btn-color: #ffffff;
  --btn-bgcolor2: #619bff;
  --btn-color2: #ffffff;
  --btn-bgcolor3: #6c52ee;
  --font-size-sm: 14px;
  --line-height-sm: 19.6px;
  --input-background: #191c33;
  --input-background2: #31344b;
  --background-item: #191c33;
  --background-body: #00031c;
  --border-color: #292c41;
  --border-color2: #80818d;
  --full-fd: 70px;
}
@media (max-width: 767px) {
  :root {
    --font-size-sm: 12px;
    --line-height-sm: 16px;
  }
}

/* Sidebar "À suivre" façon YouTube : miniature à gauche, infos à droite */
.jws-up-next-item {
  margin-bottom: 12px;
}
.jws-up-next-link {
  display: flex;
  gap: 8px;
  text-decoration: none;
}
.jws-up-next-thumb {
  position: relative;
  flex: 0 0 168px;
  width: 168px;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 8px;
  background: #1a1a1a;
}
.jws-up-next-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.jws-up-next-duration {
  position: absolute;
  bottom: 4px;
  right: 4px;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  font-size: 11px;
  padding: 1px 4px;
  border-radius: 3px;
  line-height: 1.4;
}
.jws-up-next-thumb::after {
  content: '';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.35);
  opacity: 0;
  transition: opacity 0.15s ease;
}
.jws-up-next-item:hover .jws-up-next-thumb::after {
  opacity: 1;
}
.jws-up-next-thumb::before {
  content: '\25B6';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 22px;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}
.jws-up-next-item:hover .jws-up-next-thumb::before {
  opacity: 1;
}
.jws-up-next-info {
  flex: 1;
  min-width: 0;
}
.jws-up-next-info .video_title {
  font-size: 14px;
  line-height: 1.3;
  margin: 0 0 4px 0;
  color: var(--heading, #fff);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.jws-up-next-channel {
  font-size: 12px;
  color: var(--body2, #a1a0a1);
  margin-bottom: 2px;
}
.jws-up-next-views {
  font-size: 12px;
  color: var(--body2, #a1a0a1);
}

/* "À suivre" version vignettes seules (sans titre) */
.jws-up-next-item {
  margin-bottom: 8px;
}
.jws-up-next-link {
  display: block;
}
.jws-up-next-thumb {
  width: 100%;
  aspect-ratio: 16 / 9;
  flex: none;
}

/* Fix : la vignette "À suivre" doit remplir tout son espace réservé */
.jws-up-next-thumb {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 8px;
  background: #1a1a1a;
}
.jws-up-next-thumb img.attachment-full,
.jws-up-next-thumb img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

/* Icône play + fond assombri au survol seulement, avec petite animation d'apparition */
.jws-up-next-thumb::after {
  background: rgba(0, 0, 0, 0.25) !important;
  z-index: 1 !important;
}
.jws-up-next-thumb::before {
  transform: translate(-50%, -50%) scale(0.6) !important;
  transition: opacity 0.2s ease, transform 0.2s ease !important;
}
.jws-up-next-item:hover .jws-up-next-thumb::before {
  transform: translate(-50%, -50%) scale(1) !important;
}

/* Titre fiche vidéo : taille réduite (était trop gros) */
.videos-top .jws-title {
  font-size: 20px !important;
  line-height: 1.3 !important;
  margin: 12px 0 !important;
}

/* Boite description video (vues/date/hashtags/texte) style YouTube */
.jws-video-description-box {
  background: rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 12px 16px;
  margin: 12px 0;
}
.jws-video-description-box .jws-meta-info {
  font-weight: 600;
  margin-bottom: 8px;
}
.jws-video-description-box .jws-meta-info span {
  margin-right: 10px;
}

/* Titre à gauche, boutons like/partager/YouTube groupés à droite, même ligne */
.single-movies .jws-tool {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  left: auto !important;
  right: 0 !important;
}
.single-movies .jws-tool-left {
  flex-grow: 1 !important;
  min-width: 0;
}
.single-movies .jws-tool-right {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  gap: 15px;
}
.single-movies .jws-tool .jws-likes,
.single-movies .jws-tool .jws-share,
.single-movies .jws-tool .jws-watchlist,
.single-movies .jws-tool .jws-youtube-link {
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
}

/* Description en accordéon (façon YouTube) : 3 lignes visibles, toute la zone cliquable */
.jws-description-accordion {
  cursor: pointer;
  position: relative;
}
.jws-description-accordion .jws-description-text {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  max-height: none;
}
.jws-description-accordion.jws-expanded .jws-description-text {
  -webkit-line-clamp: unset;
  display: block;
}
.jws-description-chevron {
  display: block;
  width: 14px;
  height: 14px;
  margin: 8px auto 0;
  border-right: 2px solid var(--main);
  border-bottom: 2px solid var(--main);
  transform: rotate(45deg);
  transition: transform .2s ease;
}
.jws-description-accordion.jws-expanded .jws-description-chevron {
  transform: rotate(-135deg);
}

/* "Vidéos recommandées" (post-related, layout2) : vignette rectangle 16:9 au lieu du poster portrait, titre en dessous */
.jws-related .layout2 .content-front img {
  aspect-ratio: 16 / 9 !important;
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  object-position: center !important;
}
.jws-related .layout2 .content-back {
  display: none !important;
}

/* Vignette pub sidebar (après "À suivre") : remontée légèrement, moins d'espace au-dessus */
.elementor-11541 .elementor-element.elementor-element-29ae235b {
  margin-top: 8px !important;
}

/* Adoucit le décrochage du lecteur/sidebar "sticky" en fin de scroll (sticky_kit bascule fixed->absolute brutalement) */
.jws_sticky_move {
  transition: top 0.15s ease-out;
}

/* Évite le flash/saut visuel du carrousel "Vidéos recommandées" au chargement JS (owl-carousel
   recalcule les largeurs autoWidth après coup) : masqué jusqu'à l'init owl-carousel terminée */
.jws-related .owl-carousel:not(.owl-loaded) {
  opacity: 0;
}
.jws-related .owl-carousel.owl-loaded {
  opacity: 1;
  transition: opacity 0.2s ease;
}

/* Page "Toutes les vidéos" (/tv_shows/) : filtres à gauche, barre de recherche à droite, même ligne */
.agri-archive-nav-split {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
}
.agri-archive-nav-filters {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.agri-archive-nav-search {
  flex: 0 0 auto;
  width: 480px;
  max-width: 100%;
}

/* Squelettes de cartes façon YouTube pendant le chargement AJAX ("Toutes les vidéos") */
.jws-movies-archive .post_content > .row.loading > .loader {
  display: none !important;
}
.agri-skeleton-item {
  padding-right: calc(20px / 2);
  padding-left: calc(20px / 2);
  margin-bottom: 30px;
}
.agri-skeleton-thumb {
  width: 100%;
  aspect-ratio: 630 / 400;
  border-radius: 8px;
  background: var(--background-item, #1a1a1a);
}
.agri-skeleton-line {
  height: 14px;
  border-radius: 4px;
  background: var(--background-item, #1a1a1a);
  margin-top: 12px;
}
.agri-skeleton-line-title {
  width: 90%;
}
.agri-skeleton-line-cat {
  width: 40%;
  margin-top: 8px;
}
.agri-skeleton-thumb,
.agri-skeleton-line {
  animation: agri-skeleton-pulse 1.2s ease-in-out infinite;
}
@keyframes agri-skeleton-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}


/* Meta info (catégorie/date/vues/commentaires) : catégorie sur sa propre ligne en mobile */
@media (max-width: 767px) {
  .single-movies .jws-meta-info .jws-cat {
    display: block !important;
    margin-bottom: 6px;
  }
}

/* Bouton ... (jws-tool-more) : caché par défaut, visible seulement en mobile */
.single-movies .jws-tool-more {
  display: none;
  position: relative;
  flex-shrink: 0;
}
.single-movies .jws-tool-more-btn {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 2px solid var(--main);
  background: rgba(255,255,255,0.06);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  cursor: pointer;
  padding: 0;
}
.single-movies .jws-tool-more-btn span {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #fff;
  display: block;
}
.single-movies .jws-tool-more-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background: #10142a;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  padding: 8px;
  min-width: 200px;
  z-index: 20;
  box-shadow: 0 8px 24px rgba(0,0,0,0.4);
}
.single-movies .jws-tool-more.jws-open .jws-tool-more-dropdown {
  display: block;
}
.single-movies .jws-tool-more-dropdown > * {
  padding: 10px 12px;
  border-radius: 6px;
}
.single-movies .jws-tool-more-dropdown > *:hover {
  background: rgba(255,255,255,0.06);
}

@media (max-width: 767px) {
  .single-movies .jws-tool {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
  .single-movies .jws-tool-left {
    width: auto !important;
    flex-grow: 1;
    min-width: 0;
  }
  .single-movies .jws-tool-right {
    display: none !important;
  }
  .single-movies .jws-tool-more {
    display: block;
  }
}

/* Section Vidéos recommandées retirée en mobile (demande explicite) */
@media (max-width: 767px) {
  .single-movies .jws-related {
    display: none !important;
  }
}

/* Bannière pub page Toutes les vidéos (/tv_shows/) : mobile uniquement, après la pagination */
.agri-archive-ads-banner {
  display: none;
}
@media (max-width: 767px) {
  .agri-archive-ads-banner {
    display: block;
    text-align: center;
    margin: 24px 0;
  }
  .agri-archive-ads-banner img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
  }
}

/* Filtres (Catégorie/Année/Trier par) page Toutes les vidéos : grille pleine
   largeur en mobile au lieu du scroll horizontal natif, 3 par ligne max.
   Un 4e filtre futur devra passer dans un bouton ... séparé (pas fait
   tant qu'il n'y a que 3 filtres). */
@media (max-width: 767px) {
  .archive-nav .post-select-filter {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px;
    float: none !important;
    overflow-x: visible !important;
    width: 100%;
  }
  .archive-nav .post-select-filter .fild-item {
    display: block !important;
    margin: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  .archive-nav .post-select-filter .select2-container,
  .archive-nav .post-select-filter select {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* Onglets Vidéos/Shorts (page Toutes les vidéos), façon YouTube */
.agri-format-tabs {
  display: flex;
  gap: 32px;
  margin-bottom: 20px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
.agri-format-tab {
  padding: 10px 0;
  font-weight: 700;
  font-size: 16px;
  color: rgba(255,255,255,0.5);
  border-bottom: 2px solid transparent;
  cursor: pointer;
  text-decoration: none !important;
}
.agri-format-tab.active {
  color: #fff;
  border-bottom-color: #fff;
}

/* Bouton "..." (points verticaux) page Toutes les vidéos : filtres au-delà
   de 3 (Trier par, futurs filtres) regroupés dans un dropdown mobile */
.agri-archive-more {
  display: none;
  position: relative;
}
.agri-archive-more-btn {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 2px solid var(--main);
  background: rgba(255,255,255,0.06);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  cursor: pointer;
  padding: 0;
}
.agri-archive-more-btn span {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #fff;
  display: block;
}
.agri-archive-more-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background: #10142a;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  padding: 8px;
  min-width: 180px;
  z-index: 20;
  box-shadow: 0 8px 24px rgba(0,0,0,0.4);
}
.agri-archive-more.agri-open .agri-archive-more-dropdown {
  display: block;
}
.agri-archive-more-dropdown .fild-item {
  width: 100% !important;
}

@media (max-width: 767px) {
  .archive-nav .post-select-filter {
    grid-template-columns: repeat(3, 1fr) !important;
    align-items: start;
    position: relative;
    overflow: visible;
    /* Espace réservé à droite pour le bouton "..." positionné en absolu,
       évite qu'il chevauche le 3e filtre (Année). Hauteur mini garantie
       pour ne pas couper le bouton rond (40px) si les selects sont plus
       bas que ça. */
    padding-right: 48px;
    min-height: 40px;
  }
  .agri-archive-more {
    display: block;
    position: absolute;
    /* Les selects natifs (Select2) font 30px de haut, le bouton rond fait
       40px : décale de la moitié de la différence pour centrer verticalement
       par rapport aux autres boutons filtre plutôt que de coller en haut. */
    top: -5px;
    right: 0;
    overflow: visible;
  }
}

/* Lien "Filtres" natif retiré en mobile (redondant, les filtres sont déjà visibles directement) */
@media (max-width: 767px) {
  .archive-nav .show_filter_shop {
    display: none !important;
  }
}

/* Espace entre la ligne filtres et la barre de recherche en mobile (collait) */
@media (max-width: 767px) {
  .agri-archive-nav-search {
    margin-top: 8px;
  }
}

/* Marge basse de la barre de recherche uniformisée avec la marge haute (8px) */
@media (max-width: 767px) {
  .agri-archive-nav-search {
    margin-bottom: 8px;
  }
}

/* Titre vignette grille (Toutes les vidéos, page catégorie, layout6) :
   2 lignes max avec ellipsis, au lieu d'1 seule ligne tronquée */
.jws-movies_advanced-element .video_title.lm-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.3;
}
/* Catégorie (div séparée) + vues/date (div séparée), alignées en flex sur
   une ligne sous le titre de la vignette */
.agri-card-meta-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  overflow: hidden;
}
.agri-card-meta-row .video-cat {
  flex-shrink: 0;
  white-space: nowrap;
}
.agri-card-meta-row .agri-card-meta {
  color: rgba(255,255,255,0.6);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.agri-card-meta-row a {
  color: inherit;
}

/* Popup hover (agrandissement carte + boutons Lire/Année) désactivé sur
   les vignettes grille movies (layout6) — demande explicite après
   nettoyage des boutons, finalement retiré entièrement */
.jws-movies_advanced-element .popup-detail,
.external-inner .popup-detail {
  display: none !important;
}

/* Effet hover agrandissement (clone flottant .external-div) retiré
   uniquement sur la page "Nos réalisations" (/tv_shows/), demande explicite
   après avoir constaté que même sans les boutons du popup, l'agrandissement
   restait visible et gênant */
body.post-type-archive-videos .external-div {
  display: none !important;
}

/* Icône play au hover sur les vignettes grille (page "Nos réalisations"),
   même pattern que la sidebar "À suivre" (.jws-up-next-thumb) */
body.post-type-archive-videos .jws-post-item .post-media {
  position: relative;
}
body.post-type-archive-videos .jws-post-item .post-media::after {
  content: '';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.35);
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}
body.post-type-archive-videos .jws-post-item:hover .post-media::after {
  opacity: 1;
}
body.post-type-archive-videos .jws-post-item .post-media::before {
  content: '\25B6';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 2px solid #fff;
  background: rgba(0, 0, 0, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 20px;
  padding-left: 4px;
  box-sizing: border-box;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}
body.post-type-archive-videos .jws-post-item:hover .post-media::before {
  opacity: 1;
}
/* AGRI: gros chiffres classement Top 10 (layout7) */
/* AGRI: masque chiffres classement pour widget Shorts Dernieres publications */


.agri-top-rank-item {
    position: relative;
    padding-left: 90px;
    overflow: visible;
}
.agri-top-rank-number {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    line-height: 100px;
    font-size: 100px;
    font-family: 'Metropolitano', sans-serif;
    font-weight: 700;
    color: transparent;
    -webkit-text-stroke: 1px var(--heading);
    text-stroke: 1px var(--heading);
    z-index: 5;
    pointer-events: none;
}
/* AGRI: halo lumineux vert derriere le chiffre, repris tel quel du
   widget natif top_videos_advanced (.top-videos-inner:before dans le
   theme parent) - c'est lui qui porte la couleur, pas le chiffre. */
.agri-top-rank-item::before {
    content: "";
    position: absolute;
    width: 90px;
    height: 90px;
    left: 0;
    top: 50%;
    margin-top: -45px;
    background: var(--main);
    filter: blur(40px);
    z-index: 1;
    pointer-events: none;
}
@media (max-width: 767px) {
    .agri-top-rank-item {
        padding-left: 30px;
    }
    .agri-top-rank-number {
        font-size: 50px;
        line-height: 50px;
    }
}
/* AGRI: masque chiffres classement pour Shorts (Dernieres publications + page rubrique) */
.agri-short-only .agri-top-rank-number,
.agri-format-short-block .agri-top-rank-number {
    display: none;
}
.agri-short-only .agri-top-rank-item,
.agri-format-short-block .agri-top-rank-item {
    padding-left: 0;
}
.agri-short-only .agri-top-rank-item::before,
.agri-format-short-block .agri-top-rank-item::before {
    display: none;
}

/* AGRI: hover cercle play generalise a tout le site (etait scope a
   /videos/ uniquement) - retire le clone flottant .external-div et le
   popup Netflix-style partout, garde uniquement l'icone play ronde */
.external-div {
  display: none !important;
}
body:not(.page-id-6029) .jws-post-item .post-media {
  position: relative;
}
body:not(.page-id-6029) .jws-post-item .post-media::after {
  content: '';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.35);
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}
body:not(.page-id-6029) .jws-post-item:hover .post-media::after {
  opacity: 1;
}
body:not(.page-id-6029) .jws-post-item .post-media::before {
  content: '\25B6';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 2px solid #fff;
  background: rgba(0, 0, 0, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 20px;
  padding-left: 4px;
  box-sizing: border-box;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}
body:not(.page-id-6029) .jws-post-item:hover .post-media::before {
  opacity: 1;
}

/* AGRI: test icone YouTube officielle - page rubrique (?about=1) uniquement */
.agri-videos-grid .post-media {
  position: relative;
}
.agri-videos-grid .post-media::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 68px;
  height: 48px;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2068%2048%22%3E%3Cpath%20fill%3D%22%23f00%22%20d%3D%22M66.52%207.74c-.78-2.93-2.49-5.41-5.42-6.19C55.79.13%2034%200%2034%200S12.21.13%206.9%201.55C3.97%202.33%202.27%204.81%201.48%207.74.06%2013.05%200%2024%200%2024s.06%2010.95%201.48%2016.26c.78%202.93%202.49%205.41%205.42%206.19C12.21%2047.87%2034%2048%2034%2048s21.79-.13%2027.1-1.55c2.93-.78%204.64-3.26%205.42-6.19C67.94%2034.95%2068%2024%2068%2024s-.06-10.95-1.48-16.26z%22/%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M45%2024%2027%2014v20%22/%3E%3C/svg%3E%0A");
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.15s ease;
  pointer-events: none;
}
.agri-videos-grid .post-inner:hover .post-media::before {
  opacity: 1;
}

/* AGRI: exclut icone play hover pour cards Article/Blog (widget jws_blog) */
.jws_blog_slider .jws-post-item .post-media::after,
.jws_blog_slider .jws-post-item .post-media::before,
.jws_blog_layout6 .jws-post-item .post-media::after,
.jws_blog_layout6 .jws-post-item .post-media::before {
  content: none !important;
  display: none !important;
}


/* AGRI: remplace ombre violette hover boutons par vert #7ED957 (rgba 126,217,87) */
.btn-main:hover,
.button-default .button-default:hover {
    box-shadow: 0px 15px 40px -8px rgba(126,217,87,0.5) !important;
}

/* AGRI: fond pastilles "Nos rubriques" inactives - noir semi-transparent au lieu de blanc */
.jws-videocat-list .layout1 .category-tab-item a {
    background: rgba(0,0,0,0.3) !important;
}

/* AGRI: page Blog (/blog/) - titre carte article limité à 2 lignes, extrait à 4 lignes */
.jws-blog-element .jws-post-item .post-inner .jws_post_content .entry-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.jws-blog-element .jws-post-item .post-inner .jws_post_content .jws_post_excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* AGRI: single blog - fix chevauchement tags multi-lignes (manque display+margin) */
.single-blog .post-tags a {
    display: inline-block;
    margin: 4px 6px 4px 0;
}
.single-blog .post-tags span {
    display: inline-block;
    margin-bottom: 4px;
}

/* AGRI: single blog mobile - nav article precedent/suivant : icones seules, texte + titre masques */
@media (max-width: 767px) {
    .single-blog .post-navigation .content_nav > span {
        font-size: 0;
    }
    .single-blog .post-navigation .content_nav .title {
        display: none;
    }
    .single-blog .post-navigation .content_nav i {
        font-size: 22px;
    }
}

/* AGRI: single blog - taille icones SVG partage (Instagram/TikTok/X/Threads) alignee sur fa- */
.agri-share .agri-svg-icon svg {
    vertical-align: middle;
}

/* AGRI: single blog mobile - flèches nav article precedent/suivant côte à côte (flex) au lieu d'empilées */
@media (max-width: 767px) {
    .single-blog .post-navigation {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 40px;
    }
    .single-blog .post-navigation > div.left,
    .single-blog .post-navigation > div.right {
        width: auto !important;
        float: none !important;
    }
    .single-blog .post-navigation > a {
        position: static;
        margin-left: 0;
        order: 1;
    }
}

/* AGRI: hero home mobile - force image bandeau a remplir toute la hauteur du bloc
   (bug observe: image cantonnee en haut, grand vide en dessous malgre
   jws_slider_video_item:height correct - fix defensif chaine height 100%) */
@media (max-width: 767px) {
    .jws_slider_video_item,
    .jws_slider_video_item .video-background-holder,
    .jws_slider_video_item .video-images {
        height: 580px !important;
        min-height: 580px !important;
    }
    .jws_slider_video_item .video-images {
        background-size: cover !important;
        background-position: right center !important;
    }
}

/* AGRI: hero home - description tronquee a 4 lignes avec ... */
.jws-slider_video-element .video-content-holder .video-description {
    font-size: 17px;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.jws-slider_video-element .video-content-holder .video-play .btn-main {
    color: #000;
}

/* AGRI: page rubrique "à propos" (?about=1 sur /movies_cat/<slug>/) */
.agri-rubrique-about {
    width: 100%;
}
.agri-rubrique-banner {
    position: relative;
    width: 100%;
    height: 800px;
    background-size: cover;
    background-position: center;
    background-color: #0a0d1f;
    background-image: linear-gradient(135deg, #1a3d1f 0%, #0a0d1f 70%);
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 40px;
}
.agri-rubrique-banner-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: flex-end;
    padding: 40px;
    background: linear-gradient(0deg, #00031c 0%, rgba(0,3,28,0.7) 15%, rgba(0,3,28,0) 60%);
}
.agri-rubrique-banner-overlay h1 {
    color: #fff;
    margin: 0;
}
.agri-rubrique-body {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.agri-rubrique-block h2 {
    margin-bottom: 16px;
}
.agri-rubrique-text p {
    line-height: 1.7;
    opacity: 0.9;
}
.agri-team-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 24px;
}
.agri-team-member {
    text-align: center;
}
.agri-team-photo {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto 12px;
}
.agri-team-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.agri-team-member h4 {
    margin: 0 0 4px;
    font-size: 16px;
}
.agri-team-role {
    font-size: 13px;
    opacity: 0.7;
}
.agri-videos-carousel {
    margin-bottom: 24px;
}
.agri-videos-carousel .owl-stage {
    display: flex;
}
/* AGRI: grille Videos de la rubrique (remplace carrousel owl, + Charger plus) */
.agri-videos-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}
@media (max-width: 1024px) {
    .agri-videos-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 767px) {
    .agri-videos-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
.agri-rubrique-loadmore {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: fit-content;
    margin: 0 auto 24px !important;
    float: none !important;
}
.agri-rubrique-loadmore.is-loading {
    opacity: 0.6;
    pointer-events: none;
}

.agri-rubrique-cta {
    display: inline-block;
}
@media (max-width: 1024px) {
    .agri-rubrique-banner {
        height: 720px;
    }
}
@media (max-width: 1024px) and (min-width: 768px) {
    .agri-rubrique-banner {
        height: 600px;
    }
}
@media (max-width: 767px) {
    .agri-rubrique-banner {
        height: 580px;
    }
    .agri-rubrique-banner-overlay {
        padding: 20px;
    }
}

/* AGRI: cartes vidéo - ratio vertical (9:16, style Shorts) pour les vidéos
   au format court (_agri_yt_format = short), ratio paysage (16:9) inchangé
   pour les vidéos normales. S'applique à la grille /videos/ home et au
   carrousel "Vidéos de la rubrique" (?about=1). */
.agri-format-short .post-media {
    aspect-ratio: 9 / 16;
}
.agri-format-short .post-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.agri-format-video .post-media {
    aspect-ratio: 16 / 9;
}
.agri-format-video .post-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* AGRI: page rubrique about - onglets filtre Tout/Vidéos/Shorts */
.agri-format-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
}
.agri-format-tab {
    padding: 8px 18px;
    border-radius: 20px;
    background: rgba(255,255,255,0.08);
    color: #fff;
    opacity: 0.7;
    font-size: 14px;
}
.agri-format-tab.active,
.agri-format-tab:hover {
    background: var(--main);
    color: #000;
    opacity: 1;
}
.agri-no-videos {
    opacity: 0.6;
}

/* AGRI: page rubrique about - grille autres rubriques */
.agri-other-rubriques-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.agri-other-rubrique-item {
    padding: 10px 18px;
    border-radius: 6px;
    background: rgba(255,255,255,0.06);
    color: #fff;
}
.agri-other-rubrique-item:hover {
    background: var(--main);
    color: #000;
}

/* AGRI: page rubrique about - flèches navigation carrousel vidéos visibles
   (owl-nav a height:0 par défaut, invisible sans ce fix) */
.agri-videos-carousel {
    position: relative;
}
.agri-videos-carousel .owl-nav {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    pointer-events: none;
    height: auto;
}
.agri-videos-carousel .owl-nav button {
    pointer-events: all;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(0,0,0,0.6) !important;
    color: #fff !important;
    font-size: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 -10px;
}
.agri-videos-carousel .owl-nav button.disabled {
    opacity: 0.3;
}
.agri-videos-carousel .owl-stage-outer {
    overflow: hidden;
}

/* AGRI: cartes vidéo (layout6) - vues + date de publication */
.agri-video-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    opacity: 0.7;
    margin-top: 4px;
}
.agri-video-views:after {
    content: "•";
    margin-left: 10px;
}
.agri-video-views:only-child:after {
    content: none;
    margin-left: 0;
}


/* AGRI: page Actualite (/blog/) - toolbar filtre Tous/Article/Blog + recherche */
.agri-actualite-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 24px;
}
.agri-actualite-search {
    flex-shrink: 0;
}
.agri-actualite-search-input {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 30px;
    padding: 10px 18px;
    color: #fff;
    width: 480px !important;
    max-width: 100%;
}
.agri-actualite-search-input::placeholder {
    color: rgba(255,255,255,0.5);
}
.agri-actualite-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 24px;
}
@media (max-width: 1024px) {
    .agri-actualite-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 767px) {
    .agri-actualite-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    .agri-actualite-toolbar {
        flex-direction: column;
        align-items: flex-start;
    }
    .agri-actualite-search-input {
        min-width: 100%;
    }
}
.agri-actualite-loadmore {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: fit-content;
    margin: 0 auto 24px !important;
    color: #000 !important;
}
.agri-actualite-wrap.is-loading {
    opacity: 0.6;
    pointer-events: none;
}

/* AGRI: espace entre titre Actualites et hero (toolbar deplacee sous le hero) */
.elementor-element-830b46a {
    margin-bottom: 20px !important;
}
.agri-actualite-toolbar {
    margin-top: 24px;
}

/* AGRI: mobile - tabs Tous/Article/Blog deplaces (JS) juste apres le titre
   Actualites, affiches sur la meme ligne */
@media (max-width: 767px) {
    .elementor-element-830b46a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: nowrap;
        gap: 12px;
    }
    .elementor-element-830b46a .agri-format-tabs {
        gap: 6px;
    }
    .elementor-element-830b46a .agri-format-tab {
        padding: 6px 12px;
        font-size: 13px;
    }
}

/* AGRI: hero page Actualite - titre limite a 2 lignes (troncage), badge
   categorie reste fixe en haut, description toujours en dessous */
.agri-actualite-hero .entry-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* AGRI: espacement manquant sur cards grille Actualite (layout2 inclus
   directement sans le wrapper natif jws_blog_layout2, qui portait ces
   marges) - titre colle a l'image sans ce fix */
.agri-actualite-item .entry-title {
    margin-top: 23px;
    margin-bottom: 12px;
}
.agri-actualite-item .jws_post_excerpt {
    margin-bottom: 12px;
}
/* Hero (layout3) - meme souci */
.agri-actualite-hero .entry-title {
    margin-top: 44px;
    margin-bottom: 20px;
}
.agri-actualite-hero .jws_post_excerpt {
    margin-bottom: 20px;
}

/* AGRI: hero page Actualite - meilleure repartition verticale des 4
   blocs (categorie, titre, description, meta), evite que le contenu
   colle en haut alors que l'image est plus haute */
.agri-actualite-hero .post-inner {
    align-items: stretch;
}
.agri-actualite-hero .jws_post_content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding: 20px 0;
    box-sizing: border-box;
}
.agri-actualite-hero .post_cat {
    align-self: flex-start;
    width: auto;
    margin-bottom: 0;
}
.agri-actualite-hero .jws_post_meta {
    margin-top: auto;
}

/* AGRI: mobile - masque champ recherche Actualite, aligne titre+tabs */
@media (max-width: 767px) {
    .agri-actualite-search {
        display: none;
    }
    .elementor-element-830b46a {
        align-items: baseline;
    }
    .elementor-element-830b46a .elementor-heading-title {
        margin: 0;
        flex-shrink: 0;
    }
}

/* AGRI: mobile - n'affiche que 6 items initiaux (sur les 12 charges),
   coherent avec pagination 6/mobile vs 12/desktop demandee. Le 'Charger
   plus' AJAX ajoute alors de nouveaux .agri-actualite-item APRES les 12
   deja presents, donc non concernes par ce nth-child limite aux 12
   premiers de la grille. */
@media (max-width: 767px) {
    .agri-actualite-grid > .agri-actualite-item:nth-child(n+7):nth-child(-n+12) {
        display: none;
    }
}

/* AGRI: mobile - retire le bouton 'Tous', garde Article/Blog seulement */
@media (max-width: 767px) {
    .agri-format-tabs .agri-format-tab[data-category=""] {
        display: none;
    }
}

/* AGRI: bloc 'Partager sur' single article - flex avec icones, aligne
   sur mobile (evite le label et les icones empiles sur des lignes
   separees) */
.agri-share .post-share-inner {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}
@media (max-width: 767px) {
    .agri-share .post-share-inner {
        gap: 10px;
    }
    .agri-share .post-share-inner label {
        margin: 0;
    }
}

/* AGRI: titres secondaires en contenu article (couleur WP native
   orange), passes en vert #7ED957 (charte du site) - override global
   sans toucher au contenu de chaque article individuellement */
.has-luminous-vivid-orange-color {
    color: #7ED957 !important;
    font-size: 22px !important;
    display: block;
}
@media (max-width: 767px) {
    .has-luminous-vivid-orange-color {
        font-size: 20px !important;
    }
}

/* AGRI: hero statique page single rubrique (movies_cat), meme habillage
   visuel que le carrousel "Nos rubriques" de la home (widget jws_slider_video
   layout3 - .video-background-holder/.video-content-holder viennent du CSS
   parent), juste un wrapper avec hauteur fixe puisqu'il n'y a qu'un slide */
.agri-rubrique-hero {
    position: relative;
    width: 100%;
    height: 500px;
    overflow: hidden;
    border-radius: 10px;
}
/* AGRI: point focal remonte (au lieu de center par defaut sur
   .video-images) pour eviter de couper les visages/tetes en haut des
   photos de banniere rubrique - la home garde son cover center normal,
   seul ce hero single-rubrique est concerne */
.agri-rubrique-hero .video-images {
    background-position: center top;
}
@media (max-width: 767px) {
    .agri-rubrique-hero {
        height: 400px;
        border-radius: 0;
    }
}

/* AGRI: retire le degrade sombre du hero uniquement sur les pages
   rubrique (/rubriques/<slug>/) - decision explicite le 28/08/2026,
   l'accueil garde son degrade normal (meme widget jws_slider_video,
   meme fichier layout3.php, classe conditionnelle sur is_tax('movies_cat')) */
.video-overlay.agri-no-overlay {
    background: none;
}

/* AGRI: titre des cards rubriques (page /rubriques/) en bas au lieu de
   centre - demande explicite le 28/08/2026. Widget jws-videos-category
   en layout2, structure HTML minimale (a > img + span), override du
   positionnement absolu centre du parent (style.css ligne ~9298). */
.jws-videocat-list .layout2 .category-tab-item span {
    top: auto;
    left: 0;
    right: 0;
    bottom: 0;
    transform: none;
    padding: 19px;
    width: 100%;
    box-sizing: border-box;
}

/* AGRI: badge categorie (ex "Article") des cartes blog - remplace le
   fond vert plein par un contour blanc solide, texte blanc pur (le
   texte var(--light) d'origine manquait de contraste sur fond vert). */
.post_cat.bage {
    background: transparent;
    border: 1px solid #ffffff;
}
.post_cat.bage a {
    color: #7ED957;
}

/* AGRI: agrandit legerement le titre des cartes rubrique sur /rubriques/
   (widget jws-videos-category layout2), 16px -> 25px. */
.jws-videocat-list .layout2 .category-tab-item span {
    font-size: 17px;
}

/* AGRI: page A propos - garde 2 colonnes visibles sur mobile pour le
   Wall of Stories et la grille de chiffres (au lieu de passer a 1
   seule colonne trop etroite en flex-wrap par defaut). */
@media (max-width: 767px) {
    .agri-wall-grid > a {
        flex: 0 0 calc(50% - 7px) !important;
        aspect-ratio: 1/1 !important;
    }
    .agri-figures-grid > div {
        flex: 0 0 50% !important;
    }
}

/* AGRI: page /rubriques/ - garde 2 colonnes visibles sur mobile pour
   la grille statique des 12 rubriques (au lieu de 1 seule colonne). */
@media (max-width: 767px) {
    div[data-agri-static-rubriques] > a {
        flex: 0 0 calc(50% - 4px) !important;
    }
}

/* AGRI: page single blog - marge interne 80px gauche/droite */
.single-blog .container {
    padding-left: 80px;
    padding-right: 80px;
}

/* AGRI: bouton Lire la suite - cards articles page blog */
a.agri-read-more {
    display: inline-block !important;
    align-self: flex-start !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: fit-content !important;
    margin: 12px 0;
    padding: 8px 18px !important;
    font-size: 13px !important;
    color: #000 !important;
}

/* AGRI: page blog archive - marge gauche/droite 80px pour aligner avec le logo header */
.elementor-element-e892bb8 {
    padding-left: 80px;
    padding-right: 80px;
}