/* Product Card - dealer.international
   Depends on: components.css */

.dealer-product-card {
    --product-card-media-bg: #E7E7E7;
    --product-card-media-radius: 10px;
    --product-card-media-aspect: 2 / 3;
    --product-card-image-fit: cover;
    --product-card-image-position: center;
    --product-card-media-to-body: 10px;
    --product-card-body-gap: 4px;
    --product-card-brand-size: 14px;
    --product-card-brand-line-height: 1.2;
    --product-card-price-size: 12px;
    --product-card-price-line-height: 1.2;
    --product-card-sale-price-gap: 12px;
    --product-card-badge-top: 11px;
    --product-card-badge-left: 12px;
    --product-card-badge-gap: 5px;
    --product-card-badge-height: 20px;
    --product-card-badge-padding-x: 6px;
    --product-card-badge-radius: 4px;
    --product-card-badge-size: 12px;
    --product-card-wishlist-touch: 20px;
    --product-card-wishlist-icon: 20px;
    --product-card-wishlist-top: 10px;
    --product-card-wishlist-right: 12px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    color: var(--color-black);
    font-family: var(--font-family);
}

.dealer-product-card a,
.dealer-product-card a:hover,
.dealer-product-card a:focus {
    color: inherit;
    text-decoration: none;
}

.dealer-product-card__media {
    position: relative;
}

.dealer-product-card__media-link {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: var(--product-card-media-aspect);
    border-radius: var(--product-card-media-radius);
    background: var(--product-card-media-bg);
    color: inherit;
}

.dealer-product-card__badges {
    position: absolute;
    z-index: 3;
    top: var(--product-card-badge-top);
    left: var(--product-card-badge-left);
    display: flex;
    align-items: center;
    gap: var(--product-card-badge-gap);
    max-width: calc(100% - (var(--product-card-badge-left) * 2));
    pointer-events: none;
}

.dealer-product-card__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--product-card-badge-height);
    padding: 0 var(--product-card-badge-padding-x);
    border-radius: var(--product-card-badge-radius);
    font-size: var(--product-card-badge-size);
    font-weight: var(--font-weight-medium);
    line-height: 1;
    white-space: nowrap;
}

.dealer-product-card__badge--new {
    background: var(--color-black);
    color: var(--color-white);
}

.dealer-product-card__badge--sale {
    background: var(--color-sale);
    color: var(--color-black);
}

.dealer-product-card__image-wrap {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dealer-product-card .dealer-product-card__image-wrap .dealer-product-card__image {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: 0;
    object-fit: var(--product-card-image-fit);
    object-position: var(--product-card-image-position);
}

.dealer-product-card .dealer-product-card__wishlist {
    position: absolute;
    z-index: 4;
    top: var(--product-card-wishlist-top);
    right: var(--product-card-wishlist-right);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--product-card-wishlist-touch);
    height: var(--product-card-wishlist-touch);
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--color-black);
    text-shadow: none;
}

.dealer-product-card__wishlist.is-active {
    color: var(--color-black);
}

.dealer-product-card__wishlist.is-active .dealer-product-card__wishlist-icon path {
    fill: currentColor;
}

.dealer-product-card .dealer-product-card__wishlist:hover,
.dealer-product-card .dealer-product-card__wishlist:active {
    background: transparent;
    color: var(--color-black);
    transform: none;
}

.dealer-product-card__wishlist-icon {
    display: block;
    width: var(--product-card-wishlist-icon);
    height: var(--product-card-wishlist-icon);
}

.dealer-product-card__body-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--product-card-body-gap);
    margin-top: var(--product-card-media-to-body);
    color: var(--color-black);
}

.dealer-product-card__brand {
    display: -webkit-box;
    overflow: hidden;
    min-height: 1.28em;
    color: var(--color-black);
    font-size: var(--product-card-brand-size);
    font-weight: var(--font-weight-medium);
    line-height: var(--product-card-brand-line-height);
    text-align: center;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.dealer-product-card__price {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: var(--product-card-sale-price-gap);
    min-height: 1.25em;
    color: var(--color-primary);
    font-size: var(--product-card-price-size);
    font-weight: var(--font-weight-medium);
    line-height: var(--product-card-price-line-height);
    text-align: center;
}

.dealer-product-card__price-current,
.dealer-product-card__price-regular {
    display: inline-flex;
    align-items: baseline;
}

.dealer-product-card__price-current {
    color: var(--color-primary);
}

.dealer-product-card__price--sale .dealer-product-card__price-current {
    color: var(--color-error);
}

.dealer-product-card__price-regular {
    color: var(--color-primary);
    text-decoration-line: line-through;
    text-decoration-thickness: 1px;
    text-decoration-color: currentColor;
    opacity: 0.9;
}

body.dealer-focus-modality-ready.dealer-using-keyboard .dealer-product-card__media-link:focus,
body.dealer-focus-modality-ready.dealer-using-keyboard .dealer-product-card__body-link:focus,
body.dealer-focus-modality-ready.dealer-using-keyboard .dealer-product-card__wishlist:focus {
    outline: var(--focus-outline-width) solid var(--color-primary);
    outline-offset: var(--focus-outline-offset);
}

.dealer-product-card__media-link:focus-visible,
.dealer-product-card__body-link:focus-visible,
.dealer-product-card__wishlist:focus-visible {
    outline: var(--focus-outline-width) solid var(--color-primary);
    outline-offset: var(--focus-outline-offset);
}

@media (min-width: 768px) {
    .dealer-product-card {
        --product-card-media-radius: 10px;
        --product-card-media-to-body: 12px;
        --product-card-body-gap: 5px;
        --product-card-brand-size: 15px;
        --product-card-price-size: 14px;
        --product-card-sale-price-gap: 14px;
        --product-card-badge-top: 10px;
        --product-card-badge-left: 10px;
        --product-card-badge-height: 24px;
        --product-card-badge-padding-x: 8px;
        --product-card-badge-size: 12px;
        --product-card-wishlist-touch: 20px;
        --product-card-wishlist-icon: 20px;
        --product-card-wishlist-top: 10px;
        --product-card-wishlist-right: 10px;
    }
}

@media (min-width: 1024px) {
    .dealer-product-card {
        --product-card-media-radius: 10px;
        --product-card-brand-size: 16px;
        --product-card-price-size: 14px;
        --product-card-badge-height: 22px;
        --product-card-badge-padding-x: 8px;
        --product-card-badge-size: 12px;
        --product-card-wishlist-touch: 32px;
        --product-card-wishlist-top: 6px;
        --product-card-wishlist-right: 6px;
    }

    .dealer-product-card .dealer-product-card__wishlist:hover {
        background: rgba(255, 255, 255, 0.72);
        border-radius: 50%;
    }
}