/* ==========================================================================
   Agrizone shop: product cards
   Based on the supplied card design (style.css), adapted for:
   RTL / Vazirmatn / the Agrizone palette / WooCommerce markup / touch screens.
   Scope: WooCommerce shop + category/tag archives (and related products).
   ========================================================================== */

.agz-grid {
    --d: -1; /* RTL: -1 mirrors every horizontal motion of the original design */
    --agz-ink: #171d4d;
    --agz-muted: #6f7288;
    --agz-line: #e4e6df;
}
[dir="ltr"] .agz-grid { --d: 1; }


/* ======================================
   PAGE SHELL (archive pages only)
====================================== */

body.post-type-archive-product #primary,
body.tax-product_cat #primary,
body.tax-product_tag #primary {
    background: radial-gradient(circle at 50% 12%, #ffffff 0%, #f7f8f6 40%, #eceee9 100%);
    padding: 56px 24px 110px;
}

body.post-type-archive-product #primary main.site-main,
body.tax-product_cat #primary main.site-main,
body.tax-product_tag #primary main.site-main {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

#primary main.site-main > .woocommerce-breadcrumb {
    flex: 0 0 100%;
    margin: 0 0 14px;
    font-size: 13px;
    line-height: 1.8;
    color: #8a8ea3;
}
#primary main.site-main > .woocommerce-breadcrumb a {
    color: #20245e;
    text-decoration: none;
}
#primary main.site-main > .woocommerce-breadcrumb a:hover { text-decoration: underline; }

#primary main.site-main > .woocommerce-products-header {
    flex: 0 0 100%;
    margin: 0 0 30px;
}
#primary main.site-main > .woocommerce-products-header .page-title {
    margin: 0;
    font-family: "Vazirmatn", sans-serif;
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 800;
    line-height: 1.35;
    color: var(--agz-ink, #171d4d);
}

#primary main.site-main > .woocommerce-notices-wrapper { flex: 0 0 100%; }

#primary main.site-main > .woocommerce-result-count {
    flex: 1 1 auto;
    float: none;
    margin: 0 0 30px;
    font-size: 14px;
    color: #6f7288;
}

#primary main.site-main > .woocommerce-ordering {
    flex: 0 0 auto;
    float: none;
    margin: 0 0 30px;
}
#primary main.site-main > .woocommerce-ordering select {
    appearance: none;
    -webkit-appearance: none;
    min-width: 220px;
    padding: 11px 20px 11px 44px;
    border: 1px solid #e0e3da;
    border-radius: 100px;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%23171d4d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 18px center;
    font-family: "Vazirmatn", sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #171d4d;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(23, 29, 77, .05);
}
[dir="ltr"] #primary main.site-main > .woocommerce-ordering select {
    padding: 11px 44px 11px 20px;
    background-position: calc(100% - 18px) center;
}
#primary main.site-main > .woocommerce-ordering select:focus-visible {
    outline: 2px solid #0e6b45;
    outline-offset: 2px;
}

#primary main.site-main > nav.woocommerce-pagination {
    flex: 0 0 100%;
    margin-top: 64px;
}
.woocommerce-pagination ul.page-numbers {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    border: 0;
}
.woocommerce-pagination ul.page-numbers li { border: 0; float: none; }
.woocommerce-pagination ul.page-numbers li .page-numbers {
    min-width: 44px;
    height: 44px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
    background: #fff;
    font-size: 15px;
    font-weight: 600;
    color: #171d4d;
    box-shadow: 0 4px 14px rgba(23, 29, 77, .06);
}
.woocommerce-pagination ul.page-numbers li .page-numbers.current,
.woocommerce-pagination ul.page-numbers li a.page-numbers:hover {
    background: #171d4d;
    color: #fff;
}


/* ======================================
   GRID
====================================== */

.agz-grid.products {
    flex: 0 0 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 60px 38px;
}
.agz-grid.products::before,
.agz-grid.products::after {
    display: none !important;
    content: none !important;
}
.agz-grid.products li.product {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0;
    list-style: none;
    text-align: start;
    position: relative;
}


/* ======================================
   CARD
====================================== */

.agz-grid .product-card {
    position: relative;
    height: 556px;
    isolation: isolate;
    font-family: "Vazirmatn", sans-serif;
    color: var(--agz-ink);

    --accent: #0e6b45;
    --accent-soft: #dcefe5;
    --glow: rgba(14, 107, 69, .25);
}
.agz-grid .product-card *,
.agz-grid .product-card *::before,
.agz-grid .product-card *::after { box-sizing: border-box; }

.agz-grid .card-green  { --accent: #0e6b45; --accent-soft: #dcefe5; --glow: rgba(14, 107, 69, .25); }
.agz-grid .card-orange { --accent: #b45f12; --accent-soft: #fbead6; --glow: rgba(237, 138, 32, .28); }
.agz-grid .card-blue   { --accent: #2a62b8; --accent-soft: #e3ecf9; --glow: rgba(42, 98, 184, .25); }

.agz-grid .product-card a { color: inherit; font-size: inherit; text-decoration: none; }


/* ======================================
   BACK HOVER LAYER
====================================== */

.agz-grid .product-card .back-layer {
    position: absolute;
    inset: 12px;
    z-index: -1;
    border-radius: 31px;
    background: var(--accent);
    opacity: 0;
    transform: translateY(0) rotate(0);
    transition: transform .6s cubic-bezier(.2, .8, .2, 1), opacity .4s ease;
}


/* ======================================
   ACTUAL CARD
====================================== */

.agz-grid .product-card .card-inner {
    position: relative;
    z-index: 2;
    height: 100%;
    overflow: visible;
    border-radius: 28px;
    background: #f8f8f6;
    box-shadow: 0 10px 30px rgba(23, 29, 77, .07), 0 2px 8px rgba(23, 29, 77, .04);
    transition: transform .55s cubic-bezier(.2, .8, .2, 1), box-shadow .55s ease;
}


/* ======================================
   BADGES
====================================== */

.agz-grid .product-card .badges {
    position: absolute;
    top: 22px;
    inset-inline-start: 22px;
    z-index: 20;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
}
.agz-grid .product-card .badge {
    min-width: 52px;
    padding: 5px 13px;
    border-radius: 100px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.7;
    text-align: center;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.agz-grid .product-card .badge-new   { color: #fff; background: #171d4d; }
.agz-grid .product-card .badge-sale  { color: #fff; background: var(--accent); }
.agz-grid .product-card .badge-hot   { color: #171d4d; background: #bce85b; }
.agz-grid .product-card .badge-out   { color: #fff; background: #8b8e9f; }
.agz-grid .product-card .badge bdi   { unicode-bidi: isolate; }


/* ======================================
   ACTION ICONS
====================================== */

.agz-grid .product-card .product-actions {
    position: absolute;
    top: 20px;
    inset-inline-end: 20px;
    z-index: 20;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.agz-grid .product-card .product-actions > button,
.agz-grid .product-card .product-actions > a {
    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .9);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 5px 18px rgba(23, 29, 77, .1);
    font: inherit;
    font-size: 15px;
    line-height: 1;
    color: #222;
    cursor: pointer;
    opacity: 0;
    transform: translateX(calc(22px * var(--d))) scale(.82);
    transition: opacity .35s ease, transform .5s cubic-bezier(.2, .8, .2, 1), background .25s ease, color .25s ease;
}
.agz-grid .product-card .product-actions > :nth-child(2) { transition-delay: .05s; }
.agz-grid .product-card .product-actions > :nth-child(3) { transition-delay: .10s; }

.agz-grid .product-card .product-actions > button:focus:not(:focus-visible) {
    background: rgba(255, 255, 255, .9);
    color: #222;
}
.agz-grid .product-card .product-actions > button:hover,
.agz-grid .product-card .product-actions > a:hover,
.agz-grid .product-card .product-actions > button:focus-visible,
.agz-grid .product-card .product-actions > a:focus-visible {
    color: #fff;
    background: var(--accent);
    transform: scale(1.08) !important;
}
.agz-grid .product-card .product-actions > button.active,
.agz-grid .product-card .product-actions > button.active:focus {
    background: #171d4d;
    color: #fff;
}
.agz-grid .product-card .product-actions > button.active i { animation: agzHeartPop .4s ease; }

@keyframes agzHeartPop {
    0%   { transform: scale(.5); }
    60%  { transform: scale(1.35); }
    100% { transform: scale(1); }
}


/* ======================================
   IMAGE AREA
====================================== */

.agz-grid .product-card .product-image {
    position: relative;
    height: 290px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 28px 28px 0 0;
}

/* subtle background circle */
.agz-grid .product-card .product-image::before {
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--accent-soft) 0%, rgba(255, 255, 255, 0) 70%);
    transform: scale(.9);
    opacity: .7;
    transition: transform .7s cubic-bezier(.2, .8, .2, 1), opacity .4s ease;
}

/* shine */
.agz-grid .product-card .product-image::after {
    content: "";
    position: absolute;
    top: -30%;
    left: -70%;
    width: 42%;
    height: 170%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .7), transparent);
    transform: rotate(18deg);
    opacity: 0;
    transition: left .9s ease, opacity .3s ease;
    z-index: 10;
    pointer-events: none;
}

/* glow under item */
.agz-grid .product-card .product-glow {
    position: absolute;
    bottom: 30px;
    width: 190px;
    height: 35px;
    border-radius: 50%;
    background: var(--glow);
    filter: blur(18px);
    opacity: .75;
    transition: transform .6s ease, opacity .6s ease;
}


/* ======================================
   IMAGES
====================================== */

.agz-grid .product-card .product-image .image {
    position: absolute;
    width: 72%;
    height: 72%;
    max-width: none;
    margin: 0;
    padding: 0;
    object-fit: contain;
    border-radius: 0;
    box-shadow: none;
    filter: drop-shadow(0 20px 17px rgba(23, 29, 77, .14));
    transition: transform .75s cubic-bezier(.2, .8, .2, 1), opacity .45s ease, clip-path .75s cubic-bezier(.2, .8, .2, 1);
}

.agz-grid .product-card .product-image .image-main {
    opacity: 1;
    transform: scale(1) rotate(0deg);
    clip-path: circle(100% at 50% 50%);
}
.agz-grid .product-card .product-image .image-hover {
    opacity: 0;
    transform: scale(.72) rotate(calc(-16deg * var(--d))) translateX(calc(28px * var(--d)));
    clip-path: circle(0% at calc(50% + 20% * var(--d)) 30%);
}


/* ======================================
   CONTENT
====================================== */

.agz-grid .product-card .product-info {
    position: relative;
    height: 266px;
    padding: 4px 26px 26px;
}

.agz-grid .product-card .category {
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.8;
    color: #8b8e9f;
    letter-spacing: 0;
}

.agz-grid .product-card .product-info .product-title {
    margin: 0 0 6px;
    padding: 0;
    font-family: "Vazirmatn", sans-serif;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.55;
    letter-spacing: 0;
    color: var(--agz-ink);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.agz-grid .product-card .product-info .product-title a:hover { color: var(--accent); }

.agz-grid .product-card .product-info .excerpt {
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.85;
    color: var(--agz-muted);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.agz-grid .product-card .chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 10px;
    padding: 0;
    list-style: none;
}
.agz-grid .product-card .chips li {
    margin: 0;
    padding: 1px 10px;
    border-radius: 100px;
    background: #eceee9;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.9;
    color: #4d516b;
}


/* ======================================
   RATING + STOCK ROW
====================================== */

.agz-grid .product-card .meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.agz-grid .product-card .rating {
    display: flex;
    align-items: center;
    gap: 3px;
    margin: 0;
    color: #d29a43;
    font-size: 11px;
}
.agz-grid .product-card .rating .far { color: #d3d5cf; }
.agz-grid .product-card .rating .rating-text {
    margin-inline-start: 6px;
    font-size: 12px;
    font-weight: 500;
    color: #999caf;
}

.agz-grid .product-card .stock {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 1px 11px;
    border-radius: 100px;
    background: var(--accent-soft);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.9;
    color: var(--accent);
    white-space: nowrap;
}
.agz-grid .product-card .stock::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}
.agz-grid .product-card .stock.is-low { background: #fbead6; color: #b45f12; }
.agz-grid .product-card .stock.is-out { background: #f6e1e1; color: #a43a3a; }


/* ======================================
   PRICE
====================================== */

.agz-grid .product-card .price-row {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 12px;
    transition: transform .45s cubic-bezier(.2, .8, .2, 1);
}
.agz-grid .product-card .price-row .price {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    margin: 0;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.5;
    letter-spacing: 0;
    color: var(--agz-ink);
}
.agz-grid .product-card .price-row .price .from { font-size: 13px; font-weight: 500; color: var(--agz-muted); }
.agz-grid .product-card .price-row .price .cur  { font-size: 13px; font-weight: 600; color: var(--agz-muted); }
.agz-grid .product-card .price-row .old-price {
    font-size: 14px;
    line-height: 1.5;
    color: #a3a6b6;
    text-decoration: line-through;
}


/* ======================================
   ADD TO CART
====================================== */

.agz-grid .product-card .card-inner > .add-cart {
    position: absolute;
    inset-inline: 26px;
    bottom: -5px;
    z-index: 30;
    height: 54px;
    margin: 0;
    padding-block: 0;
    padding-inline: 22px 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 0;
    border-radius: 16px;
    background: #171d4d;
    font-family: "Vazirmatn", sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0;
    color: #fff;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-28px) scale(.97);
    transition: opacity .35s ease, transform .55s cubic-bezier(.2, .8, .2, 1), background .3s ease;
}
.agz-grid .product-card .card-inner > .add-cart:hover,
.agz-grid .product-card .card-inner > .add-cart:focus-visible { background: var(--accent); color: #fff; }

.agz-grid .product-card .add-cart .cart-icon {
    width: 39px;
    height: 39px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(255, 255, 255, .13);
    font-size: 15px;
    transition: transform .35s ease, background .35s ease;
}
.agz-grid .product-card .add-cart:hover .cart-icon {
    transform: rotate(calc(-8deg * var(--d)));
    background: rgba(255, 255, 255, .2);
}

/* ajax states (WooCommerce adds .loading / .added) */
.agz-grid .product-card .add-cart.loading { opacity: .85; pointer-events: none; }
.agz-grid .product-card .add-cart.loading .cart-icon i::before { content: "\f110"; }
.agz-grid .product-card .add-cart.loading .cart-icon i { animation: agzSpin .8s linear infinite; }
.agz-grid .product-card .add-cart.added .cart-icon i::before { content: "\f00c"; }
.agz-grid .product-card .added_to_cart { display: none !important; }

@keyframes agzSpin { to { transform: rotate(360deg); } }


/* ======================================
   CARD HOVER / KEYBOARD FOCUS
====================================== */

.agz-grid .product-card:is(:hover, :focus-within) .card-inner {
    transform: translateY(-13px);
    box-shadow: 0 30px 55px rgba(23, 29, 77, .14), 0 10px 20px rgba(23, 29, 77, .06);
}

/* BACK PLATE APPEARS */
.agz-grid .product-card:is(:hover, :focus-within) .back-layer {
    opacity: 1;
    transform: translateY(14px) translateX(calc(12px * var(--d))) rotate(calc(3deg * var(--d)));
}

/* ICONS */
.agz-grid .product-card:is(:hover, :focus-within) .product-actions > button,
.agz-grid .product-card:is(:hover, :focus-within) .product-actions > a {
    opacity: 1;
    transform: translateX(0) scale(1);
}

/* IMAGE CHANGE */
.agz-grid .product-card:is(:hover, :focus-within) .product-image .image-main {
    opacity: 0;
    transform: scale(.74) rotate(calc(12deg * var(--d))) translateX(calc(-24px * var(--d)));
    clip-path: circle(0% at calc(50% - 20% * var(--d)) 70%);
}
.agz-grid .product-card:is(:hover, :focus-within) .product-image .image-hover {
    opacity: 1;
    transform: scale(1.04) rotate(0deg) translateX(0);
    clip-path: circle(100% at 50% 50%);
}

/* IMAGE BACKGROUND */
.agz-grid .product-card:is(:hover, :focus-within) .product-image::before {
    transform: scale(1.28);
    opacity: 1;
}

/* SHINE SWEEP */
.agz-grid .product-card:is(:hover, :focus-within) .product-image::after {
    left: 130%;
    opacity: 1;
}

/* GLOW */
.agz-grid .product-card:is(:hover, :focus-within) .product-glow {
    transform: scaleX(1.25) translateY(6px);
    opacity: 1;
}

/* MOVE PRICE UP */
.agz-grid .product-card:is(:hover, :focus-within) .price-row {
    transform: translateY(-4px);
}

/* CART BUTTON */
.agz-grid .product-card:is(:hover, :focus-within) .card-inner > .add-cart {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(34px) scale(1);
}


/* ======================================
   TOAST (wishlist / share / cart feedback)
====================================== */

.agz-toast {
    position: fixed;
    inset-inline: 0;
    bottom: 28px;
    z-index: 99999;
    width: max-content;
    max-width: calc(100% - 40px);
    margin: 0 auto;
    padding: 12px 22px;
    border-radius: 100px;
    background: #171d4d;
    box-shadow: 0 16px 40px rgba(23, 29, 77, .3);
    font-family: "Vazirmatn", sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.7;
    color: #fff;
    opacity: 0;
    pointer-events: none;
    transform: translateY(14px);
    transition: opacity .3s ease, transform .4s cubic-bezier(.2, .8, .2, 1);
}
.agz-toast.show { opacity: 1; transform: translateY(0); }


/* ======================================
   RESPONSIVE
====================================== */

@media (max-width: 1050px) {
    .agz-grid.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
    body.post-type-archive-product #primary,
    body.tax-product_cat #primary,
    body.tax-product_tag #primary { padding: 36px 20px 90px; }

    #primary main.site-main > .woocommerce-result-count { flex: 0 0 100%; margin-bottom: 14px; }
    #primary main.site-main > .woocommerce-ordering { flex: 0 0 100%; }
    #primary main.site-main > .woocommerce-ordering select { width: 100%; }

    .agz-grid.products {
        max-width: 390px;
        margin-inline: auto;
        grid-template-columns: 1fr;
        gap: 48px;
    }
}

/* Touch screens have no hover: everything stays reachable. */
@media (hover: none) {
    .agz-grid .product-card { height: auto; }
    .agz-grid .product-card .card-inner { height: auto; padding-bottom: 24px; }
    .agz-grid .product-card .product-info { height: auto; padding-bottom: 0; }

    .agz-grid .product-card .product-actions > button,
    .agz-grid .product-card .product-actions > a {
        opacity: 1;
        transform: none;
    }

    .agz-grid .product-card .card-inner > .add-cart {
        position: relative;
        inset-inline: auto;
        bottom: auto;
        margin: 18px 26px 0;
        opacity: 1;
        pointer-events: auto;
        transform: none;
    }
    .agz-grid .product-card .card-inner > .add-cart.loading { pointer-events: none; }

    .agz-grid .product-card:is(:hover, :focus-within) .card-inner { transform: none; }
    .agz-grid .product-card:is(:hover, :focus-within) .card-inner > .add-cart { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .agz-grid .product-card *,
    .agz-grid .product-card *::before,
    .agz-grid .product-card *::after,
    .agz-toast {
        transition-duration: .01ms !important;
        animation: none !important;
    }
}

/* with chips there is less room: one line of excerpt */
.agz-grid .product-card .product-info.has-chips .excerpt { -webkit-line-clamp: 1; }
