/* ===================================================
   Muzamna — native WooCommerce shop / archive
   JS-driven icon swap, sits inside parent's column flex
   Uses theme tokens: --main-1, --base-3
   =================================================== */

.woocommerce ul.products li.product {
    --muz-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --muz-ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
    --muz-icon-size: 50px;
    --muz-gap: 8px;
    --muz-radius: 10px;
    /* Don't override the user's display/flex-direction here */
}

/* Hide WC's auto-injected "View Cart" — our quick icon handles it */
.woocommerce ul.products li.product a.added_to_cart {
    display: none !important;
}

/* ── Actions wrapper (JS-injected) ────────────────── */
.muz-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--muz-gap);
    align-items: stretch;   /* equal heights — button & icon match */
    width: 100%;
	padding:5px;
}

/* ── Add to cart button (80%) ─────────────────────── */
.muz-actions > a.add_to_cart_button {
    flex: 1 1 calc(80% - var(--muz-gap));
    min-width: 140px;
    min-height: var(--muz-icon-size);
    padding: 0 18px;
    border: 0;
    border-radius: var(--muz-radius);

    background-color: var(--main-1);
    color: var(--base-3);

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    box-sizing: border-box;

    transition:
        background-color .35s var(--muz-ease-soft),
        color .35s var(--muz-ease-soft),
        box-shadow .35s var(--muz-ease-soft),
        filter .35s var(--muz-ease-soft),
        transform .25s var(--muz-ease-soft);
}
.muz-actions > a.add_to_cart_button:hover {
    box-shadow: 0 8px 20px rgba(13, 10, 31, 0.18);
    transform: translateY(-1px);
}
.muz-actions > a.add_to_cart_button.loading {
    opacity: 0.7;
    pointer-events: none;
}

/* In-cart visual ✓ chip */
.muz-actions.is-added > a.add_to_cart_button {
    filter: saturate(0.95);
}
.muz-actions.is-added > a.add_to_cart_button::before {
    content: '✓';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: var(--base-3);
    color: var(--main-1);
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
}

/* ── Quick icon slot (20%) ────────────────────────── */
.muz-quick {
    flex: 0 1 calc(20% - var(--muz-gap));
    min-width: var(--muz-icon-size);
    min-height: var(--muz-icon-size);
    align-self: stretch;             /* match button's row height */

    position: relative;
    border-radius: var(--muz-radius);
    overflow: hidden;
    box-sizing: border-box;
}

.muz-quick__state {
    position: absolute;
    inset: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--muz-radius);

    background-color: var(--main-1);
    color: var(--base-3);
    text-decoration: none;

    opacity: 0;
    transform: scale(0.6) rotate(-12deg);
    pointer-events: none;

    transition:
        opacity .4s var(--muz-ease),
        transform .45s var(--muz-ease),
        background-color .35s var(--muz-ease-soft),
        box-shadow .35s var(--muz-ease-soft);
}
.muz-quick__state svg { transition: transform .3s var(--muz-ease); }
.muz-quick__state--cart svg { transform: scaleX(-1); }  /* RTL flip */

/* Default: eye visible */
.muz-quick__state--view {
    opacity: 1;
    transform: scale(1) rotate(0);
    pointer-events: auto;
}

/* Added: cart icon swaps in */
.muz-actions.is-added .muz-quick__state--view {
    opacity: 0;
    transform: scale(0.6) rotate(12deg);
    pointer-events: none;
}
.muz-actions.is-added .muz-quick__state--cart {
    opacity: 1;
    transform: scale(1) rotate(0);
    pointer-events: auto;
}

.muz-quick__state:hover {
    box-shadow: 0 8px 20px rgba(13, 10, 31, 0.18);
    background: var(--new-main-2);
    color: #ffffff;
}
.muz-quick__state--view:hover svg { transform: scale(1.1); }
.muz-quick__state--cart:hover svg { transform: scaleX(-1) translateY(-2px); }

/* ── Narrow screens: stack full-width ─────────────── */
@media (max-width: 400px) {
    .muz-actions > a.add_to_cart_button { flex-basis: 100%; }
    .muz-quick                          { flex-basis: 100%; }
}

/* ── Reduced motion ───────────────────────────────── 
@media (prefers-reduced-motion: reduce) {
    .muz-actions > a.add_to_cart_button,
    .muz-quick__state {
        transition-duration: 0.01ms !important;
    }
}*/

.woocommerce ul.products li.product .button{
	    margin-top: unset !important;
}