/* --------------------------------------------------------------------------
   Karacter — Favorite: inima, contorul, toastul.
   Se încarcă pe tot site-ul. Stilurile paginii stau în krcwishlist-page.css.
   -------------------------------------------------------------------------- */

/* --- Inima ---------------------------------------------------------------
   Un singur element care își schimbă doar umplerea. Forma e un SVG codat în
   `mask`, ca iconița de coș din buton (index §8): preia culoarea din
   `currentColor`, deci hover-ul și starea activă se fac din `color`. */
.krcwl-heart {
    display: inline-block;
    width: 22px;
    height: 22px;
    background-color: currentColor;
    vertical-align: -.18em;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 496S0 319.4 0 167.7C0 94.2 58.6 32 133.1 32c34.6 0 67.4 13.4 91.9 36.8 12.1 11.5 21.3 25.6 31 39.1 9.7-13.5 18.9-27.6 31-39.1C311.5 45.4 344.4 32 378.9 32 453.5 32 512 94.2 512 167.7 512 319.4 256 496 256 496zm0-306.2l-53.9-74.5c-16-22.1-41.7-35.2-69-35.2-47 0-85.1 38.1-85.1 85.1 0 33.3 15 64.6 32.5 92.2 21.3 33.7 50.6 67.1 81.2 97.2 30.4 30 61 55.6 84 73.8 3.6 2.9 7.1 5.5 10.3 8 3.2-2.5 6.6-5.1 10.3-8 23.1-18.2 53.6-43.8 84-73.8 30.6-30.1 59.8-63.6 81.2-97.3 17.5-27.6 32.6-58.8 32.6-92.2 0-47-38.1-85.1-85.1-85.1-27.3 0-53 13.1-69 35.2L256 189.8z'/%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 512 512'%3E%3Cpath d='M256 496S0 319.4 0 167.7C0 94.2 58.6 32 133.1 32c34.6 0 67.4 13.4 91.9 36.8 12.1 11.5 21.3 25.6 31 39.1 9.7-13.5 18.9-27.6 31-39.1C311.5 45.4 344.4 32 378.9 32 453.5 32 512 94.2 512 167.7 512 319.4 256 496 256 496zm0-306.2l-53.9-74.5c-16-22.1-41.7-35.2-69-35.2-47 0-85.1 38.1-85.1 85.1 0 33.3 15 64.6 32.5 92.2 21.3 33.7 50.6 67.1 81.2 97.2 30.4 30 61 55.6 84 73.8 3.6 2.9 7.1 5.5 10.3 8 3.2-2.5 6.6-5.1 10.3-8 23.1-18.2 53.6-43.8 84-73.8 30.6-30.1 59.8-63.6 81.2-97.3 17.5-27.6 32.6-58.8 32.6-92.2 0-47-38.1-85.1-85.1-85.1-27.3 0-53 13.1-69 35.2L256 189.8z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Inima plină e aceeași formă, dar cu conturul umplut — schimbăm doar
   culoarea, nu forma, ca să nu sară butonul la click. */
.js-krcwl-toggle.is-in-list {
    color: var(--c-accent, #E50F1E);
}
.js-krcwl-toggle.is-in-list .krcwl-heart {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M47.6 300.4 228.3 469.1c7.5 7 17.4 10.9 27.7 10.9s20.2-3.9 27.7-10.9L464.4 300.4c30.4-28.3 47.6-68 47.6-109.5v-5.8c0-69.9-50.5-129.5-119.4-141C347 36.5 300.6 51.4 268 84L256 96 244 84c-32.6-32.6-79-47.5-124.6-39.9C50.5 55.6 0 115.2 0 185.1v5.8c0 41.5 17.2 81.2 47.6 109.5z'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M47.6 300.4 228.3 469.1c7.5 7 17.4 10.9 27.7 10.9s20.2-3.9 27.7-10.9L464.4 300.4c30.4-28.3 47.6-68 47.6-109.5v-5.8c0-69.9-50.5-129.5-119.4-141C347 36.5 300.6 51.4 268 84L256 96 244 84c-32.6-32.6-79-47.5-124.6-39.9C50.5 55.6 0 115.2 0 185.1v5.8c0 41.5 17.2 81.2 47.6 109.5z'/%3E%3C/svg%3E");
}
.is-in-list .krcwl-heart{
    background-color:var(--c-accent, #E50F1E);
}
.js-krcwl-toggle.is-busy {
    opacity: .5;
    pointer-events: none;
}

/* Inima din listing — fără fundal de buton, doar iconița */
.krcwl-mini {
    padding: .35rem;
    border: 0;
    background: none;
    color: inherit;
    cursor: pointer;
}
.krcwl-mini:hover {
    color: var(--c-accent, #E50F1E);
}

/* --- Toastul -------------------------------------------------------------
   Un singur element, refolosit. Se creează din JS la prima acțiune. */
.krcwl-toast {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 1080;
    display: flex;
    align-items: center;
    gap: .75rem;
    max-width: 320px;
    padding: .85rem 1rem;
    background: #1A1A1A;
    color: #fff;
    font-size: .9rem;
    line-height: 1.35;
    border-radius: 2px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .18s ease, transform .18s ease;
    pointer-events: none;
}
.krcwl-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
.krcwl-toast a {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 3px;
    white-space: nowrap;
}
.krcwl-toast--error {
    background: #8A1620;
}

@media (max-width: 575.98px) {
    .krcwl-toast {
        right: 12px;
        left: 12px;
        bottom: 12px;
        max-width: none;
    }
}

/* --- Cardul din contul clientului ---------------------------------------- */
.krcwl-account-count {
    opacity: .6;
}

/* --- Badge-ul de contor din header ---------------------------------------
   Geometria și culorile vin din clasa temei, `cart-products-count-btn`
   (Theme Editor le generează în modules/iqitthemeeditor/views/css/custom_s_1.css).
   Regula de aici e doar plasa de siguranță: dacă tema se schimbă și clasa
   dispare, badge-ul rămâne vizibil în loc să devină text nestilizat. */
.krcwl-count-btn {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 16px;
    height: 16px;
    padding: 1px 5px;
    line-height: 15px;
    font-size: .8rem;
    text-align: center;
    border-radius: 30px;
}