/* =========================
   WP HEADER
========================= */
.wp-header{
  position: sticky;
  top: 0;
  z-index: 1030;
  background: #fff;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.wp-header .container-fluid{
  padding-left: 16px;
  padding-right: 16px;
}

/* Top bar default (mobile) */
.wp-header-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  min-height: 64px;
}

/* Brand */
.wp-brand{ display:flex; align-items:center; text-decoration:none; }
.wp-brand__img{ height: 34px; width:auto; display:block; }

/* Actions */
.wp-desktop-actions,
.wp-mobile-actions{
  display:flex;
  align-items:center;
  gap: 10px;
}

/* Icon buttons */
.wp-iconbtn{
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border: 1px solid rgba(0,0,0,.08);
  background: #fff;
}
.wp-iconbtn:hover{ background: rgba(0,0,0,.03); }
.wp-iconbtn i{ font-size: 18px; line-height: 1; }

/* Flag */
.wp-flag{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display:block;
}

/* Avatar */
.wp-avatar{
  width: 36px;
  height: 36px;
  border-radius: 999px;
  overflow:hidden;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border: 1px solid rgba(0,0,0,.10);
}
.wp-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }

/* =========================
   SEARCH (shared)
========================= */
.wp-header-searchform{
  position: relative;
  display:flex;
  align-items:center;
  width:100%;
  margin: 0; /* évite les décalages selon pages */
}

.wp-search-ico{
  position:absolute;
  left: 14px;
  opacity:.55;
  pointer-events:none;
  z-index: 2;
}

.wp-search-input{
  height: 44px;
  border-radius: 999px !important;
  padding-left: 42px !important;
  padding-right: 54px !important;
  position: relative;
  z-index: 1;
}

.wp-search-iconbtn{
  position:absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 0;
  background: #ff385c;
  color: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  z-index: 3; /* important: évite clic qui tombe sur login derrière */
}
.wp-search-iconbtn:hover{ filter: brightness(.95); }
.wp-search-iconbtn i{ font-size:18px; line-height:1; }

/* =========================
   DESKTOP LAYOUT (>=992px)
   Logo | Search centered | Icons
========================= */
@media (min-width: 992px){
  .wp-header-top{
    display:grid;
    grid-template-columns: auto 1fr auto;
    align-items:center;
    gap: 16px;
    min-height: 64px;
  }

  .wp-desktop-search{
    display:flex;
    align-items:center;     /* stop “search qui monte” */
    justify-content:center; /* center */
    min-width: 0;
  }

  /* Taille “normale” : ni full width, ni trop petite */
  .wp-desktop-search .wp-header-searchform{
    width: 100%;
    max-width: 620px; /* <- ton “juste milieu” */
  }
}

/* =========================
   MOBILE SEARCH : only after scroll
========================= */
.wp-mobile-searchrow{
  display: none; /* hidden at top */
  padding: 10px 0 12px;
  background:#fff;
  border-top: 1px solid rgba(0,0,0,.06);
}

@media (max-width: 991.98px){
  .wp-header.is-scrolled .wp-header-top{
    display:none;
  }

  .wp-header.is-scrolled .wp-mobile-searchrow{
    display:block;
    position: sticky;
    top: 0;
    z-index: 1031;
    border-top: 0;
  }

  .wp-header-searchform--mobile .wp-search-input{ height: 46px; }
}

/* =========================
   Desktop nested submenu hover
========================= */
.dropdown-submenu{ position: relative; }
.dropdown-submenu > .dropdown-menu{
  top: 0;
  left: 100%;
  margin-left: .1rem;
  margin-right: .1rem;
}
@media (min-width: 992px){
  .dropdown-submenu:hover > .dropdown-menu{ display:block; }
}

/* =========================
   MOBILE MENU MODAL
========================= */
.wp-mobile-menu .modal-header{
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.wp-mobile-menu .modal-body{
  padding: 16px;
}

/* Accordion style */
.wp-mobile-accordion .accordion-item{
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: 10px;
}
.wp-mobile-accordion .accordion-button{
  background:#fff;
  box-shadow:none;
  font-weight: 700;
}
.wp-mobile-accordion .accordion-button:not(.collapsed){
  background: rgba(0,0,0,.02);
}

/* Links inside modal menu */
.wp-menu-link,
.wp-menu-action{
  width: 100%;
  display:flex;
  align-items:center;
  padding: 12px 12px;
  text-decoration:none;
  color: inherit;
  border-radius: 12px;
}
.wp-menu-link:hover,
.wp-menu-action:hover{
  background: rgba(0,0,0,.04);
}

.wp-menu-muted{
  display:block;
  padding: 12px 12px;
  color: rgba(0,0,0,.55);
}

.wp-menu-group{ padding: 6px 0; }
.wp-menu-group-title{
  padding: 10px 12px;
  font-weight: 700;
  opacity: .85;
}

.wp-menu-section{
  margin-top: 14px;
  padding-top: 10px;
  border-top: 1px solid rgba(0,0,0,.06);
}
.wp-menu-section-title{
  font-weight: 800;
  margin-bottom: 8px;
  opacity: .85;
}

/* Prevent horizontal scroll */
.wp-header, .wp-header *{ max-width: 100%; }
body{ overflow-x: hidden; }



/* =========================
   HERO IMAGE
========================= */

/* Logos réseaux sociaux dans la hero */
.hero-section .hero-image .social-icon {
  position: absolute;
  width: 40px;
  z-index: 2;
}

/* TikTok : entre shape-02 et shape-01 côté droit */
.hero-section .hero-image .social-tiktok {
  top: 18%;
  right: 18%;
}

/* Instagram : un peu plus bas, pour équilibrer le bloc */
.hero-section .hero-image .social-instagram {
  top: 32%;
  right: 28%;
}

/* Masquer sur mobile comme les autres éléments décoratifs */
@media (max-width: 991.98px) {
  .hero-section .hero-image .social-icon {
    display: none !important;
  }
}









/* =========================
   CHIPSBAR 
========================= */

.wp-chipsbar{ margin: 10px 0 14px; }

.wp-chipsbar__row{
  display:flex;
  gap:10px;
  align-items:center;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling: touch;
  white-space: nowrap;
  padding: 6px 2px;
}
.wp-chipsbar__row > *{ flex: 0 0 auto; }
.wp-chipsbar__row::-webkit-scrollbar{ height: 0; }

.wp-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-radius: 999px;
  border: 0px solid #e6e9ef;
  background: #f3f5f8;
  color: #1f2a37;
  padding: 10px 14px;
  font-weight: 600;
  line-height: 1;
}

.wp-chip i{ font-size: 16px; }

.wp-chip:hover{
  background: #eef2f6;
}

/* “Filters” un peu plus visible  */
.wp-chip--primary{
  background: #e9f2ff;
  border-color: #cfe3ff;
  color: #1f2a37;
}

/* 1) Empêche tout débordement horizontal parasite */
html, body { overflow-x: hidden; }

/* 2) Cache les barres de scroll (chipsbar) */
.wp-chipsbar__row{
  scrollbar-width: none;        /* Firefox */
  -ms-overflow-style: none;     /* IE/Edge legacy */
}
.wp-chipsbar__row::-webkit-scrollbar{
  width: 0 !important;
  height: 0 !important;
  display: none !important;     /* Webkit */
}

/* 3) iOS: évite le “scroll indicator” trop visible */
@supports (-webkit-touch-callout: none){
  .wp-chipsbar__row{ -webkit-overflow-scrolling: touch; }
}


/* =========================
   Sort buttons (dans la modal) même style que chips
========================= */
.wp-sort-btn{
  border-radius: 999px;
  border: 1px solid #e6e9ef !important;
  background: #f3f5f8 !important;
  color: #1f2a37 !important;
  font-weight: 00 !important;
}

.wp-sort-btn.active{
  background: #e9f2ff !important;
  border-color: #1f2a37 !important;
  color: #1f2a37 !important;
  box-shadow: 0 4px 10px #1f2a37;
}

/* =========================
   Breadcrumb
========================= */

.wp-breadcrumbbar{
  padding: 6px 0 !important;
  margin: 0 !important;
}
.wp-breadcrumbbar .breadcrumb{
  margin: 0 !important;
  padding: 0 !important;
}
.wp-breadcrumbbar .wp-bc-title{
  font-weight: 700;
  font-size: 16px;
  margin: 0 0 2px 0;
}
/* =========================================================
   Provider Auth - LEFT PANEL layout fix (aeration + cards)
   ========================================================= */

.auth-left{
  /* restore a true grey panel feeling */
  background: #f6f7f8 !important;
  border-right: 1px solid rgba(0,0,0,.08);
}

.auth-left h3{
  margin-bottom: 10px !important;
  letter-spacing: -0.2px;
}

.auth-left p{
  margin-bottom: 22px !important;
  color: rgba(0,0,0,.62) !important;
  line-height: 1.55;
}

/* Benefits become cards (white blocks) */
.left-benefit{
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 14px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  box-shadow: 0 6px 18px rgba(0,0,0,.04);
  margin-bottom: 14px; /* spacing between sections */
}

.left-benefit:last-child{
  margin-bottom: 0;
}

.left-benefit .iconbox{
  width: 46px;
  height: 46px;
  border-radius: 12px;
  background: rgba(0,0,0,.03);
  border: 1px solid rgba(0,0,0,.08);
  flex: 0 0 46px;
}

.left-benefit .iconbox i{
  font-size: 18px;
  opacity: .9;
}

.left-benefit .title{
  font-weight: 800;
  margin-bottom: 4px;
  line-height: 1.2;
}

.left-benefit .desc{
  color: rgba(0,0,0,.62);
  font-size: .96rem;
  line-height: 1.45;
}

/* More breathing room on mobile */
@media (max-width: 576px){
  .auth-left{
    padding: 18px !important;
  }
  .left-benefit{
    padding: 14px 12px;
    border-radius: 12px;
    margin-bottom: 12px;
  }
}

/* Optional: make left panel not feel glued to edges inside card */
@media (min-width: 992px){
  .auth-left{
    padding-top: 44px !important;
    padding-bottom: 44px !important;
  }
}


