html[data-theme="dark"] {
	--dark-bg: #1b1e23;
	--dark-surface: #24282e;
	--dark-surface-2: #2b3036;
	--dark-elevated: #2f353c;
	--dark-border: #363b42;
	--dark-border-strong: #434a52;
	--dark-text: #c9ced4;
	--dark-text-muted: #8a9199;
	--dark-input-bg: #20242a;
	--dark-hover: #2b3036;
	--dark-link: #64b5f6;
}

html[data-theme="dark"],
html[data-theme="dark"] body {
	background-color: var(--dark-bg);
	color: var(--dark-text);
}

html[data-theme="dark"] .page-container,
html[data-theme="dark"] .page-content,
html[data-theme="dark"] .content-wrapper,
html[data-theme="dark"] .content {
	background-color: var(--dark-bg);
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6,
html[data-theme="dark"] .page-title h4,
html[data-theme="dark"] .text-default {
	color: var(--dark-text);
}

html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .text-size-mini.text-muted,
html[data-theme="dark"] .help-block {
	color: var(--dark-text-muted) !important;
}

html[data-theme="dark"] hr {
	border-top-color: var(--dark-border);
}

/* Panels / cards */
html[data-theme="dark"] .panel,
html[data-theme="dark"] .panel-default,
html[data-theme="dark"] .panel-flat,
html[data-theme="dark"] .panel-white {
	background-color: var(--dark-surface);
	border-color: var(--dark-border);
	color: var(--dark-text);
}

html[data-theme="dark"] .panel-heading,
html[data-theme="dark"] .panel-footer,
html[data-theme="dark"] .panel-body {
	background-color: var(--dark-surface);
	border-color: var(--dark-border);
	color: var(--dark-text);
}

html[data-theme="dark"] .panel-title,
html[data-theme="dark"] .panel-heading .panel-title {
	color: var(--dark-text);
}

html[data-theme="dark"] .well {
	background-color: var(--dark-surface-2);
	border-color: var(--dark-border);
}

/* Tables */
html[data-theme="dark"] .table,
html[data-theme="dark"] .table > thead > tr > th,
html[data-theme="dark"] .table > tbody > tr > td,
html[data-theme="dark"] .table > tbody > tr > th,
html[data-theme="dark"] .table > tfoot > tr > td {
	color: var(--dark-text);
	border-color: var(--dark-border);
}

html[data-theme="dark"] .table > thead > tr > th {
	border-bottom-color: var(--dark-border-strong);
}

html[data-theme="dark"] .table-bordered,
html[data-theme="dark"] .table-bordered > thead > tr > th,
html[data-theme="dark"] .table-bordered > tbody > tr > td,
html[data-theme="dark"] .table-bordered > tbody > tr > th {
	border-color: var(--dark-border);
}

html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) {
	background-color: rgba(255, 255, 255, 0.02);
}

html[data-theme="dark"] .table-hover > tbody > tr:hover {
	background-color: var(--dark-hover);
}

/* Forms */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-control:not([type="color"]),
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] input[type="search"],
html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] input[type="url"],
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] input[type="datetime-local"],
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
	background-color: var(--dark-input-bg);
	border-color: var(--dark-border-strong);
	color: var(--dark-text);
}

html[data-theme="dark"] .form-control:focus {
	border-color: #4a90d9;
	background-color: var(--dark-input-bg);
	color: var(--dark-text);
}

html[data-theme="dark"] .form-control::placeholder {
	color: var(--dark-text-muted);
}

html[data-theme="dark"] .form-control[disabled],
html[data-theme="dark"] .form-control[readonly],
html[data-theme="dark"] fieldset[disabled] .form-control {
	background-color: #191c20;
	color: var(--dark-text-muted);
}

html[data-theme="dark"] .input-group-addon {
	background-color: var(--dark-surface-2);
	border-color: var(--dark-border-strong);
	color: var(--dark-text);
}

html[data-theme="dark"] .control-label,
html[data-theme="dark"] label {
	color: var(--dark-text);
}

html[data-theme="dark"] .checker span,
html[data-theme="dark"] .choice span {
	background-color: var(--dark-input-bg);
	border-color: var(--dark-border-strong);
}

/* Select2 */
html[data-theme="dark"] .select2-container--default .select2-selection--single,
html[data-theme="dark"] .select2-container--default .select2-selection--multiple,
html[data-theme="dark"] .select2-selection {
	background-color: var(--dark-input-bg);
	border-color: var(--dark-border-strong);
	color: var(--dark-text);
}

html[data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered {
	color: var(--dark-text);
}

html[data-theme="dark"] .select2-dropdown,
html[data-theme="dark"] .select2-container--default .select2-search--dropdown .select2-search__field {
	background-color: var(--dark-elevated);
	border-color: var(--dark-border-strong);
	color: var(--dark-text);
}

html[data-theme="dark"] .select2-results__option {
	color: var(--dark-text);
}

html[data-theme="dark"] .select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: #1976d2;
}

html[data-theme="dark"] .select2-container--default .select2-selection--multiple .select2-selection__choice {
	background-color: var(--dark-surface-2);
	border-color: var(--dark-border-strong);
	color: var(--dark-text);
}

/* Buttons */
html[data-theme="dark"] .btn-default {
	background-color: var(--dark-surface-2);
	border-color: var(--dark-border-strong);
	color: var(--dark-text);
}

html[data-theme="dark"] .btn-default:hover,
html[data-theme="dark"] .btn-default:focus,
html[data-theme="dark"] .btn-default:active {
	background-color: var(--dark-elevated);
	border-color: var(--dark-border-strong);
	color: #fff;
}

/* Dropdowns */
html[data-theme="dark"] .dropdown-menu {
	background-color: var(--dark-elevated);
	border-color: var(--dark-border-strong);
}

html[data-theme="dark"] .dropdown-menu > li > a {
	color: var(--dark-text);
}

html[data-theme="dark"] .dropdown-menu > li > a:hover,
html[data-theme="dark"] .dropdown-menu > li > a:focus {
	background-color: var(--dark-hover);
	color: #fff;
}

html[data-theme="dark"] .dropdown-menu .divider {
	background-color: var(--dark-border);
}

/* Modals */
html[data-theme="dark"] .modal-content {
	background-color: var(--dark-surface);
	border-color: var(--dark-border-strong);
	color: var(--dark-text);
}

html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer {
	border-color: var(--dark-border);
}

html[data-theme="dark"] .modal-title {
	color: var(--dark-text);
}

html[data-theme="dark"] .close {
	color: var(--dark-text);
	text-shadow: none;
	opacity: 0.7;
}

html[data-theme="dark"] .modal-backdrop {
	background-color: #000;
}

/* Breadcrumbs / page header */
html[data-theme="dark"] .page-header {
	background-color: var(--dark-surface);
	border-color: var(--dark-border);
}

html[data-theme="dark"] .breadcrumb-line,
html[data-theme="dark"] .breadcrumb-line-component {
	background-color: var(--dark-surface);
	border-color: var(--dark-border);
}

html[data-theme="dark"] .breadcrumb > li,
html[data-theme="dark"] .breadcrumb > .active,
html[data-theme="dark"] .breadcrumb > li > a,
html[data-theme="dark"] .breadcrumb-elements > li > a {
	color: var(--dark-text);
}

html[data-theme="dark"] .breadcrumb > li + li:before {
	color: var(--dark-text-muted);
}

/* Tabs */
html[data-theme="dark"] .nav-tabs {
	border-bottom-color: var(--dark-border);
}

html[data-theme="dark"] .nav-tabs > li > a {
	color: var(--dark-text);
}

html[data-theme="dark"] .nav-tabs > li > a:hover,
html[data-theme="dark"] .nav-tabs > li > a:focus {
	background-color: var(--dark-hover);
	border-color: var(--dark-border);
}

html[data-theme="dark"] .nav-tabs > li.active > a,
html[data-theme="dark"] .nav-tabs > li.active > a:hover,
html[data-theme="dark"] .nav-tabs > li.active > a:focus {
	background-color: var(--dark-surface);
	border-color: var(--dark-border);
	color: var(--dark-text);
}

html[data-theme="dark"] .tab-content {
	color: var(--dark-text);
}

html[data-theme="dark"] .tab-content:not([class*="bg-"]),
html[data-theme="dark"] .tab-content-bordered .tab-content:not([class*="bg-"]) {
	background-color: var(--dark-surface);
	border-color: var(--dark-border);
	color: var(--dark-text);
}

html[data-theme="dark"] .tab-content-bordered .content-divider > span {
	background-color: var(--dark-surface);
}

html[data-theme="dark"] .nav-pills > li > a {
	color: var(--dark-text);
}

/* Alerts / flash messages */
html[data-theme="dark"] .alert-styled-left {
	background-color: var(--dark-surface-2);
	border-color: var(--dark-border);
	color: var(--dark-text);
}

/* Datagrid (Ublaboo) */
html[data-theme="dark"] .datagrid {
	background-color: var(--dark-surface);
	color: var(--dark-text);
}

html[data-theme="dark"] .datagrid table,
html[data-theme="dark"] .datagrid table thead th,
html[data-theme="dark"] .datagrid table tbody td,
html[data-theme="dark"] .datagrid table tbody th {
	color: var(--dark-text);
	border-color: var(--dark-border);
}

html[data-theme="dark"] .datagrid table thead tr.row-group-actions th,
html[data-theme="dark"] .datagrid table th.col-checkbox,
html[data-theme="dark"] .datagrid .ublaboo-datagrid-th-form-inline {
	background-color: var(--dark-surface-2);
	color: var(--dark-text);
}

html[data-theme="dark"] .datagrid table.table-striped > tbody > tr:nth-of-type(odd) {
	background-color: rgba(255, 255, 255, 0.02);
}

html[data-theme="dark"] .datagrid table.table-hover > tbody > tr:hover,
html[data-theme="dark"] .datagrid table.table-hover > tbody > tr:hover > td {
	background-color: var(--dark-hover);
}

html[data-theme="dark"] .datagrid .row-grid-bottom {
	background-color: var(--dark-surface-2);
	border-color: var(--dark-border);
}

html[data-theme="dark"] .datagrid .datagrid-row-columns-summary td,
html[data-theme="dark"] .datagrid .datagrid-row-columns-summary td:first-child,
html[data-theme="dark"] .datagrid .datagrid-row-columns-summary td:last-child {
	border-color: var(--dark-border);
}

html[data-theme="dark"] .datagrid .datagrid-toolbar,
html[data-theme="dark"] .datagrid .datagrid-group-action-title,
html[data-theme="dark"] .datagrid .datagrid-per-page,
html[data-theme="dark"] .datagrid .col-per-page {
	color: var(--dark-text);
}

html[data-theme="dark"] .pagination > li > a,
html[data-theme="dark"] .pagination > li > span {
	background-color: var(--dark-surface);
	border-color: var(--dark-border);
	color: var(--dark-text);
}

html[data-theme="dark"] .pagination > .active > a,
html[data-theme="dark"] .pagination > .active > span {
	background-color: #1976d2;
	border-color: #1976d2;
	color: #fff;
}

/* Media / list groups / panels-of-content */
html[data-theme="dark"] .media {
	border-color: var(--dark-border);
}

html[data-theme="dark"] .list-group-item {
	background-color: var(--dark-surface);
	border-color: var(--dark-border);
	color: var(--dark-text);
}

/* Code */
html[data-theme="dark"] pre,
html[data-theme="dark"] code,
html[data-theme="dark"] kbd,
html[data-theme="dark"] .well pre {
	background-color: #15181c;
	border-color: var(--dark-border);
	color: #d0d5db;
}

/* Navbar (keeps environment color header via bg-* classes) */
html[data-theme="dark"] .navbar-default:not([class*="bg-"]) {
	background-color: #16191d;
	border-color: var(--dark-border);
}

/* Summernote / editors */
html[data-theme="dark"] .note-editor.note-frame,
html[data-theme="dark"] .note-editor .note-editing-area .note-editable,
html[data-theme="dark"] .note-toolbar {
	background-color: var(--dark-input-bg);
	border-color: var(--dark-border-strong);
	color: var(--dark-text);
}

html[data-theme="dark"] .note-btn,
html[data-theme="dark"] .note-editor .btn-default {
	background-color: var(--dark-surface-2);
	border-color: var(--dark-border-strong);
	color: var(--dark-text);
}

/* Theme toggle button */
html[data-theme="dark"] #adminThemeToggle i {
	color: #ffca28;
}
