/* Spoločné štýly košíka (assets/js/cart-ui.js) */

/* ---------- zvýraznenie tlačidla Košík v hlavičke ---------- */
.cart-btn{
  position:relative;
}

.cart-btn.cart-bump{
  animation:cartBump .75s cubic-bezier(.3,1.6,.5,1);
}

@keyframes cartBump{
  0%   { transform:scale(1);    background:var(--brick, #7B2D2D); box-shadow:0 16px 30px rgba(123,45,45,0.20); }
  25%  { transform:scale(1.14) rotate(-3deg); background:#3F712E; box-shadow:0 0 0 7px rgba(79,138,59,0.25), 0 16px 30px rgba(79,138,59,0.30); }
  45%  { transform:scale(0.96) rotate(2deg);  background:#3F712E; }
  65%  { transform:scale(1.05) rotate(-1deg); background:#3F712E; box-shadow:0 0 0 12px rgba(79,138,59,0); }
  100% { transform:scale(1);    background:var(--brick, #7B2D2D); box-shadow:0 16px 30px rgba(123,45,45,0.20); }
}

.cart-bump-bubble{
  position:absolute;
  top:-6px;
  right:-4px;
  min-width:26px;
  height:26px;
  padding:0 7px;
  border-radius:999px;
  background:#3F712E;
  color:#fff;
  font-style:normal;
  font-size:13px;
  font-weight:900;
  line-height:26px;
  text-align:center;
  pointer-events:none;
  box-shadow:0 6px 14px rgba(0,0,0,0.18);
  animation:cartBubble 1s ease-out forwards;
}

.cart-bump-bubble.is-minus{
  background:#7B2D2D;
}

@keyframes cartBubble{
  0%   { opacity:0; transform:translateY(6px) scale(.6); }
  20%  { opacity:1; transform:translateY(-4px) scale(1.1); }
  70%  { opacity:1; transform:translateY(-14px) scale(1); }
  100% { opacity:0; transform:translateY(-26px) scale(.9); }
}

/* ---------- − množstvo + na kartách produktov ---------- */
.card-qty{
  display:none;
  align-items:center;
  justify-content:space-between;
  gap:2px;
  height:40px;
  padding:3px;
  border-radius:999px;
  background:var(--green, #3F712E);
  color:#fff;
  box-shadow:0 12px 22px rgba(79,138,59,0.22);
  position:relative;
  z-index:3;
  animation:cardQtyIn .22s ease-out;
}

.product-card.is-in-cart .add-btn{
  display:none !important;
}

.product-card.is-in-cart .card-qty,
[data-modal-product-id].is-in-cart .card-qty{
  display:inline-flex;
}

.card-qty-btn{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#fff;
  font-size:21px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
  padding:0;
  transition:background .15s ease;
}

.card-qty-btn:hover,
.card-qty-btn:focus-visible{
  background:rgba(255,255,255,0.20);
  outline:none;
}

.card-qty-value{
  min-width:22px;
  text-align:center;
  font-size:15px;
  font-weight:900;
}

.card-qty-btn{
  position:relative;
  overflow:visible;
  transition:background .15s ease, transform .12s ease;
}

.card-qty-btn:active{
  transform:scale(.82);
}

/* vlnka po kliknutí */
.card-qty-btn::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:50%;
  background:rgba(255,255,255,0.55);
  opacity:0;
  transform:scale(.3);
  pointer-events:none;
}

.card-qty-btn.is-pressed::after{
  animation:cardQtyRipple .45s ease-out;
}

/* jemné pruženie celého ovládača */
.card-qty.is-pressed{
  animation:cardQtySquish .32s cubic-bezier(.3,1.7,.5,1);
}

/* farebný záblesk: − do červena, + do hnedej */
.card-qty.is-pressed.is-flash-minus{
  animation:cardQtySquish .32s cubic-bezier(.3,1.7,.5,1), cardQtyFlashMinus .6s ease-out;
}

.card-qty.is-pressed.is-flash-plus{
  animation:cardQtySquish .32s cubic-bezier(.3,1.7,.5,1), cardQtyFlashPlus .6s ease-out;
}

@keyframes cardQtyFlashMinus{
  0%, 35% { background:#C0392B; box-shadow:0 12px 22px rgba(192,57,43,0.32); }
  100%    { background:var(--green, #3F712E); box-shadow:0 12px 22px rgba(79,138,59,0.22); }
}

@keyframes cardQtyFlashPlus{
  0%, 35% { background:var(--brown, #4A1F1F); box-shadow:0 12px 22px rgba(74,31,31,0.32); }
  100%    { background:var(--green, #3F712E); box-shadow:0 12px 22px rgba(79,138,59,0.22); }
}

/* ---------- ovládač v detaile produktu (modálne okno) ---------- */
[data-modal-product-id].is-in-cart > :not(.card-qty){
  display:none !important;
}

.card-qty.card-qty--modal{
  height:52px;
  padding:4px;
  gap:6px;
  min-width:170px;
}

.card-qty--modal .card-qty-btn{
  width:44px;
  height:44px;
  flex:0 0 44px;
  font-size:24px;
}

.card-qty--modal .card-qty-value{
  min-width:40px;
  font-size:18px;
}

.card-qty-label{
  font-size:12px;
  font-weight:800;
  opacity:.85;
  white-space:nowrap;
}

.card-qty-value{
  display:inline-block;
}

.card-qty-value.is-changed{
  animation:cardQtyPop .3s ease-out;
}

.card-qty-value.is-changed.is-up{
  animation:cardQtyUp .3s cubic-bezier(.3,1.5,.5,1);
}

.card-qty-value.is-changed.is-down{
  animation:cardQtyDown .3s cubic-bezier(.3,1.5,.5,1);
}

@keyframes cardQtyRipple{
  0%   { opacity:1; transform:scale(.3); }
  100% { opacity:0; transform:scale(1.6); }
}

@keyframes cardQtySquish{
  0%   { transform:scale(1); }
  35%  { transform:scale(1.08, .92); }
  70%  { transform:scale(.97, 1.03); }
  100% { transform:scale(1); }
}

@keyframes cardQtyUp{
  0%   { opacity:0; transform:translateY(12px) scale(.7); }
  60%  { opacity:1; transform:translateY(-3px) scale(1.25); }
  100% { opacity:1; transform:translateY(0) scale(1); }
}

@keyframes cardQtyDown{
  0%   { opacity:0; transform:translateY(-12px) scale(.7); }
  60%  { opacity:1; transform:translateY(3px) scale(1.25); }
  100% { opacity:1; transform:translateY(0) scale(1); }
}

@keyframes cardQtyIn{
  from { opacity:0; transform:scale(.7); }
  to   { opacity:1; transform:scale(1); }
}

@keyframes cardQtyPop{
  0%   { transform:scale(1); }
  50%  { transform:scale(1.35); }
  100% { transform:scale(1); }
}

/* Produkt bez jednotkovej ceny (€/kg, €/l): prázdny riadok s rovnakou výškou
   ako .unit-price, aby bolo tlačidlo + v rovnakej výške ako na ostatných kartách. */
.product-card .product-action:not(:has(.unit-price))::after{
  content:'\00a0';
  display:block;
  margin-top:6px;
  font-size:11px;
  line-height:1.1;
  white-space:nowrap;
  visibility:hidden;
}

@media (prefers-reduced-motion: reduce){
  .cart-btn.cart-bump,
  .cart-bump-bubble,
  .card-qty,
  .card-qty-value.is-changed,
  .card-qty.is-pressed,
  .card-qty-btn.is-pressed::after{
    animation-duration:.01s;
  }
}