//
// Colors
//

@page-background-color:                         #000000;
@content-background-color:                      #2a2a2a;
@content-border-color:                          #4a4a4a;
@content-container-color:                       #2a2a2a;

@site-brand-color:                              #ff0013;
@button-label-color:                            #e8e8e8;
@button-label-hover:                            #2a2a2a;
@social-link-color:                             #e8e8e8;
@checkout-button-text-color:                    #e8e8e8;

@emoji-react-button-active-color:               #adc7a0;

@scrollbar-border-color:                        @content-border-color;
@scrollbar-thumb-color:                         #ff001380;

@global-background:                             #1a1a1a;
@global-muted-background:                       #3a3a3a;
@global-primary-background:                     #1e87f0;
@global-secondary-background:                   #222;

@global-success-background:                     #32d296;
@global-warning-background:                     #faa05a;
@global-danger-background:                      #f0506e;

@global-color:                                  #c8c8c8;
@global-emphasis-color:                         #ffffff;
@global-muted-color:                            #9a9a9a;

@global-link-color:                             #e00000;
@global-link-hover-color:                       #ff0000;

@global-border:                                 #4a4a4a;
@global-inverse-color:                          #e8e8e8;

//
// Inverse
//

@inverse-global-color-mode:                     light;

@inverse-global-color:                          fade(@global-inverse-color, 70%);
@inverse-global-emphasis-color:                 @global-inverse-color;
@inverse-global-muted-color:                    #a8a8a8;
@inverse-global-inverse-color:                  #1a1a1a;

@inverse-global-primary-background:             @global-inverse-color;
@inverse-global-muted-background:               fade(@global-inverse-color, 10%);

@inverse-global-border:                         fade(@global-inverse-color, 20%);

//
// Button
//

@button-default-color:                          #000000;
@button-primary-color:                          #000000;
@button-secondary-color:                        #000000;

@button-text-color:                             #000000;
@button-text-hover-color:                       #000000;
@button-text-disabled-color:                    #000000;

button.uk-button.uk-button-default,
a.uk-button.uk-button-default {
  color: @global-color;
}

//
// Component: Navbar
//

@navbar-background:                             #1a1a1a;
@navbar-nav-item-height:                        @site-navbar-height;

//
// Off-Canvas
//

@offcanvas-bar-background:                      #1a1a1a;

//
// Navbar
//

@navbar-dropdown-background:                    #2a2a2a;
@navbar-dropdown-border:                        #3a3a3a;

.uk-navbar-dropdown {
  border: solid 2px @navbar-dropdown-border;
  border-radius: 4px;

  .uk-nav-divider {
    border-color: @navbar-dropdown-border;
  }
}

//
// Form
//

@internal-form-select-image:                     "/uikit/images/backgrounds/form-select.svg";
@internal-form-datalist-image:                   "/uikit/images/backgrounds/form-datalist.svg";
@internal-form-radio-image:                      "/uikit/images/backgrounds/form-radio.svg";
@internal-form-checkbox-image:                   "/uikit/images/backgrounds/form-checkbox.svg";
@internal-form-checkbox-indeterminate-image:     "/uikit/images/backgrounds/form-checkbox-indeterminate.svg";

/* Disabled */
.uk-input:disabled,
.uk-select:disabled,
.uk-textarea:disabled {
  color: @inverse-global-muted-color;
}