/* trikito-popup-1.css — Shoptet colorbox popupy (Přidáno do košíku aj.)
   v SVĚTLO: bílý panel radius 20, fade+rise vstup, černé CTA se žlutým
   hoverem. CSS-only, do chování colorboxu nesahá. Tokeny literálně,
   popup žije mimo naše scopy. */

/* ── overlay ── */
#cboxOverlay{background:rgba(27,21,19,.7)!important;animation:tkPopFade .3s ease}
@keyframes tkPopFade{from{opacity:0}}

/* ── panel ── */
#colorbox{animation:tkPopVstup .38s cubic-bezier(.16,1,.3,1);outline:0}
@keyframes tkPopVstup{from{opacity:0;transform:translateY(16px) scale(.98)}}
#cboxContent{background:#fff!important;border-radius:20px!important;
  box-shadow:0 24px 70px rgba(27,21,19,.28);overflow:visible!important}
#cboxLoadedContent{border-radius:20px;background:#fff!important;
  font-family:'Grift',-apple-system,system-ui,sans-serif;color:#1B1513}
#cboxTopLeft,#cboxTopCenter,#cboxTopRight,
#cboxMiddleLeft,#cboxMiddleRight,
#cboxBottomLeft,#cboxBottomCenter,#cboxBottomRight{background:none!important;display:none!important}

/* ── zavírací křížek (nativně textové tlačítko Zavřít) ── */
#cboxClose{position:absolute;top:14px;right:16px;width:38px;height:38px;
  font-size:0!important;line-height:0;text-indent:0!important;
  background:#fff!important;border:0;border-radius:50%;
  box-shadow:inset 0 0 0 1.5px rgba(27,21,19,.16);cursor:pointer;
  transition:box-shadow .18s,transform .18s;z-index:5}
#cboxClose::before{content:"×";font-size:22px;line-height:38px;color:#1B1513;
  font-family:'Grift',sans-serif;display:block}
#cboxClose:hover{box-shadow:inset 0 0 0 2px #1B1513;transform:rotate(90deg)}

/* ── obsah Přidáno do košíku ── */
#colorbox .advanced-order{padding:34px 38px 30px;text-align:center}
#colorbox .advanced-order .h1{font-size:26px;font-weight:800;letter-spacing:-.015em;
  color:#1B1513;margin:0 0 6px;font-family:inherit}
#colorbox .advanced-order .h2{font-size:16px;font-weight:700;color:#1B1513;margin:0 0 18px}
#colorbox .advanced-order .h2 span{display:inline-block;font-weight:600;
  color:rgba(27,21,19,.62);margin-left:6px}
#colorbox .extras-wrap{max-width:520px;margin:0 auto 22px}
#colorbox .extra.delivery{background:#F4F1EA;border-radius:14px;padding:14px 18px;
  font-size:14.5px;color:#1B1513;position:relative;overflow:hidden}
#colorbox .extra.delivery::before,#colorbox .extra.delivery::after{display:none!important}
#colorbox .extra.delivery img,#colorbox .extra.delivery svg,
#colorbox .extra.delivery .icon{display:none!important}
#colorbox .extra.delivery strong{font-weight:800}
#colorbox .extra.delivery strong:last-of-type{color:#0F6F5C}
#colorbox .extra.delivery .price-range{height:5px;background:rgba(27,21,19,.10);
  border-radius:4px;margin-top:11px;overflow:hidden}
#colorbox .extra.delivery .price-range>div{height:100%;background:#0F6F5C;border-radius:4px}

/* ── tlačítka ── */
#colorbox .advancedOrder__buttons{display:flex;justify-content:center;align-items:center;
  gap:22px;flex-wrap:wrap;margin-top:4px}
#colorbox .advancedOrder__buttons .btn{float:none;margin:0}
#colorbox .btn.next-step-back{background:none!important;border:0!important;
  color:rgba(27,21,19,.62)!important;font:600 14.5px/1.2 'Grift',sans-serif;
  text-transform:none!important;text-decoration:underline;text-underline-offset:3px;
  padding:10px 6px;cursor:pointer;transition:color .18s;box-shadow:none!important}
#colorbox .btn.next-step-back:hover{color:#1B1513!important}
#colorbox .btn.btn-conversion{background:#1B1513!important;color:#fff!important;
  border:0!important;border-radius:16px!important;
  font:700 15px/1 'Grift',sans-serif;letter-spacing:.02em;text-transform:none!important;
  padding:17px 34px;cursor:pointer;box-shadow:none!important;text-decoration:none!important;
  transition:background .25s cubic-bezier(.16,1,.3,1),color .25s cubic-bezier(.16,1,.3,1)}
#colorbox .btn.btn-conversion:hover{background:#FFD21E!important;color:#1B1513!important}

/* ── mobil ── */
@media(max-width:620px){
  #colorbox .advanced-order{padding:26px 18px 22px}
  #colorbox .advanced-order .h1{font-size:21px}
  #colorbox .advancedOrder__buttons{gap:12px}
  #colorbox .btn.btn-conversion{width:100%;padding:16px 20px}
}
@media(prefers-reduced-motion:reduce){
  #colorbox,#cboxOverlay{animation:none}
  #cboxClose{transition:none}
}
