/**
 * Color:
 * All our colors are defined in variables. If you must create a new color that
 * is not defined here, assign it to a variable in your own stylesheet. Consider
 * adding it to the `ui-components` if the color can be shared.
 *
 * **Note**: For dark grays, just use `.blue-*`.
 *
 *     @example
 *     .Section.flex
 *       .color
 *         .example-block.green-lightest @green-lightest
 *         .example-block.green-lighter @green-lighter
 *         .example-block.green-light @green-light
 *         .example-block.green @green
 *         .example-block.green-dark @green-dark
 *         .example-block.green-darker @green-darker
 *         .example-block.green-darkest @green-darkest
 *       .color
 *         .example-block.blue-lightest @blue-lightest
 *         .example-block.blue-lighter @blue-lighter
 *         .example-block.blue-light @blue-light
 *         .example-block.blue @blue
 *         .example-block.blue-dark @blue-dark
 *         .example-block.blue-darker @blue-darker
 *         .example-block.blue-darkest @blue-darkest
 *       .color
 *         .example-block.gray-lightest @gray-lightest
 *         .example-block.gray-lighter @gray-lighter
 *         .example-block.gray-light @gray-light
 *         .example-block.gray @gray
 *         .example-block.blue-dark @blue-dark
 *         .example-block.blue-darker @blue-darker
 *         .example-block.blue-darkest @blue-darkest
 *       .color
 *         .example-block.mustard @mustard
 *       .color
 *         .example-block.orange @orange
 *
 *     .Section
 *       .Section-header
 *         h4.Section-header Semantic color variables
 *       .Section-content.color.flex
 *         .example-block.success-color @success-color
 *         .example-block.info-color @info-color
 *         .example-block.warning-color @warning-color
 *         .example-block.error-color @error-color
 */

@import "./config";