@import "@{b3-import-variables}";

// Nunito Sans is used on dimagi.com and embedded in hqwebapp/base.html
@font-family-sans-serif: "Nunito Sans", "Helvetica Neue", Helvetica, Arial,
  sans-serif;

@font-size-base: 12px;
@icon-font-path: "../../bootstrap/fonts/";

// Main background & text
@cc-bg: #f2f2f1;
@cc-text: #1c2126;

// Success
@cc-att-pos-extra-hi: #e3f1df;
@cc-att-pos-hi: #bbe5b3;
@cc-att-pos-mid: #4aba32;
@cc-att-pos-low: #118043;
@cc-att-pos-extra-low: #173630;

// Error
@cc-att-neg-extra-hi: #fbeae6;
@cc-att-neg-hi: #fead9a;
@cc-att-neg-mid: #e73c27;
@cc-att-neg-low: #bf0712;
@cc-att-neg-extra-low: #340101;

// Warning/Attention
@cc-light-warm-accent-extra-hi: #fcf2cd;
@cc-light-warm-accent-hi: #ffea8a;
@cc-light-warm-accent-mid: #eec200;
@cc-light-warm-accent-low: #9c6f19;
@cc-light-warm-accent-extra-low: #573b00;

// Call to action
@call-to-action-extra-hi: #f4f5fa;
@call-to-action-hi: #b4bcf5;
@call-to-action-mid: #5c6ac5;
@call-to-action-low: #212f78;
@call-to-action-extra-low: #000639;

// Accent light blue: buttons on dark backgrounds, occasional secondary buttons (upload/download)
@cc-light-cool-accent-hi: #ccf3f4;
@cc-light-cool-accent-mid: #00bdc5;
@cc-light-cool-accent-low: #00799a;

// Accent purples used in signup, which uses colors more like dimagi.com than HQ
@color-purple-dark: #43467f;
@color-purple-dark-inverse: #e3d0ff;

// Neutrals used as borders/backgrounds
@cc-neutral-hi: #d6d6d4;
@cc-neutral-mid: #685c53;
@cc-neutral-low: #373534;

// Blues used for links and app manager accents
@cc-brand-hi: #bcdeff;
@cc-brand-mid: #004ebc;
@cc-brand-low: #002c5f;

// used in registration app only. will be merged into "brand" color Bootstrap 5 migration
@commcare-blue: #5d70d2;

// Accent colors used in few places (billing, web apps, one-offs). Minimize usage.
@cc-dark-cool-accent-hi: #d6c5ea;
@cc-dark-cool-accent-mid: #9060c8;
@cc-dark-cool-accent-low: #5d3f82;

@cc-dark-warm-accent-hi: #ffe3c2;
@cc-dark-warm-accent-mid: #ff8400;
@cc-dark-warm-accent-low: #994f00;

// Main TWBS Colors
@brand-primary: @cc-brand-mid;
@brand-success: @cc-att-pos-mid;
@brand-info: @cc-light-cool-accent-mid;
@brand-warning: @cc-dark-warm-accent-mid;
@brand-danger: @cc-att-neg-mid;

@text-color: @cc-text;

@link-hover-color: @cc-brand-low;

@btn-default-color: @cc-text;
@btn-default-bg: @cc-bg;
@btn-default-border: @cc-neutral-hi;

@navbar-height: 60px;
@navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2);
@navbar-default-bg: @cc-bg;

@navbar-footer-height: 40px;
@navbar-footer-link-color: mix(darken(#ffffff, 10), @brand-primary, 90);
@navbar-footer-link-color-hover: @gray-lighter;
@navbar-footer-button-color: #474747;

@btn-footer-color: #ffffff;
@btn-footer-bg: #474747;
@btn-footer-border: #cccccc;

@checkbox-default-color: @call-to-action-mid;

@grid-gutter-width: 20px;

// Z-index master list
// -------------------------
// Also see Bootstrap 3's own master list:
// bootstrap/less/variables.less
@zindexDashboardSpinner: 500;
@zindexAccountingPricingTableHeader: 800;

// Other Zindecies
@zindex-select2-results: 1056; // higher than $zindex-modal so select2s can be used in modals
@zindex-hq-navigation: 1049; // lower than bootstrap's $zindex-modal-background
@zindex-cloudcare-debugger: 1040;
@zindex-persistent-menu-nav: 1030;
@zindex-persistent-menu-nav-arrow: @zindex-persistent-menu-nav + 1;
@zindex-navbar: 1000;
@zindex-app-preview: 998;
@zindex-navbar-cloudcare: 995;
@zindex-persistent-tile-cloudcare: 993;
@zindex-formplayer-progress: 990;
@zindex-report-loading: 100;
@zindex-formplayer-scroll-to-bottom: 5;
@zindex-next-error: 5; // Above the sticky submit button
@zindex-formplayer-anchored-submit: 4;

@input-border-radius-large: 5px;
@input-color: #000;
@cursor-disabled: "not-allowed";
