/* MouSou AJAX add-to-cart v1 */

.mousou-cart-loading,
.mousou-cart-success,
.mousou-cart-error{
 display:inline-flex !important;
 align-items:center !important;
 justify-content:center !important;
 gap:8px !important;
 transition:transform .18s ease, background-color .18s ease, border-color .18s ease !important;
}

.mousou-cart-success{
 background:#118a4e !important;
 border-color:#118a4e !important;
 color:#fff !important;
}

.mousou-cart-error{
 background:#b42318 !important;
 border-color:#b42318 !important;
 color:#fff !important;
}

.mousou-cart-spinner{
 width:17px;
 height:17px;
 border:2px solid rgba(255,255,255,.45);
 border-top-color:#fff;
 border-radius:50%;
 display:inline-block;
 animation:mousouCartSpin .7s linear infinite;
}

.mousou-cart-check{
 width:22px;
 height:22px;
 border-radius:50%;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 background:rgba(255,255,255,.18);
 font-weight:900;
}

.mousou-ajax-cart-toast{
 position:fixed;
 top:20px;
 left:50%;
 transform:translate(-50%, -18px);
 z-index:12000;
 min-width:min(360px, calc(100vw - 28px));
 max-width:calc(100vw - 28px);
 padding:13px 16px;
 display:flex;
 align-items:center;
 justify-content:center;
 gap:10px;
 border-radius:18px;
 background:#10213f;
 color:#fff;
 box-shadow:0 18px 42px rgba(16,33,63,.24);
 font-weight:800;
 text-align:center;
 opacity:0;
 visibility:hidden;
 pointer-events:none;
 transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
}

.mousou-ajax-cart-toast.is-visible{
 opacity:1;
 visibility:visible;
 transform:translate(-50%, 0);
}

.mousou-ajax-cart-toast.is-error{
 background:#b42318;
}

.mousou-toast-icon{
 width:26px;
 height:26px;
 flex:0 0 26px;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 border-radius:50%;
 background:rgba(255,255,255,.17);
 font-size:16px;
 font-weight:900;
}

.mousou-cart-bump{
 animation:mousouCartBump .48s ease;
}

@keyframes mousouCartSpin{
 to{transform:rotate(360deg)}
}

@keyframes mousouCartBump{
 0%,100%{transform:scale(1)}
 45%{transform:scale(1.15)}
}

@media(max-width:768px){
 .mousou-ajax-cart-toast{
  top:calc(12px + env(safe-area-inset-top, 0px));
  min-width:calc(100vw - 24px);
  padding:12px 14px;
  border-radius:16px;
  font-size:14px;
 }
}
