// Add scss variables here that can be used in another scss files.
//
// For example, if you define a variable in this file
//
//   $some-standard-color: red;
//
// you can use in renalware/modules/users.scss like so
//
//   @import "../base/variables";
//
//   div.some-class {
//     background-color: $some-standard-color;
//   }

//
// Colours
//

// NHS Colours
$nhs-yellow: #fae100;
$nhs-warm-yellow: #ffb81c;
$nhs-orange: #ed8b00;
$nhs-red: #d81e05;

$nhs-emergency-red: #da291c;
$nhs-dark-red: #8a1538;
$nhs-dark-pink: #7c2855;
$nhs-purple: #330072;
$nhs-pink: #ae2573;

$nhs-dark-blue: #003087;
$nhs-blue: #005eb8;
$nhs-bright-blue: #0072ce;
$nhs-light-blue: #41b6e6;
$nhs-aqua-blue: #00a9ce;

$nhs-aqua-green: #00a499;
$nhs-light-green: #78be20;
$nhs-green: #009639;
$nhs-dark-green: #006747;

$dashboard-muted-color: #888;
$link-colour: $primary-color; // #008CBA;
$link-focus-colour: #0078a0;
$link-hover-colour: #64d6fb;
$white: #fff;
$off-white: #eee;
$dark-grey: #222;
$muted-dark-grey: #555;
$winter-sky: #aaa;
$light-grey: #ddd;
$mid-grey: #999;
$very-light-grey: #f5f5f5;
$error-background: $off-white;
$almost-white: rgb(252, 252, 252);
$light-yellow: #fff066;
$light-green: #00e658;

// Drug type colours
$drug-type-default-colour: none;
$drug-type-esa-colour: #ff9;
$drug-type-immunosuppressant-colour: #ccfeff;

$tab-border-color: #ddd;

// Patient header/banner
$patient-header-muted-color: #777;
$patient-header-icon-color: #bbb;
$patient-header-bg-color: $nhs-blue;

// Bookmarks
$bookmark-urgent-colour: #ffffc8;

// Letter states
$letter-state-unknown: $mid-grey;
$letter-state-draft: $nhs-aqua-blue;
$letter-state-pending-review: $nhs-orange;
$letter-state-approved: $nhs-green;
$letter-state-completed: $nhs-dark-green;

// Renal reg missing data labels
$renal-reg-missing-data-default: $dark-grey;
$renal-reg-missing-data-comorbidities-at-esrf: $nhs-aqua-blue;
$renal-reg-missing-data-prd: $nhs-orange;
$renal-reg-missing-data-first-seen-on: $nhs-green;
$renal-reg-missing-data-ethnicity: $nhs-dark-green;

// Admission Request priority but can be used elsewhere
$priority-urgent: $nhs-dark-red;
$priority-high: $nhs-red;
$priority-medium: $nhs-warm-yellow;
$priority-low: $nhs-green;

// Modals
$max-modal-height: 600px;

$mini-profile-backgound-colour: #def0f6;
$mini-profile-renal-backgound-colour: #def0f6;
$mini-profile-allergies-backgound-colour: $nhs-yellow;

$letter-preview-background-colour: #ddd;

// tables
$table-even-row-colour: #fcfcfc;
$table-border-colour: #ddd;
$table-toggled-content-colour: #fefff1;
$table-urgent-colour: $nhs-yellow;
$table-row-hover-colour: #f9f9f9;

$patient-menu-background-colour: #eee;
$menu-divider-colour: #e6e6e6;

$footer-colour: $patient-header-muted-color;
$footer-bg-colour: $patient-menu-background-colour;

// Forms
$form-hint-colour: #bbb;
$form-hint-colour-strong: #888;
$disabled-colour: #ccc;
$pipe-separator-colour: #AAA;

// Menus
$patient-menu-icon-color: $gainsboro;
$patient-menu-icon-hover-color: $white;

// HD Diaries
$hd-weekly-diary-colour: #ffedd4;
$hd-weekly-diary-hover-colour: lighten($hd-weekly-diary-colour, 25);


//
// Lists
//
$dl-horizontal-dt-width: 9rem;

$patient-side-nav-width: 14.5rem;

// Select2
$select2-input-height: 2.2rem;

// Breakpoints
$small-range: (0, 40em);
$medium-range: (40.063em, 64em);
$large-range: (64.063em, 90em);
$xlarge-range: (90.063em, 120em);
$xxlarge-range: (120.063em, 99999999em);

// Foundation defaults
// $small-range: (0, 45.78570em);
// $medium-range: (45.78571em, 73.21429em);
// $large-range: (73.21423em, 102.92857em);
// $xlarge-range: (102.9286em, 137.21429em)
//

$screen: "only screen";

$landscape: "#{$screen} and (orientation: landscape)";
$portrait: "#{$screen} and (orientation: portrait)";

$small-up: $screen;
$small-only: "#{$screen} and (max-width: #{upper-bound($small-range)})";

$medium-up: "#{$screen} and (min-width:#{lower-bound($medium-range)})";
$medium-only: "#{$screen} and (min-width:#{lower-bound($medium-range)}) and (max-width:#{upper-bound($medium-range)})";

$large-up: "#{$screen} and (min-width:#{lower-bound($large-range)})";
$large-only: "#{$screen} and (min-width:#{lower-bound($large-range)}) and (max-width:#{upper-bound($large-range)})";

$xlarge-up: "#{$screen} and (min-width:#{lower-bound($xlarge-range)})";
$xlarge-only: "#{$screen} and (min-width:#{lower-bound($xlarge-range)}) and (max-width:#{upper-bound($xlarge-range)})";

$xxlarge-up: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)})";
$xxlarge-only: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)}) and (max-width:#{upper-bound($xxlarge-range)})";