/* Base Styles */
body {
  background-color: #0b0c10;
  color: #ffffff;
  font-family: 'Roboto', sans-serif;
  padding-top: 70px;
  transition: all 0.3s ease;
}

.navbar {
  background-color: #000;
}

.navbar-brand,
.navbar-brand:hover {
  font-family: 'Orbitron', sans-serif;
  color: #00f0ff !important;
}

.navbar-brand img,
.footer-logo {
  height: 40px;
  width: auto;
}

.nav-link {
  color: white !important;
  transition: all 0.3s ease;
}

.nav-link.active,
.navbar-nav .nav-link.active,
.nav-link:hover {
  color: #00f0ff !important;
  border-bottom: 2px solid #00f0ff;
}

/* Neon Button Styles */
.btn-neon,
.btn-outline-neon {
  border: 1px solid #00f0ff;
  color: #00f0ff;
  background: transparent;
  transition: all 0.3s ease;
}

.btn-neon:hover,
.btn-outline-neon:hover {
  background-color: #00f0ff;
  color: #000;
}

/* Neon Badge (Cart Count) */
.badge.bg-info.text-dark {
  background-color: #00f0ff !important;
  color: #000 !important;
}

/* Headings and Hero Text */
.neon-text {
  color: #00f0ff;
  text-shadow: 0 0 5px #00f0ff, 0 0 10px #00f0ff;
}

/* Cards */
.card {
  background-color: #1c1e22;
  border: 1px solid #00f0ff;
  color: white;
  margin-bottom: 20px;
  transition: all 0.3s ease;
}

.card-title {
  color: #00f0ff;
  font-family: 'Orbitron', sans-serif;
}

.card.h-100 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.card .btn {
  margin-bottom: 5px;
}

.card .btn + .btn {
  margin-left: 5px;
}

/* Modals */
.modal-content {
  background-color: #1c1e22;
  color: white;
  border: 1px solid #00f0ff;
}

.btn-close {
  filter: invert(1);
}

/* Forms */
.form-control,
.form-control:focus {
  background-color: #0b0c10;
  color: white;
  border: 1px solid #00f0ff;
  transition: all 0.3s ease;
}

/* Footer */
footer {
  background-color: #1c1e22;
  color: white;
}

footer a {
  color: #00f0ff;
  text-decoration: none;
  transition: all 0.3s ease;
}

footer a:hover {
  text-decoration: underline;
  color: #00c6ff;
}

/* Scrollbar (Optional Neon Touch) */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #0b0c10;
}

::-webkit-scrollbar-thumb {
  background: #00f0ff;
  border-radius: 5px;
}

/* Transition for interactive elements */
a,
.btn,
.nav-link,
.card,
.form-control {
  transition: all 0.3s ease;
}
footer .text-muted {
  color: #cccccc !important; /* or #bbbbbb for slightly brighter text */
}
html, body {
  height: 100%;
  display: flex;
  flex-direction: column;
}

body > main {
  flex: 1;
}
footer a {
  color: #00f0ff !important;
  text-decoration: none !important;
}

footer a:hover {
  color: #00f0ff !important;
  text-decoration: none !important;
}
