@import "colors", "media";
@import "../themes/theme-vars.scss";

:root {
  --mainBackground: #1e2124;
  --textColorPrimary: #87909c;
}

// Dimensions
$unit: 8px;
$padding: $unit;
$margin: $unit;
$radius: ceil($unit * .3);

// Fonts
$font-main: 'Roboto', 'Helvetica', 'Arial', sans-serif !default;
$font-monospace: Lucida Console, Monaco, Consolas, monospace;
$font-size-small: floor(1.5 * $unit);
$font-size: floor(1.75 * $unit);
$font-size-big: floor(2 * $unit);
$font-weight-thin: 300;
$font-weight-normal: 400;
$font-weight-bold: 500;

// Z-index correlations
$zIndex-sidebar-hover: 500;
$zIndex-select-portal: 300;
$zIndex-dialog: 200;
$zIndex-drawer: 100;

// Animation timing functions
$animation-curve-fast-out-slow-in: cubic-bezier(0.4, 0, 0.2, 1);
$animation-curve-linear-out-slow-in: cubic-bezier(0, 0, 0.2, 1);
$animation-curve-fast-out-linear-in: cubic-bezier(0.4, 0, 1, 1);

// Import other common vars & mixins
@import "mixins";