[data-theme="dark"] {
    --font-family: 'Sarabun', sans-serif;
    --bg-body: #1a1a1a;
    --bg-panel: #2d2d2d;
    --bg-navbar: #252525;
    --bg-sidebar: #222222;
    --text-primary: #e0e0e0;
    --text-muted: #999999;
    --border-color: #444444;
    --input-bg: #333333;
    --table-stripe: #333333;
    --shadow: rgba(0,0,0,0.3);
    --success: #5cb85c;
    --danger: #d9534f;
    --warning: #f0ad4e;
    --primary: #5b9bd5;
    --code-bg: #1e1e1e;
    --link-color: #6ba3d8;
}

[data-theme="dark"] .navbar-default {
    background-color: var(--bg-navbar);
    background-image: none;
    border-color: var(--border-color);
    box-shadow: none;
}
[data-theme="dark"] .navbar-default .navbar-brand,
[data-theme="dark"] .navbar-default .navbar-nav > li > a,
[data-theme="dark"] .navbar-default .navbar-text {
    color: var(--text-primary);
}
[data-theme="dark"] .navbar-default .navbar-nav > li > a:hover,
[data-theme="dark"] .navbar-default .navbar-nav > li > a:focus {
    color: var(--primary);
    background-color: rgba(255,255,255,0.05);
}
[data-theme="dark"] .navbar-default .navbar-toggle {
    border-color: var(--border-color);
}
[data-theme="dark"] .navbar-default .navbar-toggle .icon-bar {
    background-color: var(--text-primary);
}
[data-theme="dark"] .navbar-default .navbar-collapse,
[data-theme="dark"] .navbar-default .navbar-collapse.in,
[data-theme="dark"] .navbar-default .navbar-form {
    border-color: var(--border-color);
    background-color: var(--bg-navbar);
    background-image: none;
    box-shadow: none;
}
[data-theme="dark"] .navbar-default .btn-link {
    color: var(--text-primary);
}
[data-theme="dark"] .navbar-default .btn-link:hover,
[data-theme="dark"] .navbar-default .btn-link:focus {
    color: var(--primary);
}
[data-theme="dark"] .nav-tabs {
    border-bottom-color: var(--border-color);
}
[data-theme="dark"] .nav-tabs > li > a {
    color: var(--text-muted);
}
[data-theme="dark"] .nav-tabs > li > a:hover {
    background-color: var(--bg-sidebar);
    border-color: var(--border-color);
    color: var(--text-primary);
}
[data-theme="dark"] .nav-tabs > li.active > a,
[data-theme="dark"] .nav-tabs > li.active > a:hover,
[data-theme="dark"] .nav-tabs > li.active > a:focus {
    background-color: var(--bg-panel);
    border-color: var(--border-color);
    border-bottom-color: transparent;
    color: var(--text-primary);
}
[data-theme="dark"] .preview-pane {
    background-color: var(--bg-panel);
    border-color: var(--border-color);
    color: var(--text-primary);
}
[data-theme="dark"] .markdown-body pre {
    background-color: var(--code-bg);
    border-color: var(--border-color);
}

[data-theme="dark"] .markdown-body pre code,
[data-theme="dark"] .markdown-body pre code.hljs {
    background: transparent;
    color: #d4d4d4;
}

[data-theme="dark"] .markdown-body pre code .hljs-comment,
[data-theme="dark"] .markdown-body pre code .hljs-quote {
    color: #8b9cb3;
    font-style: italic;
}

[data-theme="dark"] .markdown-body pre code .hljs-keyword,
[data-theme="dark"] .markdown-body pre code .hljs-selector-tag,
[data-theme="dark"] .markdown-body pre code .hljs-built_in,
[data-theme="dark"] .markdown-body pre code .hljs-name {
    color: #7cb7ff;
}

[data-theme="dark"] .markdown-body pre code .hljs-string,
[data-theme="dark"] .markdown-body pre code .hljs-attr,
[data-theme="dark"] .markdown-body pre code .hljs-symbol,
[data-theme="dark"] .markdown-body pre code .hljs-bullet {
    color: #98d4a4;
}

[data-theme="dark"] .markdown-body pre code .hljs-number,
[data-theme="dark"] .markdown-body pre code .hljs-literal {
    color: #f5c98a;
}

[data-theme="dark"] .markdown-body pre code .hljs-title,
[data-theme="dark"] .markdown-body pre code .hljs-section,
[data-theme="dark"] .markdown-body pre code .hljs-function .hljs-title {
    color: #ffd580;
}

[data-theme="dark"] .markdown-body pre code .hljs-variable,
[data-theme="dark"] .markdown-body pre code .hljs-template-variable,
[data-theme="dark"] .markdown-body pre code .hljs-attribute {
    color: #e0a8ff;
}

[data-theme="dark"] .markdown-body pre code .hljs-meta,
[data-theme="dark"] .markdown-body pre code .hljs-type {
    color: #7ee8e8;
}

[data-theme="dark"] .markdown-body pre code .hljs-emphasis {
    font-style: italic;
}

[data-theme="dark"] .markdown-body pre code .hljs-strong {
    font-weight: 700;
}

[data-theme="dark"] .markdown-body .md-inline-code {
    background-color: #2a3140;
    border-color: #4a5568;
    color: #f0f3f8;
}

[data-theme="dark"] .panel {
    background-color: var(--bg-panel);
    border-color: var(--border-color);
    color: var(--text-primary);
}
[data-theme="dark"] .panel-heading {
    background-color: var(--bg-sidebar);
    border-color: var(--border-color);
    color: var(--text-primary);
}
[data-theme="dark"] .form-control {
    background-color: var(--input-bg);
    border-color: var(--border-color);
    color: var(--text-primary);
}
[data-theme="dark"] .table {
    color: var(--text-primary);
}
[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: var(--table-stripe);
}
[data-theme="dark"] .list-group-item {
    background-color: var(--bg-panel);
    border-color: var(--border-color);
    color: var(--text-primary);
}
[data-theme="dark"] .list-group-item:hover,
[data-theme="dark"] .list-group-item:focus {
    background-color: var(--bg-sidebar);
    color: var(--text-primary);
}
[data-theme="dark"] .list-group-item.active,
[data-theme="dark"] .list-group-item.active:hover,
[data-theme="dark"] .list-group-item.active:focus {
    background-color: var(--primary);
    border-color: var(--primary);
    color: #fff;
}
[data-theme="dark"] .breadcrumb {
    background-color: transparent;
}
[data-theme="dark"] .breadcrumb > li + li:before {
    color: var(--text-muted);
}
[data-theme="dark"] .breadcrumb > .active {
    color: var(--text-muted);
}
[data-theme="dark"] .breadcrumb a {
    color: var(--link-color);
}
[data-theme="dark"] .btn-default {
    background-color: var(--bg-panel);
    background-image: none;
    border-color: var(--border-color);
    color: var(--text-primary);
    box-shadow: none;
    text-shadow: none;
}
[data-theme="dark"] .btn-default:hover,
[data-theme="dark"] .btn-default:focus,
[data-theme="dark"] .btn-default:active,
[data-theme="dark"] .btn-default.active,
[data-theme="dark"] .btn-default:active:hover,
[data-theme="dark"] .btn-default:active:focus {
    background-color: var(--bg-sidebar);
    background-image: none;
    border-color: var(--border-color);
    color: var(--text-primary);
    box-shadow: none;
    text-shadow: none;
}
[data-theme="dark"] .modal-content {
    background-color: var(--bg-panel);
    color: var(--text-primary);
}
[data-theme="dark"] .close {
    color: var(--text-primary);
    opacity: 0.8;
}