/* Favorieten 0.1.4 (hartje 4x klasse: body.single.single-product button:hover uit het child-thema is 0,3,2 en maakte het bij hover zwart) (WallCatcher Winkel). Melding: goedgekeurd door Dennis 7 okt 2026 (proef op de live productpagina). */
.wcw-fav-melding{position:fixed;z-index:99999;right:24px;top:104px;width:372px;max-width:calc(100vw - 32px);
  display:grid;grid-template-columns:56px minmax(0,1fr) 28px;gap:12px;align-items:center;padding:12px 12px 12px 12px;
  background:#fff;border:1px solid rgba(176,146,106,.28);border-radius:12px;
  box-shadow:0 10px 30px rgba(31,31,31,.12),0 2px 6px rgba(31,31,31,.06);
  font-family:"Open Sans","Open Sans Terugval",sans-serif;color:#1f1f1f;
  opacity:0;transform:translateY(-6px);transition:opacity .22s ease,transform .22s ease}
.wcw-fav-melding.is-zichtbaar{opacity:1;transform:none}
.wcw-fav-melding img{width:56px;height:56px;object-fit:cover;border-radius:8px;display:block;background:rgba(176,146,106,.08)}
.wcw-fav-melding .wcw-fav-kop{display:flex;align-items:center;gap:6px;margin:0 0 2px;
  font-family:"Libre Baskerville","Libre Terugval",Georgia,serif;font-size:14.5px;line-height:1.3;white-space:nowrap}
.wcw-fav-melding .wcw-fav-kop svg{width:15px;height:15px;flex-shrink:0;fill:#c0392b;stroke:#c0392b}
.wcw-fav-melding .wcw-fav-naam{min-width:0;margin:0 0 4px;font-size:13px;line-height:1.35;color:#6b6b6b;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wcw-fav-melding .wcw-fav-actie{font-size:13px;font-weight:600;color:#1f1f1f;text-decoration:underline;
  text-underline-offset:3px;text-decoration-color:rgba(31,31,31,.35);background:none;border:0;padding:0;cursor:pointer;font-family:inherit}
.wcw-fav-melding .wcw-fav-sluit{align-self:start;width:28px;height:28px;border:0;background:none;color:#7a7a7a;
  font-size:20px;line-height:1;cursor:pointer;border-radius:6px}
.wcw-fav-melding .wcw-fav-sluit:hover{background:rgba(176,146,106,.1);color:#1f1f1f}
@media (max-width:768px){
  .wcw-fav-melding{left:12px;right:12px;top:auto;bottom:calc(84px + env(safe-area-inset-bottom));width:auto;max-width:none;
    transform:translateY(8px)}
}
@media (prefers-reduced-motion:reduce){.wcw-fav-melding{transition:none}}

/* Het child-thema maakt op productpagina's elke button zwart (body.single.single-product button, specificiteit 0,2,2).
   Daarom "html body .wcw-fav-melding.wcw-fav-melding.wcw-fav-melding" (0,3,2): wint zonder !important. */
html body .wcw-fav-melding.wcw-fav-melding.wcw-fav-melding button{all:unset;box-sizing:border-box;cursor:pointer}
html body .wcw-fav-melding.wcw-fav-melding.wcw-fav-melding button.wcw-fav-actie{font-family:"Open Sans","Open Sans Terugval",sans-serif;font-size:13px;font-weight:600;color:#1f1f1f;
  text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(31,31,31,.35)}
html body .wcw-fav-melding.wcw-fav-melding.wcw-fav-melding button.wcw-fav-sluit{align-self:start;display:flex;align-items:center;justify-content:center;width:28px;height:28px;
  color:#7a7a7a;font-size:20px;line-height:1;border-radius:6px}
html body .wcw-fav-melding.wcw-fav-melding.wcw-fav-melding button.wcw-fav-sluit:hover{background:rgba(176,146,106,.12);color:#1f1f1f}
html body .wcw-fav-melding.wcw-fav-melding.wcw-fav-melding button:focus-visible,html body .wcw-fav-melding.wcw-fav-melding.wcw-fav-melding a:focus-visible{outline:2px solid #7d8a6a;outline-offset:2px}
.wcw-fav-melding .wcw-fav-leeg{width:56px;height:56px;border-radius:8px;background:rgba(176,146,106,.08)}
.wcw-fav-melding .wcw-fav-tekst{min-width:0}

/* Hartje op de productkaart: zelfde rondje als het oude YITH-hartje uit snippet 150/151 (wit, 34px, rechtsboven).
   Specifiek genoeg om de zwarte knoppen van het child-thema te winnen zonder !important. */
html body .wcw-fav-knop.wcw-fav-knop.wcw-fav-knop.wcw-fav-knop{all:unset;box-sizing:border-box;position:absolute;top:10px;right:10px;z-index:4;width:34px;height:34px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.96);
  box-shadow:0 1px 4px rgba(0,0,0,.08);cursor:pointer;transition:opacity .2s,transform .15s}
html body .wcw-fav-knop.wcw-fav-knop.wcw-fav-knop.wcw-fav-knop svg{width:16px;height:16px;fill:none;stroke:#222;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
html body .wcw-fav-knop.wcw-fav-knop.wcw-fav-knop.wcw-fav-knop.is-bewaard svg{fill:#D62828;stroke:#D62828}
html body .wcw-fav-knop.wcw-fav-knop.wcw-fav-knop.wcw-fav-knop:active{transform:scale(.92)}
html body .wcw-fav-knop.wcw-fav-knop.wcw-fav-knop.wcw-fav-knop:focus-visible{outline:2px solid #7d8a6a;outline-offset:2px}
li.product:has(> .wcw-fav-knop),.woocommerce-image__wrapper:has(> .wcw-fav-knop){position:relative}
/* Groot scherm met muis: pas bij hover (zelfde regel als snippet 150); bewaard blijft altijd zichtbaar */
@media (hover:hover) and (pointer:fine) and (min-width:993px){
  html body .wcw-fav-knop.wcw-fav-knop.wcw-fav-knop.wcw-fav-knop{opacity:0}
  html body li.product:hover .wcw-fav-knop.wcw-fav-knop.wcw-fav-knop.wcw-fav-knop,html body .wcw-fav-knop.wcw-fav-knop.wcw-fav-knop.wcw-fav-knop:focus-visible,html body .wcw-fav-knop.wcw-fav-knop.wcw-fav-knop.wcw-fav-knop.is-bewaard{opacity:1}
}
/* De oude YITH-knop op kaarten niet meer tonen (JS haalt hem ook weg; dit voorkomt een flits) */
body.wcw-fav li.product .yith-wcwl-add-to-wishlist{visibility:hidden}