/* p1450108174224-heart-visual-contract-v1
 * Last-loaded wishlist-heart visual contract.
 * Root cause: older product-card rules attempted to draw saved/unsaved hearts via
 * ::before on the SVG element. Pseudo-elements on SVG are not a reliable render
 * surface and can leave only the circular button visible. This contract always
 * renders the existing inline SVG path and changes state only through aria-pressed
 * / .is-saved, matching the stable JS DOM contract introduced earlier.
 */

.heart-button[data-basket-heart-button]{
  --aw224-heart-visual-size:30px;
  position:relative!important;
  inline-size:var(--aw224-heart-visual-size)!important;
  block-size:var(--aw224-heart-visual-size)!important;
  width:var(--aw224-heart-visual-size)!important;
  height:var(--aw224-heart-visual-size)!important;
  min-inline-size:var(--aw224-heart-visual-size)!important;
  min-block-size:var(--aw224-heart-visual-size)!important;
  min-width:var(--aw224-heart-visual-size)!important;
  min-height:var(--aw224-heart-visual-size)!important;
  padding:0!important;
  display:inline-grid!important;
  place-items:center!important;
  border:1px solid rgba(18,55,91,.18)!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.96)!important;
  color:#08275b!important;
  box-shadow:0 3px 10px rgba(8,39,91,.065)!important;
  transform:none!important;
}

/* The visual control stays small, while the pseudo hit-area gives roughly
 * 44–46 px pointer/touch coverage without making the circle visually dominant. */
.heart-button[data-basket-heart-button]::after{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:50%;
}

.heart-button[data-basket-heart-button]:hover{
  border-color:rgba(18,55,91,.34)!important;
  background:#fff!important;
  box-shadow:0 4px 12px rgba(8,39,91,.085)!important;
  transform:none!important;
}

.heart-button[data-basket-heart-button]:focus-visible{
  outline:2px solid color-mix(in srgb,var(--aw-focus,#17738c) 44%,transparent)!important;
  outline-offset:3px!important;
}

.heart-button[data-basket-heart-button] .aw-heart-icon[data-basket-heart-icon]{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  inline-size:15px!important;
  block-size:15px!important;
  width:15px!important;
  height:15px!important;
  margin:0!important;
  transform:none!important;
  overflow:visible!important;
  font-size:initial!important;
  color:inherit!important;
  fill:transparent!important;
  stroke:currentColor!important;
  stroke-width:1.85!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  pointer-events:none!important;
}

/* Explicitly neutralize every old text-heart fallback. Pseudo-elements on SVG
 * are the browser-sensitive part of the old implementation. */
.heart-button[data-basket-heart-button] .aw-heart-icon[data-basket-heart-icon]::before,
.heart-button[data-basket-heart-button] .aw-heart-icon[data-basket-heart-icon]::after{
  content:none!important;
  display:none!important;
}

.heart-button[data-basket-heart-button] .aw-heart-icon[data-basket-heart-icon] path{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  fill:transparent!important;
  stroke:currentColor!important;
  stroke-width:1.85!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  vector-effect:non-scaling-stroke!important;
}

.heart-button[data-basket-heart-button][aria-pressed="true"],
.heart-button[data-basket-heart-button].is-saved{
  color:var(--aw-wishlist,#b4233b)!important;
  background:var(--aw-wishlist-bg,#fff5f6)!important;
  border-color:var(--aw-wishlist-border,rgba(180,35,59,.28))!important;
  box-shadow:0 3px 10px rgba(180,35,59,.09)!important;
}

.heart-button[data-basket-heart-button][aria-pressed="true"] .aw-heart-icon[data-basket-heart-icon] path,
.heart-button[data-basket-heart-button].is-saved .aw-heart-icon[data-basket-heart-icon] path{
  fill:currentColor!important;
  stroke:currentColor!important;
}

.heart-button[data-basket-heart-button]:disabled{
  opacity:.72!important;
  cursor:wait!important;
  transform:none!important;
}

html[data-aw-contrast="dark"] .heart-button[data-basket-heart-button]{
  background:#172a3a!important;
  border-color:#526b80!important;
  color:#dce9f5!important;
  box-shadow:none!important;
}
html[data-aw-contrast="dark"] .heart-button[data-basket-heart-button][aria-pressed="true"],
html[data-aw-contrast="dark"] .heart-button[data-basket-heart-button].is-saved{
  background:#542532!important;
  border-color:#d9798b!important;
  color:#ffd1d8!important;
}

@media (max-width:768px){
  .heart-button[data-basket-heart-button]{
    --aw224-heart-visual-size:28px;
  }
  .heart-button[data-basket-heart-button] .aw-heart-icon[data-basket-heart-icon]{
    inline-size:14px!important;
    block-size:14px!important;
    width:14px!important;
    height:14px!important;
  }
}

@media (forced-colors:active){
  .heart-button[data-basket-heart-button]{forced-color-adjust:auto!important}
  .heart-button[data-basket-heart-button][aria-pressed="true"] .aw-heart-icon[data-basket-heart-icon] path{fill:ButtonText!important;stroke:ButtonText!important}
}

@media (prefers-reduced-motion:reduce){
  .heart-button[data-basket-heart-button]{transition:none!important}
}

/* Portal/product-card-v3 has historical !important rules with higher selector
 * specificity (42 px button / 30 px icon). Override those explicitly here so
 * the final contract is not merely load-order dependent. */
.portal-homepage .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button],
.portal-ui .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button]{
  --aw224-heart-visual-size:30px!important;
  inline-size:var(--aw224-heart-visual-size)!important;
  block-size:var(--aw224-heart-visual-size)!important;
  width:var(--aw224-heart-visual-size)!important;
  height:var(--aw224-heart-visual-size)!important;
  min-inline-size:var(--aw224-heart-visual-size)!important;
  min-block-size:var(--aw224-heart-visual-size)!important;
  min-width:var(--aw224-heart-visual-size)!important;
  min-height:var(--aw224-heart-visual-size)!important;
  border-color:rgba(18,55,91,.18)!important;
  background:rgba(255,255,255,.96)!important;
  color:#08275b!important;
  box-shadow:0 3px 10px rgba(8,39,91,.065)!important;
}
.portal-homepage .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button] .aw-heart-icon[data-basket-heart-icon],
.portal-ui .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button] .aw-heart-icon[data-basket-heart-icon]{
  inline-size:15px!important;
  block-size:15px!important;
  width:15px!important;
  height:15px!important;
  font-size:initial!important;
}
.portal-homepage .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button][aria-pressed="true"],
.portal-homepage .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button].is-saved,
.portal-ui .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button][aria-pressed="true"],
.portal-ui .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button].is-saved{
  color:var(--aw-wishlist,#b4233b)!important;
  background:var(--aw-wishlist-bg,#fff5f6)!important;
  border-color:var(--aw-wishlist-border,rgba(180,35,59,.28))!important;
  box-shadow:0 3px 10px rgba(180,35,59,.09)!important;
}
.portal-homepage .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button][aria-pressed="true"] .aw-heart-icon[data-basket-heart-icon] path,
.portal-homepage .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button].is-saved .aw-heart-icon[data-basket-heart-icon] path,
.portal-ui .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button][aria-pressed="true"] .aw-heart-icon[data-basket-heart-icon] path,
.portal-ui .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button].is-saved .aw-heart-icon[data-basket-heart-icon] path{
  fill:currentColor!important;
  stroke:currentColor!important;
}

@media (max-width:768px){
  .portal-homepage .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button],
  .portal-ui .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button]{
    --aw224-heart-visual-size:28px!important;
  }
  .portal-homepage .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button] .aw-heart-icon[data-basket-heart-icon],
  .portal-ui .product-card.portal-product-card.product-card-v3 .heart-button[data-basket-heart-button] .aw-heart-icon[data-basket-heart-icon]{
    inline-size:14px!important;
    block-size:14px!important;
    width:14px!important;
    height:14px!important;
  }
}