/* Decap CMS dark mode */
:root {
  color-scheme: dark;
}

body, #nc-root {
  background: #111 !important;
  color: #e8e8e8 !important;
}

/* Top nav */
header, [class*="AppHeader"], [class*="Topbar"] {
  background: #1a1a1a !important;
  border-bottom: 1px solid #333 !important;
}

/* Sidebar */
[class*="CollectionView"], [class*="SidebarNavList"], nav[class*="sidebar"], aside {
  background: #161616 !important;
  border-right: 1px solid #2a2a2a !important;
}

[class*="NavLink"], [class*="SidebarNavLink"] {
  color: #ccc !important;
}

[class*="NavLink"]:hover, [class*="NavLink"][class*="active"] {
  background: #2a2a2a !important;
  color: #fff !important;
}

/* Main content area */
[class*="EditorContainer"], [class*="CollectionContainer"], main {
  background: #111 !important;
}

/* Cards / list items */
[class*="ListCard"], [class*="EntryCard"], [class*="Card"] {
  background: #1e1e1e !important;
  border: 1px solid #2a2a2a !important;
  color: #e8e8e8 !important;
}

[class*="ListCard"]:hover, [class*="EntryCard"]:hover {
  background: #252525 !important;
}

/* Editor panels */
[class*="EditorControlPane"], [class*="ControlPane"], [class*="EditorPanel"] {
  background: #161616 !important;
  border-color: #2a2a2a !important;
}

/* Form inputs */
input, textarea, select, [class*="TextInput"], [class*="SelectInput"] {
  background: #222 !important;
  color: #e8e8e8 !important;
  border-color: #3a3a3a !important;
}

input:focus, textarea:focus, select:focus {
  border-color: #666 !important;
  outline: none !important;
}

/* Labels */
label, [class*="ControlLabel"] {
  color: #aaa !important;
}

/* Buttons */
button[class*="primary"], [class*="Button"][class*="primary"] {
  background: #444 !important;
  color: #fff !important;
  border-color: #555 !important;
}

button[class*="primary"]:hover {
  background: #555 !important;
}

/* Toolbar */
[class*="Toolbar"], [class*="EditorToolbar"] {
  background: #1a1a1a !important;
  border-color: #2a2a2a !important;
}

/* Markdown editor */
[class*="RichTextEditor"], [class*="Editor"] .CodeMirror {
  background: #1a1a1a !important;
  color: #e8e8e8 !important;
}

.CodeMirror {
  background: #1a1a1a !important;
  color: #e8e8e8 !important;
}

/* Dropdowns */
[class*="Dropdown"], [class*="DropdownList"] {
  background: #1e1e1e !important;
  border-color: #333 !important;
}

/* Hints */
[class*="HintText"], [class*="hint"] {
  color: #777 !important;
}

/* Boolean toggle */
[class*="ToggleBackground"] {
  background: #333 !important;
}

/* Scrollbars */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #111; }
::-webkit-scrollbar-thumb { background: #333; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #444; }