/* stylelint-disable */
$infoBoxPadding: 2 * $spacing;
$infoBoxBorderSize: 4px;
$infoBoxAdditionalPadding: 3 * $spacing;

.info-box {
    // Default Style
    padding: $infoBoxPadding $infoBoxPadding $infoBoxPadding $infoBoxAdditionalPadding;
    font-size: $blankslate-small-p-font-size;
    line-height: $default-line-height;
    border-radius: $border-radius;
    box-shadow: 0 2px 4px 0 rgba(var(--white-rgb), $transparency-5);
    border-left: $infoBoxBorderSize solid;

    // Variables
    --background-color: var(--info-10);
    --border-color: var(--info-60);

    // Style Override
    background-color: var(--background-color);
    border-color: var(--border-color);

    // Mods
    &.mod-warning {
        --background-color: var(--warning-10);
        --border-color: var(--warning-70);
    }
}

.info-box__footer {
    margin-top: $infoBoxAdditionalPadding;
}