.notification-container{--popup-min-width:200px;--popup-max-height:400px;--min-header-height:42px;--popup-border-radius:8px;--popup-border-width:1px;--popup-border-left-width:6px;--popup-border-color:transparent;--popup-box-shadow:0 0 20px hsla(0,0%,100%,.6);--popup-dividing-border:1px solid rgba(0,0,0,.05);--popup-dialog-bg:hsla(0,0%,100%,.93);--popup-dialog-border-width:1px;--popup-dialog-border-left-width:8px;--popup-dialog-lborder-color:#0b8dad;--popup-dialog-border-color:transparent;--popup-dialog-title-color:#222;--popup-dialog-desc-color:#444;--popup-dialog-close-x-color:#a61818;--popup-dialog-box-shadow:-1px -1px 20px hsla(0,0%,100%,.4),5px 5px 15px rgba(0,0,0,.8);--popup-btns-dividing-border:none;--popup-btn-border-width:2px;--popup-btn-min-height:38px;--popup-btn-min-width:80px;--popup-btn-radus:8px;--popup-btn-text-shadow:1px 1px rgba(0,0,0,.6);--popup-action-border:#12ba82;--popup-action-color:#12ba82;--popup-cancel-border:#bbb;--popup-cancel-color:#a61818;--popup-cancel-hover-color:red;--popup-action-hover-color:#14d796;--popup-error-bg:#fff0f0;--popup-error-color:#9f3a38;--popup-error-border-color:#e0b4b4;--popup-error-lborder-color:#ca0e0e;--popup-error-title-color:#f01111;--popup-error-close-x-color:#ca0e0e;--popup-warning-bg:#fffaf3;--popup-warning-color:#997240;--popup-warning-border-color:#c9ba9b;--popup-warning-lborder-color:#f7a307;--popup-warning-title-color:#f07911;--popup-warning-close-x-color:#997240;--popup-success-bg:#fcfff5;--popup-success-color:#1a531b;--popup-success-border-color:#6da16d;--popup-success-lborder-color:#1e9520;--popup-success-title-color:#12ba82;--popup-success-close-x-color:#6a9469;--popup-info-bg:#f8ffff;--popup-info-color:#064b84;--popup-info-border-color:#295b83;--popup-info-lborder-color:#0b86ea;--popup-info-title-color:#2984c4;--popup-info-close-x-color:#5a7184;font-size:1em;position:fixed;transition:all .4s linear;z-index:1001}.notification-container.center{height:fit-content;left:50%;top:30%;transform:translate(-50%,-30%)}.notification-container.top-left{left:1vw;top:2vh}.notification-container.bottom-left{bottom:2vh;left:1vw}.notification-container.top-right{right:1vw;top:2vh}.notification-container.bottom-right{bottom:2vh;right:1vw}.notification-container.bottom-right .notification,.notification-container.top-right .notification{margin-left:auto}.notification{border:var(--popup-border-width) solid var(--popup-border-color);border-left-width:var(--popup-border-left-width);border-radius:var(--popup-border-radius);box-shadow:var(--popup-box-shadow);margin-bottom:6px;max-height:var(--popup-max-height);max-width:98vw;min-width:var(--popup-min-width);overflow:hidden;position:relative;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(0,1,.5,1);user-select:none;width:350px;z-index:1001}.notification-title{align-items:center;border-bottom:var(--popup-dividing-border);display:flex;justify-content:space-between;line-height:var(--min-header-height);min-height:var(--min-header-height)}.notification-title .title{flex:1;font-size:1.2em;font-weight:500;padding-left:12px}.notification-body{align-items:center;display:flex;justify-content:flex-start;min-height:56px;padding:0;position:relative;word-break:break-word!important}.notification-body .notification-close{position:absolute;right:4px;top:4px}.notification-desc{flex:1;font-weight:500;line-height:2em;max-height:calc(var(--popup-max-height) - var(--min-header-height));overflow:hidden;padding:16px 12px;position:relative}.notification-dialog{background-color:var(--popup-dialog-bg);border-color:var(--popup-dialog-border-color);border-left-color:var(--popup-dialog-lborder-color);border-width:var(--popup-dialog-border-width);border-left-width:var(--popup-dialog-border-left-width);box-shadow:var(--popup-dialog-box-shadow);color:var(--popup-dialog-desc-color);position:relative}.notification-dialog .notification-title{color:var(--popup-dialog-title-color)}.notification-error{background-color:var(--popup-error-bg);border-color:var(--popup-error-border-color);border-left-color:var(--popup-error-lborder-color);color:var(--popup-error-color)}.notification-error .notification-title{color:var(--popup-error-title-color)}.notification-success{background-color:var(--popup-success-bg);border-color:var(--popup-success-border-color);border-left-color:var(--popup-success-lborder-color);color:var(--popup-success-color)}.notification-success .notification-title{color:var(--popup-success-title-color)}.notification-warning{background:var(--popup-warning-bg);border-color:var(--popup-warning-border-color);border-left-color:var(--popup-warning-lborder-color);color:var(--popup-warning-color)}.notification-warning .notification-title{color:var(--popup-warning-title-color)}.notification-info{background:var(--popup-info-bg);border-color:var(--popup-info-border-color);border-left-color:var(--popup-info-lborder-color);color:var(--popup-info-color)}.notification-info .notification-title{color:var(--popup-info-title-color)}.notification-close{cursor:pointer;display:block;height:24px;transition:color .1s;width:24px}.notification-close svg{display:block}.notification-close .close-x{fill:transparent;stroke-linecap:round;stroke-width:5}.notification-dialog .close-x{stroke:var(--popup-dialog-close-x-color)}.notification-error .close-x{stroke:var(--popup-error-close-x-color)}.notification-warning .close-x{stroke:var(--popup-warning-close-x-color)}.notification-success .close-x{stroke:var(--popup-success-close-x-color)}.notification-info .close-x{stroke:var(--popup-info-close-x-color)}.bottom-right .notification.animation-slide-in,.top-right .notification.animation-slide-in{animation:slide-in .4s forwards,bounceIn .7s forwards;transform:translateX(100%)}.bottom-right .notification.animation-slide-out,.top-right .notification.animation-slide-out{animation:right-slide-out .4s forwards}.bottom-left .notification.animation-slide-in,.top-left .notification.animation-slide-in{animation:slide-in .4s forwards,bounceIn .7s forwards;transform:translateX(-100%)}.bottom-left .notification.animation-slide-out,.top-left .notification.animation-slide-out{animation:left-slide-out .4s forwards}.notification.animation-fade-in{animation:fade-in .4s forwards}.notification.animation-fade-out{animation:fade-out .4s forwards}.notification-buttons{border-top:var(--popup-btns-dividing-border);display:flex;justify-content:space-around;padding:4px 0}.notification-button{border:var(--popup-btn-border-width) solid transparent;border-radius:var(--popup-btn-radus);cursor:pointer;display:inline-block;font-weight:600;min-height:var(--popup-btn-min-height);min-width:var(--popup-btn-min-width);position:relative;text-align:center;text-shadow:var(--popup-btn-text-shadow);vertical-align:middle}.notification-button:before{align-items:center;display:flex;font-size:1.32em;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%}.notification-cancel:before{content:"\2717"}.notification-cancel{border-color:var(--popup-cancel-border);color:var(--popup-cancel-color)}.notification-cancel:hover{color:var(--popup-cancel-hover-color)}.notification-action:before{content:"\2714"}.notification-action{border-color:var(--popup-action-border);color:var(--popup-action-color)}.notification-action:hover{color:var(--popup-action-hover-color)}.overlay{background-color:rgba(0,0,0,.2);display:none;height:100%;left:0;position:fixed;top:0;width:100%;z-index:1000}.overlay.active{display:block}@keyframes fade-in{0%{max-height:0;opacity:0;transform:scale(0);visibility:hidden}to{max-height:var(--popup-max-height);opacity:1;transform:scale(1);visibility:visible}}@keyframes fade-out{to{max-height:0;opacity:0;transform:scale(0);visibility:hidden}}@keyframes slide-in{to{transform:translateX(0)}}@keyframes left-slide-out{to{margin:0;max-height:0;opacity:0;transform:translateX(-120%)}}@keyframes right-slide-out{to{margin:0;max-height:0;opacity:0;transform:translateX(120%)}}@keyframes bounceIn{50%{opacity:.5;transform:scale(.84)}75%{opacity:.9;transform:scale(.99)}to{opacity:1;transform:scale(1)}}