/*!
 * @module angularjs-toast
 * @description A Simple toast notification service for AngularJS pages
 * @version v4.0.1
 * @link https://github.com/sibiraj-s/angularjs-toast#readme
 * @licence MIT License, https://opensource.org/licenses/MIT
 */
.angularjs-toast .alert,
.toast-alert .alert {
    padding      : 15px;
    margin-bottom: 100px;
    border       : 1px solid transparent;
    border-radius: 4px;
    position     : relative
}

.angularjs-toast .alert h4,
.toast-alert .alert h4 {
    margin-top: 0;
    color     : inherit
}

.angularjs-toast .alert .alert-link,
.toast-alert .alert .alert-link {
    font-weight: 700
}

.angularjs-toast .alert>p,
.angularjs-toast .alert>ul,
.toast-alert .alert>p,
.toast-alert .alert>ul {
    margin-bottom: 0
}

.angularjs-toast .alert>p+p,
.toast-alert .alert>p+p {
    margin-top: 2px
}

.angularjs-toast .alert.alert-dismissible,
.toast-alert .alert.alert-dismissible {
    padding-right: 35px
}

.angularjs-toast .alert.alert-dismissible .close,
.toast-alert .alert.alert-dismissible .close {
    position: absolute;
    top     : 0;
    right   : 0;
    padding : 15px;
    color   : inherit
}

.angularjs-toast .alert .close,
.toast-alert .alert .close {
    float          : right;
    font-size      : 21px;
    font-weight    : 700;
    line-height    : 1;
    color          : #000;
    text-shadow    : 0 1px 0 #fff;
    opacity        : .2;
    text-decoration: none
}

.angularjs-toast .alert .close:focus,
.angularjs-toast .alert .close:hover,
.toast-alert .alert .close:focus,
.toast-alert .alert .close:hover {
    color          : #000;
    text-decoration: none;
    cursor         : pointer;
    opacity        : .5
}

.angularjs-toast .alert.alert-success,
.toast-alert .alert.alert-success {
    color           : white;
    border-color    : #c3e6cb
}

.angularjs-toast .alert.alert-info,
.toast-alert .alert.alert-info {
    color           : white;
    background-color: rgb(12 74 110);
}

.angularjs-toast .alert.alert-warning,
.toast-alert .alert.alert-warning {
    color           : #856404;
    background-color: #fff3cd;
    border-color    : #ffeeba
}

.angularjs-toast .alert.alert-danger,
.toast-alert .alert.alert-danger {
    color           : #721c24;
    background-color: #f8d7da;
    border-color    : #f5c6cb
}

.angularjs-toast {
    position: fixed;
    z-index : 10000;
    width   : 100%;
    display:flex;
    justify-content: center;
    align-items: center;
    bottom     : 6rem;
}

.angularjs-toast ul.toast-container {
    padding   : 0;
    list-style: none;
    position  : absolute;
    top       : 20px;
}

.angularjs-toast ul.toast-container li {
    transition: 1s ease
}

.angularjs-toast ul.toast-container li .alert {
    display: flex;
    align-items: center;
    row-gap: 5px;
}

.angularjs-toast ul.toast-container li.ng-enter {
    opacity   : 0;
    transition: .3s ease-in
}

.angularjs-toast ul.toast-container li.ng-enter.ng-enter-active {
    opacity: 1
}

.angularjs-toast ul.toast-container li.ng-leave {
    opacity   : 1;
    transition: .2s ease-in
}

.angularjs-toast ul.toast-container li.ng-leave.ng-leave-active {
    opacity: 0
}

.angularjs-toast ul.toast-container.right {
    max-width: 1440px;
    display:flex;
    flex-direction: column;
    justify-items: center;
}

.angularjs-toast ul.toast-container.right li {
    text-align: right
}

.angularjs-toast ul.toast-container.center {
    left     : 0;
    left     : 50%;
    transform: translate(-50%, 0)
}

.angularjs-toast ul.toast-container.left {
    left       : 0;
    margin-left: 20px
}

.angularjs-toast ul.toast-container.left li {
    text-align: left
}
