@keyframes cekonay-shake {
10%,90%{transform:translate3d(-1px, 0, 0);}
20%,80%{transform:translate3d(2px, 0, 0);}
30%,50%,70%{transform:translate3d(-4px, 0, 0);}
40%,60%{transform:translate3d(4px, 0, 0);}
}
@keyframes cekonay-spin {
to{transform:rotate(360deg);}
}
.cekonay-flycart-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.7);z-index:99998;opacity:0;visibility:hidden;transition:opacity 0.3s ease, visibility 0.3s ease;backdrop-filter:blur(2px);}
.cekonay-flycart-container{position:fixed;top:0;left:100%;width:100%;max-width:420px;height:100%;background:#fff;z-index:99999;display:flex;flex-direction:column;transition:left 0.5s cubic-bezier(0.4, 0, 0.2, 1);box-shadow:-5px 0 20px rgba(0, 0, 0, 0.15);}
body.cekonay-flycart-open{overflow:hidden;}
body.cekonay-flycart-open .cekonay-flycart-overlay{opacity:1;visibility:visible;}
body.cekonay-flycart-open .cekonay-flycart-container{left:calc(100% - 420px);}
.cekonay-flycart-header{padding:20px;padding-top:max(20px, env(safe-area-inset-top));background:#fef3e9;color:#27221b;display:flex;justify-content:space-between;align-items:center;flex-shrink:0;transition:background-color 0.3s ease, color 0.3s ease;}
@media (prefers-color-scheme: dark) {
.cekonay-flycart-header{background:#191c21;color:#cdd4f4;}
}
.cekonay-flycart-header h3{margin:0;font-size:18px;font-weight:600;color:inherit;}
@media (prefers-color-scheme: dark) {
.cekonay-flycart-header h3{color:#cdd4f4 !important;}
}
.cekonay-flycart-close{width:24px;height:24px;background:transparent;border:none;color:#27221b;font-size:24px;line-height:1;cursor:pointer;padding:0;transition:transform 0.3s ease, opacity 0.3s ease, color 0.3s ease;opacity:0.8;}
@media (prefers-color-scheme: dark) {
.cekonay-flycart-close{color:#cdd4f4;}
}
.cekonay-flycart-close:hover{opacity:1;transform:scale(1.1);}
.cekonay-flycart-wrapper{display:flex;flex-direction:column;flex-grow:1;overflow:hidden;}
.cekonay-flycart-content{flex-grow:1;overflow-x:hidden;overflow-y:auto;padding:20px 0;background:#f8f8f8;}
@media (prefers-color-scheme: dark) {
.cekonay-flycart-content{background:#24323f;}
}
.cekonay-flycart-content::-webkit-scrollbar{width:8px;}
.cekonay-flycart-content::-webkit-scrollbar-track{background:#f1f1f1;}
.cekonay-flycart-content::-webkit-scrollbar-thumb{background:#ccc;border-radius:4px;}
.cekonay-flycart-content::-webkit-scrollbar-thumb:hover{background:#999;}
.cekonay-flycart-items{padding:0;}
.cekonay-flycart-item{padding:0 20px;margin:10px 0 0 0;position:relative;}
.cekonay-flycart-item:first-child{margin-top:0;}
.cekonay-flycart-item-inner{padding:10px;display:flex;align-items:flex-start;background:#ffffff;border-radius:4px;box-shadow:0 1px 3px rgba(0, 0, 0, 0.05);transition:transform 0.3s ease, box-shadow 0.3s ease;position:relative;}
.cekonay-flycart-item-inner:hover{box-shadow:0 2px 8px rgba(0, 0, 0, 0.1);}
.cekonay-flycart-item-image-qty{display:flex;flex-direction:column;align-items:center;width:80px;flex:0 0 80px;margin-right:12px;}
.cekonay-flycart-item-image{width:80px;height:80px;overflow:hidden;border-radius:4px;margin-bottom:8px;}
.cekonay-flycart-item-image img{width:100%;height:100%;object-fit:cover;border-radius:4px;}
.cekonay-flycart-qty{display:flex;align-items:center;justify-content:center;}
.cekonay-flycart-qty-btn{width:28px;height:28px;background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);border:none;color:#ffffff;font-size:15px;font-weight:700;line-height:1;cursor:pointer;transition:transform 0.3s ease, box-shadow 0.3s ease;-webkit-tap-highlight-color:transparent;user-select:none;box-shadow:0 2px 6px rgba(102, 126, 234, 0.3);}
.cekonay-flycart-qty-btn:hover{transform:scale(1.05);box-shadow:0 4px 12px rgba(102, 126, 234, 0.5);}
.cekonay-flycart-qty-btn:active{transform:scale(0.98);}
.cekonay-flycart-qty-minus{border-radius:4px 0 0 4px;}
.cekonay-flycart-qty-plus{border-radius:0 4px 4px 0;}
.cekonay-flycart-qty-input{width:32px;height:26px;text-align:center;border:none;background:#eeeeee;color:#444;font-size:12px;font-weight:600;padding:0;-moz-appearance:textfield;}
.cekonay-flycart-qty-input::-webkit-inner-spin-button, .cekonay-flycart-qty-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;}
.cekonay-flycart-qty-input:focus{outline:none;}
.cekonay-flycart-item-details{flex-grow:1;display:flex;flex-direction:column;min-width:0;}
.cekonay-flycart-item-name{font-size:14px;font-weight:600;color:#222;margin:0 0 6px 0;line-height:1.3;}
.cekonay-flycart-item-name a{color:#222;text-decoration:none;}
.cekonay-flycart-item-name a:hover{color:#0073aa;}
.cekonay-flycart-item-data{font-size:11px;color:#888;margin:4px 0;line-height:1.4;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;}
.cekonay-flycart-item-data p, .cekonay-flycart-item-data dl{margin:0;padding:0;display:inline-flex;flex-wrap:wrap;gap:3px;}
.cekonay-flycart-item-data dt{font-weight:600;display:inline;margin:0;}
.cekonay-flycart-item-data dd{display:inline;margin:0;}
.cekonay-flycart-item-data dd:after{content:' | ';display:inline;margin:0 4px;color:#ccc;}
.cekonay-flycart-item-data dd:last-child:after{content:'';}
.cekonay-flycart-item-price{font-size:13px;color:#666;margin:0 0 4px 0;}
.cekonay-flycart-item-price .amount{font-weight:600;color:#333;}
.cekonay-flycart-item-remove{position:absolute;top:10px;right:10px;width:22px;height:22px;background:#ff4444;border:none;border-radius:50%;color:#fff;font-size:14px;line-height:1;cursor:pointer;opacity:0;transition:opacity 0.3s ease, transform 0.3s ease;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;}
.cekonay-flycart-item-inner:hover .cekonay-flycart-item-remove{opacity:1;}
.cekonay-flycart-item-remove:hover{transform:scale(1.1);background:#cc0000;}
.cekonay-flycart-empty{text-align:center;padding:60px 20px;color:#999;}
.cekonay-flycart-empty-icon{font-size:64px;margin-bottom:20px;opacity:0.3;}
.cekonay-flycart-empty-text{font-size:16px;color:#666;}
.cekonay-flycart-footer{padding:20px;padding-bottom:max(20px, env(safe-area-inset-bottom));background:#fff;border-top:1px solid #e0e0e0;flex-shrink:0;}
@media (prefers-color-scheme: dark) {
.cekonay-flycart-footer{background:#d1d0ec;}
}
.cekonay-flycart-total{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;font-size:16px;font-weight:600;color:#333;}
.cekonay-flycart-total-label{color:#666;}
.cekonay-flycart-total-amount{color:#333;font-size:18px;}
.cekonay-flycart-actions{display:flex;gap:10px;}
.cekonay-flycart-btn{flex:1;padding:12px 20px;border:none;border-radius:98px;font-size:14px;font-weight:600;cursor:pointer;text-align:center;text-decoration:none;transition:all 0.3s ease;display:inline-block;}
.cekonay-flycart-btn-cart{background:#f0f0f0;color:#333;border:2px solid #667eea;font-weight:700;transition:all 0.3s ease;}
.cekonay-flycart-btn-cart:hover{background:#667eea;color:#ffffff;transform:translateY(-2px);box-shadow:0 4px 12px rgba(102, 126, 234, 0.3);}
.cekonay-flycart-btn-checkout{background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);color:#ffffff;font-weight:700;border:none;transition:all 0.3s ease;box-shadow:0 4px 12px rgba(102, 126, 234, 0.4);}
.cekonay-flycart-btn-checkout:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(102, 126, 234, 0.6);}
.cekonay-flycart-count{position:fixed;bottom:max(20px, env(safe-area-inset-bottom, 20px));right:max(20px, env(safe-area-inset-right, 20px));width:60px;height:60px;background:linear-gradient(135deg, #1a1a1a 0%, #000000 100%);border-radius:50%;box-shadow:0 4px 16px rgba(0, 0, 0, 0.5);cursor:pointer;z-index:99997;display:flex;align-items:center;justify-content:center;transition:transform 0.3s ease, box-shadow 0.3s ease;pointer-events:auto !important;}
.cekonay-flycart-count:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 8px 24px rgba(0, 0, 0, 0.6);}
.cekonay-flycart-count svg{width:26px;height:26px;color:#ffffff;stroke:#ffffff;fill:none;}
.cekonay-flycart-count-badge{position:absolute;top:-4px;right:-4px;min-width:22px;height:22px;background:#ff4444;color:#fff;border-radius:11px;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 6px;box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);}
.cekonay-flycart-shake{animation:cekonay-shake 0.5s;}
.cekonay-flycart-count-empty{display:none !important;}
.cekonay-flycart-loading{pointer-events:none;opacity:0.6;}
.cekonay-flycart-loading::before{content:'';position:absolute;top:50%;left:50%;width:24px;height:24px;margin:-12px 0 0 -12px;border:3px solid #f3f3f3;border-top:3px solid #667eea;border-radius:50%;animation:cekonay-spin 1s linear infinite;z-index:100000;}
@media(max-width:768px){
.cekonay-flycart-container{max-width:100%;}
body.cekonay-flycart-open .cekonay-flycart-container{left:0;}
.cekonay-flycart-content{padding-left:max(0px, env(safe-area-inset-left));padding-right:max(0px, env(safe-area-inset-right));}
.cekonay-flycart-count{width:56px;height:56px;}
}
@media(max-width:480px){
.cekonay-flycart-header{padding-left:max(20px, env(safe-area-inset-left));padding-right:max(20px, env(safe-area-inset-right));}
.cekonay-flycart-footer{padding-left:max(20px, env(safe-area-inset-left));padding-right:max(20px, env(safe-area-inset-right));}
.cekonay-flycart-actions{flex-direction:column;}
.cekonay-flycart-btn{width:100%;}
.cekonay-flycart-qty-input{font-size:16px;}
}
@media (prefers-reduced-motion: reduce) {
* {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
}
}