/* ============================================================
   MVCKO — koszyk w nagłówku + panel boczny
   assets/header-cart.css
   ============================================================ */

.mvck-hidden{display:none !important}

/* ============================================================
   PRZYCISK W NAGŁÓWKU
   Dziedziczy wygląd z .n-cta motywu — dokładamy tylko licznik
   i drobne różnice wynikające z tego, że to <button>, nie <a>.
   ============================================================ */
button.mvck-cta{
  font:inherit;
  cursor:pointer;
  -webkit-appearance:none;appearance:none;
}
button.mvck-cta.is-bump{animation:mvckBump .5s cubic-bezier(.2,.8,.2,1)}
@keyframes mvckBump{
  0%,100%{transform:scale(1)}
  30%    {transform:scale(1.07)}
}

/* licznik na ikonie */
.mvck-cta-ico{position:relative}
.mvck-count{
  position:absolute;top:-6px;right:-6px;
  min-width:19px;height:19px;padding:0 5px;
  display:grid;place-items:center;
  border-radius:100px;
  background:#FF6A97;color:#161616;
  font-family:'Unbounded',sans-serif;font-weight:900;
  font-size:10px;line-height:1;
  box-shadow:0 2px 8px rgba(255,106,151,.45);
  pointer-events:none;
}
.mvck-count[data-count="0"]{opacity:.35;box-shadow:none}

/* ============================================================
   PANEL BOCZNY
   ============================================================ */
.mvck{position:fixed;inset:0;z-index:2147483000}
.mvck[hidden]{display:none}

.mvck__veil{
  position:absolute;inset:0;
  background:rgba(10,10,11,.6);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  opacity:0;transition:opacity .3s ease;
}
.mvck.is-open .mvck__veil{opacity:1}

.mvck__panel{
  position:absolute;top:0;right:0;bottom:0;
  width:min(420px,100%);
  display:flex;flex-direction:column;
  background:
    radial-gradient(120% 60% at 10% 0%, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 60%),
    #161616;
  border-left:1px solid rgba(255,255,255,.14);
  box-shadow:-24px 0 60px rgba(0,0,0,.5);
  transform:translateX(100%);
  transition:transform .32s cubic-bezier(.2,.8,.2,1);
  font-family:'DM Sans',system-ui,sans-serif;
  color:#F4F4F4;
}
.mvck.is-open .mvck__panel{transform:translateX(0)}

.mvck__head{
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 24px;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.mvck__title{display:none}
.mvck__head{justify-content:flex-end}
.mvck__close{
  width:38px;height:38px;display:grid;place-items:center;
  border-radius:50% !important;
  border:1px solid rgba(255,255,255,.18) !important;
  background:rgba(255,255,255,.05) !important;
  color:#F4F4F4 !important;cursor:pointer;padding:0 !important;
  transition:.22s cubic-bezier(.2,.8,.2,1);
}
.mvck__close svg{width:18px;height:18px}
.mvck__close:hover{
  color:#FF6A97 !important;
  border-color:rgba(255,106,151,.55) !important;
  transform:rotate(90deg);
}

.mvck__body{flex:1 1 auto;overflow-y:auto;padding:20px 24px}

/* ---------- mini-koszyk Woo w panelu ---------- */
.mvck__body .woocommerce-mini-cart{
  list-style:none;margin:0 !important;padding:0 !important;
}

/* Woo wypluwa płaski ciąg elementów bez kontenerów.
   Zdjęcie trzymamy w lewej kolumnie przez wszystkie wiersze,
   reszta układa się kolejno w prawej. */
.mvck__body .woocommerce-mini-cart-item{
  position:relative;
  display:grid !important;
  grid-template-columns:72px minmax(0,1fr);
  grid-auto-rows:min-content;
  column-gap:14px;row-gap:4px;
  align-items:start;
  padding:16px 34px 16px 0 !important;
  margin:0 !important;
  border-bottom:1px solid rgba(255,255,255,.08);
  transition:opacity .25s ease;
}
.mvck__body .woocommerce-mini-cart-item.is-removing{opacity:.35;pointer-events:none}
.mvck__body .woocommerce-mini-cart-item::before,
.mvck__body .woocommerce-mini-cart-item::after{content:none !important}

/* zdjęcie — lewa kolumna, pełna wysokość pozycji */
.mvck__body .woocommerce-mini-cart-item img{
  grid-column:1;
  grid-row:1 / -1;
  align-self:start;
  width:72px !important;height:72px !important;
  object-fit:cover;
  border-radius:10px;border:1px solid rgba(255,255,255,.12);
  float:none !important;margin:0 !important;
}

/* wszystko inne — prawa kolumna, jedno pod drugim */
.mvck__body .woocommerce-mini-cart-item > *:not(img):not(.remove){
  grid-column:2;
  min-width:0;
}

/* nazwa produktu */
.mvck__body .woocommerce-mini-cart-item a:not(.remove){
  display:block;
  font-family:'Unbounded',sans-serif;font-weight:900;
  font-size:12px;line-height:1.35;text-transform:uppercase;
  color:#F4F4F4 !important;text-decoration:none !important;
  padding:0 !important;margin:0 !important;
  overflow-wrap:anywhere;
}
.mvck__body .woocommerce-mini-cart-item a:not(.remove):hover{color:#FF6A97 !important}

/* opcje: rozmiar, typ, plik */
.mvck__body dl.variation{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr);
  gap:2px 10px;
  margin:2px 0 0 !important;font-size:11px;line-height:1.4;
}
.mvck__body dl.variation dt{
  grid-column:1 !important;
  color:#8A8A8E !important;font-weight:400 !important;margin:0 !important;
  white-space:nowrap;
}
.mvck__body dl.variation dd{
  grid-column:2 !important;
  color:#F4F4F4 !important;margin:0 !important;
  overflow-wrap:anywhere;
}
.mvck__body dl.variation dd p{margin:0 !important}

/* cena i ilość — zawsze na końcu pozycji, pod zdjęciem i opisem */
.mvck__body .woocommerce-mini-cart-item .quantity{
  grid-column:1 / -1 !important;
  grid-row:auto;
  order:99;
  display:block !important;
  margin:10px 0 0 !important;
  padding-top:10px;
  border-top:1px solid rgba(255,255,255,.08);
  font-family:'Unbounded',sans-serif;font-weight:900;
  font-size:13px;color:#F4F4F4 !important;
  white-space:nowrap;
}
.mvck__body .quantity .amount,
.mvck__body .quantity bdi{
  color:#FF6A97 !important;text-decoration:none !important;
}

.mvck__body a.remove{
  position:absolute !important;top:16px;right:0;
  width:24px !important;height:24px !important;
  line-height:22px !important;font-size:15px !important;
  display:grid;place-items:center;
  color:#9A9A9E !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:50% !important;
  background:rgba(255,255,255,.04) !important;
  transition:.2s;
}
.mvck__body a.remove:hover{
  color:#161616 !important;background:#FF6A97 !important;border-color:#FF6A97 !important;
}

/* ---------- podsumowanie + przyciski ---------- */
.mvck__body .woocommerce-mini-cart__total{
  display:flex;align-items:center;justify-content:space-between;
  margin:20px 0 !important;padding:18px 0 0 !important;
  border-top:1px solid rgba(255,255,255,.12);
  font-family:'Unbounded',sans-serif;font-weight:900;
  font-size:13px;text-transform:uppercase;
}
.mvck__body .woocommerce-mini-cart__total strong{font-weight:900}
.mvck__body .woocommerce-mini-cart__total .amount{color:#FF6A97 !important;font-size:16px}

.mvck__body .woocommerce-mini-cart__buttons{
  display:flex;flex-direction:column;gap:10px;
  margin:0 !important;
}
.mvck__body .woocommerce-mini-cart__buttons a{
  display:grid;place-items:center;
  height:50px;border-radius:12px !important;
  font-family:'Unbounded',sans-serif;font-weight:900;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  text-decoration:none !important;
  transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s;
}
/* "Zobacz koszyk" — szkło */
.mvck__body .woocommerce-mini-cart__buttons a:not(.checkout){
  color:#F4F4F4 !important;
  border:1px solid rgba(255,255,255,.18) !important;
  background:
    radial-gradient(120% 160% at 14% 0%, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 58%),
    rgba(255,255,255,.04) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16);
}
.mvck__body .woocommerce-mini-cart__buttons a:not(.checkout):hover{
  color:#FF6A97 !important;border-color:rgba(255,106,151,.5) !important;
}
/* "Zamawiam" — różowe szkło */
.mvck__body .woocommerce-mini-cart__buttons a.checkout{
  position:relative;overflow:hidden;isolation:isolate;
  color:#161616 !important;
  border:1.5px solid rgba(255,255,255,.28) !important;
  background:
    radial-gradient(120% 160% at 12% 0%, rgba(255,255,255,.42) 0%, rgba(255,255,255,0) 55%),
    #FF6A97 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 12px 28px rgba(255,106,151,.30);
}
.mvck__body .woocommerce-mini-cart__buttons a.checkout::after{
  content:'';position:absolute;inset:-40% -25%;z-index:-1;pointer-events:none;
  background:linear-gradient(115deg,transparent 34%,rgba(255,255,255,.55) 46%,rgba(255,255,255,.18) 54%,transparent 66%);
  transform:translateX(-32%);
  animation:mvckSheen 5.5s ease-in-out infinite;
}
.mvck__body .woocommerce-mini-cart__buttons a.checkout:hover{
  transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65),0 18px 38px rgba(255,106,151,.44);
}
@keyframes mvckSheen{
  0%,100%{transform:translateX(-32%)}
  50%    {transform:translateX(32%)}
}

/* ---------- pusty koszyk ---------- */
.mvck__body .woocommerce-mini-cart__empty-message{
  padding:48px 24px;text-align:center;
  color:#9A9A9E;font-size:14px;
  border:1px dashed rgba(255,255,255,.14);
  border-radius:14px;
}

@media (prefers-reduced-motion:reduce){
  .mvck__panel,.mvck__veil,.mvck-btn{transition:none}
  .mvck__body .woocommerce-mini-cart__buttons a.checkout::after,
  .mvck-btn.is-bump{animation:none}
}

/* ============================================================
   KOMPAKTOWA IKONA KOSZYKA PRZY BURGERZE (mobile)
   ============================================================ */
.mvck-mini{
  position:relative;
  display:none;                 /* na desktopie mamy pełny przycisk */
  align-items:center;justify-content:center;
  width:44px;height:44px;
  margin-right:6px;
  border-radius:12px !important;
  border:1px solid rgba(255,255,255,.18) !important;
  background:
    radial-gradient(120% 160% at 14% 0%, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 58%),
    rgba(255,255,255,.05) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
  color:#FF6A97 !important;
  cursor:pointer;padding:0 !important;
  -webkit-appearance:none;appearance:none;
  transition:transform .22s cubic-bezier(.2,.8,.2,1),border-color .22s;
}
.mvck-mini svg{width:21px;height:21px}
.mvck-mini:active{transform:scale(.94)}
.mvck-mini.is-bump{animation:mvckBump .5s cubic-bezier(.2,.8,.2,1)}

.mvck-mini .mvck-count{top:-5px;right:-5px}

@media (max-width:900px){
  .mvck-mini{display:inline-flex}
  /* pełny przycisk chowamy — na mobile wystarczy ikona */
  button.mvck-cta{display:none !important}
}

/* panel na mobile zajmuje prawie cały ekran */
@media (max-width:520px){
  .mvck__panel{width:100%;border-left:0}
  .mvck__head{padding:18px 18px}
  .mvck__body{padding:16px 18px}
}
