/* ==============================================
   TM24 NOVAChild – Produkt-Card: Aktions-Buttons
   Modul: modules/listing/product-card/product-card-actions.css
   Scope: .productbox .productbox-quick-actions
   UTF-8 ohne BOM

   Enthält NUR: Hover-Buttons, Quick-Actions, Aktions-Overlay
   ============================================== */

/* (Bereits in product-card.css als Teil der Basis enthalten)
   Diese Datei dient als Erweiterungs-Hook für komplexere
   Aktions-Elemente wie Vergleich, Wish-List-Counter, etc. */

/* ---- Warenkorb-Button in der Card ---- */
.productbox .productbox-addtocart {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 12px 14px;
    background: var(--p);
    color: #fff;
    font-family: var(--f);
    font-size: 13px;
    font-weight: 700;
    text-align: center;
    border: 0;
    border-radius: 0 0 var(--r) var(--r);
    cursor: pointer;
    transition: background var(--speed);
}

.productbox:hover .productbox-addtocart {
    display: block;
}

.productbox .productbox-addtocart:hover {
    background: var(--pd);
}

/* ---- Wunschliste-Button ---- */
.productbox .wishlist-button,
.productbox [data-wishlist] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(8px);
    border: 1px solid var(--brd-l);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: var(--mut);
    cursor: pointer;
    transition: all var(--speed);
}

.productbox .wishlist-button:hover,
.productbox [data-wishlist]:hover {
    background: #fee2e2;
    color: #dc2626;
    border-color: #fca5a5;
}

.productbox .wishlist-button.is-active,
.productbox [data-wishlist].is-active {
    background: #fee2e2;
    color: #dc2626;
}

/* ---- Vergleich-Button ---- */
.productbox .compare-button {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(8px);
    border: 1px solid var(--brd-l);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: var(--mut);
    cursor: pointer;
    transition: all var(--speed);
}

.productbox .compare-button:hover {
    background: var(--pl);
    color: var(--p);
    border-color: rgba(46, 43, 203, .3);
}