body {
  background: linear-gradient(135deg, #0d1f5e 0%, #0a3c3c 55%, #4a1068 100%);
  background-attachment: fixed;
  min-height: 100vh;
  color: var(--text-color);
}

/* Layout */
#main {
    min-height: 95vh;
    padding-top: 30px;
}

.bg-main {
    background-color: var(--main-color);
}

.bg-main-light {
    background-color: var(--main-light-color);
}

.bg-main-lighter {
    background-color: var(--main-lighter-color);
}

/* Navbar */
.navbar.bg-main {
  background-color: var(--main-color) !important;
  border-bottom: 1px solid var(--main-lighter-color);
}

/* Buttons */
.btn-custom-main {
  color: white;
  background-color: transparent;
  border: 1px solid var(--accent-cyan);
  color: var(--accent-cyan);
}

.btn-custom-main:hover {
  background-color: var(--accent-cyan);
  color: #0d0e1a;
}

/* Footer */
.footer {
  background-color: var(--main-color);
  color: var(--text-muted-color);
  padding-top: 20px;
  border-top: 1px solid var(--main-lighter-color);
}

/* Forms */
.form-control {
  background-color: var(--input-bg);
  border-color: var(--main-lighter-color);
  color: var(--text-color);
}

.form-control:focus {
  background-color: var(--input-bg);
  border-color: var(--accent-cyan);
  color: var(--text-color);
  box-shadow: 0 0 0 0.2rem rgba(0, 212, 232, 0.2);
}

.form-control::placeholder {
  color: var(--text-muted-color);
}

/* Dropdowns */
.dropdown-menu {
  background-color: var(--main-light-color);
  border-color: var(--main-lighter-color);
}

.dropdown-item {
  color: var(--text-color);
}

.dropdown-item:hover {
  background-color: var(--main-lighter-color);
  color: var(--accent-cyan);
}