.alert-container{display:flex;flex-direction:column;gap:10px;left:var(--alert-position-left,50%);max-height:var(--alert-max-height,100px);max-width:var(--alert-max-width,80%);position:fixed;top:var(--alert-position-top,50px);transform:translateX(-50%);width:max-content;z-index:var(--alert-z-index,1000)}.alert-container.left{left:var(--alert-position-left-aligned,20px);right:auto;transform:unset}.alert-container.left .alert.fade-in{animation-name:fade-in-left;opacity:1;transform:translateX(0)}.alert-container.left .alert.fade-out{opacity:0;transform:translateX(-10px)}.alert-container.right{left:auto;right:var(--alert-position-right-aligned,20px);transform:unset}.alert-container.right .alert.fade-in{animation-name:fade-in-right;opacity:1;transform:translateX(0)}.alert-container.right .alert.fade-out{opacity:0;transform:translateX(10px)}.alert{align-items:flex-start;border-radius:6px;box-shadow:0 4px 8px rgba(0,0,0,.1);display:flex;font-size:14px;font-weight:500;justify-content:space-between;padding:12px 16px;opacity:1;overflow-y:auto;transition:opacity .5s ease-in-out,transform .5s ease-in-out}.alert.fade-in{animation:fade-in-top .5s ease-in-out;opacity:1;transform:translateY(0)}.alert.fade-out{opacity:0;transform:translateY(-10px)}.alert p{flex-grow:1;line-height:18px;margin:0}.alert .alert-close{background:none;border:none;color:inherit;cursor:pointer;font-size:16px;font-weight:700;line-height:18px;margin-left:10px;transition:transform .2s ease-in-out}.alert .alert-close:hover{transform:scale(1.2)}.alert-primary{background-color:var(--alert-primary);color:var(--color-white)}.alert-secondary{background-color:var(--alert-secondary);color:var(--color-white)}.alert-success{background-color:var(--alert-success);color:var(--color-white)}.alert-danger{background-color:var(--alert-danger);color:var(--color-white)}.alert-warning{background-color:var(--alert-warning);color:var(--font-primary-color)}.alert-info{background-color:var(--alert-info);color:var(--color-white)}.alert-light{background-color:var(--alert-light);color:var(--font-primary-color);border:1px solid var(--alert-light-border)}.alert-dark{background-color:var(--alert-dark);color:var(--color-white)}@keyframes fade-in-top{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in-left{0%{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}@keyframes fade-in-right{0%{opacity:0;transform:translateX(10px)}to{opacity:1;transform:translateX(0)}}@media(max-width:767px){:root{--alert-position-top:20px;--alert-position-left-aligned:10px;--alert-position-right-aligned:10px;--alert-max-width:95%;--alert-max-height:150px}}@media(max-width:480px){:root{--alert-position-top:10px;--alert-position-left-aligned:5px;--alert-position-right-aligned:5px;--alert-max-width:90%;--alert-max-height:180px}}