/* =========================================
   SYNEXTA SEARCH V26.0 (TAGS CARTOUCHE)
   ========================================= */

/* --- A. MENU DROPDOWN (Intact) --- */
.syn-menu-search-dropdown { width: 250px !important; max-width: 250px !important; padding: 15px !important; background: #ffffff !important; border: none !important; box-shadow: 0 15px 40px rgba(0,0,0,0.1) !important; border-radius: 4px !important; box-sizing: border-box !important; }
.syn-search-input-wrap { position: relative !important; margin-bottom: 10px !important; border-bottom: 1px solid #000 !important; transition: border-color 0.3s ease !important; }
.syn-search-input-wrap:focus-within { border-bottom-color: var(--syn-accent) !important; }
#syn-search-wrapper-unique.syn-search-input-wrap { border-bottom: 1px solid #000 !important; }
#syn-menu-search-input-id.syn-menu-search-input { width: 100% !important; border: none !important; padding: 8px 30px 8px 0 !important; font-size: 13px !important; font-weight: 400 !important; color: #000 !important; background: transparent !important; outline: none !important; box-shadow: none !important; border-radius: 0 !important; }
.syn-menu-search-input::placeholder { color: #999 !important; font-style: italic; }
.syn-search-icon { position: absolute !important; right: 0 !important; top: 50% !important; transform: translateY(-50%) !important; color: #333 !important; pointer-events: none !important; background: none !important; border: none !important; padding: 0 !important; }
.syn-spinner { position: absolute; right: 25px; top: 50%; margin-top: -6px; width: 12px; height: 12px; border: 2px solid #fff; border-top: 2px solid #000; border-radius: 50%; opacity: 0; visibility: hidden; transition: 0.2s; }
.syn-search-input-wrap.loading .syn-spinner { opacity: 1; visibility: visible; animation: synSpin 0.8s linear infinite; }
@keyframes synSpin { to { transform: rotate(360deg); } }
.syn-search-list { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.syn-search-list li { margin: 0 !important; padding: 0 !important; border: none !important; display: block !important; }
.syn-search-item { display: flex !important; align-items: center !important; padding: 8px 0 !important; text-decoration: none !important; background: transparent !important; border-bottom: 1px solid #f9f9f9 !important; transition: opacity 0.2s ease !important; width: 100% !important; }
.syn-search-item:hover { opacity: 0.7 !important; }
.syn-thumb { width: 36px !important; height: 36px !important; flex-shrink: 0 !important; background: #f4f4f4 !important; margin-right: 10px !important; border-radius: 2px !important; overflow: hidden !important; display: flex !important; align-items: center !important; justify-content: center !important; border: none !important; box-shadow: none !important; }
.syn-thumb img { width: 100% !important; height: 100% !important; object-fit: cover !important; margin: 0 !important; }
.syn-info { flex: 1 !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; justify-content: center !important; }
.syn-title { font-size: 12px !important; color: #333 !important; font-weight: 500 !important; line-height: 1.3 !important; margin: 0 !important; display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden !important; }
.syn-view-all-li { margin-bottom: 10px !important; padding-bottom: 0 !important; text-align: right !important; }
.syn-view-all-link { display: block !important; background: #000 !important; color: #fff !important; text-align: center !important; padding: 8px !important; font-size: 10px !important; text-transform: uppercase !important; font-weight: 700 !important; letter-spacing: 1px !important; text-decoration: none !important; border-radius: 2px !important; transition: background 0.2s !important; }
.syn-view-all-link:hover { background: var(--syn-accent) !important; color: #fff !important; }
.syn-no-results { padding: 15px 0 !important; text-align: center !important; color: #999 !important; font-size: 11px !important; }


/* --- B. PAGE DE RÉSULTATS (TAGS CARTOUCHE) --- */

.syn-static-results-wrapper { width: 100% !important; margin: 30px 0 !important; }
.syn-results-title { font-size: 24px !important; margin-bottom: 30px !important; border-bottom: none !important; color: #111 !important; font-weight: 300 !important; }
.syn-results-title span { font-weight: 700 !important; }


.wooproduct { position: relative !important; aspect-ratio: 1 / 1 !important; display: flex !important; flex-direction: column !important; overflow: hidden !important; background: #fff !important; border: 1px solid #eee !important; border-radius: 4px !important; transition: box-shadow 0.3s ease !important; margin: 0 !important; padding: 0 !important; }
.wooproduct:hover { box-shadow: 0 10px 30px rgba(0,0,0,0.08) !important; border-color: #ddd !important; }
.wooproduct::before, .wooproduct::after { content: none !important; display: none !important; }
.syn-card-link { text-decoration: none !important; color: inherit !important; display: flex !important; flex-direction: column !important; width: 100% !important; height: 100% !important; }

.syn-visual-area { flex: 1 !important; position: relative !important; width: 100% !important; overflow: hidden !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 15px !important; }
.syn-visual-area img { max-width: 100% !important; max-height: 100% !important; width: auto !important; height: auto !important; object-fit: contain !important; mix-blend-mode: multiply !important; transition: transform 0.5s ease !important; margin: 0 !important; border: none !important; box-shadow: none !important; }
.wooproduct:hover img { transform: scale(1.08) !important; }

.syn-price-badge { position: absolute !important; top: 10px !important; right: 10px !important; background: #fff !important; padding: 4px 8px !important; border-radius: 3px !important; box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important; font-weight: 700 !important; font-size: 13px !important; color: #000 !important; line-height: 1 !important; z-index: 10 !important; }
.syn-price-badge del { display: none !important; } 
.syn-price-badge ins { text-decoration: none !important; background: transparent !important; color: #000 !important; }

/* TAGS CARTOUCHE BLANCHE */
.syn-tags-stack { position: absolute !important; top: 40px !important; right: 10px !important; display: flex !important; flex-direction: column !important; align-items: flex-end !important; gap: 4px !important; z-index: 9 !important; }

.syn-tag {
    display: inline-block !important;
    background: #ffffff !important; /* Fond Blanc Cartouche */
    color: #333 !important;
    padding: 3px 8px !important;    /* Espace interne */
    border-radius: 3px !important;  /* Bords arrondis */
    box-shadow: 0 2px 5px rgba(0,0,0,0.08) !important; /* Petite ombre */
    font-size: 10px !important; 
    font-weight: 700 !important; 
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    text-shadow: none !important;   /* Suppression ombre texte */
}

.syn-content-area { height: 50px !important; flex-shrink: 0 !important; padding: 0 15px 10px 15px !important; display: flex !important; align-items: center !important; background: #fff !important; }
.wooproduct h3 { font-family: inherit !important; font-size: 13px !important; font-weight: 600 !important; color: #333 !important; margin: 0 !important; padding: 0 !important; line-height: 1.3 !important; text-transform: none !important; text-align: left !important; border: none !important; background: none !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
.wooproduct h3::before, .wooproduct h3::after { content: none !important; display: none !important; width: 0 !important; height: 0 !important; }

.syn-pagination { margin-top: 50px; display: flex; justify-content: center; gap: 5px; }
.syn-pagination .page-numbers { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid #eee; color: #333; text-decoration: none; font-weight: 600; transition: all 0.2s; }
.syn-pagination .page-numbers.current, .syn-pagination .page-numbers:hover { background: #111; color: #fff; border-color: #111; }
/*css fichier boutique*/
/* ==========================================================================
   BOUTIQUE TACTICAL GRID (Version 46.0 - Prix Avancés & Marques)
   ========================================================================== */

/* --- 1. SKELETON & ANTI-CLS --- */
.boutique-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(var(--syn-col, 4), 1fr);
    min-height: 400px;
    animation: synFadeIn 0.4s ease-out forwards;
    opacity: 0;
}

@keyframes synFadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.boutique-grid.is-loading {
    opacity: 0.6;
    pointer-events: none;
    transition: opacity 0.2s ease;
}

/* Responsive Grille : 1 colonne forcée sous 768px */
@media (max-width: 1024px) { .boutique-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px) { .boutique-grid { grid-template-columns: repeat(2, 1fr) !important; } } 



.syn-brand-link {
    display: block; /*background: #fff;*/ padding: 2px; border: 1px solid #eee; border-radius: 2px; transition: border-color 0.2s;
}
.syn-brand-link:hover { border-color: #000; }


.wooproduct {
    aspect-ratio: var(--syn-ratio, 1/1) !important;
    /**/height: auto !important; position: relative !important;
    border: 1px solid #f0f0f0 !important; background-color: #ffffff !important;
    overflow: hidden !important; padding: 5px !important;
    box-sizing: border-box !important; display: flex; flex-direction: column;
    transition: box-shadow 0.3s ease;
    text-align: left !important; text-decoration: none !important;
}
.wooproduct::before, .wooproduct::after { display: none !important; content: none !important; }
.wooproduct a { text-decoration: none !important; border: none !important; outline: none !important; box-shadow: none !important; }
.wooproduct:hover { box-shadow: 0 5px 15px rgba(0,0,0,0.08) !important; z-index: 2; transform: none !important; }

/* Upper Deck (Image uniquement et badges absolus) */

.syn-upper-deck {
    position: relative; flex: 1 1 auto; width: 100%; min-height: 80px;
    background-color: #ffffff !important;
}

.syn-main-link {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;
    background: transparent;
}
.product-img {
    position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important;
    object-fit: contain; object-position: center;
    padding: 5px; box-sizing: border-box; background: transparent !important;
    transition: transform 0.4s ease; margin: 0 !important; border: none !important;
}
.wooproduct:hover .product-img { transform: scale(1.03); }

/* Badges superposés à l'image */
.syn-overlay-badges { position: absolute; top: 0; left: 0; z-index: 6; display: flex; flex-direction: column; pointer-events: none; }
.syn-tag {
    background: #e02b20 !important; color: #fff !important; font-size: 10px; padding: 4px 8px;
    font-weight: 700; text-transform: uppercase; border-radius: 0 0 4px 0;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.1); margin-bottom: 2px;
}
.syn-tag-featured { background: #3c8145 !important; }
.syn-tag-rupture { background: #dedede !important; color: #111 !important; }



.syn-card-footer {
    flex: 0 0 auto; padding: 10px; background: #ffffff;
    border-top: 1px solid #f5f5f5; text-align: left;

    display: flex; flex-direction: column; gap: 4px; position: relative;
    align-items: center;
    box-sizing: border-box;
    /**/min-height: 117px;
        justify-content: space-between;
}
h3.syn-product-title {
    letter-spacing: 0 !important; 

    margin: 0 !important; padding: 0 !important;
    font-weight: 600 !important;
    line-height: 1.3 !important; color: #222 !important; 
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    font-family: inherit !important;
}
h3.syn-product-title::before, h3.syn-product-title::after { display: none !important; content: none !important; }
.wooproduct:hover h3.syn-product-title { color: #000; }

.syn-product-brand-wrapper {
    position: absolute;  right: 0; z-index: 10; margin: 0 8px 8px 0;
}
.syn-brand-link img {
    max-width: 55px; height: auto; display: block; object-fit: contain;
        max-height: 30px;
}
.syn-mini-tag {

    background: #f5f5f5 !important; color: #666 !important; border: 1px solid #eee;
    font-size: 10px; padding: 2px 6px; font-weight: 600; text-transform: uppercase;
    border-radius: 3px; display: inline-block; line-height: 1 !important;
}
.syn-mini-tag:hover { background: #000 !important; color: #fff !important; border-color: #000; }

/* Ligne d'actions Prix + Panier alignés horizontalement au bas */
.syn-footer-actions-row {
    display: flex; justify-content: space-between; gap: 8px;width: 100%;
        margin-top: 9px;
    align-items: flex-end; /*align-items: flex-end; margin-top: auto;*/
}

.syn-price-block { flex: 1; }

.syn-price-container {
    display: flex; /**/flex-direction: column; align-items: flex-start; line-height: 1;gap:1px
}
.current-price-container{
        display: flex;
    align-items: flex-end;
    gap: 3px;

    font-size: 19px;
}
/* Ordre strict d'affichage des prix */
.syn-price-container ins,
.syn-price-container .current-price {
    /*order: 1 !important;
    font-size: 1.25em !important;*/ font-weight: 700; color: #1779c8 !important;
    background: transparent !important;
    text-decoration: none !important;

}
.syn-price-container del,
.syn-price-container .old-price {
   /* order: 2 !important;*/
    font-weight: 400; font-size: 16px; color: #888 !important;
    /*text-decoration: line-through !important;*/ margin-top: 1px;
}

.syn-price-container del{
    position: relative;
    text-decoration: none !important;
}

.syn-price-container .old-price::after {
    content: '';
    position: absolute;
    top: 34%;
    left: -10%;
    width: 110%;
    height: 1px;
    background: #888;
    transform: rotate(-13deg);
}
.syn-price-prefix { font-size: 0.6em; color: #777; margin-bottom: 2px; display: block;display: none; }

.syn-tax-label { font-size: 11px !important; font-weight: 400 !important; color: #1779c8 !important; text-transform: uppercase; margin-bottom: 2px; }

/* Bloc Panier */
.syn-cart-block { display: flex; align-items: center;
    justify-content: flex-end;     /*position: absolute;
    right: 0px;*/}

.syn-overlay-cart {/*position: absolute; bottom: 0; right: 0; z-index: 10; margin: 0 8px 8px 0;*/ 
    position: static !important; margin: 0 !important; }
.syn-add-to-cart-wrap { display: flex; align-items: center; gap: 6px; }



.syn-btn-add-cart, .syn-btn-add-cart-link {
    padding: 0 !important;
    text-decoration: none !important;
    width: 32px; height: 32px; /*background: #f9f9f9 !important;*/ border: none !important;    background-color: transparent !important;
    color: #333 !important; display: flex; align-items: center; justify-content: center;
    cursor: pointer; border-radius: 4px !important; box-shadow: none !important; transition: all 0.2s ease;
    z-index: 3;
}
.syn-btn-add-cart:hover, .syn-btn-add-cart-link:hover { 
    /*color: var(--wp--style--color--link, #0073aa) !important; background: white !important;*/
    background: #000 !important; border-color: #000 !important; color: #fff !important; 
}
.syn-btn-add-cart svg, .syn-btn-add-cart-link svg {   transition: stroke 0.2s;stroke: currentColor; width: 25px; height: 25px; }

.syn-msg-inline { font-size: 11px; color: #2e7d32; font-weight: 600; margin-top: 4px; display: none; }

