.zdpc-widget {
    --zdpc-gap: 15px;
    --zdpc-basis-desktop: calc(25% - 11.25px);
    --zdpc-basis-tablet: calc(50% - 7.5px);
    --zdpc-basis-mobile: calc(86.956522% - 1.956522px);
    --zdpc-basis: var(--zdpc-basis-desktop);
    --zdpc-grid-desktop: 4;
    --zdpc-grid-tablet: 2;
    --zdpc-grid-mobile: 1;
    --zdpc-grid-cols: var(--zdpc-grid-desktop);
    width: 100%;
}

.zdpc-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.zdpc-section-title {
    min-width: 0;
    margin: 0;
    color: #063e38;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.2;
}

.zdpc-section-link {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 9px 16px;
    border: 1px solid #d7d7d3;
    border-radius: 999px;
    background: #fff;
    color: #063e38;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none !important;
    white-space: nowrap;
    transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}

.zdpc-section-link:hover,
.zdpc-section-link:focus-visible {
    text-decoration: none !important;
}

.zdpc-viewport {
    width: 100%;
}

.zdpc-widget--carousel .zdpc-viewport {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    touch-action: manipulation;
}

.zdpc-widget--carousel .zdpc-viewport::-webkit-scrollbar {
    display: none;
}

.zdpc-list {
    list-style: none;
    padding: 0;
    margin: 0;
    gap: var(--zdpc-gap);
    align-items: stretch;
}

.zdpc-widget--carousel .zdpc-list {
    display: flex;
}

.zdpc-widget--grid .zdpc-list {
    display: grid;
    grid-template-columns: repeat(var(--zdpc-grid-cols), minmax(0, 1fr));
}

.zdpc-item {
    min-width: 0;
}

.zdpc-widget--carousel .zdpc-item {
    flex: 0 0 var(--zdpc-basis);
    scroll-snap-align: start;
}

.zdpc-card {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    isolation: isolate;
    background: #fff;
    border: 1px solid #d9d9d6;
    border-radius: 16px;
}

.zdpc-card[data-zdpc-url] {
    cursor: pointer;
}

.zdpc-media {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #f1f1ef;
}

.zdpc-figure {
    width: 100%;
    height: 100%;
    margin: 0;
}

.zdpc-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.zdpc-image--primary,
.zdpc-image--hover {
    transition: opacity .28s ease;
}

.zdpc-image--hover {
    position: absolute;
    inset: 0;
    opacity: 0;
}

@media (hover: hover) and (pointer: fine) {
    .zdpc-card--hover-ready:hover .zdpc-image--hover {
        opacity: 1;
    }

    .zdpc-card--hover-ready:hover .zdpc-image--primary {
        opacity: 0;
    }
}

.zdpc-card--hover-ready:focus-within .zdpc-image--hover { opacity: 1; }
.zdpc-card--hover-ready:focus-within .zdpc-image--primary { opacity: 0; }

.zdpc-badges {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
    max-width: calc(100% - 72px);
    pointer-events: none;
}

.zdpc-badge-slot:empty,
.zdpc-brand:empty,
.zdpc-stock-status:empty,
.zdpc-you-save:empty {
    display: none;
}

.zdpc-wishlist {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 5;
    width: 40px;
    height: 40px;
    pointer-events: auto;
}

.zdpc-content {
    position: relative;
    z-index: 3;
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 190px;
    padding: 14px 16px 16px;
    background: inherit;
    pointer-events: none;
}

.zdpc-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
    margin: 0 0 9px;
}

.zdpc-brand {
    min-width: 0;
    margin: 0;
    color: #0a6070;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
}

.zdpc-stock-status {
    flex: 0 0 auto;
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    color: #d83a2e;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    text-align: right;
    white-space: nowrap;
}

.zdpc-stock-status::before {
    content: "";
    flex: 0 0 auto;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.zdpc-title {
    margin: 0;
    color: #063e38;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.28;
}

.zdpc-title a {
    position: relative;
    z-index: 4;
    color: inherit;
    border-bottom: 0 !important;
    box-shadow: none !important;
    text-decoration: none !important;
    pointer-events: auto;
}

.zdpc-title a:hover,
.zdpc-title a:focus,
.zdpc-title a:focus-visible,
.zdpc-title a:active,
.zdpc-title a:visited {
    color: inherit;
    border-bottom: 0 !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

.zdpc-brand a,
.zdpc-you-save a {
    position: relative;
    z-index: 4;
    pointer-events: auto;
}

.zdpc-footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 24px;
}

.zdpc-price {
    min-width: 0;
    color: #002e1a;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

.zdpc-price .price {
    margin: 0;
}

/* Keep WooCommerce/theme single-product price rules from changing card layout.
 * Sale prices and the save amount must render identically in archive and
 * single-product carousels. */
.zdpc-widget .zdpc-price {
    display: inline-flex;
    align-items: baseline;
    gap: 7px;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.zdpc-widget .zdpc-price del,
.zdpc-widget .zdpc-price ins {
    display: inline-flex !important;
    align-items: baseline;
    margin: 0 !important;
    padding: 0 !important;
    line-height: inherit !important;
}

.zdpc-widget .zdpc-price del {
    opacity: 1;
    color: #4b94a0 !important;
    font-size: .82em;
    font-weight: 500;
}

.zdpc-widget .zdpc-price ins {
    font-size: 1em;
    font-weight: 700;
    text-decoration: none !important;
}

.zdpc-widget .zdpc-price del .woocommerce-Price-amount,
.zdpc-widget .zdpc-price ins .woocommerce-Price-amount,
.zdpc-widget .zdpc-price .amount {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    font: inherit !important;
    line-height: inherit !important;
    white-space: nowrap;
}

.zdpc-you-save {
    color: #16933a;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.35;
    text-align: right;
}

.zdpc-widget .zdpc-you-save {
    display: inline-flex;
    align-items: baseline;
    gap: 3px;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.zdpc-widget .zdpc-you-save .woocommerce-Price-amount,
.zdpc-widget .zdpc-you-save .amount {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    font: inherit !important;
    line-height: inherit !important;
    white-space: nowrap;
}

.zdpc-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 18px;
}

.zdpc-arrow {
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    padding: 0;
    border: 1px solid #d4d4d4;
    border-radius: 999px;
    background: #fff;
    color: #143f3b;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

.zdpc-arrow[disabled] {
    opacity: .38;
    cursor: default;
}

.zdpc-widget.zdpc-no-overflow .zdpc-nav {
    display: none;
}

.zdpc-dots {
    display: flex;
    align-items: center;
    gap: 7px;
}

.zdpc-dots[hidden] {
    display: none !important;
}

.zdpc-dot {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #c8cecc;
    cursor: pointer;
}

.zdpc-dot[aria-current="true"] {
    background: #184f49;
    transform: scale(1.2);
}

.zdpc-empty,
.zdpc-editor-warning {
    border-radius: 10px;
    font-size: 12px;
    line-height: 1.45;
}

.zdpc-empty {
    padding: 18px;
    border: 1px dashed #ccc;
}

.zdpc-editor-warning {
    margin: 0 0 12px;
    padding: 10px 12px;
    border: 1px solid #e5b955;
    background: #fff8e5;
    color: #57451d;
}

/* Existing shortcode presentation. The shortcode behaviour remains in the
   existing site code; only its placement/presentation is scoped here. */
.zdpc-widget .elementor-shortcode,
.zdpc-widget .elementor-shortcode > * {
    margin-top: 0;
    margin-bottom: 0;
}

.zdpc-widget .zd-fire-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
}

.zdpc-widget .zd-fire-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 28px;
    padding: 5px 9px;
    border: 1px solid #efc77f;
    border-radius: 999px;
    background: #fff1dc;
    color: #b66b0f;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

/* Distinct fire-rating colours. FD30 remains orange; FD60 is blue. */
.zdpc-widget .zd-fire-badge--fd30 {
    border-color: #efc77f;
    background: #fff1dc;
    color: #b66b0f;
}

.zdpc-widget .zd-fire-badge--fd60 {
    border-color: #8bb8e8;
    background: #e8f2ff;
    color: #2367a3;
}

.zdpc-widget .zd-fire-badge__icon {
    display: inline-flex;
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
}

.zdpc-widget .zd-fire-badge__icon svg {
    display: block;
    width: 100%;
    height: 100%;
    fill: currentColor;
}

.zdpc-widget .zdpc-badge-slot--discount > * {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    margin: 0;
    padding: 5px 10px;
    border-radius: 999px;
    background: #fbe3e8;
    color: #9b3340;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.zdpc-widget .zdpc-stock-status > *,
.zdpc-widget .zdpc-stock-status [class*="out-of-stock"],
.zdpc-widget .zdpc-stock-status [class*="out_of_stock"] {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: inherit !important;
    font: inherit !important;
    line-height: inherit !important;
    text-decoration: none !important;
}

/* Wishlist shortcode: preserve its state/logic, normalise only the button. */
.zdpc-widget .zdpc-wishlist .fbw-wishlist-button,
.zdpc-widget .zdpc-wishlist [data-fbw-wishlist] {
    -webkit-appearance: none !important;
    appearance: none !important;
    display: inline-grid !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    place-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(45, 55, 53, .28) !important;
    border-radius: 50% !important;
    outline: 0 !important;
    background: rgba(255, 255, 255, .94) !important;
    color: #253b38 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .05) !important;
    font-size: 0 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    overflow: hidden;
}

.zdpc-widget .zdpc-wishlist .fbw-wishlist-button:hover,
.zdpc-widget .zdpc-wishlist .fbw-wishlist-button:focus-visible {
    background: #fff !important;
    border-color: rgba(32, 42, 40, .42) !important;
    color: #162a27 !important;
}

.zdpc-widget .zdpc-wishlist [hidden],
.zdpc-widget .zdpc-wishlist .fbw-wishlist-button__icon-shape[hidden] {
    display: none !important;
}

.zdpc-widget .zdpc-wishlist .fbw-wishlist-button__icon,
.zdpc-widget .zdpc-wishlist .fbw-wishlist-button__icon-shape:not([hidden]) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
}

.zdpc-widget .zdpc-wishlist svg {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.55 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.zdpc-widget .zdpc-wishlist svg path {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.55 !important;
}

.zdpc-widget .zdpc-wishlist .fbw-wishlist-button[aria-pressed="true"] {
    color: #b12f46 !important;
}

.zdpc-widget .zdpc-wishlist .fbw-wishlist-button[aria-pressed="true"] .fbw-wishlist-button__icon-shape--heart svg,
.zdpc-widget .zdpc-wishlist .fbw-wishlist-button[aria-pressed="true"] .fbw-wishlist-button__icon-shape--heart svg path {
    fill: currentColor !important;
    stroke: currentColor !important;
}

.zdpc-widget .zd-product-brand,
.zdpc-widget .zdpc-brand > * {
    color: inherit;
    font: inherit;
    line-height: inherit;
    text-decoration: none;
}

.zdpc-widget .zdpc-you-save,
.zdpc-widget .zdpc-you-save > * {
    color: #16933a;
    font-size: inherit;
    font-weight: 500;
    line-height: inherit;
    margin: 0;
}

/* Device responsiveness follows viewport breakpoints, not the width of the
 * Elementor widget wrapper. This prevents a full-width desktop grid from being
 * incorrectly classified as tablet merely because the content container is <=1024px. */
@media (min-width: 768px) and (max-width: 1024px) {
    .zdpc-widget--carousel { --zdpc-basis: var(--zdpc-basis-tablet); }
    .zdpc-widget--grid { --zdpc-grid-cols: var(--zdpc-grid-tablet); }
}

@media (max-width: 767px) {
    .zdpc-widget .zdpc-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
    .zdpc-widget .zdpc-footer > .zdpc-price,
    .zdpc-widget .zdpc-footer > .zdpc-you-save {
        flex: 0 0 auto;
        min-width: 0;
        max-width: 100%;
        white-space: normal;
        flex-wrap: wrap;
        text-align: left;
    }
    .zdpc-widget .zdpc-footer > .zdpc-you-save { position: static; }
    .zdpc-widget .zdpc-footer.zdpc-align-center { align-items: center; }
    .zdpc-widget .zdpc-footer.zdpc-align-right { align-items: flex-end; }

    .zdpc-widget--carousel { --zdpc-basis: var(--zdpc-basis-mobile); }
    .zdpc-widget--grid { --zdpc-grid-cols: var(--zdpc-grid-mobile); }

    .zdpc-content {
        min-height: 176px;
        padding: 13px 14px 14px;
    }

    .zdpc-title { font-size: 15px; }
    .zdpc-brand,
    .zdpc-stock-status,
    .zdpc-price,
    .zdpc-you-save { font-size: 12.5px; }

    .zdpc-badges {
        top: 10px;
        left: 10px;
        gap: 6px;
    }

    .zdpc-wishlist {
        top: 10px;
        right: 10px;
        width: 38px;
        height: 38px;
    }

    .zdpc-widget .zdpc-wishlist .fbw-wishlist-button,
    .zdpc-widget .zdpc-wishlist [data-fbw-wishlist] {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        min-height: 38px !important;
    }

    .zdpc-widget .zd-fire-badge,
    .zdpc-widget .zdpc-badge-slot--discount > * {
        min-height: 26px;
        padding: 5px 8px;
        font-size: 11px;
    }
}

@media (max-width: 640px) {
    .zdpc-section-header {
        gap: 12px;
        margin-bottom: 16px;
    }

    .zdpc-section-title { font-size: 20px; }

    .zdpc-section-link {
        min-height: 36px;
        padding: 8px 12px;
        font-size: 13px;
    }
}

@media (max-width: 390px) {
    .zdpc-section-header { gap: 8px; }
    .zdpc-section-title { font-size: 18px; }
    .zdpc-section-link {
        min-height: 34px;
        padding: 7px 10px;
        font-size: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .zdpc-widget--carousel .zdpc-viewport {
        scroll-behavior: auto;
    }

    .zdpc-image--primary,
    .zdpc-image--hover,
    .zdpc-section-link {
        transition: none;
    }
}

/* v1.5 compact native fire badge. The legacy shortcode keeps its original
   inline-SVG markup elsewhere on the site; the widget uses this zero-DOM icon. */
.zdpc-widget .zd-fire-badge--compact::before {
    content: "";
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 2.5c.3 2.3-.5 3.8-1.8 5.2-1.3 1.4-2.8 2.7-2.8 5 0 2 1.4 3.8 3.1 3.8 1.8 0 3.2-1.3 3.2-3.3 0-1.4-.5-2.6-1.4-3.7 2.8 1 4.8 3.7 4.8 6.8 0 4-3 6.7-6.9 6.7-3.8 0-6.9-2.8-6.9-6.8 0-2.8 1.2-4.7 3-6.5 1.7-1.8 3.9-3.4 5.7-7.2z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 2.5c.3 2.3-.5 3.8-1.8 5.2-1.3 1.4-2.8 2.7-2.8 5 0 2 1.4 3.8 3.1 3.8 1.8 0 3.2-1.3 3.2-3.3 0-1.4-.5-2.6-1.4-3.7 2.8 1 4.8 3.7 4.8 6.8 0 4-3 6.7-6.9 6.7-3.8 0-6.9-2.8-6.9-6.8 0-2.8 1.2-4.7 3-6.5 1.7-1.8 3.9-3.4 5.7-7.2z'/%3E%3C/svg%3E") center / contain no-repeat;
}


/* Custom Card Builder -----------------------------------------------------
   Elementor stores the builder configuration, while cards remain direct,
   semantic HTML. No nested Elementor widgets are rendered per product. */
.zdpc-content--custom {
    --zdpc-builder-gap: 9px;
    min-height: 190px;
}

.zdpc-content--custom > .zdpc-builder-element {
    margin-top: 0;
    margin-bottom: 0;
    min-width: 0;
}

.zdpc-content--custom > .zdpc-builder-element + .zdpc-builder-element {
    margin-top: var(--zdpc-builder-gap);
}

.zdpc-content--custom > .zdpc-push-bottom {
    margin-top: auto !important;
    padding-top: var(--zdpc-builder-gap);
}

.zdpc-content--custom .zdpc-align-left { text-align: left; }
.zdpc-content--custom .zdpc-align-center { text-align: center; }
.zdpc-content--custom .zdpc-align-right { text-align: right; }

.zdpc-content--custom .zdpc-meta.zdpc-align-center,
.zdpc-content--custom .zdpc-footer.zdpc-align-center {
    justify-content: center;
}

.zdpc-content--custom .zdpc-meta.zdpc-align-right,
.zdpc-content--custom .zdpc-footer.zdpc-align-right {
    justify-content: flex-end;
}

.zdpc-builder-rating,
.zdpc-builder-description,
.zdpc-builder-attribute,
.zdpc-builder-sku,
.zdpc-builder-categories,
.zdpc-builder-custom {
    font-size: 12px;
    line-height: 1.45;
}

.zdpc-builder-rating { color: #a47700; }
.zdpc-builder-description { color: #66706d; }
.zdpc-builder-attribute,
.zdpc-builder-sku,
.zdpc-builder-categories,
.zdpc-builder-custom { color: #3f4946; }

.zdpc-builder-categories a {
    position: relative;
    z-index: 4;
    color: inherit;
    pointer-events: auto;
    text-decoration: none;
}

.zdpc-builder-categories a:hover,
.zdpc-builder-categories a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.zdpc-builder-label { font-weight: 700; }

.zdpc-builder-divider {
    width: 100%;
    height: 0;
    padding: 0;
    border: 0;
    border-top: 1px solid #e1e4e1;
}

.zdpc-builder-spacer {
    display: block;
    width: 100%;
    height: var(--zdpc-spacer, 12px);
}

.zdpc-builder-price-save {
    padding-top: 0;
}

.zdpc-builder-save .zdpc-you-save {
    display: block;
}

.zdpc-seo-product-link {
    pointer-events: auto;
}

.zdpc-title--clamp-1,
.zdpc-title--clamp-2,
.zdpc-title--clamp-3,
.zdpc-title--clamp-4 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
}
.zdpc-title--clamp-1 { -webkit-line-clamp: 1; }
.zdpc-title--clamp-2 { -webkit-line-clamp: 2; }
.zdpc-title--clamp-3 { -webkit-line-clamp: 3; }
.zdpc-title--clamp-4 { -webkit-line-clamp: 4; }

/* Integrated lightweight wishlist button.
 * The FBW data/AJAX layer is preserved, while ZDPC cards render a single
 * semantic <button> and draw the icon with a pseudo-element. This removes the
 * repeated span > span > svg > path subtree from every product card. */
.zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist] {
    -webkit-appearance: none !important;
    appearance: none !important;
    display: grid !important;
    place-items: center !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(45, 55, 53, .28) !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, .94) !important;
    color: #253b38 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .05) !important;
    line-height: 1 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    overflow: hidden !important;
    -webkit-tap-highlight-color: transparent;
}

.zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist]::before {
    content: "";
    display: block;
    width: 22px;
    height: 22px;
    background-color: currentColor;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.2-4.35-9.65-9.4C.3 7.35 2.35 3 6.75 3c2.15 0 4.02 1.2 5.25 2.75C13.23 4.2 15.1 3 17.25 3c4.4 0 6.45 4.35 4.4 8.6C19.2 16.65 12 21 12 21Z' fill='none' stroke='black' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.2-4.35-9.65-9.4C.3 7.35 2.35 3 6.75 3c2.15 0 4.02 1.2 5.25 2.75C13.23 4.2 15.1 3 17.25 3c4.4 0 6.45 4.35 4.4 8.6C19.2 16.65 12 21 12 21Z' fill='none' stroke='black' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist]:hover,
.zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist]:focus-visible {
    background: #fff !important;
    border-color: rgba(32, 42, 40, .42) !important;
    color: #162a27 !important;
}

.zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist]:focus-visible {
    outline: 2px solid currentColor !important;
    outline-offset: 2px !important;
}

.zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist][aria-pressed="true"],
.zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist].is-in-wishlist {
    color: #b12f46 !important;
}

.zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist][aria-pressed="true"]::before,
.zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist].is-in-wishlist::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.2-4.35-9.65-9.4C.3 7.35 2.35 3 6.75 3c2.15 0 4.02 1.2 5.25 2.75C13.23 4.2 15.1 3 17.25 3c4.4 0 6.45 4.35 4.4 8.6C19.2 16.65 12 21 12 21Z' fill='black'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.2-4.35-9.65-9.4C.3 7.35 2.35 3 6.75 3c2.15 0 4.02 1.2 5.25 2.75C13.23 4.2 15.1 3 17.25 3c4.4 0 6.45 4.35 4.4 8.6C19.2 16.65 12 21 12 21Z' fill='black'/%3E%3C/svg%3E");
}

.zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist][data-fbw-action="remove"]::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 6 18 18M18 6 6 18' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 6 18 18M18 6 6 18' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

@media (max-width: 767px) {
    .zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist] {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
    }

    .zdpc-widget button.zdpc-wishlist.zdpc-wishlist-button[data-fbw-wishlist]::before {
        width: 21px;
        height: 21px;
    }
}