.alert{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);opacity:0;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:16px;align-items:center;gap:15px;margin-bottom:15px;padding:20px;font-family:Vazir,Tahoma,Arial,sans-serif;transition:all .8s cubic-bezier(.68,-.55,.265,1.55);display:flex;position:relative;overflow:hidden;transform:translate(100%);box-shadow:0 8px 32px #0000004d,inset 0 1px #ffffff1a}.alert:before{content:"";background:linear-gradient(90deg,#0000,currentColor,#0000);height:3px;animation:2s infinite shimmer;position:absolute;top:0;left:0;right:0;transform:translate(-100%)}.alert.show{opacity:1;transform:translate(0)}.alert.hide{opacity:0;transform:translate(100%)}.alert .alert-icon{z-index:1;flex-shrink:0;width:24px;height:24px;animation:2s infinite pulse;position:relative}.alert .alert-icon svg{stroke-width:2.5px;width:100%;height:100%}.alert .alert-content{z-index:1;flex:1;position:relative}.alert .alert-content h3{margin-bottom:4px;font-family:Vazir,Tahoma,Arial,sans-serif;font-size:16px;font-weight:600;animation:.8s ease-out .2s both slideInUp}.alert .alert-content p{opacity:.8;font-family:Vazir,Tahoma,Arial,sans-serif;font-size:14px;animation:.8s ease-out .4s both slideInUp}.alert .alert-close{cursor:pointer;color:inherit;opacity:.7;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:1;background:#ffffff1a;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;font-size:20px;transition:all .3s;animation:.8s ease-out .6s both slideInUp;display:flex;position:relative}.alert .alert-close:hover{opacity:1;background:#fff3;transform:scale(1.1);box-shadow:0 4px 15px #0003}.alert .ripple-effect{pointer-events:none;background:#ffffff4d;border-radius:50%;width:20px;height:20px;margin-top:-10px;margin-left:-10px;animation:.6s linear ripple;position:absolute;top:50%;left:50%;transform:scale(0)}.alert-success{color:#10b981;background:linear-gradient(135deg,#10b98126,#10b9810d);border-left:4px solid #10b981;box-shadow:0 8px 32px #0000004d,inset 0 1px #ffffff1a,0 0 20px #10b9811a}.alert-success:before{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #10b9814d;border-radius:50%;width:8px;height:8px;animation:6s ease-in-out 2s infinite bubbleFloat;position:absolute;top:90%;left:30%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #10b98133}.alert-success:after{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #10b9814d;border-radius:50%;width:12px;height:12px;animation:6s ease-in-out infinite bubbleFloat;position:absolute;top:85%;left:10%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #10b98133}.alert-success .bubble-1{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #10b9814d;border-radius:50%;width:6px;height:6px;animation:6s ease-in-out 1s infinite bubbleFloat;position:absolute;top:80%;left:5%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #10b98133}.alert-success .bubble-2{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #10b9814d;border-radius:50%;width:10px;height:10px;animation:6s ease-in-out 3s infinite bubbleFloat;position:absolute;top:88%;left:35%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #10b98133}.alert-success .bubble-3{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #10b9814d;border-radius:50%;width:14px;height:14px;animation:6s ease-in-out 4s infinite bubbleFloat;position:absolute;top:82%;left:55%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #10b98133}.alert-warning{color:#fbbf24;background:linear-gradient(135deg,#fbbf2426,#fbbf240d);border-left:4px solid #fbbf24;box-shadow:0 8px 32px #0000004d,inset 0 1px #ffffff1a,0 0 20px #fbbf241a}.alert-warning:before{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #fbbf244d;border-radius:50%;width:6px;height:6px;animation:6s ease-in-out 1.5s infinite bubbleFloat;position:absolute;top:92%;left:40%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #fbbf2433}.alert-warning:after{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #fbbf244d;border-radius:50%;width:10px;height:10px;animation:6s ease-in-out infinite bubbleFloat;position:absolute;top:88%;left:15%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #fbbf2433}.alert-warning .bubble-1{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #fbbf244d;border-radius:50%;width:8px;height:8px;animation:6s ease-in-out 2.5s infinite bubbleFloat;position:absolute;top:85%;left:5%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #fbbf2433}.alert-warning .bubble-2{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #fbbf244d;border-radius:50%;width:12px;height:12px;animation:6s ease-in-out 4s infinite bubbleFloat;position:absolute;top:80%;left:35%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #fbbf2433}.alert-warning .bubble-3{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #fbbf244d;border-radius:50%;width:7px;height:7px;animation:6s ease-in-out 5s infinite bubbleFloat;position:absolute;top:90%;left:55%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #fbbf2433}.alert-error{color:#f87171;background:linear-gradient(135deg,#f8717126,#f871710d);border-left:4px solid #f87171;box-shadow:0 8px 32px #0000004d,inset 0 1px #ffffff1a,0 0 20px #f871711a}.alert-error:before{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #f871714d;border-radius:50%;width:9px;height:9px;animation:6s ease-in-out 3s infinite bubbleFloat;position:absolute;top:88%;left:50%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #f8717133}.alert-error:after{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #f871714d;border-radius:50%;width:14px;height:14px;animation:6s ease-in-out infinite bubbleFloat;position:absolute;top:82%;left:20%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #f8717133}.alert-error .bubble-1{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #f871714d;border-radius:50%;width:11px;height:11px;animation:6s ease-in-out 1.5s infinite bubbleFloat;position:absolute;top:85%;left:5%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #f8717133}.alert-error .bubble-2{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #f871714d;border-radius:50%;width:7px;height:7px;animation:6s ease-in-out 4.5s infinite bubbleFloat;position:absolute;top:90%;left:35%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #f8717133}.alert-error .bubble-3{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #f871714d;border-radius:50%;width:13px;height:13px;animation:6s ease-in-out 6s infinite bubbleFloat;position:absolute;top:78%;left:55%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #f8717133}.alert-info{color:#60a5fa;background:linear-gradient(135deg,#60a5fa26,#60a5fa0d);border-left:4px solid #60a5fa;box-shadow:0 8px 32px #0000004d,inset 0 1px #ffffff1a,0 0 20px #60a5fa1a}.alert-info:before{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #60a5fa4d;border-radius:50%;width:7px;height:7px;animation:6s ease-in-out 2.5s infinite bubbleFloat;position:absolute;top:91%;left:55%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #60a5fa33}.alert-info:after{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #60a5fa4d;border-radius:50%;width:11px;height:11px;animation:6s ease-in-out infinite bubbleFloat;position:absolute;top:87%;left:25%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #60a5fa33}.alert-info .bubble-1{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #60a5fa4d;border-radius:50%;width:9px;height:9px;animation:6s ease-in-out 3.5s infinite bubbleFloat;position:absolute;top:83%;left:5%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #60a5fa33}.alert-info .bubble-2{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #60a5fa4d;border-radius:50%;width:5px;height:5px;animation:6s ease-in-out 5.5s infinite bubbleFloat;position:absolute;top:89%;left:35%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #60a5fa33}.alert-info .bubble-3{content:"";-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);z-index:0;background:radial-gradient(circle at 30% 30%,#ffffff0d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ffffff05 0%,#0000 70%);border:1px solid #60a5fa4d;border-radius:50%;width:15px;height:15px;animation:6s ease-in-out 7s infinite bubbleFloat;position:absolute;top:79%;left:55%;box-shadow:inset 0 0 5px #ffffff1a,0 0 10px #60a5fa33}.alert.show .alert-icon{animation:.6s ease-out bounce}.alert.show .alert-content h3{animation:.8s ease-out .2s both slideInUp}.alert.show .alert-content p{animation:.8s ease-out .4s both slideInUp}.alert.show .alert-close{animation:.8s ease-out .6s both slideInUp}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes bounce{0%,20%,53%,80%,to{transform:translate(0,0)}40%,43%{transform:translateY(-8px)}70%{transform:translateY(-4px)}90%{transform:translateY(-2px)}}@keyframes bubbleFloat{0%{opacity:.3;transform:translateY(0)scale(1)}25%{opacity:.5;transform:translateY(-15px)scale(1.1)}50%{opacity:.7;transform:translateY(-30px)scale(1.2)}75%{opacity:.5;transform:translateY(-45px)scale(1.1)}to{opacity:.2;transform:translateY(-60px)scale(1)}}@keyframes ripple{to{opacity:0;transform:scale(4)}}@media (max-width:768px){.alert{gap:12px;margin-bottom:12px;padding:15px}.alert .alert-content h3{font-size:15px}.alert .alert-content p{font-size:13px}.alert-success:after,.alert-warning:after,.alert-error:after,.alert-info:after{width:8px;height:8px}.alert-success:before,.alert-warning:before,.alert-error:before,.alert-info:before{width:6px;height:6px}.alert-success .bubble-1,.alert-warning .bubble-1,.alert-error .bubble-1,.alert-info .bubble-1{width:4px;height:4px}.alert-success .bubble-2,.alert-warning .bubble-2,.alert-error .bubble-2,.alert-info .bubble-2{width:6px;height:6px}.alert-success .bubble-3,.alert-warning .bubble-3,.alert-error .bubble-3,.alert-info .bubble-3{width:8px;height:8px}}@media (max-width:480px){.alert{gap:10px;margin-bottom:10px;padding:12px}.alert .alert-content h3{font-size:14px}.alert .alert-content p{font-size:12px}.alert-success:after,.alert-warning:after,.alert-error:after,.alert-info:after{width:6px;height:6px}.alert-success:before,.alert-warning:before,.alert-error:before,.alert-info:before{width:4px;height:4px}.alert-success .bubble-1,.alert-warning .bubble-1,.alert-error .bubble-1,.alert-info .bubble-1{width:3px;height:3px}.alert-success .bubble-2,.alert-warning .bubble-2,.alert-error .bubble-2,.alert-info .bubble-2{width:4px;height:4px}.alert-success .bubble-3,.alert-warning .bubble-3,.alert-error .bubble-3,.alert-info .bubble-3{width:6px;height:6px}}@media (max-width:320px){.alert{gap:8px;margin-bottom:8px;padding:10px}.alert .alert-content h3{font-size:13px}.alert .alert-content p{font-size:11px}.alert-success:after,.alert-warning:after,.alert-error:after,.alert-info:after{width:4px;height:4px}.alert-success:before,.alert-warning:before,.alert-error:before,.alert-info:before{width:3px;height:3px}.alert-success .bubble-1,.alert-warning .bubble-1,.alert-error .bubble-1,.alert-info .bubble-1{width:2px;height:2px}.alert-success .bubble-2,.alert-warning .bubble-2,.alert-error .bubble-2,.alert-info .bubble-2{width:3px;height:3px}.alert-success .bubble-3,.alert-warning .bubble-3,.alert-error .bubble-3,.alert-info .bubble-3{width:4px;height:4px}}
