@import './colours';

/**
 * Theme Configuration
 *
 * This file provides the theming for this layout. It is imported in each apps main.js.
 *
 * !!!
 * Ensure to keep this file in sync with information in the Readme.
 * !!!
 *
 **/

// bootstrap defaults:
$primary: $colour-orange;
$secondary: $colour-blue-light;
$dark: $colour-blue-dark;
$light: $colour-white;
$warning: $colour-pink;
$danger: $colour-red;
$success: $colour-green;
$info: $colour-cream;
// custom colour names:
$highlight: $colour-orange-dark;
$background: $colour-blue;


// These imports MUST go below the above definitions to apply to the bootstrap theme
@import '~bootstrap/scss/bootstrap.scss';
@import '~bootstrap-vue/src/index.scss';

/** Defaults **/
body {
	color: $secondary;
}
h1, h2, h3, h4, h5 {
	margin: 0;
}

/** Variables **/
$tool-padding-mobile: 1rem;
$tool-padding-tablet: 1.5rem;
$tool-padding-desktop: 2rem;

$tool-border-radius: 10px;
$tool-text-large: 20px;
$tool-text-larger: 24px;

$breakpoint-tablet: 768px;
$breakpoint-desktop: 1200px;

@import './bootstrap-overrides';