/* ==========================================
   GLOBAL PRODUCT CARD
========================================== */
.product-card {
    display: flex;
    min-width: 0;
    height: 100%;
    flex-direction: column;
    padding: 0;
    text-align: center;
}

.product-card__image-wrapper {
    position: relative;
    display: flex;
    width: 100%;
    aspect-ratio: 3 / 4;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: #fbf7f2;
}

.product-card__image-link {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    padding: 28px;
}

.product-card__image {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0 !important;
    object-fit: contain;
    transition: transform 0.3s ease;
}

.product-card:hover .product-card__image {
    transform: scale(1.04);
}

/* ==========================================
   DISCOUNT
========================================== */
.product-card__discount {
    position: absolute;
    z-index: 3;
    top: 12px;
    left: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #275e43;
    padding: 6px 8px;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 19.6px;
}

/* ==========================================
   ACTIONS
========================================== */
.product-card__actions {
    position: absolute;
    z-index: 4;
    right: 12px;
    bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.product-card__action,
.product-card__action.button {
    display: flex !important;
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    border: 0 !important;
    background: #fff !important;
    padding: 0 !important;
    color: #36485c !important;
    font-size: 17px !important;
    line-height: 1 !important;
    text-decoration: none;
    transform: none !important;
    transition: 0.3s ease-in-out !important;

    clip-path: polygon(0% 58%, 0.1% 60.7%, 0.2% 63.3%, 0.5% 65.9%, 1% 68.3%, 1.5% 70.7%, 2.2% 73%, 2.9% 75.2%, 3.8% 77.2%, 4.7% 79.2%, 5.8% 81.2%, 7% 83%, 8.3% 84.7%, 9.6% 86.4%, 11.1% 87.9%, 12.6% 89.4%, 14.3% 90.7%, 16% 92%, 17.8% 93.2%, 19.7% 94.3%, 21.7% 95.2%, 23.7% 96.1%, 25.8% 97%, 28% 97.7%, 30.3% 98.3%, 32.6% 98.8%, 35% 99.2%, 37.5% 99.6%, 40% 99.8%, 42.6% 100%, 45.2% 100%, 47.9% 99.9%, 50.5% 99.6%, 53.2% 99.2%, 55.8% 98.6%, 58.5% 97.8%, 61.1% 96.9%, 63.7% 95.9%, 66.2% 94.7%, 68.7% 93.3%, 71.2% 91.9%, 73.6% 90.3%, 76% 88.6%, 78.2% 86.8%, 80.4% 84.9%, 82.6% 82.9%, 84.6% 80.8%, 86.5% 78.6%, 88.4% 76.3%, 90.1% 73.9%, 91.7% 71.5%, 93.2% 69.1%, 94.5% 66.5%, 95.8% 63.9%,  96.8% 61.3%, 97.8% 58.7%, 98.6% 56%, 99.2% 53.3%, 99.6% 50.5%, 99.9% 47.8%, 100% 45%, 99.9% 42.3%, 99.6% 39.6%, 99.2% 37%, 98.6% 34.5%, 97.8% 32.1%, 96.8% 29.7%, 95.8% 27.4%, 94.5% 25.2%, 93.2% 23.1%, 91.7% 21.1%, 90.1% 19.1%, 88.4% 17.2%, 86.5% 15.4%, 84.6% 13.8%, 82.6% 12.1%, 80.4% 10.6%, 78.2% 9.2%, 76% 7.9%, 73.6% 6.7%, 71.2% 5.5%, 68.7% 4.5%, 66.2% 3.6%, 63.7% 2.7%, 61.1% 2%, 58.5% 1.4%, 55.8% 0.9%, 53.2% 0.5%, 50.5% 0.2%, 47.9% 0.1%, 45.2% 0%, 42.6% 0.1%, 40% 0.4%, 37.5% 0.9%, 35% 1.5%, 32.6% 2.4%, 30.3% 3.4%, 28% 4.5%, 25.8% 5.9%, 23.7% 7.3%, 21.7% 8.9%, 19.7% 10.6%, 17.8% 12.5%, 16% 14.4%, 14.3% 16.5%, 12.6% 18.6%, 11.1% 20.9%, 9.6% 23.2%, 8.3% 25.7%, 7% 28.1%, 5.8% 30.7%, 4.7% 33.3%, 3.8% 35.9%, 2.9% 38.6%, 2.2% 41.4%, 1.5% 44.1%, 1% 46.9%, 0.5% 49.7%, 0.2% 52.5%, 0.1% 55.2%);
}

.product-card__info-button {
    cursor: pointer;
}

.product-card__action img {
    display: block;
    max-width: 24px;
    max-height: 24px;
    margin: 0 !important;
    transition: filter 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
}

.product-card__action:hover,
.product-card__action.button:hover {
    background: #5e7d33 !important;
}

.product-card__action:hover img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(2%) hue-rotate(13deg) brightness(104%) contrast(101%);
}

.product-card__action.loading {
    opacity: 0.6;
    pointer-events: none;
}

/*
 * Ugasiti WooCommerce spinner / check glyph
 * koji se crta preko ::before / ::after.
 */
.product-card__cart.loading::before,
.product-card__cart.loading::after,
.product-card__cart.added::before,
.product-card__cart.added::after,
.product-card__cart.is-added::before,
.product-card__cart.is-added::after {
    content: none !important;
    display: none !important;
    animation: none !important;
}

.product-card .added_to_cart {
    display: none !important;
}

.product-card__cart-icons {
    position: relative;
    display: block;
    width: 20px;
    height: 20px;
}

.product-card__cart-icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    max-width: 20px !important;
    max-height: 20px !important;
}

.product-card__cart-icon--bag {
    opacity: 1;
    transform: scale(1);
}

.product-card__cart-icon--check {
    opacity: 0;
    transform: scale(0.85);
}

.product-card__cart.added,
.product-card__cart.is-added,
.product-card__cart.added:hover,
.product-card__cart.is-added:hover {
    background: #88b04b !important;
}

.product-card__cart.added .product-card__cart-icon--bag,
.product-card__cart.is-added .product-card__cart-icon--bag {
    opacity: 0;
    transform: scale(0.85);
}

.product-card__cart.added .product-card__cart-icon--check,
.product-card__cart.is-added .product-card__cart-icon--check {
    opacity: 1;
    transform: scale(1);
}

.product-card__cart.added img,
.product-card__cart.is-added img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(2%) hue-rotate(13deg) brightness(104%) contrast(101%);
}

@media (prefers-reduced-motion: reduce) {
    .product-card__cart-icon {
        transition: none;
    }

    .product-card:hover .product-card__image {
        transform: none;
    }
}

/* ==========================================
   CONTENT
========================================== */
.product-card__content {
    padding: 18px 8px 0;
}

.product-card__category {
    margin-bottom: 4px;
    color: #275e43;
    font-size: 12px;
    font-weight: 700;
    line-height: 16.8px;
}

.product-card__category a {
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    text-decoration: none;
}

.product-card__title {
    margin: 0 0 8px !important;
    padding: 0 !important;
    color: #36485c;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 25.2px !important;
}

.product-card__title a {
    color: inherit !important;
    text-decoration: none;
    transition: color 0.3s ease-in-out;
}

.product-card__title a:hover {
    color: #275e43 !important;
}

.product-card__price {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #36485c;
    font-size: 16px;
    font-weight: 600;
    line-height: 22.4px;
}

.product-card__price .amount {
    color: inherit !important;
    font-size: inherit !important;
    font-weight: 400 !important;
}

.product-card__price del {
    margin: 0;
    color: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 19.6px;
    opacity: 0.6;
}

.product-card__price ins {
    margin: 0;
    background: transparent;
    color: inherit;
    font-weight: 600;
    text-decoration: none;
}

/* ==========================================
   INFO POPUP
========================================== */
.product-card__info-popup {
    position: absolute;
    z-index: 10;
    right: 68px;
    bottom: 68px;
    width: 225px;
    border-radius: 12px;
    background: #fff;
    padding: 20px;
    color: #36485c;
    text-align: left;
    box-shadow: 0 12px 35px rgba(54, 72, 92, 0.18);
}

.product-card__info-popup[hidden] {
    display: none;
}

.product-card__info-popup::after {
    position: absolute;
    right: -8px;
    bottom: 18px;
    width: 16px;
    height: 16px;
    background: #fff;
    content: "";
    transform: rotate(45deg);
}

.product-card__info-popup-text {
    color: #36485c;
    font-size: 14px;
    font-weight: 400;
    line-height: 19.6px;
}

.product-card__info-close {
    position: absolute;
    z-index: 2;
    top: 8px;
    right: 8px;
    display: flex;
    width: 28px;
    min-width: 28px;
    height: 28px;
    min-height: 28px;
    align-items: center;
    justify-content: center;
    margin: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    padding: 0;
    color: #36485c;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    transition:
        background-color 0.2s ease,
        color 0.2s ease;
}

.product-card__info-close:hover {
    background: #f2f4f1;
    color: #275e43;
}

/* ==========================================
   WOOCOMMERCE ARCHIVE RESET
========================================== */
.woocommerce ul.products li.product.product-card-item {
    margin-bottom: 40px;
    text-align: initial;
}

.woocommerce ul.products li.product.product-card-item .product-card {
    width: 100%;
}

.woocommerce ul.products li.product.product-card-item a img {
    margin: 0 !important;
}

/* ==========================================
   SHOP / CATEGORY PRODUCT CARD
========================================== */
.woocommerce ul.products li.product.product-card-item .product-card .product-card__cart:not(.added):not(.is-added) {
    background: #fff !important;
}

.woocommerce ul.products li.product.product-card-item .product-card .product-card__cart:not(.added):not(.is-added):hover {
    background: #88b04b !important;
}

.woocommerce ul.products li.product.product-card-item .product-card .product-card__cart.added,
.woocommerce ul.products li.product.product-card-item .product-card .product-card__cart.is-added,
.woocommerce ul.products li.product.product-card-item .product-card .product-card__cart.added:hover,
.woocommerce ul.products li.product.product-card-item .product-card .product-card__cart.is-added:hover {
    background: #88b04b !important;
}

.woocommerce ul.products li.product.product-card-item .product-card .product-card__cart img {
    width: 20px;
    height: 20px;
}



.woocommerce ul.products li.product.product-card-item .product-card .product-card__title {
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 25.2px !important;
}

/* ==========================================
   RESPONSIVE
========================================== */
@media only screen and (max-width: 767px) {
    .custom-featured-products-section__products .flickity-viewport,
    .custom-related-products__slider .flickity-viewport {
        overflow: visible;
    }

    .product-card__image-link {
        padding: 16px;
    }

    .product-card__action,
    .product-card__action.button {
        width: 46px !important;
        min-width: 46px !important;
        height: 46px !important;
        min-height: 46px !important;
    }

    .product-card__content {
        padding: 18px 4px 0;
    }

    .product-card__title {
        font-size: 16px !important;
        line-height: 1.2 !important;
    }

    .product-card__price {
        font-size: 14px;
        font-weight: 400;
        line-height: 1.4;
        flex-direction: column-reverse;
        gap: 0;
    }

    .product-card__price del {
        font-size: 12px;
        font-weight: 400;
        line-height: 16.8px;
    }

    .product-card__info-popup {
        right: 8px;
        bottom: 68px;
        left: 8px;
        width: auto;
        max-width: 285px;
        padding: 16px 32px 16px 16px;
    }

    .product-card__info-popup::after {
        right: 20px;
    }

    .product-card__info-close {
        top: 4px;
        right: 4px;
    }

    .product-card__info-popup-text {
        font-size: 12px;
    }
}