/* New Dark theme with new primary(#8224e3) and secondary(#00ff60) colors */

/* Text colors */
.primaryColor {
  color: #EEFFFF !important;
}

.secondaryColor {
  color: #22b368 !important;
}

.tertiaryColor {
  color: #b9c5d8 !important;
}

/* Background colors */
.primaryBackgroundColor {
  background-color: #1C1C1C !important;
}

.secondaryBackgroundColor {
  background-color: #2C2C2C !important;
  color: #2C2C2C !important;
}

.tertiaryBackgroundColor {
  background-color: #3C3C3C !important;
}

.quaternaryBackgroundColor {
  background-color: #8224e3 !important;
}

/* Button colors */
.primaryButton {
  background-color: #8224e3 !important;
  color: #b9c5d8 !important;
}

.primaryButton:hover {
  background-color: #a044c3 !important;
}

.successButton {
  background-color: #22b368 !important;
  color: #b9c5d8 !important;
}

.successButton:hover {
  background-color: #29a56d !important;
}

.dangerButton {
  background-color: #ff4757 !important;
  color: #b9c5d8 !important;
}

.dangerButton:hover {
  background-color: #e53246 !important;
}

.cancelButton {
  background-color: #4d525a !important;
  border-color: #393e46 !important;
  color: #b9c5d8 !important;
}

.cancelButton:hover {
  background-color: #5b6169 !important;
}

/* Elements */
input,
textarea {
  background-color: #4d525a !important;
  color: #b9c5d8 !important;
  border-color: #393e46 !important;
}

input[type="checkbox"] {
  accent-color: #8224e3;
}

/* Main menu */
.mainMenuLink {
  background-color: #2c2d2d !important;
  color: #6b7280 !important;
}

.mainMenuLink:hover {
  color: #b9c5d8 !important;
  border-color: #cbd5e1 !important;
}

.mainMenuLinkSelected {
  color: #8224E3 !important;
  border-color: #8224e3 !important;
}

.mainMenuMobileLink {
  background-color: #2c2d2d !important;
  color: #b9c5d8 !important;
}

.mainMenuMobileLink:hover {
  background-color: #4d525a !important;
  border-color: #6b7280 !important;
}

.mainMenuMobileLinkSelected {
  background-color: #4d525a !important;
  border-color: #8224e3 !important;
  color: #8224e3 !important;
}

#main-menu-toggle-btn {
  colora: #9ca3af !important;
}

#main-menu-toggle-btn:hover {
  color: #b9c5d8 !important;
  background-color: #4d525a !important;
}

/* Border colors */
.primaryBorderColor {
  border-color: #393e46 !important;
}

/* Placeholder colors */
.primaryBorderColor::placeholder {
  color: #6b7280;
  opacity: 1;
}

.primaryBorderColor::-ms-input-placeholder {
  color: #6b7280;
  opacity: 1;
}

/* Stroke colors */
.primaryStrokeColor {
  stroke: #b9c5d8 !important;
}

/* Passwords */
.passwordsBackgroundColor {
  background-color: #222831 !important;
}

.passwordsBorderColor {
  border-color: #000000 !important;
}

/* Import and Export buttons */
.importExportButtons {
  color: #b1bfce !important;
  border-color: #222831 !important;
}

.importExportButtons:hover {
  color: #91a6ba !important;
}

/* Scroll bar */
::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: #1C1C1C;
}

::-webkit-scrollbar-thumb {
  background: #2C2C2C;
  border-radius: 15px;
}

::-webkit-scrollbar-thumb:hover {
  background: #5b6169;
}