:root {
    --chv-card: #111a2c;
    --chv-panel: #0f172a;
    --chv-panel-solid: #0b1220;
    --chv-border: #1e293b;
    --chv-border-light: #2c3a55;
    --chv-text: #cbd5e1;
    --chv-text-muted: #94a3b8;
    --chv-heading: #e2e8f0;
    --chv-accent: #4f46e5;
    --chv-accent-2: #6366f1;
    --chv-success: #22c55e;
    --chv-danger: #ef4444;
    --chv-warning: #f59e0b;
    --chv-info: #38bdf8;
    --chv-body-bg: #0b1120;
}

html {
    scrollbar-color: #334155 #0b1120;
}

body,
body.primary-bg-color {
    background-color: var(--chv-body-bg) !important;
    background-image: none !important;
    color: var(--chv-text) !important;
}

body, .body, h1, h2, h3, h4, h5, h6 {
    color: var(--chv-text);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.panel-title, .card-title, .page-header h1, .header-lined h1 {
    color: var(--chv-heading) !important;
}

a {
    color: var(--chv-accent-2);
}

a:hover, a:focus {
    color: #818cf8;
}

.text-muted, .small-text, .muted {
    color: var(--chv-text-muted) !important;
}

/* ---------- Panels / cards ---------- */

.panel, .card,
.panel-default, .card-default {
    background-color: var(--chv-card) !important;
    border-color: var(--chv-border) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

.panel-heading, .card-header,
.panel-default > .panel-heading,
.card-default > .card-header,
.panel-group .panel-heading {
    background-color: var(--chv-panel) !important;
    border-color: var(--chv-border) !important;
    color: var(--chv-heading) !important;
}

.panel-footer, .card-footer {
    background-color: var(--chv-panel) !important;
    border-top-color: var(--chv-border) !important;
}

.panel-primary > .panel-heading,
.panel-primary > .panel-footer,
.panel-primary > .panel-body,
.panel-primary {
    border-color: var(--chv-accent) !important;
}

.panel-primary > .panel-heading {
    background-color: var(--chv-accent) !important;
}

.card.bg-default,
.card.bg-info,
.card.bg-success,
.card.bg-warning,
.card.bg-danger {
    background-color: var(--chv-card) !important;
}

.card-header.bg-info,
.card-header.bg-success,
.card-header.bg-warning,
.card-header.bg-danger {
    color: #fff !important;
}

.card-header.bg-info { background-color: #0e7490 !important; }
.card-header.bg-success { background-color: #15803d !important; }
.card-header.bg-warning { background-color: #b45309 !important; }
.card-header.bg-danger { background-color: #b91c1c !important; }

/* ---------- Tables ---------- */

.table {
    color: var(--chv-text) !important;
    background-color: var(--chv-card) !important;
}

.table > thead > tr > th,
.table > thead > tr > td {
    border-bottom-color: var(--chv-border-light) !important;
    color: var(--chv-heading) !important;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th {
    border-top-color: var(--chv-border) !important;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: rgba(79, 70, 229, 0.06) !important;
}

.table-hover > tbody > tr:hover {
    background-color: rgba(79, 70, 229, 0.12) !important;
    color: var(--chv-text);
}

.tablebg, .table-wrapper {
    background-color: var(--chv-card) !important;
    border-color: var(--chv-border) !important;
}

tr.rowhighlight td, tr.rowhighlight {
    background-color: rgba(79, 70, 229, 0.1) !important;
}

/* ---------- Forms ---------- */

.form-control,
.form-control:focus,
select.form-control,
input.form-control,
textarea.form-control {
    background-color: var(--chv-panel-solid) !important;
    border-color: var(--chv-border-light) !important;
    color: var(--chv-text) !important;
    box-shadow: none !important;
}

.form-control::placeholder,
input::placeholder, textarea::placeholder {
    color: var(--chv-text-muted) !important;
}

.form-control:focus {
    border-color: var(--chv-accent) !important;
    box-shadow: 0 0 0 0.2rem rgba(79, 70, 229, 0.25) !important;
}

select.form-control option {
    background-color: var(--chv-panel-solid);
    color: var(--chv-text);
}

.input-group-text,
.input-group-addon {
    background-color: var(--chv-panel) !important;
    border-color: var(--chv-border-light) !important;
    color: var(--chv-text-muted) !important;
}

label, .fieldlabel {
    color: var(--chv-text) !important;
}

.fieldarea, .fieldarea .form-control {
    background-color: transparent !important;
}

.checkbox label, .radio label {
    color: var(--chv-text);
}

/* ---------- Buttons ---------- */

.btn-default, .btn-secondary {
    background-color: var(--chv-panel) !important;
    border-color: var(--chv-border-light) !important;
    color: var(--chv-text) !important;
}

.btn-default:hover, .btn-secondary:hover {
    background-color: var(--chv-border) !important;
    color: var(--chv-heading) !important;
}

.btn-primary {
    background-color: var(--chv-accent) !important;
    border-color: var(--chv-accent) !important;
    color: #fff !important;
}

.btn-primary:hover, .btn-primary:focus {
    background-color: var(--chv-accent-2) !important;
    border-color: var(--chv-accent-2) !important;
}

.btn-success { background-color: var(--chv-success) !important; border-color: var(--chv-success) !important; }
.btn-danger { background-color: var(--chv-danger) !important; border-color: var(--chv-danger) !important; }
.btn-warning { background-color: var(--chv-warning) !important; border-color: var(--chv-warning) !important; }
.btn-info { background-color: var(--chv-info) !important; border-color: var(--chv-info) !important; }

/* ---------- Header / navbar ---------- */

#header, .header {
    background-color: var(--chv-panel) !important;
    border-bottom: 1px solid var(--chv-border) !important;
}

.navbar-default, .navbar, .topbar {
    background-color: var(--chv-panel) !important;
    border-color: var(--chv-border) !important;
}

.navbar-default .navbar-nav > li > a,
.navbar a, .nav a, .topbar a {
    color: var(--chv-text) !important;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.nav a:hover {
    color: #fff !important;
    background-color: var(--chv-border) !important;
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .active > a {
    background-color: var(--chv-border) !important;
    color: #fff !important;
}

.nav > li > a {
    color: var(--chv-text);
}

.nav-tabs > li > a {
    background-color: var(--chv-panel) !important;
    border-color: var(--chv-border) !important;
    color: var(--chv-text-muted) !important;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    background-color: var(--chv-card) !important;
    border-color: var(--chv-border) !important;
    border-bottom-color: transparent !important;
    color: var(--chv-heading) !important;
}

/* ---------- Dropdowns ---------- */

.dropdown-menu, .slim-menu {
    background-color: var(--chv-panel-solid) !important;
    border: 1px solid var(--chv-border) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5) !important;
}

.dropdown-menu > li > a {
    color: var(--chv-text) !important;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    background-color: var(--chv-border) !important;
    color: #fff !important;
}

.dropdown-menu > li > a.text-danger,
.dropdown-menu > li > a.text-danger:hover {
    color: var(--chv-danger) !important;
}

/* ---------- Modals ---------- */

.modal-content {
    background-color: var(--chv-card) !important;
    border: 1px solid var(--chv-border) !important;
}

.modal-header, .modal-footer {
    border-color: var(--chv-border) !important;
    background-color: var(--chv-panel) !important;
}

.modal-header .close, .close {
    color: var(--chv-text) !important;
    opacity: 0.8;
}

/* ---------- Alerts ---------- */

.alert {
    background-color: var(--chv-card) !important;
    border-color: var(--chv-border-light) !important;
    color: var(--chv-text) !important;
}

.alert-danger, .alert-error {
    background-color: rgba(239, 68, 68, 0.12) !important;
    border-color: rgba(239, 68, 68, 0.4) !important;
    color: #fca5a5 !important;
}

.alert-success {
    background-color: rgba(34, 197, 94, 0.12) !important;
    border-color: rgba(34, 197, 94, 0.4) !important;
    color: #86efac !important;
}

.alert-info {
    background-color: rgba(56, 189, 248, 0.12) !important;
    border-color: rgba(56, 189, 248, 0.4) !important;
    color: #7dd3fc !important;
}

.alert-warning {
    background-color: rgba(245, 158, 11, 0.12) !important;
    border-color: rgba(245, 158, 11, 0.4) !important;
    color: #fcd34d !important;
}

/* ---------- Badges / labels ---------- */

.label, .badge {
    background-color: var(--chv-border) !important;
    color: var(--chv-heading) !important;
}

.label-success, .badge-success { background-color: var(--chv-success) !important; color: #fff !important; }
.label-danger, .badge-danger { background-color: var(--chv-danger) !important; color: #fff !important; }
.label-warning, .badge-warning { background-color: var(--chv-warning) !important; color: #fff !important; }
.label-info, .badge-info { background-color: var(--chv-info) !important; color: #fff !important; }
.label-primary, .badge-primary { background-color: var(--chv-accent) !important; color: #fff !important; }

/* ---------- Footer ---------- */

#footer, .footer {
    background-color: var(--chv-panel) !important;
    border-top: 1px solid var(--chv-border) !important;
    color: var(--chv-text-muted) !important;
}

/* ---------- Misc ---------- */

.well {
    background-color: var(--chv-card) !important;
    border-color: var(--chv-border) !important;
}

.list-group-item {
    background-color: var(--chv-card) !important;
    border-color: var(--chv-border) !important;
    color: var(--chv-text) !important;
}

.list-group-item.active {
    background-color: var(--chv-accent) !important;
    border-color: var(--chv-accent) !important;
    color: #fff !important;
}

.page-header, hr {
    border-color: var(--chv-border) !important;
}

.progress, .progress-bar {
    background-color: var(--chv-border) !important;
}

.popover {
    background-color: var(--chv-panel-solid) !important;
    border-color: var(--chv-border) !important;
}

.popover-title {
    background-color: var(--chv-panel) !important;
    color: var(--chv-heading) !important;
    border-bottom-color: var(--chv-border) !important;
}

.popover-content {
    color: var(--chv-text) !important;
}

/* Client area homepage panels */
.home-panel, .client-home-panels .panel {
    background-color: var(--chv-card) !important;
}

/* Invoices */
.invoice-container {
    background-color: var(--chv-body-bg) !important;
}

.invoice-container .card,
.invoice-container .table,
.invoice-container .transactions-container {
    background-color: var(--chv-card) !important;
    color: var(--chv-text) !important;
}

.invoice-status .unpaid {
    color: var(--chv-warning) !important;
    border-color: var(--chv-warning) !important;
}

.invoice-status .paid {
    color: var(--chv-success) !important;
    border-color: var(--chv-success) !important;
}

/* Order form / cart */
#order-standard_cart, .order-box,
.order-summary, .summary-container {
    background-color: var(--chv-card) !important;
    border-color: var(--chv-border) !important;
}

.cart-table .item, .cart-table {
    background-color: var(--chv-card) !important;
    border-color: var(--chv-border) !important;
}

/* Domain checker */
#domainSearchForm, .domain-checker-container,
.domain-checker-result, .search-domain {
    background-color: var(--chv-card) !important;
    border-color: var(--chv-border) !important;
}

/* Pagination */
.pagination > li > a, .pagination > li > span {
    background-color: var(--chv-panel) !important;
    border-color: var(--chv-border-light) !important;
    color: var(--chv-text) !important;
}

.pagination > .active > a,
.pagination > .active > span {
    background-color: var(--chv-accent) !important;
    border-color: var(--chv-accent) !important;
    color: #fff !important;
}

/* Tabs */
.tab-content {
    background-color: var(--chv-card) !important;
}

/* Code / pre */
code, pre {
    background-color: var(--chv-panel-solid) !important;
    border-color: var(--chv-border) !important;
    color: var(--chv-text) !important;
}

/* Tablesorter headers */
th.headerSort, th.headerSortUp, th.headerSortDown {
    color: var(--chv-heading) !important;
}

/* Knowledgebase article / announcements */
.article, .announcement-single,
.kb-category, .kb-article {
    background-color: var(--chv-card) !important;
    border-color: var(--chv-border) !important;
}

/* Support ticket */
.ticket-reply, .ticket-message {
    background-color: var(--chv-card) !important;
    border-color: var(--chv-border) !important;
}

.ticket-reply .ticket-reply-body {
    color: var(--chv-text) !important;
}

/* SSL / addon checkboxes */
.checkbox-inline input[type="checkbox"],
.checkbox input[type="checkbox"],
.radio input[type="radio"] {
    accent-color: var(--chv-accent);
}

input[type="checkbox"], input[type="radio"] {
    accent-color: var(--chv-accent);
}

/* Selection */
::selection {
    background: var(--chv-accent);
    color: #fff;
}
