$background: #000;

$text-color: #c8c8c8;
$primary: #428bca;
$success: #5cb85c;
$danger: #dc3545;
$warning: darken(#ffc107, 10%);

$gray-lighter: #999;
$gray-light: #7a8288;
$gray: #52575c;
$gray-dark: #3a3f44;
$gray-darker: #272b30;
$gray-black: #222;

// $gold: goldenrod;
$gold: #d4af37;

$input-bg: $gray-dark;
$input-border: $gray-darker;
$input-color: $text-color;
$input-placerholder: #757575;

$tablet-breakpoint: 768px;
$desktop-breakpoint: 992px;
$large-desktop-breakpoint: 1800px;

$border-radius-base: 4px;

$panel-bg: rgba($gray-darker, 0.9);
$panel-outer-border: lighten(#555, 10%);
$panel-inner-border: rgba(#c8c8c8, 0.9);
$panel-border-width: 2px;
$panel-border-radius: 10px;
$panel-content-border-radius: 6px;
$panelOuterBorderRadius: 24px;
$panelInnerBorderRadius: 20px;
$panelContentBorderRadius: 16px;

$navigation-mobile-height: 60px;
$navigation-mobile-bottom-offset: 20px;

$transition-base-speed: 0.5s;

// bootstrap overrides
$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 992px,
  lg: 1500px,
  xl: 2100px,
  xxl: 2800px,
  3xl: 3200px,
);

$container-max-widths: (
  xs: 100%,
  sm: 100%,
  md: 95%,
  lg: 95%,
  xl: 95%,
  xxl: 95%,
  3xl: 95%,
);

$font-size-base: 1rem;
$h1-large-font-size: $font-size-base * 2.5;
$h1-font-size: $font-size-base * 2.15;
$h2-font-size: $font-size-base * 1.7;
$h3-font-size: $font-size-base * 1.25;
$h4-font-size: $font-size-base;
$h5-font-size: $font-size-base * 0.85;
$h6-font-size: $font-size-base * 0.85;

$body-bg: $background;
$body-color: $text-color;

$progress-bg: #1c1e22;
