.elementor-1640 .elementor-element.elementor-element-e0f263a{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-around;--align-items:center;}.elementor-1640 .elementor-element.elementor-element-2909a3e{width:var( --container-widget-width, 15% );max-width:15%;--container-widget-width:15%;--container-widget-flex-grow:0;}.elementor-1640 .elementor-element.elementor-element-fac0377{width:var( --container-widget-width, 50% );max-width:50%;--container-widget-width:50%;--container-widget-flex-grow:0;z-index:46;}.elementor-1640 .elementor-element.elementor-element-f42db64{--display:flex;--min-height:7vh;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1640 .elementor-element.elementor-element-f42db64:not(.elementor-motion-effects-element-type-background), .elementor-1640 .elementor-element.elementor-element-f42db64 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-1640 .elementor-element.elementor-element-f8378ed > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-1640 .elementor-element.elementor-element-f8378ed.elementor-element{--align-self:center;}.elementor-1640 .elementor-element.elementor-element-f8378ed{z-index:20;}.elementor-1640 .elementor-element.elementor-element-f8378ed .elementor-menu-toggle{margin:0 auto;}.elementor-1640 .elementor-element.elementor-element-6f916e5 .elementor-button{background-color:var( --e-global-color-accent );border-radius:36px 36px 36px 36px;}.elementor-1640 .elementor-element.elementor-element-6f916e5 .elementor-button:hover, .elementor-1640 .elementor-element.elementor-element-6f916e5 .elementor-button:focus{background-color:var( --e-global-color-secondary );}.elementor-1640 .elementor-element.elementor-element-6f916e5 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}body:not(.rtl) .elementor-1640 .elementor-element.elementor-element-6f916e5{right:13px;}body.rtl .elementor-1640 .elementor-element.elementor-element-6f916e5{left:13px;}.elementor-1640 .elementor-element.elementor-element-6f916e5{bottom:2vh;z-index:50;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for html, class: .elementor-element-fac0377 *//* ===========================
   Custom Live Search (Lagabia)
   Targets your markup:
   .custom-search-container
   .custom-search-results-list
   .custom-search-result-item
   .custom-search-result-header
   .custom-no-results
   =========================== */

/* -- Tweakable design tokens (change to your brand) -- */
:root {
  --cs-bg: #ffffff;
  --cs-border: #e5e7eb;       /* light gray */
  --cs-border-strong: #d1d5db;
  --cs-text: #111827;         /* near-black */
  --cs-subtext: #6b7280;      /* gray-500 */
  --cs-accent: #111827;       /* action color */
  --cs-hover: #f9fafb;        /* hover bg */
  --cs-shadow: 0 12px 30px rgba(0,0,0,.12);
  --cs-radius: 14px;
  --cs-gap: .75rem;
  --cs-z: 9999;
}

/* Container */
.custom-search-container {
  position: relative;
  max-width: 760px; /* adjust as needed */
  margin-left: auto;
  margin-right: auto;
}

/* Input + button (kept minimal; you said CSS will be here) */
.custom-search-container form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .5rem;
}

#custom-search-input {
  width: 100%;
  border: 1px solid var(--cs-border);
  border-radius: 9999px;
  padding: .7rem 1rem;
  font-size: 16px;
  color: var(--cs-text);
  background: var(--cs-bg);
  outline: none;
  transition: box-shadow .15s ease, border-color .15s ease;
}
#custom-search-input:focus {
  border-color: var(--cs-accent);
  box-shadow: 0 0 0 3px rgba(17,24,39,.08);
}

.custom-search-button {
  display: inline-grid;
  place-items: center;
  padding: .6rem .9rem;
  border-radius: 9999px;
  border: 1px solid var(--cs-accent);
  background: var(--cs-accent);
  color: #fff;
  cursor: pointer;
  transition: transform .06s ease, opacity .15s ease, box-shadow .15s ease;
}
.custom-search-button:hover { opacity: .95; }
.custom-search-button:active { transform: translateY(1px); }

/* Results dropdown */
.custom-search-results-list {
  position: absolute;
  top: calc(100% + .5rem);
  left: 0;
  right: 0;
  z-index: var(--cs-z);
  display: none;              /* JS toggles to block */
  background: var(--cs-bg);
  border: 1px solid var(--cs-border);
  border-radius: var(--cs-radius);
  box-shadow: var(--cs-shadow);
  overflow: hidden;
  max-height: 70vh;           /* keep it on screen */
  backdrop-filter: saturate(140%) blur(0px);
}

/* Optional: if Elementor or headers overlap */
.custom-search-results-list * {
  -webkit-tap-highlight-color: transparent;
}

/* Group header (Produits / Catégories / Marques) */
.custom-search-result-header {
  padding: .55rem .9rem;
  font-size: 12px;
  font-weight: 600;
  color: var(--cs-subtext);
  background: #f8fafc;
  border-bottom: 1px solid var(--cs-border);
  letter-spacing: .02em;
  text-transform: uppercase;
}

/* Individual result rows */
.custom-search-result-item {
  position: relative;
  display: grid;
  grid-template-columns: 52px 1fr auto; /* img | info | right meta (price) */
  gap: var(--cs-gap);
  align-items: center;
  padding: .7rem .9rem;
  text-decoration: none;
  color: var(--cs-text);
  border-bottom: 1px solid #f3f4f6;
  transition: background .12s ease, transform .06s ease;
}
.custom-search-result-item:last-child {
  border-bottom: 0;
}

/* Hover / keyboard focus feel */
.custom-search-result-item:hover,
.custom-search-result-item:focus {
  background: var(--cs-hover);
}
.custom-search-result-item:active { transform: translateY(1px); }

/* Thumbnail */
.custom-search-result-item img {
  width: 52px;
  height: 52px;
  object-fit: cover;
  border-radius: 10px;
  background: #f3f4f6;
  border: 1px solid var(--cs-border);
}

/* Info blocks */
.custom-product-info,
.custom-category-info,
.custom-brand-info {
  min-width: 0; /* allow text truncation */
}
.custom-product-info strong,
.custom-category-info strong,
.custom-brand-info strong {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 600;
  color: var(--cs-text);
  margin-bottom: 2px;
}
.custom-product-info span,
.custom-category-info span,
.custom-brand-info span {
  font-size: 12px;
  color: var(--cs-subtext);
  white-space: nowrap;
}

/* Price column (right) only for products if you render it there) */
.custom-search-result-item.product-item .custom-product-info span {
  font-weight: 600; /* price_html often bold-worthy */
  color: var(--cs-text);
}

/* Category / Brand badges (optional look) */
.custom-search-result-item.category-item::before,
.custom-search-result-item.brand-item::before {
  content: attr(data-badge);  /* you can set data-badge via JS if needed */
  display: none;
}

/* No results */
.custom-no-results {
  padding: .9rem;
  color: var(--cs-subtext);
  text-align: center;
}

/* Scroll behavior for long lists */
.custom-search-results-list {
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--cs-border-strong) transparent;
}
.custom-search-results-list::-webkit-scrollbar {
  width: 10px;
}
.custom-search-results-list::-webkit-scrollbar-track {
  background: transparent;
}
.custom-search-results-list::-webkit-scrollbar-thumb {
  background-color: var(--cs-border-strong);
  border-radius: 999px;
  border: 3px solid transparent;
}

/* Responsive tweaks */
@media (max-width: 640px) {
  .custom-search-result-item {
    grid-template-columns: 44px 1fr;
  }
  .custom-search-result-item img {
    width: 44px;
    height: 44px;
  }
  /* Hide right column on mobile if you later add one */
  .custom-search-result-item > :last-child {
    display: none;
  }
}

/* Prevent overlap cut by parent overflow hidden sections */
.elementor-section, .elementor-container, .elementor-column {
  overflow: visible !important;
}

/* Raise above sticky headers/megamenu if needed */
.custom-search-container {
  isolation: isolate;            /* new stacking context */
}
.custom-search-container .custom-search-results-list {
  z-index: 99999;                /* extra safe */
}

/* Optional: subtle appear animation */
@keyframes cs-fade-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.custom-search-results-list[style*="display: block"] {
  animation: cs-fade-in .12s ease-out;
}/* End custom CSS */
/* Start custom CSS for nav-menu, class: .elementor-element-f8378ed *//* =================================================================
   ===== FULL-WIDTH, CENTERED, 5-COLUMN MEGA MENU (ADAPTIVE, ELEMENTOR SAFE) =====
   ================================================================= */

/* make sure nothing clips the dropdown */
.elementor-location-header,
#nav { overflow: visible !important; }

/* 1. Main Navigation Styling (Centering Menu Links) */
#nav .elementor-nav-menu { 
  display:flex; justify-content:center; align-items:center; gap:32px;
}
#nav .elementor-nav-menu > li > a { 
  color: #111;
  font-weight: 600;
  text-decoration: none;
  transition: color .2s ease;
}
#nav .elementor-nav-menu > li > a:hover {
  color: #0ea5e9;
}

/* parent li can host a full-width panel */
#nav .elementor-nav-menu > li.menu-item-has-children { 
  position: static; 
}

/* 2. PANEL: FULL-WIDTH VIEWPORT, CENTRED CONTENT */
#nav .elementor-nav-menu > li > .sub-menu {
  position: absolute;
  top: 100%;
  
  /* Clé pour le centrage en pleine largeur (100vw) */

  width: 80vw;               /* FULL VIEWPORT WIDTH */
  max-width: none;            /* Ignorer les contraintes de largeur du parent */
  
  /* Padding adaptatif pour laisser une marge de respiration sur les côtés */
  padding: 44px clamp(20px, 6vw, 50px); 

  background: #fff;
  border-top: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 30px 80px rgba(0,0,0,.16);
  border-radius: 0 0 14px 14px;
  z-index: 9999;

  /* GRID: 5 equal columns spanning the full width */
  display: grid !important;
  grid-template-columns: repeat(5, 1fr); 
  gap: 36px;
  justify-items: start;
  align-items: start;

  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
}

/* show on hover */
#nav .elementor-nav-menu > li:hover > .sub-menu {
  transform: translate(-50%, 0);
  opacity: 1; visibility: visible; pointer-events: auto;
  transition-delay: 0s;
}

/* 3. Structure des colonnes et liens */

/* each first-level child in the sub-menu = one column; kill theme floats */
#nav .elementor-nav-menu > li > .sub-menu > .menu-item {
  float:none !important; display:block !important; position:static !important;
  margin:0; padding:0; background:transparent !important; border:0 !important;
}

/* column heading (first link) */
#nav .elementor-nav-menu > li > .sub-menu > .menu-item > a {
  display:block; margin:0 0 12px; padding:0;
  font: 800 14px/1.3 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  letter-spacing:.05em; text-transform:uppercase; color:#111;
  pointer-events:none; /* makes heading not clickable */
}

/* links inside each column */
#nav .elementor-nav-menu > li > .sub-menu > .menu-item > .sub-menu {
  position:static !important; display:block !important; margin:0; padding:0; 
  background:transparent !important; border:0 !important; box-shadow:none !important;
}
#nav .elementor-nav-menu > li > .sub-menu > .menu-item > .sub-menu > .menu-item { 
  list-style:none; 
}
#nav .elementor-nav-menu > li > .sub-menu > .menu-item > .sub-menu > .menu-item > a {
  display:block; padding:7px 0; color:#444; font-weight:500; text-decoration:none; border-radius:6px;
  transition: background .2s ease, color .2s ease, padding-left .2s ease;
}
#nav .elementor-nav-menu > li > .sub-menu > .menu-item > .sub-menu > .menu-item > a:hover {
  color:#0ea5e9; background: rgba(14,165,233,.10); padding-left:6px;
}

/* 4. Strip theme arrows/icons/images in the menu */
#nav .elementor-nav-menu .sub-arrow,
#nav .elementor-nav-menu a:after,
#nav .elementor-nav-menu .sub-menu .menu-item > a:before { 
  display:none !important; content:none !important; 
}
#nav .elementor-nav-menu .sub-menu img,
#nav .elementor-nav-menu .menu-image,
#nav .elementor-nav-menu .wp-post-image { 
  display:none !important; 
}


@media (max-width: 1400px){ 
  #nav .elementor-nav-menu > li > .sub-menu { grid-template-columns: repeat(4, 1fr); }
}
/* 4 colonnes -> 3 colonnes */
@media (max-width: 1024px){
  #nav .elementor-nav-menu > li > .sub-menu { grid-template-columns: repeat(3, 1fr); }
}
/* 3 colonnes -> 2 colonnes (Tablette) */
@media (max-width: 768px){
  #nav .elementor-nav-menu > li > .sub-menu{
    position: static; left:auto; transform:none; width:100%;
    box-shadow:none; border-radius:0; border-top:0; 
    padding:16px 24px;
    opacity:1; visibility:visible; pointer-events:auto;
    
    grid-template-columns: 1fr 1fr; 
    gap:16px;
    
    transition: none; /* Désactiver les transitions sur mobile */
  }
}
/* 2 colonnes -> 1 colonne (Mobile) */
@media (max-width: 480px){
  #nav .elementor-nav-menu > li > .sub-menu{ 
    grid-template-columns: 1fr; 
    padding-left: 16px; 
    padding-right: 16px;
  }
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-6f916e5 *//* Floating Button Animation - Beating Effect */
#but {
    animation: beat 1.4s infinite ease-in-out;
    transform-origin: center;
}

/* Keyframes for beating / pulsing effect */
@keyframes beat {
    0% { transform: scale(1); }
    15% { transform: scale(1.15); }
    30% { transform: scale(1); }
    45% { transform: scale(1.15); }
    60% { transform: scale(1); }
    100% { transform: scale(1); }
}/* End custom CSS */