.ContractFlowthroughFormFields {
    font-weight: 400;
    .form-label,
    label {
        font-size: 14px;
        font-weight: 500;
    }
    &-AutomaticShutoff {
        padding-top: 5px;
        padding-bottom: 5px;
        display: inline-flex;

        /* The following CSS is needed to satisfy the design requirements of
        the space following the Automatic Shutoff text before the information tooltip */
        gap: 4px;
    }
    &-Calculation {
        &-Example,
        &-Summary {
            font-size: 12px;
        }
    }

    /* The following CSS is needed to display the errors from validation, by default it is display:none */
    .FormControl-error-message {
        display: flex;
    }

    &-Rate,
    &-RecoupmentCap {
        flex: 1 1 25%; /* Dynamic width */
        max-width: 132px; /* Maximum width */
        box-sizing: border-box; /* Include padding and border in width */
    }

    &-Text-Info,
    p {
        display: inline-flex;
        font-size: 12px;
        font-weight: 400;

        /* The following CSS is needed to satisfy the design requirements of
        the space following the Automatic Shutoff text before the information tooltip */
        gap: 4px;

        /* The following CSS is needed to satisfy the design requirements
         of the info glyph icon being --midnight-650 */
        .GlyphIcon path {
            fill: var(--midnight-650, #276b9b);
        }
    }

    .flowthrough-status {
        justify-content: center;
        display: flex;

        &-active .DotGlyphIcon {
            color: var(--success-750);
        }

        &-paused .DotGlyphIcon {
            color: var(--warning-600);
        }

        &-shutoff .DotGlyphIcon {
            color: var(--error-600);
        }
    }

    /* The following CSS is needed to satisfy the design requirements of
    the alignment of the SuiteSelect input value wrapper */
    .SuiteSelect-input-value-wrapper {
        line-height: 2;
    }
}