@import "../../../../../../vendor/joomla-custom-elements/css/joomla-alert.css";
#system-message-container:empty {
display: none;
margin-top: 0;
}
#system-message-container joomla-alert {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
min-width: 16rem;
padding: 0;
margin-bottom: 0;
color: var(--gray-dark);
background-color: hsl(0, 0%, 100%);
border: 1px solid var(--alert-accent-color, transparent);
border-radius: 0.25rem;
-webkit-transition: opacity 0.15s linear;
transition: opacity 0.15s linear;
}
#system-message-container joomla-alert + * {
margin-top: 1rem;
}
#system-message-container joomla-alert .alert-heading {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-ms-flex-line-pack: center;
align-content: center;
padding: 0.8rem;
color: var(--alert-heading-text);
background: var(--alert-accent-color, transparent);
}
#system-message-container joomla-alert .alert-heading .message::before,
#system-message-container joomla-alert .alert-heading .success::before {
display: inline-block;
width: 1em;
height: 1em;
content: "";
background-image: url('data:image/svg+xml;utf8,');
background-size: 100%;
}
#system-message-container joomla-alert .alert-heading .notice::before,
#system-message-container joomla-alert .alert-heading .info::before {
display: inline-block;
width: 1em;
height: 1em;
content: "";
background-image: url('data:image/svg+xml;utf8,');
background-size: 100%;
}
#system-message-container joomla-alert .alert-heading .warning::before {
display: inline-block;
width: 1em;
height: 1em;
content: "";
background-image: url('data:image/svg+xml;utf8,');
background-size: 100%;
}
#system-message-container joomla-alert .alert-heading .error::before,
#system-message-container joomla-alert .alert-heading .danger::before {
display: inline-block;
width: 1em;
height: 1em;
content: "";
background-image: url('data:image/svg+xml;utf8,');
background-size: 100%;
}
#system-message-container joomla-alert .alert-wrapper {
width: 100%;
}
#system-message-container joomla-alert .alert-link {
color: var(--success, inherit);
}
#system-message-container joomla-alert[type=success], #system-message-container joomla-alert[type=message] {
--alert-accent-color: var(--success);
--alert-heading-text: hsla(0, 0%, 100%, .95);
--alert-close-button: var(--success);
background-color: hsl(0, 0%, 100%);
}
#system-message-container joomla-alert[type=info], #system-message-container joomla-alert[type=notice] {
--alert-accent-color: var(--info);
--alert-heading-text: hsla(0, 0%, 100%, .95);
--alert-close-button: var(--info);
background-color: hsl(0, 0%, 100%);
}
#system-message-container joomla-alert[type=warning] {
--alert-accent-color: var(--warning);
--alert-heading-text: hsla(0, 0%, 100%, .95);
--alert-close-button: var(--warning);
background-color: hsl(0, 0%, 100%);
}
#system-message-container joomla-alert[type=error], #system-message-container joomla-alert[type=danger] {
--alert-accent-color: var(--danger);
--alert-heading-text: hsla(0, 0%, 100%, .95);
--alert-close-button: var(--danger);
background-color: hsl(0, 0%, 100%);
}
#system-message-container joomla-alert .joomla-alert--close,
#system-message-container joomla-alert .joomla-alert-button--close {
position: absolute;
top: 0;
right: 0;
padding: 0.2rem 0.8rem;
font-size: 2rem;
color: var(--alert-close-button);
background: none;
border: 0;
opacity: 1;
}
#system-message-container joomla-alert .joomla-alert--close:hover, #system-message-container joomla-alert .joomla-alert--close:focus,
#system-message-container joomla-alert .joomla-alert-button--close:hover,
#system-message-container joomla-alert .joomla-alert-button--close:focus {
text-decoration: none;
cursor: pointer;
opacity: 0.75;
}
[dir=rtl] #system-message-container joomla-alert .joomla-alert--close,
[dir=rtl] #system-message-container joomla-alert .joomla-alert-button--close {
right: auto;
left: 0;
padding: 0.2rem 0.6rem;
}
#system-message-container joomla-alert div {
font-size: 1rem;
}
#system-message-container joomla-alert div .alert-message {
padding: 0.3rem 2rem 0.3rem 0.3rem;
margin: 0.5rem;
}
[dir=rtl] #system-message-container joomla-alert div .alert-message {
padding: 0.3rem 0.3rem 0.3rem 2rem;
}
#system-message-container joomla-alert div .alert-message:not(:first-of-type) {
border-top: 1px solid var(--alert-accent-color);
}