//
// Theme font
//

@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,700|Roboto:300,400,700');
$theme-font: 'Roboto', sans-serif !default;


//
// Theme Color
//

// UI
$primary: $gray-900 !default; // Primary text, Body, Button background ,Button border
$primary-inverse: $white !default; // Inverse text
$secondary: $gray-800 !default; // Secondary text, Input label, Tag label, Caption
$third: $gray_600 !default; // Breadcrumb link
$background-01: $white !default; // Default background
$background-02: $gray-900 !default; // Secondary background, Header, Footer
$background-container: $white !default; // Card background, Modal background, Side nav
$background-code: $gray-100 !default; // Code background
$background-input: $gray-100 !default; // Input background
$background-table: $gray-100 !default; // Table background
$background-tag: $gray-100 !default; // Tag background
$border-01: $gray-200 !default; // Primary border
$border-02: $gray-800 !default; // Secondary border
$border-focus: $gray-900 !default; // Focus border
$border-hover: $gray-900 !default; // Hover border
$disabled-01: $gray-100 !default; // Disabled border, Disabled background
$disabled-02: $gray-300 !default; // Disabled label


// Gray
$gray: $gray-300 !default; // Sub gray color
$gray-light: $gray-100 !default; // Sub light gray color
$gray-dark: $gray-600 !default; // Sub dark gray color


// Interactive
$hover-01: $gray-100 !default; // Primary hover
$hover-02: $gray-200 !default; // Secondary hover
$invalid: $red-700 !default; // Error, Caution
$placeholder: $gray-600 !default; // Placeholder
$selection: $blue-300 !default; // Selection