/* Force dark blue background with !important to override any other styles */
html, body {
  background-color: #050826;
  color: #ffffff;
  font-family: 'Inter', 'IBM Plex Sans', sans-serif;
  background-image: linear-gradient(to bottom, #050826 0%, #000b37 30%, #000b37 70%, #050826 100%);
  background-attachment: fixed;
  background-size: 100% 100vh;
  min-height: 100vh;
  width: 100%;
  margin: 0;
  padding: 0;
}

/* Add a specific style for the main container to enhance the gradient effect */
#__next {
  min-height: 100vh;
  background: transparent;
}

/* Force dark blue boxes */
.card, .bg-secondary, .bg-white, .bg-surface, section, div[class*="bg-white"], div[class*="bg-surface"] {
  background-color: #000b36;
  color: white;
  border-color: #2e335a;
}

/* Force white text */
h1, h2, h3, h4, h5, h6, p, span, div, li, ul, ol {
  color: white;
}

/* Force gradient text */
.gradient-text {
  background: linear-gradient(90deg, #04dcf0, #8b5cf6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  font-weight: 700;
}

/* Force header and footer colors */
header, footer, nav {
  background-color: #000b36;
  color: white;
}

/* Force main content background */
main, article, section {
  background-color: transparent;
  color: white;
}

/* Override buttons */
.btn-primary, button[type="submit"], input[type="submit"] {
  background-color: #000b36;
  color: white;
  border-color: #2e335a;
}

.btn-secondary {
  background-color: #000b36;
  color: white;
  border: 2px solid #081975;
}

/* Override links */
a, a:link, a:visited {
  color: #a7c0ff;
}

a:hover, a:active {
  color: #d4e0ff;
}

/* Override inputs */
input, textarea, select {
  background-color: #12204e;
  color: white;
  border-color: #2e335a;
}

/* Override tables */
table, tr, td, th {
  background-color: #000b36;
  color: white;
  border-color: #2e335a;
}

/* Override code blocks */
pre, code {
  background-color: #000b36;
  color: #c4b5fd;
}

/* Override any inline styles */
[style*="background-color"] {
  background-color: #000b36;
}

[style*="color"] {
  color: white;
}

/* Override any white backgrounds */
[class*="bg-white"], [class*="bg-surface"] {
  background-color: #000b36;
}

/* Override any card backgrounds */
[class*="card"] {
  background-color: #000b36;
}

/* Override any container backgrounds */
.container {
  background-color: transparent;
}

/* Override any header backgrounds */
[class*="header"] {
  background-color: #000b36;
}

/* Override any footer backgrounds */
[class*="footer"] {
  background-color: #000b36;
}

/* Override any nav backgrounds */
[class*="nav"] {
  background-color: #000b36;
}

/* Remove gradient pseudo-element */
body::before {
  display: none;
}

/* Variables for dark theme */
.dark-theme {
  --text-color: #ffffff;
  --bg-color: #000b37;
  --bg-gradient: none;
  --card-bg: #000b37;
  --border-color: #2e335a;
  --hover-color: #1d2671;
  --button-bg: #000b37;
  --button-hover: #081975;
  --link-color: #a7c0ff;
  --input-bg: #12204e;
}

.card {
  background-color: #000b36;
  border: 1px solid #2e335a;
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
}

header, nav, .navbar {
  background-color: #000b36;
  border-bottom: 1px solid #2e335a;
}

footer {
  background-color: #000b36;
  border-top: 1px solid #2e335a;
}

button, .button {
  background-color: #000b36;
  color: white;
  border: 1px solid #2e335a;
}

button:hover, .button:hover {
  background-color: #081975;
}

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

::-webkit-scrollbar-track {
  background: #000b36;
}

::-webkit-scrollbar-thumb {
  background: #2e335a;
  border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
  background: #414873;
}

/* Table styles */
table {
  border-collapse: collapse;
  width: 100%;
}

th, td {
  border: 1px solid #2e335a;
  padding: 8px;
}

th {
  background-color: #081975;
}

tr:nth-child(even) {
  background-color: #071030;
}

/* Modal or Dialog styles */
.modal {
  background-color: #000b36;
  border: 1px solid #2e335a;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6);
}

.modal-header {
  background-color: #081975;
  border-bottom: 1px solid #2e335a;
}

.modal-footer {
  background-color: #000b36;
  border-top: 1px solid #2e335a;
}

/* Alert/Notification styles */
.alert {
  background-color: #081975;
  border: 1px solid #2e335a;
}

.alert-success {
  background-color: #0a3d15;
  border-color: #175e23;
}

.alert-warning {
  background-color: #473a00;
  border-color: #665200;
}

.alert-error {
  background-color: #4b0f0f;
  border-color: #691515;
}