@import "theme-template";

// variables

$light-text-color: #fff;
$dark-text-color: #444;
$primary-text-color: #e0e0e0;
$secondary-text-color: darken($primary-text-color, 20%);
$inactive-text-color: darken($primary-text-color, 40%);
$link-text-color: #049cce;
$error-text-color: #e3745b;

$settings-select-bg: #1e1f25;
$settings-select-color: #737373;
$settings-api-node-border-color: #2a2b34;
$main-content-margin-block-bg-color: #151619;
$bg-color: #191a1f;
$panel-bg-color: #2c2e37;
$light-panel-bg-color: #353742;
$super-light-panel-bg-color: lighten($light-panel-bg-color, 8%);
$settings-menu-hover-bg: darken($light-panel-bg-color, 5%);
$settings-menu-active-bg: darken($light-panel-bg-color, 5%);
$button-bg-color: #049cce;
$secondary-button-bg-color: #546979;
$input-background: lighten($bg-color, 1%);

$alert-color: $error-text-color;
$info-color: #4a90e2;
$success-color: #18bc9c;
$warning-color: #fcab53;
$fee-color: $secondary-text-color;

// Exchange colors
$bid-color: #50d2c2;
$ask-color: #e3745b;
$call-color: #bbbf2b;
$positive-color: #6ec105;
$negative-color: #e1424a;
$row-accent-color: #3c3c3c;
$header-color: #484848;

// Account table view colors
$account-header: #1a242f;
$account-cells: #27384b;
$account-green: #7ed321;
$account-primarytext: white;
$account-dimmed: #606060;
$account-border: #323131;
$account-background: black;
$account-tabs-background: inherit;

$pulsate-green-start: $account-green;
$pulsate-green-end: #b4f271;
$pulsate-red-start: $negative-color;
$pulsate-red-end: #ef7c82;

$modal-bg-color: #27384b;

$mobile-input-bg: #1b1c22;

$incognito-bg: #e3745b;

$positive-color-alternative: #22d173;
$negative-color-alternative: #ff276d;
$medium-color: #ff9900;
$dark-help-text: #171a25;
$separator-line: rgba(23, 26, 37, 0.3);

$tab-content-background-color: lighten($account-header, 4%);
$explorer-tab-content-background-color: $tab-content-background-color;

// * * * Explorer

// * * * * * Witnesses

$explorer--witnesses--info-bg: $account-cells;
$explorer--witnesses--info-border: $header-color;
$explorer--witnesses--info-table-title-color: darken(#fff, 50%);
$explorer--witnesses--info-table-text-color: #fff;

// * * * * * Assets

$explorer--assets--bg: $bg-color;

// * * * * *

// * * *

// * * * * Settings

$settings-label-color: rgba(255, 255, 255, 0.5);

//

// color palette

// branding colors
$primary-color: #337ab7;

// help colors
$primary-dark: #191a1f;
$white: #fff;
$dark: rgba(0, 0, 0, 0.6);
$dark-1: lighten($dark, 30%);
$dark-2: lighten($dark, 60%);
$dark-3: lighten($dark, 90%);

// Header
$header-background-color: lighten($primary-dark, 10%);
$header-shadow: 0 2px 9px 0 lighten($primary-dark, 10%) !important;
$header-item--color: darken($white, 10%);
$header-item-background-color: lighten($primary-dark, 10%);
$header-item--active--background-color: lighten($primary-dark, 10%);

$header-item--active--color: $link-text-color;

// Tabs (old, not style-guide)
$tabs-border-size: 1px;
$tabs-border-color: lighten($primary-dark, 5%);
$tabs-background-color: $primary-dark;
$tabs-item-background-color: $primary-dark;
$tabs-item-color: $white;
$tabs-item-border-size: 3px;
$tabs-item-border-color: $primary-dark;
$tabs-item--active--color: $dark;
$tabs-item--active--border-color: $primary-color;
$tabs-item--active--background-color: $primary-dark;
$tabs-item--active--border-color: $primary-color;
$tabs-content-background-color: $primary-dark;

// Selector

$selector-active-border-color: $primary-color;
$selector-active-text-color: $primary-color;

$selector-border-color: lighten($primary-dark, 5%);
$selector-text-color: lighten($primary-dark, 35%);

// Header Menu

$header-menu--active--icon-background: $primary-dark;
$header-menu--active--box-shadow: 0 4px 9px 0 #00000015;
$header-menu-background-color: lighten($primary-dark, 5%);
$header-menu-item--hover--background-color: lighten($primary-dark, 10%);

.midnightTheme {
    @include theme(
        $header-menu--active--icon-background,
        $header-menu--active--box-shadow,
        $header-menu-background-color,
        $header-menu-item--hover--background-color,
        $selector-active-border-color,
        $selector-active-text-color,
        $selector-border-color,
        $selector-text-color,
        $tabs-content-background-color,
        $tabs-border-size,
        $tabs-border-color,
        $tabs-background-color,
        $tabs-item-background-color,
        $tabs-item-color,
        $tabs-item-border-size,
        $tabs-item-border-color,
        $tabs-item--active--color,
        $tabs-item--active--border-color,
        $tabs-item--active--background-color,
        $header-background-color,
        $header-shadow,
        $header-item--color,
        $header-item-background-color,
        $header-item--active--background-color,
        $header-item--active--color,
        $explorer-tab-content-background-color,
        $tab-content-background-color,
        $primary-text-color,
        $bg-color,
        $dark-text-color,
        $inactive-text-color,
        $link-text-color,
        $light-text-color,
        $secondary-text-color,
        $success-color,
        $info-color,
        $warning-color,
        $alert-color,
        $super-light-panel-bg-color,
        $panel-bg-color,
        $button-bg-color,
        $secondary-button-bg-color,
        $fee-color,
        $bid-color,
        $ask-color,
        $call-color,
        $light-panel-bg-color,
        $positive-color,
        $negative-color,
        $row-accent-color,
        $header-color,
        $input-background,
        $account-header,
        $account-cells,
        $account-green,
        $account-primarytext,
        $account-dimmed,
        $account-border,
        $account-background,
        $account-tabs-background,
        $pulsate-green-start,
        $pulsate-green-end,
        $pulsate-red-start,
        $pulsate-red-end,
        $settings-select-bg,
        $settings-select-color,
        $settings-menu-hover-bg,
        $settings-menu-active-bg,
        $settings-api-node-border-color,
        $main-content-margin-block-bg-color,
        $modal-bg-color,
        $mobile-input-bg,
        $incognito-bg,
        $explorer--witnesses--info-bg,
        $explorer--witnesses--info-border,
        $explorer--witnesses--info-table-title-color,
        $explorer--witnesses--info-table-text-color,
        $explorer--assets--bg,
        $negative-color-alternative,
        $positive-color-alternative,
        $separator-line,
        $medium-color,
        $dark-help-text,
        $settings-label-color
    );
}
