/* Dark mode for Decap CMS */
html, body, #root, #nc-root {
  background-color: #0a0a0a !important;
  color: #e0e0e0 !important;
}

/* Override all white backgrounds - but NOT text color */
* {
  background-color: inherit !important;
}

/* Then set specific backgrounds */
html, body {
  background-color: #0a0a0a !important;
}

/* Main layout areas */
[class*="AppContainer"],
[class*="AppHeader"],
[class*="AppMain"],
[class*="Wrapper"],
div[class^="css-"][class*="e1geg"],
div[class^="css-"][class*="e16556"],
div[class^="css-"][class*="e1vc5"],
div[class^="css-"][class*="u4olba"] {
  background-color: #0a0a0a !important;
  color: #e0e0e0 !important;
}

/* Sidebar and navigation */
aside,
nav,
[class*="SidebarContainer"],
div[class^="css-"][class*="s67tkf"],
div[class^="css-"][class*="hvrgqv"] {
  background-color: #141414 !important;
  color: #e0e0e0 !important;
}

/* Cards, panels, and content areas */
[class*="Card"],
[class*="Panel"],
[class*="EditorContainer"],
[class*="ControlContainer"],
div[class^="css-"][class*="hn3jn7"],
div[class^="css-"][class*="ki25g6"],
div[class^="css-"][class*="f7kqzm"],
div[class^="css-"][class*="vurnku"],
div[class^="css-"][class*="gj57a0"] {
  background-color: #1a1a1a !important;
  border-color: #2a2a2a !important;
  color: #e0e0e0 !important;
}

/* Form inputs and controls */
input,
textarea,
select,
[class*="Input"],
[class*="TextArea"],
[class*="Select"],
div[contenteditable="true"],
[data-slate-editor],
[class*="EditorControl"] {
  background-color: #141414 !important;
  border-color: #2a2a2a !important;
  color: #e0e0e0 !important;
}

input:focus,
textarea:focus,
select:focus,
[contenteditable="true"]:focus {
  border-color: #3b82f6 !important;
  outline: none !important;
}

/* Text and labels */
label,
span,
p,
h1, h2, h3, h4, h5, h6,
[class*="Label"],
[class*="Title"],
[class*="Heading"],
[class*="Text"] {
  color: #e0e0e0 !important;
}

/* Links */
a,
[class*="Link"] {
  color: #3b82f6 !important;
}

a:hover {
  color: #60a5fa !important;
}

/* Buttons */
button,
[class*="Button"]:not([class*="Primary"]) {
  background-color: #1a1a1a !important;
  border-color: #2a2a2a !important;
  color: #e0e0e0 !important;
}

button:hover,
[class*="Button"]:not([class*="Primary"]):hover {
  background-color: #2a2a2a !important;
  border-color: #3a3a3a !important;
}

/* Primary buttons */
[class*="PrimaryButton"],
[class*="SaveButton"],
button[class*="Primary"] {
  background-color: #3b82f6 !important;
  color: white !important;
  border: none !important;
}

[class*="PrimaryButton"]:hover,
[class*="SaveButton"]:hover,
button[class*="Primary"]:hover {
  background-color: #2563eb !important;
}

/* Lists and list items */
ul, ol,
[class*="List"],
[class*="ListItem"],
li {
  background-color: transparent !important;
  color: #e0e0e0 !important;
}

li:hover,
[class*="ListItem"]:hover {
  background-color: #1a1a1a !important;
}

/* Tables */
table, thead, tbody, tr, td, th {
  background-color: #141414 !important;
  border-color: #2a2a2a !important;
  color: #e0e0e0 !important;
}

tr:hover {
  background-color: #1a1a1a !important;
}

/* Tooltips and dropdowns */
[class*="Tooltip"],
[class*="Dropdown"],
[class*="Menu"],
[role="menu"] {
  background-color: #1a1a1a !important;
  border-color: #2a2a2a !important;
  color: #e0e0e0 !important;
}

/* Modal and dialogs */
[class*="Modal"],
[class*="Dialog"],
[role="dialog"] {
  background-color: #141414 !important;
  color: #e0e0e0 !important;
}

/* Media library */
[class*="MediaLibrary"],
[class*="AssetCard"],
[class*="ImageWrapper"] {
  background-color: #1a1a1a !important;
  border-color: #2a2a2a !important;
}

/* Error and warning messages */
[class*="Error"],
[class*="Warning"],
[class*="Alert"] {
  background-color: #1a1a1a !important;
  border-color: #2a2a2a !important;
}

/* Loading states */
[class*="Loader"],
[class*="Spinner"] {
  color: #3b82f6 !important;
}

/* Markdown editor specific */
.CodeMirror {
  background-color: #141414 !important;
  color: #e0e0e0 !important;
}

.CodeMirror-gutters {
  background-color: #1a1a1a !important;
  border-color: #2a2a2a !important;
}

.CodeMirror-cursor {
  border-color: #e0e0e0 !important;
}

/* Rich text editor */
[data-slate-editor] {
  background-color: #141414 !important;
  color: #e0e0e0 !important;
  caret-color: #e0e0e0 !important;
}

/* Scrollbars */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #141414;
}

::-webkit-scrollbar-thumb {
  background: #2a2a2a;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #3a3a3a;
}

/* Additional overrides for stubborn elements */
* {
  scrollbar-width: thin;
  scrollbar-color: #2a2a2a #141414;
}

div[style*="background-color: rgb(255, 255, 255)"],
div[style*="background: rgb(255, 255, 255)"],
div[style*="background-color: white"],
div[style*="background: white"] {
  background-color: #141414 !important;
}

div[style*="color: rgb(0, 0, 0)"],
div[style*="color: black"] {
  color: #e0e0e0 !important;
}

/* Force dark theme on all divs with inline styles */
div[style] {
  background-color: #141414 !important;
}

/* Ensure all text is light colored */
body * {
  color: #e0e0e0 !important;
}

/* Main content area specific overrides */
main, section, article {
  background-color: #0a0a0a !important;
  color: #e0e0e0 !important;
}

/* Collection page specific */
[class*="CollectionPage"],
[class*="collection-page"],
[class*="EntriesCollection"],
[class*="entries-collection"] {
  background-color: #0a0a0a !important;
}

/* Entry listing specific */
[class*="EntryListing"],
[class*="entry-listing"],
[class*="EntryCard"],
[class*="entry-card"] {
  background-color: #1a1a1a !important;
  border-color: #2a2a2a !important;
}

/* Toolbar and header areas */
[class*="Toolbar"],
[class*="toolbar"],
[class*="Header"],
[class*="header"]:not([class*="entry"]) {
  background-color: #141414 !important;
  border-bottom: 1px solid #2a2a2a !important;
}

/* Search bars */
[class*="Search"],
[class*="search"] {
  background-color: #1a1a1a !important;
  color: #e0e0e0 !important;
}

/* Fix white flash on load */
@media (prefers-color-scheme: light), (prefers-color-scheme: dark) {
  html, body {
    background-color: #0a0a0a !important;
  }
}

/* Preview pane specific */
[class*="PreviewPane"],
[class*="preview-pane"],
[class*="Preview"],
[class*="preview"],
iframe {
  background-color: #141414 !important;
  color: #e0e0e0 !important;
}

/* Content inside preview iframe */
iframe html,
iframe body {
  background-color: #141414 !important;
  color: #e0e0e0 !important;
}

/* Force all text in preview to be light */
[class*="preview"] *,
[class*="Preview"] * {
  color: #e0e0e0 !important;
}

/* Headings in preview */
[class*="preview"] h1,
[class*="preview"] h2,
[class*="preview"] h3,
[class*="preview"] h4,
[class*="preview"] h5,
[class*="preview"] h6,
[class*="Preview"] h1,
[class*="Preview"] h2,
[class*="Preview"] h3,
[class*="Preview"] h4,
[class*="Preview"] h5,
[class*="Preview"] h6 {
  color: #ffffff !important;
}

/* Boolean/Toggle switches */
[class*="Toggle"],
[class*="toggle"],
[class*="Switch"],
[class*="switch"],
input[type="checkbox"] + label {
  background-color: #2a2a2a !important;
  border-color: #3a3a3a !important;
}

/* Active/checked state */
[class*="Toggle"][class*="active"],
[class*="toggle"][class*="active"],
[class*="Switch"][class*="checked"],
[class*="switch"][class*="checked"],
input[type="checkbox"]:checked + label {
  background-color: #3b82f6 !important;
  border-color: #3b82f6 !important;
}

/* Toggle slider */
[class*="Toggle"] [class*="slider"],
[class*="toggle"] [class*="slider"],
[class*="Switch"] [class*="slider"],
[class*="switch"] [class*="slider"],
input[type="checkbox"] + label::before,
input[type="checkbox"] + label::after {
  background-color: #ffffff !important;
}

/* Boolean field container */
[class*="BooleanControl"],
[class*="boolean-control"],
[data-widget="boolean"] {
  background-color: transparent !important;
}

/* Checkbox styles */
input[type="checkbox"] {
  accent-color: #3b82f6 !important;
}

/* Decap CMS specific boolean widget */
[data-testid="switch-input"],
[role="switch"],
.css-1l4w6pd,
.css-iwy0a1,
div[class*="BooleanBackground"] {
  background-color: #2a2a2a !important;
  border: 1px solid #3a3a3a !important;
  cursor: pointer !important;
}

/* Boolean widget checked state */
[data-testid="switch-input"][aria-checked="true"],
[role="switch"][aria-checked="true"],
.css-1l4w6pd[aria-checked="true"],
div[class*="BooleanBackground"][class*="checked"] {
  background-color: #3b82f6 !important;
  border-color: #3b82f6 !important;
}

/* Boolean widget toggle button/circle */
[data-testid="switch-button"],
div[class*="BooleanBackground"] div,
.css-1l4w6pd div,
.css-iwy0a1 div {
  background-color: #ffffff !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.2) !important;
}

/* Fix for the actual toggle widget used by Decap */
.css-u5lnz {
  background-color: #2a2a2a !important;
}

.css-u5lnz[aria-checked="true"] {
  background-color: #3b82f6 !important;
}

.css-hiwpbm {
  background-color: #ffffff !important;
}