/* Used for things like the header */
:root.superhero {
  --theme-primary: #df691a;
  --theme-primary-hover: #b15315;
  --theme-light: #abb6c2;
  --theme-dark: #4e5d6c;
  --theme-darker: #2B3E50;
  --theme-text-contrast: #ebebeb;
  --theme-header-height: 114px;
  --theme-form-required: var(--theme-primary);
  --theme-header: var(--theme-dark);
  --theme-header-border: unset;
  --theme-btn-accent: var(--theme-primary);
  --theme-btn-accent-hover: var(--theme-primary-hover);
  --theme-bg-card: #4e5d6c;
  --theme-bg-card-footer: rgba(255, 255, 255, 0.075);
  --theme-affix-page-seasonal-color: #df691a;
  --theme-affix-page-seasonal-background-color: rgba(223, 105, 26, 0.7333333333);
  --theme-affix-page-current-week-border-color: rgb(235, 235, 235);
}

:root.darkly {
  --theme-primary: #375a7f;
  --theme-primary-hover: #4e7fb3;
  --theme-light: #adb5bd;
  --theme-dark: #303030;
  --theme-darker: #202020;
  --theme-text-contrast: #ebebeb;
  --theme-header-height: 114px;
  --theme-form-required: #c40000;
  --theme-header: var(--theme-dark);
  --theme-header-border: unset;
  --theme-btn-accent: #00bc8c;
  --theme-btn-accent-hover: #007053;
  --theme-bg-card: #303030;
  --theme-bg-card-footer: #444;
  --theme-affix-page-seasonal-color: #00bc8c;
  --theme-affix-page-seasonal-background-color: rgba(0, 188, 140, 0.7333333333);
  --theme-affix-page-current-week-border-color: rgb(235, 235, 235);
}

:root.lux {
  --theme-primary: #1a1a1a;
  --theme-primary-hover: #1a1a1a;
  --theme-light: #fff;
  --theme-dark: #ebebeb;
  --theme-darker: #ebebeb;
  --theme-text-contrast: #1a1a1a;
  --theme-header-height: 114px;
  --theme-form-required: #c40000;
  --theme-header: var(--theme-light);
  --theme-header-border: 1px solid #1a1a1a;
  --theme-btn-accent: #1a1a1a;
  --theme-btn-accent-hover: black;
  --theme-bg-card: #fff;
  --theme-bg-card-footer: rgba(0, 0, 0, 0.03);
  --theme-affix-page-seasonal-color: #df691a;
  --theme-affix-page-seasonal-background-color: rgba(223, 105, 26, 0.7333333333);
  --theme-affix-page-current-week-border-color: var(--theme-primary);
}

body {
  font-family: Salesforce Sans, Arial, sans-serif;
  background-color: var(--theme-darker) !important;
}

/* Required to give these things a bump over the .darkly and .superhero selectors */
.theme {
  /** BOOTSTRAP **/
  /* Weird offset because of theme */
  /** Hide the separating border between login/register when on a small screen, when they're stacked vertically */
  /* normal container */
  /* wide container */
  /** TOGGLE **/
  /* Override this so that long race names fit in their group selection boxes */
  /* Fixed messages always on top */
  /* Floating top header should be top, but not too top */
  /* On home page */
  /** INTRO.JS */
  /** Map */
  /* DATATABLES */
  /* HOME PAGE */
  /** Disable fractional markers -> https://github.com/IonDen/ion.rangeSlider/issues/171 */
  /** Affixes page **/
}

.theme .bootstrap-select .btn {
  background-color: white;
  border: 1px solid #ced4da;
  color: #495057;
}

.theme .nav-item-divider {
  margin: 0 0.75em;
}

.theme .bootstrap-select.form-control {
  padding: 0;
}

.theme .bootstrap-select.form-control {
  margin-bottom: 0;
  padding: 0;
  border: none;
  height: auto;
}

.theme .bootstrap-select > .dropdown-toggle {
  position: relative;
  width: 100%;
  text-align: right;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
}

.theme .bootstrap-select .dropdown-menu {
  min-width: 100%;
  box-sizing: border-box;
}

.theme .cursor-pointer {
  cursor: pointer !important;
}

@media (max-width: 576px) and (orientation: landscape) {
  .theme .hide-on-landscape {
    display: none;
  }
}
@media (max-width: 576px) and (orientation: portrait) {
  .theme .hide-on-portrait {
    display: none;
  }
}
@media (min-width: 576px) and (orientation: landscape) {
  .theme .hide-on-landscape-sm {
    display: none;
  }
}
@media (min-width: 576px) and (orientation: portrait) {
  .theme .hide-on-portrait-sm {
    display: none;
  }
}
@media (min-width: 768px) and (orientation: landscape) {
  .theme .hide-on-landscape-md {
    display: none;
  }
}
@media (min-width: 768px) and (orientation: portrait) {
  .theme .hide-on-portrait-md {
    display: none;
  }
}
@media (min-width: 992px) and (orientation: landscape) {
  .theme .hide-on-landscape-lg {
    display: none;
  }
}
@media (min-width: 992px) and (orientation: portrait) {
  .theme .hide-on-portrait-lg {
    display: none;
  }
}
@media (min-width: 1200px) and (orientation: landscape) {
  .theme .hide-on-landscape-xl {
    display: none;
  }
}
@media (min-width: 1200px) and (orientation: portrait) {
  .theme .hide-on-portrait-xl {
    display: none;
  }
}
@media (min-width: 900px) {
  .theme .login-modal-dialog {
    max-width: 900px;
  }
  .theme .register-modal-dialog {
    max-width: 900px;
  }
  .theme .register-modal-dialog .border-left.border-white {
    border: hidden;
  }
}
@media (max-width: 900px) {
  .theme .login-modal-dialog .border-left.border-white {
    border: none !important;
  }
  .theme .register-modal-dialog .border-left.border-white {
    border: none !important;
  }
}
@media (min-width: 1440px) {
  .theme .container {
    max-width: 1400px;
  }
}
@media (min-width: 1440px) {
  .theme .container_wide {
    max-width: 1400px;
  }
}
@media (min-width: 1800px) {
  .theme .container_wide {
    max-width: 1750px;
  }
}
@media (min-width: 1440px) {
  .theme .menu_sidebar {
    flex: 0 0 230px;
  }
}
@media (max-width: 690px) {
  .theme .my-sidebar {
    display: none;
  }
}
.theme .toggle-on {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 50%;
  margin: 0;
  border: 0;
  border-radius: 0;
}

.theme .toggle-on.btn {
  padding-right: 1.5rem;
}

.theme .toggle-off {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  right: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.theme .toggle-off.btn {
  padding-left: 1.5rem;
}

.theme .toggle-group label, .theme .toggle-group span {
  cursor: pointer;
}

.theme .toggle-group {
  position: absolute;
  width: 200%;
  top: 0;
  bottom: 0;
  left: 0;
  transition: left 0.35s;
  -webkit-transition: left 0.35s;
  -moz-user-select: none;
  -webkit-user-select: none;
}

.theme .left_checkbox {
  width: 40px;
}

.theme .modal-backdrop {
  z-index: 100010;
}

.theme .modal {
  z-index: 100011;
}

.theme .modal-lg {
  max-width: 80%;
}

.theme .navbar-default .navbar-nav > li > .btn-success > a:hover, .theme .navbar-default .navbar-nav > li > .btn-success > a:focus {
  background-color: #20895e;
}

.theme .navbar-default .navbar-nav > li > a.btn-success {
  color: #FFF;
}

.theme .navbar-default .navbar-nav > li > a.btn-success:hover {
  background-color: #20895E;
}

.theme .btn-outline-success:hover .text-light {
  color: #fff !important;
}

.theme .btn-outline-info:hover .text-light {
  color: #fff !important;
}

.theme .panel-heading {
  font-size: 28px;
}

.theme .panel-heading-wide {
  text-align: center;
}

.theme .alert.alert-danger ul {
  margin-bottom: 0;
}

.theme .dropdown-item {
  cursor: pointer;
  padding: 0.25em 0.9em;
}

.theme .fixed-bottom {
  z-index: 1000;
}

.theme .fixed-top {
  z-index: 800 !important;
}

.theme .popover {
  z-index: 100000 !important;
}

.theme .alert_fixed_footer {
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
}

.theme .btn-accent {
  background-color: var(--theme-btn-accent) !important;
}

.theme .btn-accent:hover {
  background-color: var(--theme-btn-accent-hover) !important;
}

.theme .bg-header {
  background-color: var(--theme-header) !important;
}

.theme #app .bg-header {
  border-bottom: var(--theme-header-border) !important;
}

.theme .route_manipulation_tools .bg-header,
.theme #map_header .bg-header {
  border: var(--theme-header-border) !important;
}

@media (max-width: 1200px) {
  .theme #map_header {
    background-color: var(--theme-header) !important;
  }
}
.theme .bg-card {
  background-color: var(--theme-bg-card) !important;
}

.theme .bg-card-footer {
  background-color: var(--theme-bg-card-footer) !important;
}

.theme .bg-dark {
  background-color: var(--theme-darker) !important;
}

.theme .border-dark {
  border-color: var(--theme-darker) !important;
}

.theme .dropdown .dropdown-menu {
  background-color: var(--theme-dark);
}

.theme .dropdown .dropdown-header {
  font-weight: bold;
  color: var(--theme-primary) !important;
}

.theme #map .dropdown-item:hover, .theme .dropdown-item:focus {
  color: black;
}

.theme .form-control:disabled, .theme .form-control[readonly] {
  color: var(--theme-text-contrast);
  background-color: var(--theme-dark);
  opacity: 1;
}

.theme .patreon-color {
  background-color: rgb(250, 118, 100);
}

.theme .text-patreon {
  color: rgb(250, 118, 100);
}

.theme .class_icon {
  background-color: var(--theme-darker);
}

.theme .affix_list .affix_list_row_selected {
  background-color: var(--theme-darker);
}

.theme .affix_list .affix_list_row:hover {
  background-color: var(--theme-darker);
}

.theme #team_members_table .dropdown.bootstrap-select .btn {
  border: 1px solid var(--theme-darker);
}

.theme .probootstrap-showcase-nav ul li.active {
  background-color: #8d9dad !important;
}

.theme .probootstrap-showcase-nav ul li.active a {
  color: rgb(235, 235, 235) !important;
}

.theme .probootstrap-showcase-nav ul li > a {
  color: var(--theme-primary) !important;
}

.theme .service .icon i {
  color: var(--theme-primary) !important;
}

.theme .introjs-button {
  color: var(--theme-dark) !important;
}

.theme .form-required {
  color: var(--theme-form-required) !important;
}

.theme .favorited {
  color: #ffd048;
}

.theme .leaflet-container {
  background-color: var(--theme-darker);
}

.theme .sidebar {
  background-color: var(--theme-dark);
}

.theme .sidebar.anchor-left {
  border-right: var(--theme-darker) solid 1px;
}

.theme .sidebar.anchor-right {
  border-left: var(--theme-darker) solid 1px;
}

.theme .sidebar-toggle {
  background: var(--theme-dark);
  color: var(--theme-primary);
}

.theme .sidebar-toggle:hover {
  background: var(--theme-primary);
  color: var(--theme-light);
}

.theme .sidebar .sidebar-header {
  background: var(--theme-darker);
}

.theme .embed .embed-header-subtitle,
.theme .sidebar .sidebar-header-subtitle {
  color: var(--theme-light);
}

.theme .route_manipulation_tools .draw_icon.leaflet-draw-toolbar-button-enabled .col,
.theme .route_manipulation_tools .draw_icon .col:hover {
  background: var(--theme-primary);
  color: var(--theme-light) !important;
}

.theme #pulls_sidebar .map_killzonessidebar_floor_switch:not(.selected):hover,
.theme #pulls_sidebar .map_killzonessidebar_killzone.selectable:not(.selected):hover {
  background-color: var(--theme-darker) !important;
}

.theme .enemy_icon.boss,
.theme .enemy_icon.melee,
.theme .enemy_icon.caster,
.theme .enemy_icon.ranged,
.theme .enemy_icon.healer,
.theme .enemy_icon.enchanted,
.theme .enemy_icon.tide,
.theme .enemy_icon.void,
.theme .enemy_icon.castermelee,
.theme .enemy_icon.healercaster,
.theme .enemy_icon.healermelee,
.theme .enemy_icon.rangedcaster,
.theme .enemy_icon.rangedhealer,
.theme .enemy_icon.rangedmelee,
.theme .enemy_icon.enemy_forces {
  background-color: var(--theme-darker);
  color: var(--theme-text-contrast);
}

.theme .dropdown.bootstrap-select {
  background-color: var(--theme-dark);
}

.theme #edit_route_freedraw_options_color,
.theme .dropdown.bootstrap-select .btn {
  background-color: var(--theme-dark);
  color: var(--theme-text-contrast);
  border: 1px solid var(--theme-darker);
}

.theme #edit_route_draw_container a {
  color: var(--theme-text-contrast);
}

.theme #edit_route_draw_container a:hover {
  text-decoration: none;
}

.theme .route_manipulation_tools.left .btn {
  width: 100%;
  height: 48px;
}

.theme .route_manipulation_tools.left .btn {
  border: none;
  border-radius: 0;
  display: flex;
  align-items: center;
  padding: 0.75rem 0.75rem 0.75rem 1.4rem;
}

.theme #view_route_map_actions_container .btn,
.theme #present_route_map_actions_container .btn,
.theme #edit_route_draw_map_actions_container .btn,
.theme #edit_route_draw_admin_map_actions_container .btn {
  border-radius: 0;
}

.theme #edit_route_draw_actions_container .leaflet-draw-actions a {
  background: inherit;
  color: var(--theme-text-contrast);
}

.theme #map .dropdown-menu.show li {
  background-color: var(--theme-darker);
}

.theme .popupCustom .leaflet-popup-tip,
.theme .popupCustom .leaflet-popup-content-wrapper {
  background: var(--theme-dark);
  color: var(--theme-light);
}

.theme .popupCustom .leaflet-popup-close-button {
  color: var(--theme-primary) !important;
}

.theme .dataTables_wrapper .dataTables_paginate .paginate_button.current {
  color: var(--theme-light) !important;
  border: none;
  background: none;
  background-color: var(--theme-primary);
}

.theme .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover, .theme .dataTables_wrapper .dataTables_paginate .paginate_button.current:active {
  color: var(--theme-light) !important;
  border: none;
  background: none;
  background-color: var(--theme-primary-hover);
}

.theme table.dataTable tbody tr {
  background-color: var(--theme-dark);
}

.theme table.dataTable tbody tr.selected {
  background-color: var(--theme-darker);
}

.theme .navbar-top-fixed-spacer {
  height: var(--theme-header-height);
}

.theme .home .mbr-overlay {
  background-color: var(--theme-dark);
}

.theme .home .mbr-overlay {
  background-color: var(--theme-dark);
}

.theme .home .demo-loader {
  background-color: var(--theme-darker);
}

.theme .home .cid-s48MCQYojq .mbr-text,
.theme .home .cid-s48MCQYojq .mbr-section-btn {
  color: unset;
}

.theme .home .form-control {
  background-color: var(--theme-dark);
  color: var(--theme-text-contrast);
}

.theme .home .cid-soU8PSECoL {
  background-color: var(--theme-darker) !important;
}

.theme .home .cid-soU8QlAKKP {
  background-color: var(--theme-darker) !important;
}

.theme .home .cid-soU6QnGh9A {
  background-color: var(--theme-darker) !important;
}

.theme .home .cid-soU6QnGh9A .mbr-iconfont {
  color: var(--theme-btn-accent) !important;
}

.theme .home .cid-soU9jtw47v .mbr-text,
.theme .home .cid-soU9jtw47v .card-title,
.theme .home .cid-soU9jtw47v .card-box {
  color: unset !important;
}

.theme .home .cid-soU5dLgjOI {
  background-color: var(--theme-darker) !important;
}

.theme .home .cid-soU7JptK9v {
  background-color: var(--theme-header) !important;
}

.theme .home .gradient-top {
  background: var(--theme-darker);
  background: linear-gradient(0deg, var(--theme-darker) 0%, rgba(0, 0, 0, 0) 100%);
}

.theme .home .gradient-top.footer {
  background: var(--theme-darker);
  background: linear-gradient(0deg, var(--theme-header) 0%, rgba(0, 0, 0, 0) 100%);
}

.theme .home .gradient-bottom {
  background: var(--theme-darker);
  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, var(--theme-darker) 100%);
}

.theme .dungeon_wallpaper_cover {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  z-index: -1;
  background-color: var(--theme-dark);
  opacity: 0.8;
}

.theme .irs--flat .irs-grid-pol.small {
  height: 0;
}

.theme .irs--flat .irs-from:before,
.theme .irs--flat .irs-to:before,
.theme .irs--flat .irs-single:before {
  border-top-color: var(--theme-primary);
}

.theme .irs--flat .irs-from,
.theme .irs--flat .irs-to,
.theme .irs--flat .irs-single,
.theme .irs--flat .irs-handle > i:first-child,
.theme .irs--flat .irs-bar {
  background-color: var(--theme-primary);
}

.theme .irs--flat.inverse .irs-line {
  background-color: var(--theme-primary);
}

.theme .irs--flat.inverse .irs-bar {
  background-color: #e1e4e9;
}

.theme .affixes_overview_table .seasonal.last_column {
  border-left: var(--theme-affix-page-seasonal-color) 3px solid;
  border-right: var(--theme-affix-page-seasonal-color) 3px solid;
  /* bb to make semi-transparent to let row offsets shine through */
  background-color: var(--theme-affix-page-seasonal-background-color);
}

.theme .affixes_overview_table .seasonal.last_column.first_row {
  border-top: var(--theme-affix-page-seasonal-color) 3px solid;
}

.theme .affixes_overview_table .seasonal.last_column.last_row {
  border-bottom: var(--theme-affix-page-seasonal-color) 3px solid;
}

.theme .affixes_overview_table .current_week.border_top {
  border-top: var(--theme-affix-page-current-week-border-color) 3px solid !important;
}

.theme .affixes_overview_table .current_week.border_bottom {
  border-bottom: var(--theme-affix-page-current-week-border-color) 3px solid !important;
}

.theme .affixes_overview_table .current_week.first_column {
  border-left: var(--theme-affix-page-current-week-border-color) 3px solid;
}

.theme .affixes_overview_table .current_week.last_column {
  border-right: var(--theme-affix-page-current-week-border-color) 3px solid;
}
