/* ===== GTF SmartSearch – CSS clean (no dupes) ===== */
:root{
  --gtfss-h: 44px;        /* hauteur barre inline */
  --gtfss-radius: 10px;   /* arrondi */
}

/* ===== Barre inline (grise, flat) ===== */
.gtfss-inline{
  flex: 1 1 auto;                 /* prend l'espace restant */
  display: flex;
  align-items: center;
  padding: 0 10px;
  min-width: 300px;
  margin-left: 12px;              /* espace visuel à gauche */
}

.gtfss-form--inline{
  display: flex;
  align-items: center;
  width: 100%;
  height: var(--gtfss-h);
  border-radius: var(--gtfss-radius);
  overflow: hidden;
  border: 1px solid #cfcfcf;
  box-shadow: none;               /* pas de relief */
  transition: background .15s, border-color .15s;
}
.gtfss-form--inline:hover{
  background: #f2f2f2;
  border-color: #cfcfcf;
}

.gtfss-input{
  flex: 1 1 auto;
  height: var(--gtfss-h);
  line-height: calc(var(--gtfss-h) - 2px);
  padding: 0 14px;
  font-size: 15px;
  border: 0;
  outline: none;
  background: transparent;
  color: #111;
}
.gtfss-input::placeholder{ color:#8a8a8a; }

/* Focus discret (AA) */
.gtfss-input:focus{
  outline: 1px solid #bdbdbd;
  outline-offset: 0;
  border-radius: var(--gtfss-radius);
}

.gtfss-btn{
  height: var(--gtfss-h);
  width: var(--gtfss-h);          /* carré = icône centrée */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  color: #333;
  cursor: pointer;
}
.gtfss-btn svg{ width:22px; height:22px }

/* Les blocs Panier / Connexion gardent leur largeur naturelle */
#_desktop_cart, #_desktop_user_info{ flex: 0 0 auto; }

/* ===== Overlay (plein écran) ===== */
.gtfss-overlay{
  position: fixed;
  inset: 0;
  z-index: 10000;                       /* très haut : devant le menu et le header */
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(2px);
  display: none;
}
.gtfss-overlay.is-open{ display: block; }

.gtfss-overlay-inner{
  max-width: 980px;
  margin: 24px auto;
  padding: 0 16px 16px;
}

.gtfss-bar .gtfss-form{
  display: flex;
  width: 100%;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #d7d7d7;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}

.gtfss-close{
  background: #111827;
  color: #fff;
  border: 0;
  padding: 0 14px;
  cursor: pointer;
  height: 44px;
  border-radius: 0;
  font-weight: 600;
}

/* ===== Liste des résultats ===== */
.gtfss-results{
  margin-top: 10px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  max-height: 70vh;
  overflow: auto;
}

.gtfss-item{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;               /* densité compacte */
  border-bottom: 1px solid #f3f4f6;
  text-decoration: none;
  color: #111827;
}

.gtfss-item:hover,
.gtfss-item.is-active{
  background: #eef4ff;              /* survol/actif plus lisible */
  outline: 2px solid #9ab3ff;
  outline-offset: -2px;
}

.gtfss-item img{
  width: 56px;
  height: 56px;
  object-fit: cover;
  flex: 0 0 auto;
}

.gtfss-meta{ flex: 1; min-width: 0; }
.gtfss-name{
  font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gtfss-sub{
  display: flex; gap: 8px; flex-wrap: wrap;
  font-size: 12px; color: #4b5563;
}
.gtfss-right{
  text-align: right; margin-left: auto;
  display: flex; flex-direction: column; gap: 4px;
  min-width: 92px;                    /* garde de la place pour le prix */
}
.gtfss-price{ font-weight: 700; }
.gtfss-stock{ font-size: 12px; color: #065f46; }
.gtfss-empty{ padding: 12px; color: #6b7280; }

/* ===== Responsive ===== */
@media (max-width: 992px){
  .gtfss-inline{ padding: 0 6px; }
}
@media (max-width: 480px){
  .gtfss-item img{ width: 52px; height: 52px; }
}

/* ===== GTFSS — ALIGNEMENT FIN PAR ÉLÉMENT ===== */
/* Ajuste juste ces trois variables (en px) */
:root{
  --gtfss-y:  -4px;   /* barre de recherche */
  --cart-y:   -6px;   /* bouton Panier */
  --login-y:  -5px;   /* bouton Connexion */
}

/* 1) Hauteur identique partout */
#header .gtfss-form--inline,
#header .gtfss-input,
#header .gtfss-btn{
  height:52px !important;
}
#header .gtfss-input{ line-height:50px !important; }

/* 2) On neutralise les anciens décalages éventuels */
#header .gtfss-inline{ transform:none !important; }

/* 3) Compensations individuelles (la clé !) */
#header .gtfss-inline{
  transform: translateY(var(--gtfss-y)) !important;
  position: relative;
  z-index: 10;                        /* header normal : passe derrière l'overlay */
}
#_desktop_cart{
  transform: translateY(var(--cart-y)) !important;
  position: relative;
  z-index: 10;                        /* idem */
}
#_desktop_user_info{
  transform: translateY(var(--login-y)) !important;
  position: relative;
  z-index: 10;                        /* idem */
}

/* 4) Centrage interne et même hauteur des contenus des boutons */
#_desktop_cart > *,
#_desktop_user_info > *{
  display:flex !important;
  align-items:center !important;
  height:52px !important;
  margin:0 !important;
}

/* 5) Sécurité : pas de marges parasites sur les wrappers */
#_desktop_cart, #_desktop_user_info{
  margin-top:0 !important;
  margin-bottom:0 !important;
}

/* ===== GTFSS — ESPACEMENT SOUS LE LOGO ===== */
/* règle unique : distance entre le logo et la ligne (barre + boutons) */
:root{
  --gtfss-gap-top: 12px;   /* ajuste: 8px, 10px, 12px, 16px... */
}

#header .gtfss-inline,
#_desktop_cart,
#_desktop_user_info{
  margin-top: var(--gtfss-gap-top) !important;
}
/* Fenêtre d'ajout au panier / modal panier : toujours tout en haut */
#blockcart-modal,
#blockcart-modal.modal,
#blockcart-modal.modal.show,
.modal,
.modal.show,
.blockcart,
.blockcart .cart-preview,
.blockcart .cart-content {
  position: relative !important;
  z-index: 10000 !important;
}

/* Le fond gris derrière la modale (backdrop Bootstrap) doit aussi passer devant le header */
.modal-backdrop,
.modal-backdrop.show {
  position: fixed !important;
  z-index: 9999 !important;
}
