$orange: rgba(255, 212, 153, 1);
$green: rgba(89, 181, 128, 1);
$red: lighten(rgba(231, 76, 60, 1), 10%);
$gray: rgba(227, 227, 227, 1);
$blue: rgba(111, 164, 196, 1);

$white: rgba(255, 255, 255, 1);
$black: rgba(0, 0, 0, 1);
$dark: rgba(0, 0, 0, 0.4);

$reddit-orange: rgba(255, 69, 0, 1);
$twitter-blue: rgba(29, 155, 240, 1);

$transparant-red: transparentize($red, 0.8);
$transparant-blue: transparentize($blue, 0.8);
$transparant-orange: transparentize($orange, 0.4);
$transparant-green: transparentize($green, 0.4);

$azureish-white: rgba(205, 230, 245, 1);
$gainsboro: rgba(238, 238, 238, 1);
$nickel: rgba(112, 112, 120, 1);
$lavendal-pink: rgba(162, 155, 254, 1);

$focus-blue: darken($azureish-white, +10%);
$checkbox-blue: rgba(34, 170, 253, 1);

// White theme
$background-color: $white;

$font-color: rgba(83, 87, 91, 1);
$link-color: darken($azureish-white, 30%);
$read-color: darken($gainsboro, 10%);
$confirm-button-font-color: rgba(255, 255, 255, 1);

$accent-color: $gainsboro;
$lighter-accent-color: $gainsboro;
$lightest-accent-color: $orange;

$confirm-color: rgba(89, 181, 128, 1);
$danger-color: rgba(237, 118, 105, 1);
$warning-color: rgba(255, 218, 119, 1);
$info-color: rgba(162, 213, 242, 1);

// Dark theme
$dark-background-color: rgba(29, 45, 80, 1);

$dark-font-color: darken($gray, 10%);
$dark-link-color: $link-color;
$dark-read-color: darken($dark-font-color, 20%);
$dark-confirm-button-font-color: $dark-font-color;

$dark-accent-color: rgba(19, 59, 92, 1);
$dark-lighter-accent-color: rgba(30, 95, 116, 1);
$dark-lightest-accent-color: rgba(252, 218, 183, 1);

$dark-confirm-color: rgba(0, 121, 101, 1);
$dark-danger-color: rgba(175, 45, 45, 1);
$dark-warning-color: rgba(238, 187, 77, 1);
$dark-info-color: rgba(31, 111, 139, 1);
