/*
 * Flash messages of the AJAX framework (data-request-flash), all pages.
 * The theme's generic ".error" rule (red, bold, 1.5em) also hit the error
 * flash, which made it red text on a red background in a large font. These
 * selectors (body ...) are more specific than ".error" and than the
 * framework's own rules, which it injects at run time after this file.
 * Width and position stay the framework's (500px centred; full width on phones).
 * Loaded after {% styles %} in layouts/default.htm.
 */
body .jax-flash-message,
body .jax-flash-message.error,
body .jax-flash-message.success,
body .jax-flash-message.info,
body .jax-flash-message.warning {
    padding: 14px 46px 14px 18px;
    border: 1px solid transparent;
    border-left-width: 5px;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(20, 30, 40, .18);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    text-align: left;
}
body .jax-flash-message .flash-message {
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
}
body .jax-flash-message.error {
    background: #fdf1f0;
    border-color: #f2c5c1;
    border-left-color: #d9342b;
    color: #6e1712;
}
body .jax-flash-message.success {
    background: #f0f8eb;
    border-color: #cfe7c0;
    border-left-color: #74be45;
    color: #22461a;
}
body .jax-flash-message.info {
    background: #eef5fc;
    border-color: #c8dcf1;
    border-left-color: #3b82c4;
    color: #173a5c;
}
body .jax-flash-message.warning {
    background: #fff8e6;
    border-color: #f1dfaa;
    border-left-color: #e0a100;
    color: #5a4200;
}
/* The close link took the theme's green link colour ("a { color: #74be45
   !important }"); it follows the message text. */
body .jax-flash-message .flash-close,
body .jax-flash-message a.flash-close,
body .jax-flash-message a.flash-close:visited {
    color: inherit !important;
    opacity: .7;
    font-size: 22px;
    line-height: 1;
}
body .jax-flash-message .flash-close:hover,
body .jax-flash-message .flash-close:focus-visible {
    opacity: 1;
}