html[data-conexao-theme="dark"] {
  color-scheme: dark;
}

html[data-conexao-theme="dark"],
html[data-conexao-theme="dark"] body,
html[data-conexao-theme="dark"] #root {
  background: #0f172a !important;
  color: #e2e8f0 !important;
}

html[data-conexao-theme="dark"] .MuiDrawer-paper,
html[data-conexao-theme="dark"] .MuiAppBar-root,
html[data-conexao-theme="dark"] .MuiToolbar-root,
html[data-conexao-theme="dark"] .MuiPaper-root,
html[data-conexao-theme="dark"] .MuiMenu-paper,
html[data-conexao-theme="dark"] .MuiPopover-paper,
html[data-conexao-theme="dark"] .MuiDialog-paper,
html[data-conexao-theme="dark"] .MuiTableContainer-root {
  background: #172033 !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}

html[data-conexao-theme="dark"] .MuiButtonBase-root.MuiListItem-root,
html[data-conexao-theme="dark"] .MuiListItem-root,
html[data-conexao-theme="dark"] .MuiTableCell-root,
html[data-conexao-theme="dark"] .MuiTableCell-head {
  background-color: #1e293b !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}

html[data-conexao-theme="dark"] .MuiButtonBase-root.MuiListItem-root:hover {
  background-color: #26354d !important;
}

html[data-conexao-theme="dark"] .MuiTypography-root,
html[data-conexao-theme="dark"] .MuiListItemText-primary,
html[data-conexao-theme="dark"] .MuiListItemText-secondary,
html[data-conexao-theme="dark"] .MuiInputBase-input,
html[data-conexao-theme="dark"] .MuiFormLabel-root,
html[data-conexao-theme="dark"] .MuiTableCell-root,
html[data-conexao-theme="dark"] .MuiSvgIcon-root {
  color: #e2e8f0 !important;
}

html[data-conexao-theme="dark"] .MuiInputBase-root,
html[data-conexao-theme="dark"] .MuiOutlinedInput-root,
html[data-conexao-theme="dark"] .MuiSelect-root {
  background: #0f172a !important;
  color: #e2e8f0 !important;
}

html[data-conexao-theme="dark"] .MuiOutlinedInput-notchedOutline {
  border-color: #475569 !important;
}

html[data-conexao-theme="dark"] .MuiDivider-root {
  background-color: #334155 !important;
}

html[data-conexao-theme="dark"] a {
  color: #93c5fd !important;
}

html[data-conexao-theme="dark"] .MuiButton-outlined {
  color: #bfdbfe !important;
  border-color: #60a5fa !important;
  background: #172033 !important;
}

#conexao-theme-toggle {
  position: relative;
  right: auto;
  bottom: auto;
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border: 1px solid #475569;
  border-radius: 50%;
  background: #172033;
  color: #e2e8f0;
  box-shadow: none;
  cursor: pointer;
  font-size: 18px;
}

html[data-conexao-theme="light"] #conexao-theme-toggle {
  background: #ffffff;
  color: #2563eb;
  border-color: #e5e7eb;
}
html[data-conexao-theme="dark"] main, html[data-conexao-theme="dark"] .MuiContainer-root { background: #0f172a !important; }
html[data-conexao-theme="dark"] .MuiTypography-colorTextSecondary { color: #94a3b8 !important; }
#conexao-theme-toggle { font-size: 0 !important; }
html[data-conexao-theme="dark"] #conexao-theme-toggle::before { content: "\2600"; font-size: 18px; }
html[data-conexao-theme="light"] #conexao-theme-toggle::before { content: "\263E"; font-size: 18px; }
html[data-conexao-theme="dark"] .MuiPaper-root.MuiPaper-rounded, html[data-conexao-theme="dark"] .MuiPaper-root.MuiPaper-elevation1, html[data-conexao-theme="dark"] .MuiButtonBase-root.MuiListItem-root { background: #172033 !important; color: #e2e8f0 !important; }
html[data-conexao-theme="dark"] .MuiButtonBase-root.MuiListItem-root * { color: inherit; }
html[data-conexao-theme="dark"] main:has(.react-trello-board), html[data-conexao-theme="dark"] .react-trello-board { background: #0f172a !important; }
html[data-conexao-theme="dark"] .react-trello-lane, html[data-conexao-theme="dark"] section[class*="Lane"], html[data-conexao-theme="dark"] div[class*="Lane"] { background: #172033 !important; border-color: #334155 !important; box-shadow: none !important; }
html[data-conexao-theme="dark"] .react-trello-card, html[data-conexao-theme="dark"] div[class*="Card"] { background: #1e293b !important; border-color: #334155 !important; color: #e2e8f0 !important; box-shadow: none !important; }
html[data-conexao-theme="dark"] .react-trello-card p, html[data-conexao-theme="dark"] div[class*="Card"] p { color: #cbd5e1 !important; }
html[data-conexao-theme="dark"] .react-trello-card button, html[data-conexao-theme="dark"] div[class*="Card"] button { color: #ffffff !important; }