
:root {

  --p10: #f4f9ff;
  --p20: #eaf1f9;
  --p30: #b3ceff;
  --p40: #8db5ff;
  --p50: #70a2ff;
  --p60: #679cff;
  --p70: #4284ff;
  --p80: #1c6bff;
  --p90: #002b7a;
  --p100: #000C23;



  --err10: #ffb9d0;
  --err20: #ff9bb3;
  --err30: #fe7e97;
  --err40: #de617b;
  --err50: #be4461;
  --err80: #61001a;
  --err90: #560012;

  --grey-dark: #424656;
  --grey-light: #a6abbd;

  --text: var(--p100);
  --text-light: var(--grey-dark);
  --text-error: var(--err50);

  --main-font: ‘Open Sans‘, Arial, Helvetica, sans-serif;
}


//@import "../node_modules/bootstrap/scss/bootstrap";
@import "./reset";
@import "./helpers";
@import "./notice";
@import "./auth";
@import "./typography";
@import "./sidebar";
@import "./form";
@import "./table";
@import "./avatar";
@import "./codemirror";
@import "./layout";
@import "./wrappers";
@import "./toolbar";
@import "./dropdown";
@import "./button";
@import "./checkbox";
@import "./pagination";
@import "./record-edit";
@import "./tabs";
@import "./switch";
@import "./preview";
@import "./dialog";
@import "./autocomplete";
@import "./reference-tags";

body {
  background-color: var(--p10);
  font-family: var(--main-font), sans-serif;
  color: var(--text);

  :focus {
    outline: none;
    box-shadow: 0 0 1px 2px var(--p70);
  }
}

.btn-spinner .spinner-border {
  display: none;
}

.btn-spinner.spinner-on .spinner-border {
  display: inline-block;
}

.cursor-pointer {
  cursor: pointer;
}


a {
  color: var(--text);
  text-decoration: none;
}


.lucent-component {
  position: relative;
}

