/*
Medisked Stylesheet for resusable notifications component
*/

/*
Notification - Banner
*/
.notification-banner {
    min-height: 35px;
    border-radius: 4px;
    margin: 20px;
    padding: 20px;
    box-shadow: 0px 0px 10px -3px rgba(0,0,0,0.7);
}

.notification-banner-success {
    background-color: #caef9c;
    color: #6f954a;
}

.notification-banner-error {
    background-color: #fc8c86;
    color: #931919;
}

.notification-banner-warning {
    background-color: #fce1ac;
    color: #B38808;
}

.notification-banner-info {
    background-color: #e5f5fa;
    color: #059dc6;
}

.notification-banner-icon {
    width: fit-content;
}

.notification-banner-success-icon {
    font-size: 36px;
}

.notification-banner-error-icon {
    font-size: 36px;
}

.notification-banner-warning-icon {
    font-size: 34px;
}

.notification-banner-info-icon {
    font-size: 36px;
}

.notification-banner-message {
    font-size: 18px;
    font-family: sans-serif;
    width: 100%;
    margin-left: 20px;
}

.notification-banner-dismissable-wrapper {
    width: 40px;
    display: table-cell;
}

.notification-banner-dismissable-icon {
    font-size: 21px;
    margin-left: 19px;
    cursor: pointer;
}

.notification-banner-container {
    display: flex;
    flex-direction: row;
    align-items: center;
}


/*
Notification - Inline Banner
*/
.notification-banner-inline {
    margin: 10px;
    min-height: 50px;
    border-radius: 4px;
    box-shadow: 0px 0px 10px -3px rgba(0,0,0,0.7);
}

.notification-banner-inline-innerwrapper {
    padding-top: 10px;
    padding-bottom: 10px;
}

.notification-banner-inline-success {
    background-color: #caef9c;
    color: #6f954a;
}

.notification-banner-inline-error {
    background-color: #fc8c86;
    color: #931919;
}

.notification-banner-inline-warning {
    background-color: #fce1ac;
    color: #B38808;
}

.notification-banner-inline-info {
    background-color: #e5f5fa;
    color: #059dc6;
}


.notification-banner-inline-icon {
    margin-left: 20px;
    margin-top: 2px;
    float: left;
}

.notification-banner-inline-success-icon {
    font-size: 24px;
}

.notification-banner-inline-error-icon {
    font-size: 24px;
}

.notification-banner-inline-warning-icon {
    font-size: 23px;
}

.notification-banner-inline-info-icon {
    font-size: 24px;
}

.notification-banner-inline-message {
    font-size: 16px;
    font-family: sans-serif;
    display: block;
    margin-top: 5px;
    margin-left: 60px;
    margin-right: 20px;
    text-align: left !important;
}


/*
Notification - Skinny Inline Banner
*/
.notification-banner-skinnyinline {
    margin: 20px;
    min-height: 35px;
    border-radius: 4px;
    box-shadow: 0px 0px 10px -3px rgba(0,0,0,0.7);
}

.notification-banner-skinnyinline-innerwrapper {
    padding-top: 10px;
    padding-bottom: 10px;
}

.notification-banner-skinnyinline-success {
    background-color: #caef9c;
    color: #6f954a;
}

.notification-banner-skinnyinline-error {
    background-color: #fc8c86;
    color: #931919;
}

.notification-banner-skinnyinline-warning {
    background-color: #fce1ac;
    color: #B38808;
}

.notification-banner-skinnyinline-info {
    background-color: #e5f5fa;
    color: #059dc6;
}


.notification-banner-skinnyinline-icon {
    margin-left: 20px;
    margin-top: 2px;
    font-size: 20px;
    float: left;
}

.notification-banner-skinnyinline-success-icon {
    font-size: 24px;
}

.notification-banner-skinnyinline-error-icon {
    font-size: 24px;
}

.notification-banner-skinnyinline-warning-icon {
    font-size: 23px;
}

.notification-banner-skinnyinline-info-icon {
    font-size: 24px;
}

.notification-banner-skinnyinline-message {
    font-size: 16px;
    font-family: sans-serif;
    display: block;
    margin-top: 3px;
    margin-left: 60px;
    margin-right: 20px;
    text-align: left !important;
}