/* MarocMarket Product Cards - WoodMart / WooCommerce */
.mms-products-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:18px;
    width:100%;
}
.mms-columns-1{grid-template-columns:1fr}
.mms-columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mms-columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.mms-columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.mms-columns-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.mms-columns-6{grid-template-columns:repeat(6,minmax(0,1fr))}

.mms-product-card{
    position:relative;
    background:#fff;
    border:1px solid #ededed;
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 3px 14px rgba(0,0,0,.06);
    transition:transform .2s ease,box-shadow .2s ease;
    min-width:0;
}
.mms-product-card:hover{
    transform:translateY(-3px);
    box-shadow:0 8px 24px rgba(0,0,0,.10);
}
.mms-product-media{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    height:210px;
    padding:0;
    background:#fff;
}
.mms-product-image{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    transition:transform .2s ease;
}
.mms-product-card:hover .mms-product-image{transform:scale(1.03)}
.mms-product-fav{
    position:absolute;
    z-index:4;
    top:10px;
    right:10px;
    width:38px;
    height:38px;
    border-radius:50%;
    background:#fff;
    border:1px solid #ececec;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#222;
    text-decoration:none;
    box-shadow:0 2px 8px rgba(0,0,0,.08);
}
.mms-product-fav span{font-size:23px;line-height:1}
.mms-product-fav.is-active{color:#c1272d}
.mms-product-fav.is-active span{font-size:21px}
.mms-badge{
    position:absolute;
    z-index:2;
    left:10px;
    top:10px;
    background:#c1272d;
    color:#fff;
    border-radius:8px;
    padding:5px 8px;
    font-size:10px;
    font-weight:700;
}
.mms-product-body{padding:0 10px 10px}
.mms-product-title{
    display:block;
    min-height:39px;
    color:#222;
    font-size:14px;
    line-height:1.35;
    font-weight:600;
    text-decoration:none;
}
.mms-product-title:hover{color:#0f4c97}
.mms-rating{height:18px;margin-top:4px}
.mms-rating .star-rating{font-size:11px}
.mms-stock{
    margin-top:4px;
    font-size:12px;
    font-weight:600;
}
.mms-stock.is-in-stock{color:#16844a}
.mms-stock.is-out-of-stock{color:#c1272d}
.mms-price{
    margin-top:2px;
    color:#222;
    font-size:18px;
    line-height:1.3;
    font-weight:800;
}
.mms-price span{font-size:12px;font-weight:700}
.mms-buy-row{margin-top:9px}
.mms-qty{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:36px;
    border:1px solid #e7e7e7;
    border-radius:18px;
    overflow:hidden;
    background:#fff;
}
.mms-qty-btn{
    width:38px;
    height:100%;
    padding:0;
    border:0;
    background:#fff;
    color:#222;
    font-size:22px;
    line-height:1;
    cursor:pointer;
}
.mms-qty-btn:hover{background:#f5f5f5}
.mms-qty-input{
    width:54px!important;
    height:30px!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
    background:#f7f7f7!important;
    border-radius:9px!important;
    text-align:center!important;
    font-size:14px!important;
    font-weight:600!important;
    -moz-appearance:textfield;
}
.mms-qty-input::-webkit-outer-spin-button,
.mms-qty-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.mms-add-to-cart{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    width:100%;
    min-height:40px;
    margin-top:7px;
    padding:8px 12px;
    border:0;
    border-radius:20px;
    background:#c1272d;
    color:#fff;
    font-size:13px;
    font-weight:700;
    cursor:pointer;
    transition:filter .2s ease,transform .1s ease;
}
.mms-add-to-cart:hover{filter:brightness(.94);color:#fff}
.mms-add-to-cart:active{transform:scale(.98)}
.mms-add-to-cart.is-loading{opacity:.7;pointer-events:none}
.mms-view-product{
    display:block;
    margin-top:9px;
    padding:10px;
    border-radius:20px;
    background:#0f4c97;
    color:#fff;
    text-align:center;
    text-decoration:none;
    font-size:13px;
    font-weight:700;
}
.mms-view-product:hover{color:#fff;filter:brightness(.95)}

@media(max-width:1024px){
    .mms-products-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:767px){
    .mms-products-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
    .mms-product-media{height:155px;padding:0}
    .mms-product-body{padding:0 8px 8px}
    .mms-product-title{font-size:12px;min-height:34px}
    .mms-price{font-size:15px}
    .mms-stock{font-size:11px}
    .mms-add-to-cart{font-size:11px;min-height:36px;padding:7px 6px}
    .mms-cart-icon{font-size:12px}
    .mms-qty{height:32px}
    .mms-qty-btn{width:32px}
    .mms-qty-input{width:44px!important;height:26px!important}
    .mms-product-fav{width:32px;height:32px;top:7px;right:7px}
    .mms-product-fav span{font-size:19px}
}


/* ===== Correctif débordement des images (v1.3 - containment strict) =====
   Principe : la zone image est une boîte de hauteur FIXE, en overflow:hidden,
   qui constitue son propre bloc de contention (contain + isolation). L'image
   elle-même est positionnée en absolute/inset:0 à l'intérieur : quelle que
   soit sa taille intrinsèque ou les styles imposés par le thème (WoodMart,
   lazyload, etc.), elle ne peut physiquement jamais dépasser cette boîte ni
   recouvrir le titre / la catégorie / le prix situés dans le corps de carte. */
.mms-product-card{
    display:flex;
    flex-direction:column;
    isolation:isolate;
}

.mms-product-media{
    position:relative !important;
    display:block !important;
    flex:0 0 210px !important;
    width:100% !important;
    height:210px !important;
    min-height:210px !important;
    max-height:210px !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
    background:#fff;
    isolation:isolate;
    contain:layout paint size;
    z-index:1;
    padding:0 !important;
}

.mms-product-media img,
.mms-product-media .mms-product-image,
.mms-product-media .attachment-woocommerce_thumbnail,
.mms-product-media picture,
.mms-product-media noscript{
    display:block !important;
    position:absolute !important;
    inset:0 !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:0 !important;
    width:100% !important;
    height:100% !important;
    max-width:100% !important;
    max-height:100% !important;
    min-height:0 !important;
    min-width:0 !important;
    object-fit:contain !important;
    object-position:center center !important;
    margin:0 !important;
    padding:0 !important;
    transform:none !important;
    z-index:1 !important;
}

.mms-badge{ z-index:3 !important; }
.mms-product-fav{ z-index:4 !important; }

.mms-product-body{
    position:relative;
    z-index:2;
    flex:1 1 auto;
    min-width:0;
    background:#fff;
    overflow:hidden;
}

.mms-product-title,
.mms-stock,
.mms-price,
.mms-buy-row,
.mms-rating{
    position:relative;
    z-index:3;
}

/* Mobile */
@media(max-width:767px){
    .mms-product-media{
        flex-basis:155px !important;
        height:155px !important;
        min-height:155px !important;
        max-height:155px !important;
        padding:0 !important;
    }

    .mms-product-media img,
    .mms-product-media .mms-product-image,
    .mms-product-media .attachment-woocommerce_thumbnail{
        inset:0 !important;
        top:0 !important;
        right:0 !important;
        bottom:0 !important;
        left:0 !important;
        width:100% !important;
        height:100% !important;
        max-width:100% !important;
        max-height:100% !important;
    }
}


/* ===== Bouton WhatsApp (v1.3 - style bouton moderne, compact) ===== */
.mms-whatsapp-button{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    width:100%;
    height:34px;
    margin-top:6px;
    padding:0 10px;
    box-sizing:border-box;
    border:1px solid rgba(0,0,0,.04);
    border-radius:999px;
    background:linear-gradient(180deg,#2fdb6c 0%,#20bd5a 100%);
    color:#fff !important;
    text-align:center;
    text-decoration:none !important;
    font-size:12.5px;
    line-height:1;
    font-weight:700;
    letter-spacing:.1px;
    white-space:nowrap;
    box-shadow:0 2px 6px rgba(32,189,90,.35), inset 0 1px 0 rgba(255,255,255,.25);
    transition:filter .15s ease, transform .15s ease, box-shadow .15s ease;
}
.mms-whatsapp-button:hover{
    color:#fff !important;
    filter:brightness(1.04);
    transform:translateY(-1px);
    box-shadow:0 4px 10px rgba(32,189,90,.45), inset 0 1px 0 rgba(255,255,255,.25);
}
.mms-whatsapp-button:active{
    transform:translateY(0) scale(.97);
    box-shadow:0 1px 4px rgba(32,189,90,.35), inset 0 1px 0 rgba(255,255,255,.2);
}
.mms-whatsapp-icon-wrap{
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    width:16px;
    height:16px;
}
.mms-whatsapp-icon-wrap svg{
    width:14px;
    height:14px;
    display:block;
}
@media(max-width:767px){
    .mms-whatsapp-button{
        height:30px;
        padding:0 6px;
        font-size:10.5px;
        gap:4px;
    }
    .mms-whatsapp-icon-wrap{width:14px;height:14px}
    .mms-whatsapp-icon-wrap svg{width:12px;height:12px}
}

/* ===== Bouton WhatsApp sur la page produit (single product) ===== */
.mms-whatsapp-button--single{
    max-width:420px;
    height:42px;
    margin-top:14px;
    margin-bottom:6px;
    font-size:14px;
    gap:8px;
}
.mms-whatsapp-button--single .mms-whatsapp-icon-wrap{width:20px;height:20px}
.mms-whatsapp-button--single .mms-whatsapp-icon-wrap svg{width:16px;height:16px}
@media(max-width:767px){
    .mms-whatsapp-button--single{
        max-width:100%;
        height:38px;
        font-size:12.5px;
    }
}
