custom-box-status-bar{position:fixed;bottom:52px;left:12px;right:12px;max-width:600px;margin:0 auto;z-index:20;background:#fffffff2;backdrop-filter:blur(12px) saturate(180%);-webkit-backdrop-filter:blur(12px) saturate(180%);border:2px solid rgba(248,107,87,.2);border-radius:9999px;box-shadow:0 10px 40px -10px #0000004d;transition:transform .4s cubic-bezier(.34,1.56,.64,1),opacity .3s ease-out;opacity:0;pointer-events:none;overflow:hidden;padding:0;will-change:transform,opacity;contain:layout style paint}custom-box-status-bar.hidden{transform:translateY(calc(100% + 52px));opacity:0}custom-box-status-bar.active{transform:translateY(0);opacity:1;pointer-events:all}@media (min-width: 640px){custom-box-status-bar{box-shadow:0 10px 50px -10px #00000059}}.custom-box-status-bar__container{max-width:100%;margin:0 auto;padding:0}.custom-box-status-bar__header{display:flex;align-items:center;gap:.75rem;justify-content:space-between}.custom-box-status-bar__info{display:flex;align-items:center;gap:.25rem;flex:1;min-width:0}.custom-box-status-bar__count{display:flex;align-items:center;gap:.25rem;font-size:1.875rem;color:#4b5563;font-weight:500}@media (min-width: 640px){.custom-box-status-bar__count{font-size:1.875rem;color:#1f2937}}.custom-box-status-bar__count span:first-child{font-weight:500}.custom-box-status-bar__price{display:none!important}.custom-box-status-bar__label{display:none}.custom-box-status-bar__actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.custom-box-status-bar__btn{display:flex;align-items:center;gap:.625rem;padding:1rem 1.75rem;border-radius:9999px;font-size:1.125rem;font-weight:600;letter-spacing:-.01em;transition:all .25s cubic-bezier(.4,0,.2,1);border:none;cursor:pointer;box-shadow:0 1px 2px #0000000d}.custom-box-status-bar__btn--preview{background:linear-gradient(135deg,#f86b57,#ef5843);color:#fff;position:relative;overflow:hidden;box-shadow:0 1px 2px #0000000d,0 4px 8px -2px #f86b5740,0 0 0 1px #f86b571a inset;transition:all .25s cubic-bezier(.4,0,.2,1)}.custom-box-status-bar__btn--preview:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(180deg,rgba(255,255,255,.1) 0%,transparent 100%);pointer-events:none}.custom-box-status-bar__btn--preview:hover{background:linear-gradient(135deg,#ef5843,#e64a35);transform:translateY(-1px);box-shadow:0 2px 4px -1px #0000000f,0 6px 12px -2px #f86b574d,0 0 0 1px #f86b5726 inset}.custom-box-status-bar__btn--preview:active{transform:translateY(0);transition:all .1s cubic-bezier(.4,0,.2,1);box-shadow:0 1px 2px #0000000d,0 2px 4px -1px #f86b5733,0 0 0 1px #f86b571a inset}.custom-box-status-bar__btn--preview svg{width:1.25rem;height:1.25rem;flex-shrink:0}.custom-box-status-bar__btn--glow{animation:button-glow 2s ease-in-out infinite}@keyframes button-glow{0%,to{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d,0 0 0 2px #f86b574d}50%{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d,0 0 0 2px #f86b574d,0 0 30px #f86b5799}}.custom-box-status-bar__btn--glow:hover{animation:none}custom-box-status-bar.box-full{animation:gentle-float 4s ease-in-out infinite}@keyframes gentle-float{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}custom-box-status-bar.box-full .custom-box-status-bar__btn--preview{animation:button-breathe 3s ease-in-out infinite}@keyframes button-breathe{0%,to{box-shadow:0 1px 2px #0000000d,0 8px 16px -4px #10b98159,0 0 0 1px #10b98126 inset}50%{box-shadow:0 2px 4px #0000000f,0 12px 24px -4px #10b98173,0 0 0 1px #10b98133 inset}}custom-box-status-bar.box-full .custom-box-status-bar__btn--preview:hover{animation:none}.custom-box-status-bar__btn--collapse{background-color:transparent;color:#6b7280;padding:.5rem;display:flex;align-items:center;justify-content:center;box-shadow:none}.custom-box-status-bar__btn--collapse:hover{background-color:#f3f4f6}.custom-box-status-bar__btn--collapse svg{transition:transform .3s}.custom-box-status-bar__content{overflow:hidden;transition:all .3s ease-in-out}.custom-box-status-bar__products{padding:1rem .5rem;display:flex;gap:.5rem;overflow-x:auto;scroll-behavior:smooth}.custom-box-status-bar__products::-webkit-scrollbar{height:4px}.custom-box-status-bar__products::-webkit-scrollbar-track{background:transparent}.custom-box-status-bar__products::-webkit-scrollbar-thumb{background:#9ca3af;border-radius:2px}.custom-box-mini-card{min-width:280px;background:#fff;border:2px solid #e5e7eb;border-radius:8px;padding:.5rem;display:flex;gap:.75rem;align-items:center}.custom-box-mini-card__image{width:48px;height:48px;border-radius:6px;overflow:hidden;flex-shrink:0;background:#f3f4f6}.custom-box-mini-card__image img{width:100%;height:100%;object-fit:cover}.custom-box-mini-card__info{flex:1;min-width:0}.custom-box-mini-card__title{font-size:.75rem;font-weight:500;color:#1f2937;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:.25rem}.custom-box-mini-card__controls{display:flex;align-items:center;gap:.5rem}.custom-box-mini-card__btn{width:24px;height:24px;border-radius:4px;border:1px solid #d1d5db;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;padding:0}.custom-box-mini-card__btn:hover{background:#f3f4f6;border-color:#9ca3af}.custom-box-mini-card__quantity{font-size:.875rem;font-weight:600;color:#1f2937;min-width:20px;text-align:center}.custom-box-status-bar__badge{position:relative;flex-shrink:0;display:none}@media (min-width: 640px){.custom-box-status-bar__badge{display:block}}.custom-box-status-bar__badge-circle{background:linear-gradient(to right,#f86b57,#ef4444);color:#fff;font-size:.875rem;font-weight:700;border-radius:50%;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 6px -1px #0000001a}.custom-box-status-bar__badge-pulse{position:absolute;top:-.25rem;right:-.25rem;width:.75rem;height:.75rem;background-color:#10b981;border-radius:50%;animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}body.custom-box-preview-modal-open,body:has(custom-box-preview-modal[active]:not([hidden])){overflow:hidden!important}html:has(custom-box-preview-modal[active]:not([hidden])){overflow:hidden!important}custom-box-preview-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;width:100%;height:100%;pointer-events:none;will-change:contents;contain:layout style}custom-box-preview-modal:not([hidden]){display:block}custom-box-preview-modal[active]{pointer-events:auto}custom-box-preview-modal .fixed-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:rgba(var(--color-background),.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1;cursor:pointer;opacity:0;visibility:hidden;pointer-events:none;transition:.8s cubic-bezier(.7,0,.2,1);transition-property:opacity,visibility,background-color;will-change:opacity,visibility;contain:strict}custom-box-preview-modal[active]>.fixed-overlay{opacity:1;visibility:visible;pointer-events:auto;cursor:zoom-out}custom-box-preview-modal .drawer__inner{--translate-y: 0;--translate-x: 100%;inset-inline:auto 0;position:absolute;top:0;right:0;bottom:0;width:100%;max-width:48rem;background:rgb(var(--color-background));color:rgb(var(--color-foreground));overflow:hidden;z-index:10;transform:translate(var(--translate-x),var(--translate-y));transition:transform .6s cubic-bezier(.7,0,.2,1);box-shadow:0 -20px 100px -20px #712d2166}custom-box-preview-modal[active]>.drawer__inner{--translate-x: 0}custom-box-preview-modal .cart-item__media{flex:0 0 8rem}@media (max-width: 767.98px){custom-box-preview-modal .cart-item__media{flex:0 0 6.5rem}}.text-red-500{color:#ef4444!important}.text-green-500{color:#10b981!important}.font-bold{font-weight:700!important}.custom-box-status-bar__progress-wrapper{position:absolute;top:0;left:0;right:0;width:100%;height:6px;background-color:#e5e7eb!important;border-radius:9999px 9999px 0 0;overflow:hidden;z-index:10;display:block!important;visibility:visible!important}.custom-box-status-bar__progress-bar{position:relative;width:100%;height:100%;display:block}.custom-box-status-bar__progress-fill{display:block!important;position:absolute;top:0;left:0;height:100%;width:50%;background-color:#f86b57!important;transition:width .4s ease-out;z-index:11}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.custom-box-status-bar__container{padding:1.5rem 1.75rem 1.25rem}.emoji-icon{font-size:1.5rem;display:inline-block;animation:emoji-bounce .6s ease-out;margin-right:.5rem}@keyframes emoji-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.3)}}.confetti-container{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;overflow:visible;z-index:100}.confetti{position:absolute;width:8px;height:8px;top:-10px;border-radius:50%;animation:confetti-fall 3s ease-out forwards}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(300px) rotate(720deg);opacity:0}}custom-box-status-bar.box-full{animation:gentle-float 4s ease-in-out infinite;border:2px solid rgba(16,185,129,.3)}custom-box-status-bar.active.box-full{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border:none;box-shadow:none}custom-box-status-bar.box-full .custom-box-status-bar__progress-wrapper{display:none!important}custom-box-status-bar.box-full .custom-box-status-bar__progress-fill{background-color:#10b981!important}custom-box-status-bar.box-full .custom-box-status-bar__btn--preview svg{flex-shrink:0;width:1.5rem;height:1.5rem}custom-box-status-bar.box-full .custom-box-status-bar__btn--preview span{position:relative;z-index:1;font-size:1.375rem;transition:transform .25s cubic-bezier(.4,0,.2,1)}custom-box-status-bar.box-full .custom-box-status-bar__btn--preview svg{transition:transform .25s cubic-bezier(.4,0,.2,1)}@media (min-width: 640px){custom-box-status-bar.box-full .custom-box-status-bar__btn--preview{font-size:1.5rem;padding:1.5rem 3.25rem}custom-box-status-bar.box-full .custom-box-status-bar__btn--preview svg{width:1.875rem;height:1.875rem}custom-box-status-bar.box-full .custom-box-status-bar__btn--preview span{font-size:1.5rem}}
/*# sourceMappingURL=/cdn/shop/t/41/assets/custom-box-status-bar.css.map */