.c-product-card {
    display: block;
    text-decoration: none;
    color: inherit;
}

.c-product-card__image-link,
.c-product-card__body-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.c-product-card__body-link {
    margin-top: 12px;

    @media screen and (min-width: 1000px) {
        margin-top: 18px;
    }
}

.c-product-card__image-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 338 / 406;
    overflow: hidden;
    background-color: var(--color-sub-bg);
    border-radius: 2px;
}

.c-product-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* テーマ設定「Show secondary image on hover」ON 時のみ出力される2枚目画像。ホバーでフェード切替 */
.c-product-card__image--secondary {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

@media (any-hover: hover) {
    .c-product-card__image-wrap:hover .c-product-card__image--secondary {
        opacity: 1;
    }
}

.c-product-card__image--placeholder {
    background-color: var(--color-sub-bg);
}

.c-product-card__ranking {
    position: absolute;
    top: 8px;
    left: 12px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
    font-family: var(--en-font-family);
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.02em;
    line-height: 1;

    /* PC：22→18px（品質チェック No.5 FB反映。Lanvin と同値） */
    @media screen and (min-width: 1000px) {
        font-size: 18px;
        top: 18px;
        left: 18px;
    }
}

.c-product-card__sold {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: color-mix(in srgb, var(--color-black) 35%, transparent);
    color: var(--color-white);
    font-family: var(--en-font-family);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.1em;

    /* PC：20→16px（品質チェック No.3 FB反映） */
    @media screen and (min-width: 1000px) {
        font-size: 16px;
    }
}

.c-product-card__title {
    margin: 0;
    font-family: var(--base-font-family);
    font-size: 14px;
    font-weight: 300;
    line-height: 1.4;
    letter-spacing: 0.02em;
    color: var(--color-text);
    font-feature-settings: "palt";

    @media screen and (min-width: 1000px) {
        margin-top: 18px;
        font-size: 16px;
    }
}

.c-product-card__price {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 6px;
    margin: 10px 0 0;
    font-family: var(--en-font-family);
    font-size: 15px;
    font-weight: 300;
    line-height: 1;
    letter-spacing: 0;
    color: var(--color-text);
    font-feature-settings: "palt", "pwid";

    @media screen and (min-width: 1000px) {
        font-size: 17px;
        margin-top: 11px;
    }
}

.c-product-card__price-sale {
    font-weight: 500;
    color: var(--color-sale);
}

.c-product-card__price-compare {
    font-size: 12px;
    font-weight: 300;
    text-decoration: line-through;
    color: var(--color-text);
}

.c-product-card__wishlist {
    position: absolute;
    right: 5px;
    bottom: 5px;
    z-index: 2;

    @media screen and (min-width: 1000px) {
        right: 10px;
        bottom: 10px;
    }
}

wishlist-button-collection.c-product-card__wishlist .wk-button,
wishlist-button-collection.c-product-card__wishlist .wk-button:hover,
wishlist-button-collection.c-product-card__wishlist .wk-button.wk-selected,
wishlist-button-collection.c-product-card__wishlist .wk-button.wk-selected:hover {
    --button-background: 255, 255, 255;
    --button-border-radius: 0;
    --button-border: 1px solid var(--color-border);

    background: var(--color-white);
    border: none;
    border-radius: 2px;
    width: 29px;
    height: 29px;
    min-width: 0;
    min-height: 0;
    padding: 0;
    color: var(--color-text);

    @media screen and (min-width: 1000px) {
        width: 45px;
        height: 45px;
    }
}

/* WK の登録時スケール演出を無効化 */
.c-product-card__wishlist .wk-button,
.c-product-card__wishlist .wk-button *,
.c-product-card__wishlist .wk-button::before,
.c-product-card__wishlist .wk-button::after,
.c-product-card__wishlist wk-icon.wk-icon::after {
    animation: none !important;
}

/* WK デフォルトの円形疑似要素（通常・ホバー・選択すべて）を無効化 */
.c-product-card__wishlist .wk-button::before,
.c-product-card__wishlist .wk-button:hover::before,
.c-product-card__wishlist .wk-button.wk-selected::before,
.c-product-card__wishlist .wk-button::after,
.c-product-card__wishlist .wk-button:hover::after,
.c-product-card__wishlist .wk-button.wk-selected::after {
    content: none !important;
}

wishlist-button-collection .wk-floating {
    z-index: 1 !important;
}

@media (any-hover: hover) {
    .c-product-card__wishlist .wk-button:hover,
    .c-product-card__wishlist .wk-button.wk-selected:hover {
        background: var(--color-white);
        opacity: 1;
    }
}

.c-product-card__wishlist wk-icon.wk-icon svg,
.zeta-card__media + wishlist-button-collection wk-icon.wk-icon svg {
    display: none;
}

.c-product-card__wishlist wk-icon.wk-icon,
.zeta-card__media + wishlist-button-collection wk-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 12px;
    flex-shrink: 0;
    color: inherit;

    @media screen and (min-width: 1000px) {
        width: 18px;
        height: 15px;
    }
}

.c-product-card__wishlist wk-icon.wk-icon::after,
.zeta-card__media + wishlist-button-collection wk-icon.wk-icon::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: currentColor;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 15'%3E%3Cpath fill='white' stroke='white' stroke-width='0.6' d='M8.68815 14.1158C8.60565 14.1158 8.52283 14.0852 8.45974 14.0238L1.53032 7.29543C-0.109988 5.69728 -0.109988 3.09768 1.53 1.49984C2.32427 0.725979 3.38028 0.299805 4.50391 0.299805C5.62754 0.299805 6.68355 0.725979 7.47782 1.49984L8.68815 2.67907L9.89849 1.49984C10.6931 0.725979 11.7491 0.299805 12.8727 0.299805C13.9963 0.299805 15.0524 0.725979 15.8466 1.49984C17.4866 3.09768 17.4866 5.69728 15.8466 7.29512L8.91657 14.0238C8.85348 14.0852 8.77098 14.1158 8.68815 14.1158ZM4.50391 0.93024C3.55337 0.93024 2.65945 1.29085 1.98747 1.94556C0.599842 3.29753 0.599842 5.49743 1.98747 6.8494L8.68848 13.3555L15.3898 6.84909C16.7771 5.49743 16.7771 3.29784 15.3895 1.94587C14.7172 1.29116 13.8236 0.930556 12.873 0.930556C11.9225 0.930556 11.0286 1.29116 10.3563 1.94587L8.91721 3.34796C8.79071 3.47121 8.58624 3.47121 8.45974 3.34796L7.02067 1.94587C6.34837 1.29116 5.45477 0.930556 4.50423 0.930556L4.50391 0.93024Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.c-product-card__wishlist .wk-button.wk-selected wk-icon.wk-icon::after,
.zeta-card__media + wishlist-button-collection  .wk-button.wk-selected wk-icon.wk-icon::after {
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 15'%3E%3Cpath fill='white' stroke='white' stroke-width='0.6' d='M8.68815 14.1158C8.60565 14.1158 8.52283 14.0852 8.45974 14.0238L1.53032 7.29543C-0.109988 5.69728 -0.109988 3.09768 1.53 1.49984C2.32427 0.725979 3.38028 0.299805 4.50391 0.299805C5.62754 0.299805 6.68355 0.725979 7.47782 1.49984L8.68815 2.67907L9.89849 1.49984C10.6931 0.725979 11.7491 0.299805 12.8727 0.299805C13.9963 0.299805 15.0524 0.725979 15.8466 1.49984C17.4866 3.09768 17.4866 5.69728 15.8466 7.29512L8.91657 14.0238C8.85348 14.0852 8.77098 14.1158 8.68815 14.1158Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.label {
    font-family: var(--en-font-family);
    font-weight: 500;
    letter-spacing: 0.1em;
}