/* GFC 02/11/2026 (Raph, SEC, PREPROD) : propositions + 5 dernieres recherches sous le champ, DANS la barre sombre
   (voir js/autoload/99-gfc-skrupt-sousbarre-20261102a.js).
   v b : puces Skrupt restylees en !important (le module les forcait en blanc 38 px). */
#skruptsearch .skrupt-search-top .skrupt-search-row { row-gap: 6px; align-content: center; }
#skruptsearch .gfc-skrupt-sousbarre { grid-column: 1 / -1; display: flex; align-items: center; gap: 6px; min-width: 0;
    overflow-x: auto; overflow-y: hidden; scrollbar-width: none; white-space: nowrap; }
#skruptsearch .gfc-skrupt-sousbarre::-webkit-scrollbar { display: none; }
#skruptsearch .gfc-skrupt-sousbarre:empty { display: none; }
/* propositions Skrupt (la ligne blanche pleine largeur disparait) */
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell { flex: 0 1 auto !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; background: none !important;
    border: 0 !important; box-shadow: none !important; width: auto !important; max-width: 100% !important; position: relative !important; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell.skrupt-chip-bar-empty { display: none !important; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar { display: flex !important; gap: 6px !important; margin: 0 !important; padding: 0 !important; min-height: 0 !important; background: none !important;
    flex-wrap: nowrap !important; overflow: hidden !important; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip { height: 24px !important; min-height: 24px !important; line-height: 22px !important; padding: 0 10px !important; margin: 0 !important;
    font-size: 13px !important; font-weight: 600 !important; color: #fff !important; background: transparent !important; border: 1px solid #EA8914 !important; border-radius: 6px !important;
    box-shadow: none !important; display: inline-flex !important; align-items: center !important; gap: 4px !important; white-space: nowrap !important; cursor: pointer !important; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip:hover { background: #EA8914 !important; color: #fff !important; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip svg, #skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip:before { color: #EA8914 !important; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip:hover svg, #skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip:hover:before { color: #fff !important; }
/* 5 dernieres recherches */
#skruptsearch .gfc-skrupt-recentes { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell:not(.skrupt-chip-bar-empty) + .gfc-skrupt-recentes { border-left: 1px solid #5a5a5a !important; padding-left: 8px !important; }
#skruptsearch .gfc-skrupt-recentes-titre { color: #9a9a9a; font-size: 12px; display: inline-flex; align-items: center; gap: 4px; }
#skruptsearch .gfc-skrupt-recentes-titre:before { content: ''; width: 13px; height: 13px; border: 1.5px solid #9a9a9a; border-radius: 50%;
    background: linear-gradient(#9a9a9a, #9a9a9a) 5px 2px / 1.5px 5px no-repeat, linear-gradient(#9a9a9a, #9a9a9a) 5px 5.5px / 4px 1.5px no-repeat;
    box-sizing: border-box; }
#skruptsearch .gfc-skrupt-recente { height: 24px; line-height: 22px; padding: 0 10px; font-size: 13px; color: #d8d8d8; background: #444;
    border: 1px solid #5a5a5a; border-radius: 6px; cursor: pointer; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#skruptsearch .gfc-skrupt-recente:hover { color: #fff; border-color: #EA8914; }
#skruptsearch .gfc-skrupt-recente-eff { height: 24px; width: 24px; padding: 0; font-size: 16px; line-height: 22px; color: #9a9a9a;
    background: none; border: 0; cursor: pointer; }
#skruptsearch .gfc-skrupt-recente-eff:hover { color: #EA8914; }
@media (max-width: 767px) {
    #skruptsearch .gfc-skrupt-recentes-titre { display: none; }
}

/* v c 02/11/2026 (Raph SEC) : croix dans chaque badge de derniere recherche (retire seulement celle-ci) */
#skruptsearch .gfc-skrupt-recente { display: inline-flex; align-items: center; gap: 6px; padding: 0 6px 0 10px; }
#skruptsearch .gfc-skrupt-recente-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#skruptsearch .gfc-skrupt-recente-x { flex: 0 0 auto; width: 16px; height: 16px; line-height: 15px; text-align: center; border-radius: 50%;
    font-size: 14px; color: #9a9a9a; cursor: pointer; }
#skruptsearch .gfc-skrupt-recente-x:hover { background: #EA8914; color: #fff; }

/* v d 02/11/2026 (Raph SEC) : 3 propositions maximum (les suivantes masquees) */
#skruptsearch #skrupt-chip-bar > .skrupt-quick-search-chip:nth-of-type(n+4),
#skruptsearch .skrupt-quick-search-track > .skrupt-quick-search-chip:nth-of-type(n+4) { display: none !important; }

/* v e 02/11/2026 (Raph, capture mobile « une proposition blanche ») : l'indicateur de defilement Skrupt (fleche + degrade)
   etait blanc force (prevu pour fond clair) et masquait la 3e proposition sur la barre sombre -> fond sombre, fleche orange */
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell.skrupt-quick-search-can-left::before,
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell.skrupt-quick-search-can-right::after {
    top: 0 !important; height: 100% !important; width: 30px !important; background: #353535 !important; color: #EA8914 !important;
    font-size: 22px !important; box-shadow: none !important; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell.skrupt-quick-search-can-right::after {
    background: linear-gradient(90deg, rgba(53,53,53,0) 0, #353535 45%) !important; justify-content: flex-end !important; padding-right: 4px !important; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell.skrupt-quick-search-can-left::before {
    background: linear-gradient(270deg, rgba(53,53,53,0) 0, #353535 45%) !important; justify-content: flex-start !important; padding-left: 4px !important; }

/* v f 02/11/2026 (Raph) : loupe a la FIN du champ, cliquable (valide la recherche, voir JS sousbarre f) */
#skruptsearch .skrupt-search-wrap { position: relative !important; }
#skruptsearch .skrupt-search-wrap .skrupt-search-icon { position: absolute !important; right: 6px !important; left: auto !important; top: 50% !important;
    transform: translateY(-50%) !important; width: 36px !important; height: 36px !important; display: flex !important; align-items: center !important;
    justify-content: center !important; margin: 0 !important; padding: 0 !important; cursor: pointer !important; pointer-events: auto !important;
    border-radius: 6px !important; color: #EA8914 !important; font-size: 22px !important; z-index: 3 !important; transition: background .15s ease; }
#skruptsearch .skrupt-search-wrap .skrupt-search-icon:hover { background: #EA8914 !important; color: #fff !important; }
#skruptsearch .skrupt-search-wrap .skrupt-search-input { padding-left: 14px !important; padding-right: 48px !important; }

/* v h 02/11/2026 (Raph, capture mobile) : ce sont les DERNIERES RECHERCHES qui defilent, plus les propositions.
   Les propositions ne retrecissent plus (3 sur ordinateur, 1 seule sur mobile, sans fleche de defilement) ;
   les dernieres recherches prennent le reste de la ligne et defilent au doigt / a la molette. */
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre { overflow: hidden !important; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell { flex: 0 0 auto !important; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar { overflow: visible !important; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell::before,
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell::after { display: none !important; }
#skruptsearch .gfc-skrupt-recentes { flex: 1 1 auto !important; min-width: 0 !important; overflow-x: auto !important; overflow-y: hidden !important;
    scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
#skruptsearch .gfc-skrupt-recentes::-webkit-scrollbar { display: none; }
#skruptsearch .gfc-skrupt-recentes > * { flex: 0 0 auto; }
@media (max-width: 767px) {
    #skruptsearch #skrupt-chip-bar > .skrupt-quick-search-chip:nth-of-type(n+2),
    #skruptsearch .skrupt-quick-search-track > .skrupt-quick-search-chip:nth-of-type(n+2) { display: none !important; }
    #skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip { max-width: 45vw !important; overflow: hidden !important; text-overflow: ellipsis !important; }
}

/* v i 02/11/2026 : fleches de defilement des dernieres recherches (zone .gfc-skrupt-rec-zone creee par le JS sousbarre i) */
#skruptsearch .gfc-skrupt-rec-zone { position: relative; flex: 1 1 auto; min-width: 0; display: flex; align-items: center; }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell:not(.skrupt-chip-bar-empty) + .gfc-skrupt-rec-zone { border-left: 1px solid #5a5a5a; padding-left: 8px; }
#skruptsearch .gfc-skrupt-rec-fl { position: absolute; top: 0; bottom: 0; width: 34px; display: none; align-items: center; border: 0; padding: 0;
    color: #EA8914; font-size: 24px; font-weight: 700; line-height: 1; cursor: pointer; z-index: 4; }
#skruptsearch .gfc-skrupt-rec-fl.on { display: flex; }
#skruptsearch .gfc-skrupt-rec-fl-g { left: 0; justify-content: flex-start; padding-left: 4px; background: linear-gradient(270deg, rgba(53,53,53,0) 0, #353535 50%); }
#skruptsearch .skrupt-search-top .gfc-skrupt-sousbarre .skrupt-chip-bar-shell:not(.skrupt-chip-bar-empty) + .gfc-skrupt-rec-zone .gfc-skrupt-rec-fl-g { left: 9px; }
#skruptsearch .gfc-skrupt-rec-fl-d { right: 0; justify-content: flex-end; padding-right: 4px; background: linear-gradient(90deg, rgba(53,53,53,0) 0, #353535 50%); }
#skruptsearch .gfc-skrupt-rec-fl:hover { color: #fff; }

/* v j 02/11/2026 (Raph, capture mobile « j'ai deux croix ») : sur mobile, on masque la petite croix bleue d'effacement
   que Chrome/Safari ajoutent d'office aux champs de recherche ; la grande croix ronde (fermer) reste. */
@media (max-width: 767px) {
    #skruptsearch input[type="search"]::-webkit-search-cancel-button,
    #skruptsearch input[type="search"]::-webkit-search-decoration { -webkit-appearance: none !important; appearance: none !important; display: none !important; }
    #skruptsearch input::-ms-clear { display: none !important; width: 0 !important; height: 0 !important; }
}

/* v k 02/11/2026 (Raph, capture mobile « agrandis la loupe ») : loupe plus grande sur mobile, zone de clic 44 px */
@media (max-width: 767px) {
    #skruptsearch .skrupt-search-wrap .skrupt-search-icon { width: 44px !important; height: 44px !important; font-size: 32px !important; right: 2px !important; }
    #skruptsearch .skrupt-search-wrap .skrupt-search-input { padding-right: 52px !important; }
}