@tailwind base;
@tailwind components;
@tailwind utilities;
/*
 * --- Primary Colors ---
 */
/*
 * --- Informational Colors ---
 *
 * Use these colors for alerts or informational text.
 */
/*
 * --- Supporting Colors ---
 *
 * These colors would primarily be used with text.
 */
/*
 * --- Feature Colors ---
 *
 * Colors used primarily in the dashboard to brand distribution channels
 */
/*
 * --- Background Colors ---
 */
/*
 * --- Text Colors ---
 *
 * When using text on a light background stick to Black or Slate.
 * Use White or Light Gray on dark backgrounds. Silver is reserved
 * for disabled states.
 */
/*
 * --- Original ---
 *
 * This is our original color variables. Some have been updated
 * to use the new color variables for StockBlocks and some of the
 * non standard variables are being left as is.
 */
/*
 * These grays are out of brand.
 */
.vb-red {
  background-color: #ed1c24;
}
.btn.vb-red :hover {
  background-color: #e4121a;
}
.gs-blue {
  background-color: #18a7f2;
}
.btn.gs-blue :hover {
  background-color: #0d9eea;
}
.ab-green {
  background-color: #50d10d;
}
.btn.ab-green :hover {
  background-color: #4ac20c;
}
.white {
  background-color: #fff;
}
.white-text {
  color: #fff;
}
.light-gray {
  background-color: #f5f5f5;
}
.light-gray-text {
  color: #f5f5f5;
}
.med-gray {
  background-color: #666;
}
.med-gray-text {
  color: #666;
}
.dark-gray {
  background-color: #363636;
}
.dark-gray-text {
  color: #363636;
}
.black {
  background-color: #252525;
}
.black-text {
  color: #252525;
}