// Quasar SASS/SCSS Variables
// --------------------------------------------------
// To customize the look and feel of this app, you can override
// the Sass/SCSS variables found in Quasar's source Sass/SCSS files.

// Check documentation for full list of Quasar variables

// Your own variables (that are declared here) and Quasar's own
// ones will be available out of the box in your .vue/.scss/.sass files

// It's highly recommended to change the default colors
// to match your app's branding.
// Tip: Use the "Theme Builder" on Quasar's documentation website.

@use 'sass:map'

// Brand Colors
$primary   : #1976D2 !default
$secondary : #26A69A !default
$accent    : #9C27B0 !default

$dark      : #1d1d1d !default
$dark-page : #121212 !default

$positive  : #21BA45 !default
$negative  : #C10015 !default
$info      : #31CCEC !default
$warning   : #F2C037 !default

// Typography
$typography-font-family                   : 'Roboto', '-apple-system', 'Helvetica Neue', Helvetica, Arial, sans-serif !default
$body-font-size                           : 14px !default
$body-line-height                         : 1.5 !default

$h1:        (size: 6rem,     line-height: 6rem,     letter-spacing: -.01562em, weight: 300) !default
$h2:        (size: 3.75rem,  line-height: 3.75rem,  letter-spacing: -.00833em, weight: 300) !default
$h3:        (size: 3rem,     line-height: 3.125rem, letter-spacing: normal,    weight: 400) !default
$h4:        (size: 2.125rem, line-height: 2.5rem,   letter-spacing: .00735em,  weight: 400) !default
$h5:        (size: 1.5rem,   line-height: 2rem,     letter-spacing: normal,    weight: 400) !default
$h6:        (size: 1.25rem,  line-height: 2rem,     letter-spacing: .0125em,   weight: 500) !default

// Spacing
$space-base   : 16px !default
$space-x-base : $space-base !default
$space-y-base : $space-base !default

$space-none : (x: 0, y: 0) !default
$space-xs   : (x: ($space-x-base * .25), y: ($space-y-base * .25)) !default
$space-sm   : (x: ($space-x-base * .5), y: ($space-y-base * .5)) !default
$space-md   : (x: $space-x-base, y: $space-y-base) !default
$space-lg   : (x: ($space-x-base * 1.5), y: ($space-y-base * 1.5)) !default
$space-xl   : (x: ($space-x-base * 3), y: ($space-y-base * 3)) !default

// Border Radius
$generic-border-radius                    : 4px !default
$button-border-radius                     : 3px !default

// Form Components
$input-font-size                          : 14px !default
$input-text-color                         : rgba(0,0,0,.87) !default
$input-label-color                        : rgba(0,0,0,.6) !default

$field-label-font-size                    : 16px !default
$field-dense-label-font-size              : 14px !default

// Buttons
$button-font-size                         : 14px !default
$button-font-weight                       : 500 !default
$button-padding                           : 4px 16px !default
$button-dense-padding                     : .285em !default

// Tables
$table-th-font-size                       : 12px !default
$table-tbody-td-font-size                 : 13px !default

// Shadows
$shadow-1  : 0 1px 3px rgba(0, 0, 0, .12), 0 1px 1px rgba(0, 0, 0, .14), 0 2px 1px -1px rgba(0, 0, 0, .2) !default
$shadow-2  : 0 1px 5px rgba(0, 0, 0, .12), 0 2px 2px rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2) !default