/*
Theme Name:   Avantage Child
Theme URI:    http://avantage.bold-themes.com
Description:  Avantage child theme — LCP Partners
Author:       BoldThemes
Author URI:   http://bold-themes.com
Template:     avantage
Version:      1.4.1
Tags:         one-column, right-sidebar, custom-menu, featured-images, sticky-post, theme-options, threaded-comments, translation-ready
Text Domain:  avantage-child
*/

/* ═══════════════════════════════════════════════
   VARIABLES CSS — Palette LCP Partners
   ═══════════════════════════════════════════════ */
:root {
  --lcp-blue-dark:    #143749;
  --lcp-blue-mid:     #225b7b;
  --lcp-blue-light:   #a2d6f5;
  --lcp-blue-link:    #539eca;
  --lcp-blue-hover:   lightblue;
  --lcp-purple-hover: #BC46B6;
  --lcp-h5:           #1b4962;
  --lcp-gradient:     linear-gradient(75deg, #225b7b 0%, #143749 100%);
}

/* ═══════════════════════════════════════════════
   HEADER — Gradient LCP
   ═══════════════════════════════════════════════ */
.topBar,
.btLightAlternateHeader .btLogoArea,
.btLightAlternateHeader .btVerticalHeaderTop,
.mainHeaderInner {
  background: var(--lcp-gradient);
  background-size: cover;
}

/* ═══════════════════════════════════════════════
   TOPBAR — Layout
   ═══════════════════════════════════════════════ */
.btMenuHorizontal .topBar .topBarPort {
  display: grid;
  grid-template-columns: 1fr 3fr;
}
.btMenuHorizontal .btTopToolsRight {
  position: relative;
}

/* ═══════════════════════════════════════════════
   LOGO
   ═══════════════════════════════════════════════ */
.logo { visibility: visible; }
.btLogoArea .logo img { height: 140px; }

/* ═══════════════════════════════════════════════
   NAVIGATION HORIZONTALE
   ═══════════════════════════════════════════════ */
.btMenuHorizontal .menuPort > nav > ul > li {
  padding: 0 30px 0 0 !important;
}
.btMenuHorizontal .menuHolder .port {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
.btStickyHeaderActive.btMenuHorizontal .mainHeader .menuHolder .port {
  align-items: center;
}
.btStickyHeaderActive.btMenuHorizontal .mainHeader .btLogoArea .menuPort nav > ul > li > .subToggler,
.btStickyHeaderActive.btMenuHorizontal .mainHeader .btLogoArea .menuPort nav > ul > li > a {
  padding: .5em 0;
}
.btMenuHorizontal .menuPort nav > ul > li.current-menu-ancestor > a::after,
.btMenuHorizontal .menuPort nav > ul > li.current-menu-item > a::after {
  background-color: #ffffff !important;
}

/* ═══════════════════════════════════════════════
   TOPBAR LINK
   ═══════════════════════════════════════════════ */
#topbarLink {
  color: #ffffff;
  line-height: 1.5;
  text-align: center;
  font-weight: 700;
  display: grid;
  grid-template-columns: 2fr 1fr;
  position: absolute;
  z-index: 2;
  width: 100%;
}
#topbarLink > div:first-child { font-size: .8rem; }
#topbarLink svg { width: 1em; height: 1em; margin-right: .5em; }
#topbarLinkRight > div {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ═══════════════════════════════════════════════
   CONTENU — Liens et titres
   ═══════════════════════════════════════════════ */
.bt_bb_headline_content b { color: var(--lcp-blue-light); }
.btContent a              { color: var(--lcp-blue-link); }
.btContent a:hover        { color: var(--lcp-purple-hover); }
h5                        { color: var(--lcp-h5); }
h5:hover                  { color: var(--lcp-blue-hover); }

/* ═══════════════════════════════════════════════
   BLOG — Ombre cartes
   ═══════════════════════════════════════════════ */
article.btPostListStandard {
  box-shadow: 5px 5px 5px -3px rgba(0, 0, 0, .75);
}
.bt_bb_latest_posts_item_read_more a,
.more-link {
  color: var(--lcp-blue-mid);
  font-weight: 600;
  text-decoration: none;
  transition: color 0.2s ease;
}
.bt_bb_latest_posts_item_read_more a:hover,
.more-link:hover { color: var(--lcp-purple-hover); }

/* ═══════════════════════════════════════════════
   LAYOUT SIDEBAR
   ═══════════════════════════════════════════════ */
.lcp-has-sidebar {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 2rem;
}

.lcp-has-sidebar > .btContent {
  flex: 1 1 0%;
  min-width: 0;
  display: block;
}

.lcp-has-sidebar > #lcp-sidebar-injected {
  flex: 0 0 280px;
  width: 280px;
  min-width: 280px;
  margin-right: 2rem;
}

/* ═══════════════════════════════════════════════
   BLOG — Articles pleine largeur
   ═══════════════════════════════════════════════ */
.lcp-has-sidebar > .btContent article.btPostListStandard,
.lcp-blog-archive .btContent article.btPostListStandard,
.blog .btContent article.btPostListStandard,
.archive .btContent article.btPostListStandard,
.category .btContent article.btPostListStandard {
  display: block;
  width: 100%;
  float: none;
  clear: both;
  margin-bottom: 2.5rem;
  box-sizing: border-box;
}

.lcp-has-sidebar > .btContent .btPagination,
.lcp-blog-archive .btContent .btPagination,
.blog .btContent .btPagination {
  display: block;
  width: 100%;
  float: none;
}

/* ═══════════════════════════════════════════════
   BLOG — Images des cartes articles
   -----------------------------------------------
   PRINCIPE :
   • .btArticleMedia → overflow:hidden uniquement,
     PAS de hauteur fixe (évite le double-conteneur)
   • .btMediaBox → aspect-ratio:16/9 + overflow:hidden
     La hauteur se calcule automatiquement selon la
     largeur disponible (sidebar ou pleine largeur)
   • img → height:100% + object-fit:cover
     Fonctionne car le parent a une hauteur calculée
     via aspect-ratio — pas besoin de max-height sur l'img
   ═══════════════════════════════════════════════ */
.lcp-blog-archive .btContent article.btPostListStandard .btArticleMedia,
.blog .btContent article.btPostListStandard .btArticleMedia {
  overflow: hidden;
}

.lcp-blog-archive .btContent article.btPostListStandard .btMediaBox,
.blog .btContent article.btPostListStandard .btMediaBox {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  display: block;
}

.lcp-blog-archive .btContent article.btPostListStandard .btMediaBox img,
.blog .btContent article.btPostListStandard .btMediaBox img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}

/* ═══════════════════════════════════════════════
   ARTICLE SINGLE — Masquer image de couverture
   ═══════════════════════════════════════════════ */
.lcp-single-post .btContent .btArticleMedia {
  display: none;
}

/* ═══════════════════════════════════════════════
   BLOG — Full width (pas de sidebar)
   ═══════════════════════════════════════════════ */
.btNoSidebar .btContentHolder,
.btNoSidebar .btContent {
  width: 100%;
  max-width: 100%;
}

/* ═══════════════════════════════════════════════
   NAVIGATION PREV / NEXT
   ═══════════════════════════════════════════════ */
.btPrevNextNav {
  padding: 2rem 0;
  border-top: 1px solid rgba(0, 0, 0, .1);
  margin-top: 3rem;
  clear: both;
}
.btPrevNextNav .btPrevNextInner {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  flex-wrap: wrap;
}
.btPrevNext {
  display: flex;
  align-items: center;
  gap: 1rem;
  text-decoration: none;
  color: var(--lcp-blue-dark);
  transition: color 0.2s ease;
  flex: 0 1 45%;
}
.btPrevNext:hover  { color: var(--lcp-purple-hover); }
.btPrevNextEmpty   { flex: 0 1 45%; }
.btPrevNextDir {
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  opacity: .7;
  font-weight: 700;
  color: var(--lcp-blue-mid);
}
.btPrevNextTitle {
  font-weight: 600;
  font-size: .95rem;
  line-height: 1.4;
}
.btPrevNextImage {
  width: 60px;
  height: 60px;
  background-size: cover;
  background-position: center;
  border-radius: 4px;
  flex-shrink: 0;
}

/* ═══════════════════════════════════════════════
   UTILITAIRES
   ═══════════════════════════════════════════════ */
.mr-0 { margin-right: 0; }
.ml-2 { margin-left: 2rem; }
.text-blue { color: var(--lcp-blue-light); }
.text-highlight {
  font-weight: bold;
  font-size: 1.2rem;
  color: var(--lcp-blue-light);
}

/* ═══════════════════════════════════════════════
   RESPONSIVE — Tablette (max 1199px)
   ═══════════════════════════════════════════════ */
@media (max-width: 1199px) {
  #topbarLink {
    position: relative;
    display: block;
  }
  #topbarLink .ml-2 {
    margin-left: 0;
    margin-top: 2rem;
  }
}

/* ═══════════════════════════════════════════════
   RESPONSIVE — Mobile (max 767px)
   ═══════════════════════════════════════════════ */
@media (max-width: 767px) {

  /* Topbar */
  #topbarLink {
    position: relative;
    display: block;
  }
  #topbarLink .ml-2 {
    margin-left: 0;
    margin-top: 1rem;
  }

  /* Layout sidebar : colonne unique */
  .lcp-has-sidebar {
    flex-direction: column;
  }
  .lcp-has-sidebar > .btContent {
    flex: 0 0 100%;
    width: 100%;
    min-width: 0;
    order: 1;
  }
  .lcp-has-sidebar > #lcp-sidebar-injected {
    flex: 0 0 100%;
    width: 100%;
    min-width: 0;
    margin-right: 0;
    order: 2;
  }

  /* Images blog mobile
     aspect-ratio s'adapte automatiquement à la largeur
     de l'écran — pas de hauteur fixe nécessaire */
  .lcp-blog-archive .btContent article.btPostListStandard .btMediaBox,
  .blog .btContent article.btPostListStandard .btMediaBox {
    aspect-ratio: 16 / 9;
    height: auto;
  }

  /* Navigation prev/next */
  .btPrevNextImage { display: none; }
  .btPrevNextNav .btPrevNextInner { flex-direction: column; }
  .btPrevNext { flex: 0 0 100%; }

  /* Pages services — colonnes builder pleine largeur */
  .bt_bb_row_holder {
    flex-direction: column;
  }
  .bt_bb_row_holder > .bt_bb_column {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
    margin-left: 0;
    box-sizing: border-box;
  }

  /* Images pages services (builder) mobile
     RÈGLE : hauteur fixe sur le CONTENEUR (220px),
     height:100% sur l'img → object-fit:cover actif.
     height:auto sur l'img serait INCOMPATIBLE avec
     object-fit:cover (l'image ignorerait le recadrage) */
  .bt_bb_image.bt_bb_shape_square,
  .bt_bb_image.bt_bb_shape_square > a {
    display: block;
    width: 100%;
    height: 220px;
    overflow: hidden;
  }
  .bt_bb_image.bt_bb_shape_square img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
    margin: 0;
  }

  /* Débordement horizontal
     Sur .btContentHolder UNIQUEMENT — jamais sur body
     car overflow:hidden sur body désactive position:fixed
     et casse la sticky bar */
  .btContentHolder {
    overflow-x: hidden;
  }
}