/**
 * Nutriforce — Design custom des cartes produit (boutique, catégories, tags).
 *
 * On ne touche PAS au markup Astra : on stylise uniquement via CSS les classes
 * existantes (.astra-shop-thumbnail-wrap, .astra-shop-summary-wrap, etc.).
 * Zéro risque de casser quoi que ce soit — Astra continue de gérer le layout,
 * les hooks, les variations, etc.
 */

/* ========================================
   CARTE : conteneur
   ======================================== */

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    background: #fff;
    border: 1px solid #e8e6e0;
    border-radius: 14px;
    overflow: hidden;
    padding: 0 !important;
    box-shadow: none;
    transition: border-color 0.2s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
    border-color: #d4d0c6;
    box-shadow: 0 6px 20px rgba(20, 30, 25, 0.07);
    transform: translateY(-3px);
}

/* Uniformise la liste (enlève les puces éventuelles) */
.woocommerce ul.products,
.woocommerce-page ul.products {
    list-style: none;
    padding-left: 0;
}

/* ========================================
   IMAGE : wrapper
   ======================================== */

.woocommerce ul.products li.product .astra-shop-thumbnail-wrap {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
    background: #f3f2ed;
    margin: 0;
    border-radius: 0;
}

.woocommerce ul.products li.product .astra-shop-thumbnail-wrap > a {
    display: block;
    width: 100%;
    height: 100%;
}

.woocommerce ul.products li.product .astra-shop-thumbnail-wrap img,
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap .attachment-woocommerce_thumbnail {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ========================================
   BOUTON HOVER "Ajouter au panier" / "Choix des options"
   (Astra l'affiche sur l'image en modern layout)
   ======================================== */

.woocommerce ul.products li.product .ast-on-card-button {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 2;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0 !important;
    border-radius: 50%;
    background: #1a472a !important;
    color: #fff !important;
    border: none !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
    opacity: 0;
    transform: translateY(6px);
    transition: opacity 0.2s, transform 0.2s, background 0.15s;
}

.woocommerce ul.products li.product:hover .ast-on-card-button {
    opacity: 1;
    transform: translateY(0);
}

.woocommerce ul.products li.product .ast-on-card-button:hover {
    background: #245c39 !important;
}

.woocommerce ul.products li.product .ast-on-card-button .ast-icon,
.woocommerce ul.products li.product .ast-on-card-button .ahfb-svg-iconset {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
}

.woocommerce ul.products li.product .ast-on-card-button svg {
    width: 18px !important;
    height: 18px !important;
    fill: #fff;
}

.woocommerce ul.products li.product .ast-on-card-button .ast-card-action-tooltip {
    display: none;
}

/* Badge "Sale" natif de Woo/Astra */
.woocommerce ul.products li.product .onsale,
.woocommerce ul.products li.product .ast-onsale-card {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    right: auto !important;
    margin: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    width: auto !important;
    height: auto !important;
    padding: 4px 10px !important;
    background: #e94f1d !important;
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    line-height: 1.4 !important;
    border-radius: 999px !important;
    border: none !important;
    z-index: 2;
}

/* ========================================
   INFOS : wrapper
   ======================================== */

.woocommerce ul.products li.product .astra-shop-summary-wrap {
    padding: 1px 16px 3px 16px !important;
    background: #fff;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* Lien du titre */
.woocommerce ul.products li.product .ast-loop-product__link {
    text-decoration: none;
    color: inherit;
}

/* Titre */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.3 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 1.6em;
}

/* Catégorie (si affichée par Astra avant le titre) */
.woocommerce ul.products li.product .ast-woo-shop-archive-categories {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #8a9a8e !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 0 0 2px !important;
    line-height: 1.2 !important;
}

/* Rating étoiles (si affichées par Astra/Woo) */
.woocommerce ul.products li.product .star-rating {
    margin: 0 !important;
    font-size: 14px !important;
    color: #1a472a !important;
    width: 5.4em !important;
}

.woocommerce ul.products li.product .star-rating::before,
.woocommerce ul.products li.product .star-rating span::before {
    color: #1a472a !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__link + .star-rating {
    margin-top: 2px !important;
}

/* ========================================
   RATING CUSTOM (injecté par content-product.php)
   ======================================== */

.woocommerce ul.products li.product .nf-loop-rating {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 !important;
    line-height: 1;
}

.woocommerce ul.products li.product .nf-loop-stars {
    display: inline-flex;
    align-items: center;
    gap: 1px;
}

.woocommerce ul.products li.product .nf-loop-stars svg {
    display: block;
    border-radius: 2px;
    width: 14px;
    height: 14px;
}

.woocommerce ul.products li.product .nf-loop-count {
    font-size: 12px;
    color: #8a9a8e;
    font-weight: 500;
    line-height: 1;
}

/* ========================================
   PRIX "À partir de" (le filtre PHP wrap le prix dans ces spans)
   ======================================== */

.woocommerce ul.products li.product .nf-loop-price-from {
    font-size: 11px;
    font-weight: 400;
    color: #9aa59e;
    letter-spacing: 0.2px;
    margin-right: 4px;
    display: inline;
}

.woocommerce ul.products li.product .nf-loop-price-amount {
    font-size: 14px;
    font-weight: 700;
    color: #1a1a1a;
    display: inline;
}

.woocommerce ul.products li.product .nf-loop-price-amount .woocommerce-Price-amount,
.woocommerce ul.products li.product .nf-loop-price-amount bdi {
    color: inherit;
    font-weight: inherit;
    font-size: inherit;
}

/* ========================================
   BOUTON "Lire la suite" / "Ajouter au panier" sous la carte (Astra mode classic)
   On le cache car le bouton hover sur image est suffisant en modern layout.
   Si besoin en mode classique, on peut le réactiver ici.
   ======================================== */

.woocommerce ul.products li.product .button.add_to_cart_button:not(.ast-on-card-button):not(.ast-select-options-trigger),
.woocommerce ul.products li.product > .button:not(.ast-on-card-button):not(.ast-select-options-trigger) {
    display: block;
    margin: 10px 16px 16px !important;
    padding: 10px 14px !important;
    background: #1a472a !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-align: center;
    transition: background 0.15s;
}

.woocommerce ul.products li.product .button.add_to_cart_button:not(.ast-on-card-button):hover {
    background: #245c39 !important;
}

/* ========================================
   MOBILE
   ======================================== */

@media (max-width: 768px) {
    .woocommerce ul.products li.product,
    .woocommerce-page ul.products li.product {
        border-radius: 12px;
    }

    .woocommerce ul.products li.product .astra-shop-summary-wrap {
        padding: 0px 8px 6px 8px !important;
    }

    .woocommerce ul.products li.product .woocommerce-loop-product__title {
        font-size: 14px !important;
    }

    .woocommerce ul.products li.product .ast-on-card-button {
        opacity: 1; /* tap-friendly, toujours visible en mobile */
        transform: none;
        width: 38px;
        height: 38px;
        bottom: 8px;
        right: 8px;
    }
}