/* v23 - Newest products hover actions */
.compact-card{
  position:relative;
}

/* Move "new / bestseller" badge to the right side for this section only. */
.compact-card > .new-badge,
.compact-card > .stock-badge,
.compact-card > .discount-badge{
  right:12px !important;
  left:auto !important;
  z-index:12;
}

.compact-card .product-media{
  position:relative;
  overflow:hidden;
}

.compact-hover-actions{
  position:absolute;
  z-index:14;
  right:50%;
  bottom:12px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:7px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:15px;
  background:rgba(255,255,255,.82);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  box-shadow:0 12px 34px rgba(24,27,45,.14);
  opacity:0;
  visibility:hidden;
  transform:translate(50%,14px) scale(.96);
  transition:opacity .24s ease,visibility .24s ease,transform .28s cubic-bezier(.2,.75,.25,1);
}

.compact-action-btn{
  position:relative;
  width:40px;
  height:40px;
  flex:0 0 40px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid #e3e5ee;
  border-radius:12px;
  color:#596174;
  background:#fff;
  font-size:16px;
  line-height:1;
  box-shadow:0 4px 13px rgba(32,36,55,.045);
  transition:transform .2s ease,color .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.compact-action-btn:hover,
.compact-action-btn.active{
  color:var(--ml-primary-dark);
  border-color:color-mix(in srgb,var(--ml-primary) 33%,#fff);
  background:color-mix(in srgb,var(--ml-primary) 7%,#fff);
  transform:translateY(-2px);
  box-shadow:0 7px 17px color-mix(in srgb,var(--ml-primary-dark) 14%,transparent);
}
.compact-action-btn.compact-action-cart{
  color:#fff;
  border-color:var(--ml-primary);
  background:linear-gradient(135deg,var(--ml-primary),var(--ml-primary-dark));
  box-shadow:0 7px 18px color-mix(in srgb,var(--ml-primary-dark) 27%,transparent);
}
.compact-action-btn.compact-action-cart:hover,
.compact-action-btn.compact-action-cart.added{
  color:#fff;
  border-color:var(--ml-primary-dark);
  background:linear-gradient(135deg,var(--ml-primary-dark),var(--ml-primary-dark));
  box-shadow:0 10px 22px color-mix(in srgb,var(--ml-primary-dark) 34%,transparent);
}

/* Small labels appear above icon buttons on desktop. */
@media (hover:hover) and (pointer:fine){
  .compact-card:hover .compact-hover-actions,
  .compact-card:focus-within .compact-hover-actions{
    opacity:1;
    visibility:visible;
    transform:translate(50%,0) scale(1);
  }
  .compact-action-btn::after{
    content:attr(data-label);
    position:absolute;
    right:50%;
    bottom:calc(100% + 9px);
    transform:translate(50%,6px);
    white-space:nowrap;
    padding:6px 8px;
    border-radius:8px;
    background:#171a27;
    color:#fff;
    font-family:'Vazirmatn',Tahoma,sans-serif;
    font-size:10px;
    font-weight:700;
    line-height:1;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:.18s ease;
    box-shadow:0 7px 18px rgba(20,22,35,.2);
  }
  .compact-action-btn:hover::after,
  .compact-action-btn:focus-visible::after{
    opacity:1;
    visibility:visible;
    transform:translate(50%,0);
  }
}

/* Touch screens have no hover: keep all three actions visible and easy to tap. */
@media (hover:none), (pointer:coarse){
  .compact-hover-actions{
    opacity:1;
    visibility:visible;
    transform:translate(50%,0) scale(1);
    bottom:8px;
    gap:5px;
    padding:5px;
    border-radius:12px;
  }
  .compact-action-btn{
    width:35px;
    height:35px;
    flex-basis:35px;
    border-radius:10px;
    font-size:14px;
  }
}

@media (max-width:575.98px){
  .compact-card > .new-badge,
  .compact-card > .stock-badge,
  .compact-card > .discount-badge{
    right:8px !important;
    top:8px !important;
  }
  .compact-hover-actions{
    bottom:7px;
  }
  .compact-action-btn{
    width:33px;
    height:33px;
    flex-basis:33px;
    font-size:13px;
  }
}

@media (prefers-reduced-motion:reduce){
  .compact-hover-actions,.compact-action-btn,.compact-action-btn::after{transition:none!important}
}
