.app-alert{

position:fixed;
inset:0;

display:flex;
align-items:center;
justify-content:center;

background:rgba(0,0,0,.45);

opacity:0;
visibility:hidden;

transition:.25s;

z-index:999999;

}

.app-alert.show{

opacity:1;
visibility:visible;

}

.app-alert-box{

width:min(90%,380px);

background:#fff;

border-radius:18px;

padding:20px;

box-shadow:0 15px 40px rgba(0,0,0,.2);

animation:popup .25s ease;

}

.app-alert-header{

display:flex;
justify-content:space-between;
align-items:center;

}

.app-alert-close{

border:none;
background:none;
font-size:20px;
cursor:pointer;

}

.app-alert-icon{

font-size:48px;
text-align:center;
margin:15px 0;

}

.app-alert-box p{

text-align:center;
color:#555;
line-height:1.6;

}

.app-alert-actions{

margin-top:20px;

}

.app-alert-btn{

width:100%;

padding:12px;

border:none;

border-radius:10px;

background:#0f7a3d;

color:#fff;

font-weight:bold;

cursor:pointer;

}

@keyframes popup{

from{

transform:scale(.9);
opacity:0;

}

to{

transform:scale(1);
opacity:1;

}

}