.variant-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.variant-modal.active{opacity:1;visibility:visible}.variant-modal-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0009;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);cursor:pointer;z-index:1}.variant-modal-content{position:relative;z-index:2;background:#fff;border-radius:20px;max-width:600px;width:100%;max-height:90vh;overflow-y:auto;overflow-x:hidden;box-shadow:0 20px 60px #0000004d,0 0 40px #e84e9a1a,inset 0 1px #fffc;transform:scale(.9);transition:transform .3s cubic-bezier(.34,1.56,.64,1);border:2px solid rgba(232,78,154,.2);scrollbar-width:none;-ms-overflow-style:none}.variant-modal-content::-webkit-scrollbar{display:none}.variant-modal.active .variant-modal-content{transform:scale(1)}.variant-modal-close{position:absolute;top:20px;right:20px;width:40px;height:40px;border:none;background:#4497bf1a;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;z-index:10}.variant-modal-close:hover{background:#4497bf33;transform:rotate(90deg)}.variant-modal-close svg{color:#666}.variant-modal-header{padding:40px 30px 30px;text-align:center;border-bottom:1px solid rgba(68,151,191,.2);position:relative;z-index:1;background:linear-gradient(180deg,#fffffff2,#f0f8ffe6)}.variant-modal-product-image{width:120px;height:120px;object-fit:contain;margin:0 auto 20px;display:block}.variant-modal-product-title{font-size:24px;font-weight:700;margin-bottom:10px;color:#1a1a1a}.variant-modal-product-price{font-size:20px;font-weight:600;color:var(--modal-primary-color, #4497BF)}.variant-modal-body{padding:30px;position:relative;z-index:1;background:#ffffffe6}.variant-modal-section-title{font-size:16px;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:20px;color:#4497bf}.variant-modal-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px;margin-bottom:24px}.variant-modal-option{display:flex;flex-direction:column;align-items:center;padding:20px;border:2px solid #e7e7e7;border-radius:16px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);background:#fff;position:relative}.variant-modal-option:hover{border-color:var(--modal-primary-color, #4497BF);transform:translateY(-4px);box-shadow:0 8px 20px #4497bf26}.variant-modal-option.active{border-color:var(--modal-primary-color, #4497BF);background:linear-gradient(135deg,#4497bf14,#64b4dc14);box-shadow:0 0 0 2px var(--modal-primary-color, #4497BF)}.variant-modal-option.unavailable{opacity:.4;cursor:not-allowed}.variant-modal-option.unavailable:hover{transform:none;box-shadow:none;border-color:#e7e7e7}.variant-modal-option-icon{width:calc(var(--modal-icon-size, 60px) * 1.5);height:calc(var(--modal-icon-size, 60px) * 1.5);margin-bottom:12px;object-fit:contain}.variant-modal-option-label{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#1a1a1a;margin-bottom:4px}.variant-modal-option-price{font-size:16px;font-weight:700;color:var(--modal-primary-color, #4497BF)}.variant-modal-option-sold-out{position:absolute;top:10px;right:10px;background:red;color:#fff;font-size:10px;font-weight:600;padding:4px 8px;border-radius:4px;text-transform:uppercase}.variant-modal-selected-info{padding:16px;background:linear-gradient(135deg,#4497bf1a,#64b4dc1a);border-radius:12px;text-align:center}.selected-variant-name{font-size:16px;font-weight:600;margin-bottom:4px;color:#1a1a1a}.selected-variant-price{font-size:18px;font-weight:700;color:var(--modal-primary-color, #4497BF)}.variant-modal-footer{padding:0 30px 30px;position:relative;z-index:1;background:#fffffff2;border-radius:0 0 20px 20px}.variant-modal-add-btn{width:100%;padding:18px 32px;background:linear-gradient(135deg,var(--modal-primary-color, #4497BF),var(--modal-secondary-color, #5ab5d9));color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:all .3s cubic-bezier(.4,0,.2,1);text-transform:uppercase;letter-spacing:1px;position:relative;overflow:visible}.variant-modal-add-btn:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 8px 30px #4497bf66}.variant-modal-add-btn:disabled{opacity:.5;cursor:not-allowed;background:#ccc}.variant-modal-add-btn svg{width:20px;height:20px}.variant-modal-success{position:absolute;top:0;right:0;bottom:0;left:0;background:#fffffffa;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:20px;z-index:10}.success-checkmark{margin-bottom:20px;animation:scaleIn .5s cubic-bezier(.34,1.56,.64,1)}@keyframes scaleIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.success-checkmark circle{stroke-dasharray:240;stroke-dashoffset:240;animation:drawCircle .6s ease-out forwards}.success-checkmark path{stroke-dasharray:60;stroke-dashoffset:60;animation:drawCheck .4s ease-out .3s forwards}@keyframes drawCircle{to{stroke-dashoffset:0}}@keyframes drawCheck{to{stroke-dashoffset:0}}.success-message{font-size:24px;font-weight:700;color:#4caf50;animation:fadeInUp .4s ease-out .5s both}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.variant-modal-floating-pet{position:absolute;pointer-events:none;animation:floatPet 3s ease-in-out infinite;transition:all .6s cubic-bezier(.4,0,.2,1);z-index:5;opacity:0}.variant-modal.active .variant-modal-floating-pet{opacity:1}.variant-modal-floating-pet.exit-left{animation:slideOutLeft .6s cubic-bezier(.4,0,.2,1) forwards}.variant-modal-floating-pet.exit-right{animation:slideOutRight .6s cubic-bezier(.4,0,.2,1) forwards}@keyframes floatPet{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes slideOutLeft{to{transform:translate(-200px);opacity:0}}@keyframes slideOutRight{to{transform:translate(200px);opacity:0}}.variant-modal-floating-pet img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 12px rgba(0,0,0,.15))}@media(max-width:1024px){.variant-modal-floating-pet{display:none!important}}@media(max-width:749px){.variant-modal{padding:0;align-items:flex-end}.variant-modal-content{border-radius:20px 20px 0 0;max-height:85vh;width:100%;max-width:100%;transform:translateY(100%)}.variant-modal.active .variant-modal-content{transform:translateY(0)}.variant-modal-close{top:16px;right:16px;width:32px;height:32px;background:transparent}.variant-modal-close svg{width:20px;height:20px;color:#999}.variant-modal-header{padding:20px 20px 16px;border-bottom:1px solid #f0f0f0;text-align:left;display:flex;align-items:center;gap:12px}.variant-modal-product-image{width:24px;height:24px;margin:0;flex-shrink:0;border-radius:4px}.variant-modal-product-title{font-size:18px;font-weight:600;color:#1a1a1a;padding-right:40px;margin:0}.variant-modal-product-price{display:none}.variant-modal-body{padding:0}.variant-modal-section-title{display:none}.variant-modal-options{display:flex;flex-direction:column;gap:0;margin-bottom:0}.variant-modal-option{flex-direction:row;align-items:center;padding:20px 24px;border:none;border-bottom:1px solid #f0f0f0;border-radius:0;background:#fff;justify-content:flex-start;position:relative}.variant-modal-option:hover{border-color:#f0f0f0;transform:none;box-shadow:none;background:#fafafa}.variant-modal-option.active{border-bottom-color:#4497bf4d;background:linear-gradient(135deg,#4497bf14,#64b4dc14);box-shadow:none}.variant-modal-option-icon{width:40px;height:40px;margin-bottom:0;margin-right:16px;flex-shrink:0}.variant-modal-option-label{font-size:15px;font-weight:500;text-transform:none;letter-spacing:0;color:#1a1a1a;margin-bottom:0;text-align:left;flex:1}.variant-modal-option-price{font-size:15px;font-weight:600;color:#1a1a1a;margin-left:16px;flex-shrink:0}.variant-modal-option.active .variant-modal-option-price{color:var(--modal-primary-color, #4497BF)}.variant-modal-selected-info{display:none!important}.variant-modal-footer{padding:16px 20px 20px;background:#fff;border-top:1px solid #f0f0f0}.variant-modal-add-btn{padding:16px 24px;font-size:15px;font-weight:600;border-radius:10px}}
/*# sourceMappingURL=/cdn/shop/t/12/assets/variant-selection-modal.css.map */
