/*--------------------------------------------------------------------------*\
    Flash text
\*--------------------------------------------------------------------------*/

.flash__text {
    /*box*/
    width: calc(100% - 85px);
    /* If the message is too large, to prevent it from overflowing onto the closing cross */
    margin-left: 10px;
    align-self: center !important;
}

/*--------------------------------------------------------------------------*\
        Sizes
\*--------------------------------------------------------------------------*/

.flash--tn .flash__text {
    /*text*/
    font-size: var(--fs-tn);
}

.flash--sm .flash__text {
    /*text*/
    font-size: var(--fs-sm);
}

.flash--md .flash__text {
    /*text*/
    font-size: var(--fs-md);
}

.flash--lg .flash__text {
    /*text*/
    font-size: var(--fs-lg);
}

/*--------------------------------------------------------------------------*\
	    Success
\*--------------------------------------------------------------------------*/

.flash--success .flash__text {
    /*text*/
    color: var(--c-success-1);
}

/*--------------------------------------------------------------------------*\
	    Warning
\*--------------------------------------------------------------------------*/

.flash--warning .flash__text {
    /*text*/
    color: var(--c-warning-1);
}

/*--------------------------------------------------------------------------*\
	    Error
\*--------------------------------------------------------------------------*/

.flash--error .flash__text {
    /*text*/
    color: var(--c-error-secondary-1);
}