/* ==== Page Blog - Global ==== */
/* Contenu 100% pour elementor, puis 1200px pour le reste */
#module-stblog-default #columns.container {
  max-width: 100% !important;
  width: 100% !important;
}

#module-stblog-default #center_column > #main > #content > .elementor {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#module-stblog-default #center_column > #main > #content > :not(.elementor) {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
}

/* Taille des images dans la liste des articles du blog */
#module-stblog-default .st_posts.product_list .blog_image img.front-image {
  width: 290px;
  height: 320px;
  object-fit: cover;
}

/* Titre des articles : maximum 2 lignes */
#module-stblog-default .st_posts.product_list .s_title_block a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4;
  max-height: calc(1.4em * 2);
}

.products_sldier_swiper .pro_outer_box:hover,
.product_list.grid .pro_outer_box:hover {
  background-color: transparent !important;
}

.products_sldier_swiper .block_blog .pro_outer_box:hover .pro_second_box,
.products_slider_swiper .block_blog .pro_outer_box:hover .pro_second_box {
  background: none !important;
}

/* == == */

/* ==== Bloc Favoris : 1 héros gauche + 4 listes droites ==== */

/* Annulation styles thème */
#category_blogs_container_4 .product_list.list .product_list_item {
  padding-top: 0;
  padding-bottom: 22px;
  border: none;
}
#category_blogs_container_4 .pro_first_box {
  overflow: visible !important;
}

/* Hover : suppression du fond */
#category_blogs_container_4 .pro_outer_box:hover .pro_second_box {
  background: none !important;
}

/* Bouton “Ajouter à aimé” : masqué */
#category_blogs_container_4 a.add_to_love {
  display: none !important;
}

/* En-tête : suppression de la bordure */
#category_blogs_container_4 .title_style_0 {
  border: none !important;
}

/* Titre principal “Favoris” */
#category_blogs_container_4 .title_block_inner {
  text-transform: none !important;
  font-size: 36px !important;
  font-family: 'Lunchtype', sans-serif !important;
}

/* Marges globales du conteneur */
#module-stblog-default .category_blogs_container_4 .st_posts.product_list {
  margin: 0 !important;
}

/* Conteneur principal */
#category_blogs_container_4 .st_posts {
  position: relative;
  padding-left: calc(630px + 40px);
  min-height: 450px;
}

/* Carte héro (1er article) */
#category_blogs_container_4 .product_list_item:first-child {
  position: absolute;
  left: 0;
  top: 0;
  width: 630px !important;
  height: 450px;
  overflow: visible;
}

/* Image héro 630×450 */
#category_blogs_container_4 .product_list_item:first-child .blog_image img {
  width: 630px !important;
  height: 450px !important;
  max-width: none !important;
  object-fit: cover;
  display: block;
}

/* Titre héro */
#category_blogs_container_4 .product_list_item:first-child .s_title_block a {
  font-size: 28px;
  line-height: 1.2;
  display: block;
  margin-top: 12px;
}

/* Colonne droite : pas d’espacement vertical */
#category_blogs_container_4 .product_list_item:nth-child(n+2) {
  margin-bottom: 0;
}

/* Colonne droite : structure en ligne */
#category_blogs_container_4 .product_list_item:nth-child(n+2) .pro_outer_box {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

/* Vignettes droites 145×120 */
#category_blogs_container_4 .product_list_item:nth-child(n+2) .blog_image img {
  width: 145px !important;
  height: 120px !important;
  max-width: none !important;
  object-fit: cover;
  display: block;
}

/* Typo titres + extraits (droite) */
#category_blogs_container_4 .product_list_item:nth-child(n+2) .s_title_block a {
  font-size: 18px;
  line-height: 1.25;
}
#category_blogs_container_4 .product_list_item:nth-child(n+2) .blok_blog_short_content {
  max-height: 3.2em;
  overflow: hidden;
}

/* Largeurs Bootstrap neutralisées */
#category_blogs_container_4 .product_list_item {
  width: auto !important;
  max-width: none !important;
}

/* == == */

/* ==== Responsive 768px → 991px : 3 articles côte à côte ==== */
@media (min-width:768px) and (max-width:991px) {

  /* Structure générale : ligne unique, sans retour */
  #category_blogs_container_4 .st_posts {
    padding-left: 0;
    min-height: auto;
    display: flex;
    flex-wrap: nowrap;
    gap: 20px;
  }

  /* Limite : 3 premiers articles affichés */
  #category_blogs_container_4 .product_list_item:nth-child(n+4) {
    display: none !important;
  }

  /* Cartes : 3 colonnes de largeur égale */
  #category_blogs_container_4 .product_list_item {
    position: static !important;
    width: calc(33.333% - 14px) !important;
    height: auto !important;
    overflow: visible !important;
    margin: 0 !important;
  }
  #category_blogs_container_4 .product_list_item:first-child {
    width: calc(33.333% - 14px) !important;
  }

  /* Images centrées (290x320) */
  #category_blogs_container_4 .product_list_item .blog_image {
    width: 100%;
    aspect-ratio: 29 / 32; /* 290x320 */
    margin: 0 0 10px;
    overflow: hidden;
    display: flex;
    justify-content: center; /* centrage horizontal */
    align-items: center; /* centrage vertical */
  }

  #category_blogs_container_4 .product_list_item .blog_image img {
    width: 290px !important;
    height: 320px !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
  }

  /* Écrase la taille du héros (630x450) */
  #category_blogs_container_4 .st_posts.product_list.list
  .product_list_item:first-child .blog_image img {
    width: 290px !important;
    height: 320px !important;
  }

  /* Écrase la taille droite (145x120) */
  #category_blogs_container_4 .product_list_item:nth-child(n+2)
  .blog_image img {
    width: 290px !important;
    height: 320px !important;
  }

  /* Structure interne des cartes */
  #category_blogs_container_4 .product_list_item .pro_outer_box {
    display: block !important;
    text-align: left;
  }

  /* Titre du 1er article */
  #category_blogs_container_4 .product_list_item:first-child
  .s_title_block a {
    font-size: 18px;
    line-height: 1.25;
    margin-top: 0 !important;
  }

  /* Texte sous les images */
  #category_blogs_container_4 .product_list_item
  .blok_blog_short_content {
    max-height: 3.2em;
    overflow: hidden;
  }
}
/* == == */

/* ==== Responsive 480px → 767px : 2 articles côte à côte ==== */
@media (min-width:480px) and (max-width:767px){

  /* Structure : 2 colonnes flexibles */
  #category_blogs_container_4 .st_posts {
    padding-left: 0;
    min-height: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
  }

  /* Limite : seulement les 2 premiers articles */
  #category_blogs_container_4 .product_list_item:nth-child(n+3) {
    display: none !important;
  }

  /* Cartes : demi-largeur avec contraintes */
  #category_blogs_container_4 .product_list.list .product_list_item {
    position: static !important;
    width: calc(50% - 8px) !important;
    max-width: 350px !important;
    height: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    display: flex;
  }
  #category_blogs_container_4 .product_list_item .pro_outer_box {
    display: flex !important;
    flex-direction: column;
    width: 100%;
    gap: 0 !important; /* suppression du gap 14px */
  }

  /* Conteneur image (tous) */
  #category_blogs_container_4 .product_list_item .blog_image {
    width: 100%;
    height: 350px;
    overflow: hidden;
    margin: 0 0 10px;
  }

  /* Images (toutes) */
  #category_blogs_container_4 .product_list_item .blog_image img {
    width: 100% !important;
    height: 350px !important;
    max-width: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
  }

  /* Overrides forts pour écraser 145x120 et 630x450 */
  #category_blogs_container_4 .st_posts.product_list.list
  .product_list_item:nth-child(-n+2) .blog_image {
    width: 100% !important;
    height: 350px !important;
  }
  #category_blogs_container_4 .st_posts.product_list.list
  .product_list_item:nth-child(-n+2) .blog_image img {
    width: 100% !important;
    height: 350px !important;
    max-width: 100% !important;
  }

  /* Titre du premier article */
  #category_blogs_container_4 .product_list_item:first-child
  .s_title_block a {
    font-size: 18px !important;
    line-height: 1.25 !important;
    margin-top: 0 !important;
  }

  /* Titres : sans min-height forcé */
  #category_blogs_container_4 .product_list_item
  .s_title_block a {
    min-height: auto !important;
  }

  /* Extrait : sans limite de hauteur */
  #category_blogs_container_4 .product_list_item
  .blok_blog_short_content {
    max-height: none;
    overflow: visible;
  }
}
/* == == */

/* ==== Responsive ≤ 479px : 1er article seul ==== */
@media (max-width:479px){

  /* Structure générale */
  #category_blogs_container_4 .st_posts {
    padding-left: 0;
    min-height: auto;
    display: block;
  }

  /* Masquer à partir du 2e article */
  #category_blogs_container_4 .product_list_item:nth-child(n+2) {
    display: none !important;
  }

  /* Carte pleine largeur */
  #category_blogs_container_4 .product_list.list .product_list_item {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    display: block;
  }
  #category_blogs_container_4 .product_list_item .pro_outer_box {
    display: block !important;
    width: 100%;
    gap: 0 !important;
  }

  /* Image 100%x350 */
  #category_blogs_container_4 .product_list_item .blog_image {
    width: 100%;
    height: 350px;
    overflow: hidden;
    margin: 0 0 10px;
  }
  #category_blogs_container_4 .product_list_item .blog_image img {
    width: 100% !important;
    height: 350px !important;
    max-width: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
  }

  /* Écrase la règle 630x450 (desktop) */
  #category_blogs_container_4 .st_posts.product_list.list
  .product_list_item:first-child .blog_image,
  #category_blogs_container_4 .st_posts.product_list.list
  .product_list_item:first-child .blog_image img {
    width: 100% !important;
    height: 350px !important;
  }

  /* Titre + texte */
  #category_blogs_container_4 .product_list_item:first-child
  .s_title_block a {
    font-size: 18px !important;
    line-height: 1.25 !important;
    margin-top: 0 !important;
  }
  #category_blogs_container_4 .product_list_item
  .s_title_block a {
    min-height: auto !important;
  }
  #category_blogs_container_4 .product_list_item
  .blok_blog_short_content {
    max-height: none;
    overflow: visible;
  }
}
/* == == */

/* ==== Bloc Articles récents (#category_blogs_container_5) ==== */
/* Images */
#category_blogs_container_5 .blog_image img {
  width: 290px;
  height: 320px;
  object-position: center center;
  object-fit: cover;
}

/* Titres des articles */
#category_blogs_container_5 .s_title_block a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4em;
  max-height: calc(1.4em * 2);
}

/* Titre principal */
#category_blogs_container_5 .title_block_inner {
  font-size: 36px;
  text-transform: none;
  font-family: 'Lunchtype', sans-serif;
}

/* En-tête : sans bordure */
#category_blogs_container_5 .title_style_0 {
  border: none;
}
/* == == */

/* ==== Bloc “Tous nos articles” ==== */
/* Titre */
#module-stblog-default h2.title_block_inner {
  font-size: 36px;
  text-transform: none;
  font-family: 'Lunchtype', sans-serif;
  color: #2e2d2e;
  margin-bottom: 30px;
}

/* Cible la grille .st_posts qui suit le titre h2.section-title > Centrer le contenu */
#module-stblog-default .title_block:has(.title_block_inner.section-title)
+ .st_posts.product_list.row.grid .pro_outer_box {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Fallback si :has() n’est pas supporté par le navigateur */
#module-stblog-default .title_block
+ .st_posts.product_list.row.grid .pro_outer_box {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.product_list.grid .block_blog .pro_outer_box:hover .pro_second_box {
  background-color: transparent !important;
}
/* == == */

/* ==== Pagination du blog ==== */
/* Masquer le compteur */
.bottom_pagination .product_count {
  display: none !important;
}

/* Centrer la pagination */
.bottom_pagination.flex_box.flex_space_between.mb-3 {
  display: flex !important;
  justify-content: center !important;
  align-items: center;
}

.bottom_pagination .pagination {
  display: flex;
  gap: 8px;
  padding: 0;
  margin: 0;
}

/* Style général des liens */
.bottom_pagination .pagination .page-link {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: transparent;
  color: grey;
  font-weight: 500;
  font-size: 16px;
  padding: 0;
  line-height: 1;
  border: none;
}

/* État actif ou désactivé */
.bottom_pagination .pagination .page-item.active .page-link,
.bottom_pagination .pagination .page-link.disabled {
  color: #2e2d2e;
  border: 1px solid #2e2d2e;
}

/* Survol */
.bottom_pagination .pagination
.page-item:not(.active):not(.disabled) .page-link:hover {
  color: #91654c;
}

/* Masquer les icônes natives */
.bottom_pagination .pagination .page-link i.fto-right-open-3,
.bottom_pagination .pagination .page-link i.fto-left-open-3 {
  display: none;
}

/* Flèche droite (SVG custom) */
.bottom_pagination .pagination .page-link.next::after {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url("/themes/panda_child_v3/assets/img/arrow-right-open.svg") no-repeat center;
  background-size: contain;
}

/* Flèche gauche (SVG custom) */
.bottom_pagination .pagination .page-link.previous::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url("/themes/panda_child_v3/assets/img/arrow-left-open.svg") no-repeat center;
  background-size: contain;
}

/* Marges globales */
.bottom_pagination.flex_box.flex_space_between.mb-3 {
  margin-bottom: 100px !important;
}

/* Version mobile (≤767px) */
@media (max-width: 767px) {
  .bottom_pagination.flex_box.flex_space_between.mb-3 {
    margin-bottom: 50px !important;
  }
}
/* == == */

/* ==== Page article ==== */
/* ==== Colonne principale ==== */
/* Titre de l'article */
#module-stblog-article h1.page_heading {
  text-transform: none;
    font-size: 50px;
    line-height: 1.2;
}

/* Masquer la date des articles (sauf page article unique) */
.blog_info .date-add {
  display: none !important;
}

body#module-stblog-article .blog_info .date-add {
  display: inline-block !important;
}

/* Masquer l'image originale de l'article (celle mise en BO) */
/* #module-stblog-article .blog_cover_box {
  display: none;
} */

/* Carroussel d'images */
#module-stblog-article .elementor-image-carousel .swiper-slide-inner img {
    width: 800px;
    height: 450px;
    object-fit: cover;
}

/* ==== Colonne droite : Articles similaires ==== */
/* Titre de la section */
#module-stblog-article .stblogrelatedarticles_container .title_block_inner {
  text-transform: none;
  font-weight: 600;
  font-size: 18px;
}

/* Masquer les flèches */
#module-stblog-article #stblogrelatedarticles_container_7af3d6ddf2 .swiper-button-tr {
  display: none !important;
}

/* Images miniatures */
#module-stblog-article .stblogrelatedarticles_container
.pro_column_box.line_item .pro_column_left {
  width: 100px;
}

#module-stblog-article .stblogrelatedarticles_container
.pro_column_box.line_item .pro_column_left picture,
#module-stblog-article .stblogrelatedarticles_container
.pro_column_box.line_item .pro_column_left img {
  width: 100px;
  object-fit: cover;
}

/* Titres des articles */
#module-stblog-article .stblogrelatedarticles_container
.pro_column_box.line_item h3.s_title_block,
#module-stblog-article .stblogrelatedarticles_container
.pro_column_box.line_item h3.s_title_block a {
  font-size: 16px;
}

/* Espacer le contenu */
#module-stblog-article .stblogrelatedarticles_container
.pro_column_box.line_item .pro_column_right {
  margin-left: 110px;
}

/* Titres des articles */
#module-stblog-article .pro_column_right .s_title_block a {
  font-weight: 500;
}

/* Lien "Voir tout" */
#module-stblog-article .stblog-see-all-wrap {
  margin-top: 30px;
}

#module-stblog-article .stblog-see-all-wrap a {
  text-decoration: underline;
  font-weight: 500;
}

/* Espacement principal (desktop) */
@media screen and (min-width: 992px) {
  #module-stblog-article #blog_primary_block {
    margin-right: 30px;
  }
}
/* == == */

/* ==== Page Article de bloc unique ==== */
#module-stblog-article #main h2 {
    color: #2e2d2e;
    font-family: 'Lunchtype';
    font-size: 36px;
}

#module-stblog-article #main h3 {
    font-family: 'Lunchtype';
    font-size: 24px;
    color: #435262;
}

#module-stblog-article #main a {
    font-weight: bold;
    text-decoration: underline;
}

#module-stblog-article #main a:hover {
    text-decoration: underline;
}
/* == == */