@import "common-variables"

/*** COLORS ***/
// common
$color-main: #006cc0
$color-box-bg: #F2F2F2
$color-alt-section-bg: #F5F5F5
$color-alt-box-bg: #e1e1e1
$color-box-shadow: rgba(0,0,0,.1)
$color-mask: rgba(0,0,0,.3)
$color-attention-soft: #e36565

// text
$color-text-dark: #2b2b2b

// input
$color-cancel: #ababab
$color-cancel-hover: #bcbcbc

// error
$color-error-text: #de0d2f

// popup
$color-popup-bg: white
$color-popup-shadow: $color-box-shadow

/*** SIZES ***/
// common
$spacer: 0.625rem
$gutter: 1.875rem
$alt-section-max-width: 700px
$alt-box-bg-border-width: 2px
$mobile-side-gap: 10px

// font size
$font-size-base: 1em
$font-size-2: 1.143em
$font-size-4: 1.286em
$font-size-8: 1.571em
$font-size-20: 2.429em

// shadow
$shadow-width: 5px

// font weight
$weight-light: 300
$weight-regular: 400
$weight-medium: 500
$weight-bold: 600

/*** COMPONENTS ***/
// upload zone
$upload-zone-bg-color: #f4f6fb
$upload-zone-border-color: #b5b5b5
$upload-zone-border-width: 1px
$upload-zone-border-style: dashed
$upload-zone-in: #fefcea
$upload-zone-in-hover: #fdf2b4

// map controls
$map-control-bg-color: #19324e

// marker cluster
$marker-cluster-bg-color: #4b5b73
$marker-cluster-bg-active-color: #404040
$marker-cluster-box-shadow: 0 0 0 4px rgba(0,0,0,.2)
$marker-cluster-border: 2px transparent solid
$marker-label-bg-color: #697a94
$marker-label-bg-color-active: #404040
$marker-label-color: white
