﻿// Implementation of our Bootstrap 5 BioID theme based on the guidelines from the marketing department

// NOTE: has been updated to support color themes of bootstrap 5.3, see https://getbootstrap.com/docs/5.3/customize/sass/


// Colors

// Our new BioID light blue
$bioid-blue: #5f7ab0;
$bioid-blue1: #6683b8;
$bioid-blue2: #8093bf;
$bioid-blue3: #a0adcf;
$bioid-blue4: #c0c7df;
$bioid-blue5: #dfe3ef;
// Our new BioID dark blue
$bioid-dark: #12151e;
$bioid-dark1: #1b2335;
$bioid-dark2: #23324e;
$bioid-dark3: #2b4168;
$bioid-dark4: #335183;
$bioid-dark5: #3963a2;
// bioid accent color green
$bioid-green: #58b999;
// bioid accent color coral
$bioid-coral: #ee726b;
// bioid-green hover color (not in brandbook)
$dark-green: #46967d;

// 1. Include functions first (so you can manipulate colors, SVGs, calc, etc)
@import "../lib/bootstrap/scss/functions";

// 2. Include any default variable overrides here

// override bootstrap colors with BioID colors
$blue: $bioid-blue;
// bioid technical green
$green: #74b959;
// bioid technical red
$red: #bf2c37;
// bioid technical gray
$gray: #9d9d9d;

// use our bioid light blue as light color
$light: $bioid-blue5;
// use our bioid dark blue as dark color
$dark: $bioid-dark;
// use our bioid blue as blue and primary
$primary: $bioid-blue;
// use our 1st accent as secondary
$secondary: $bioid-green;
// use our 2nd accent as info
$info: $bioid-coral;
$success: $green;
// a custom yellow!?
$yellow: #fcbc56; //#ffc107
$warning: $yellow;
$danger: $red;

// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.
// Note: even with 3, 'light' will not be used for our bioid colors!
$min-contrast-ratio: 2.0;

// Body
$body-color: $bioid-dark;
// Links
$link-color: $bioid-green;
$link-hover-color: $dark-green;
$link-color-dark: $bioid-green;
$link-hover-color-dark: $dark-green;
$link-decoration: none;
// Code
$code-color: $bioid-coral;
$code-color-dark: $bioid-coral;

// Playground specific!
$body-text-align: center;
$navbar-light-color: $bioid-green;
$navbar-light-hover-color: $dark-green;

// Fonts
// add Poppins as primary font
$font-family-sans-serif: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
// add FiraCode as primary monospace font
$font-family-monospace: "FiraCode", SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

// $font-size-base effects the font size of the body text
$font-size-base: 0.9375rem;

// lead font-size and weight
$lead-font-size: $font-size-base * 1.1;
$lead-font-weight: 500;

$headings-margin-bottom: 1rem;

// 3. Include remainder of required Bootstrap stylesheets
@import "../lib/bootstrap/scss/variables";
@import "../lib/bootstrap/scss/variables-dark";

// default headings font weight is semi bold
$headings-font-weight: $font-weight-semibold;

//small font for code is a bit too small
$code-font-size: $font-size-base * .9375;

// Playground specific!
$btn-font-weight: $font-weight-semibold;

// 4. Include any default map overrides here
// 5. Include remainder of required parts
@import "../lib/bootstrap/scss/maps";
@import "../lib/bootstrap/scss/mixins";
@import "../lib/bootstrap/scss/root";

// 6. Optionally include any other parts as needed
@import "../lib/bootstrap/scss/utilities";
@import "../lib/bootstrap/scss/reboot";
@import "../lib/bootstrap/scss/type";
@import "../lib/bootstrap/scss/images";
@import "../lib/bootstrap/scss/containers";
@import "../lib/bootstrap/scss/grid";
@import "../lib/bootstrap/scss/tables";
@import "../lib/bootstrap/scss/forms";
@import "../lib/bootstrap/scss/buttons";
@import "../lib/bootstrap/scss/transitions";
@import "../lib/bootstrap/scss/dropdown";
@import "../lib/bootstrap/scss/button-group";
@import "../lib/bootstrap/scss/nav";
@import "../lib/bootstrap/scss/navbar";
@import "../lib/bootstrap/scss/card";
@import "../lib/bootstrap/scss/accordion";
@import "../lib/bootstrap/scss/breadcrumb";
@import "../lib/bootstrap/scss/pagination";
@import "../lib/bootstrap/scss/badge";
@import "../lib/bootstrap/scss/alert";
@import "../lib/bootstrap/scss/progress";
@import "../lib/bootstrap/scss/list-group";
@import "../lib/bootstrap/scss/close";
@import "../lib/bootstrap/scss/toasts";
@import "../lib/bootstrap/scss/modal";
@import "../lib/bootstrap/scss/tooltip";
@import "../lib/bootstrap/scss/popover";
@import "../lib/bootstrap/scss/carousel";
@import "../lib/bootstrap/scss/spinners";
@import "../lib/bootstrap/scss/offcanvas";
@import "../lib/bootstrap/scss/placeholders";
@import "../lib/bootstrap/scss/helpers";

// 7. Optionally include utilities API last to generate classes based on the Sass map in `_utilities.scss`
@import "../lib/bootstrap/scss/utilities/api";

// 8. Add additional custom code here
