/* Vexora Web Services - Custom Theme */

:root {
  --primary: #6C63FF;
  --primary-dark: #5A52E0;
}

/* Header dark background */
.header, #header {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%) !important;
}
.header .navbar {
  background: transparent !important;
}

/* Company name - Poppins font, white, bold */
.navbar-brand .company-name {
  color: #fff !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
  font-size: 1.35rem !important;
  letter-spacing: 0.5px;
}

/* Navbar dark overrides - all white text */
.navbar-dark .navbar-brand {
  color: #fff !important;
}
.navbar-dark .navbar-nav .nav-link {
  color: rgba(255,255,255,0.9) !important;
}
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
  color: #fff !important;
}
.navbar-dark .btn,
.navbar-dark .nav-link {
  color: #fff !important;
}
.navbar-dark .navbar-toggler {
  color: #fff !important;
  border-color: rgba(255,255,255,0.3) !important;
}
.navbar-dark .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.9%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

/* Main nav bar (below logo) */
.main-navbar-wrapper {
  background: rgba(255,255,255,0.06) !important;
}
.main-navbar-wrapper .navbar-nav .nav-link,
.main-navbar-wrapper .navbar-nav a,
.main-navbar-wrapper #nav a,
#nav a,
#nav li a {
  color: #fff !important;
  padding: 8px 16px !important;
  transition: all 0.2s ease;
}
.main-navbar-wrapper .navbar-nav .nav-link:hover,
.main-navbar-wrapper .navbar-nav .nav-link:focus,
.main-navbar-wrapper .navbar-nav a:hover,
.main-navbar-wrapper #nav a:hover,
#nav a:hover,
#nav li a:hover {
  color: #fff !important;
  background: rgba(108,99,255,0.3) !important;
  border-radius: 4px;
}
.main-navbar-wrapper .navbar-nav .nav-item.active > .nav-link,
.main-navbar-wrapper .navbar-nav .nav-link.active,
#nav li.active a {
  color: #fff !important;
  background: rgba(108,99,255,0.4) !important;
  border-radius: 4px;
}

/* Dropdown toggle in nav */
.main-navbar-wrapper .dropdown-toggle {
  color: rgba(255,255,255,0.85) !important;
}
.main-navbar-wrapper .dropdown-toggle:hover {
  color: #fff !important;
}

/* Dropdown menus */
.header .dropdown-menu,
.main-navbar-wrapper .dropdown-menu {
  background: #16213e !important;
  border: 1px solid rgba(108,99,255,0.3) !important;
}
.header .dropdown-item,
.main-navbar-wrapper .dropdown-item {
  color: #e0e0e0 !important;
}
.header .dropdown-item:hover,
.main-navbar-wrapper .dropdown-item:hover {
  background: rgba(108,99,255,0.3) !important;
  color: #fff !important;
}

/* Topbar (logged-in user bar) */
.topbar {
  background: rgba(0,0,0,0.2) !important;
}
.topbar .btn, .topbar a {
  color: #ccc !important;
}
.topbar .btn:hover, .topbar a:hover {
  color: #6C63FF !important;
}

/* Search box in header */
.header .search .form-control {
  background: rgba(255,255,255,0.1) !important;
  border-color: rgba(255,255,255,0.2) !important;
  color: #fff !important;
}
.header .search .form-control::placeholder {
  color: rgba(255,255,255,0.5) !important;
}
.header .search .btn {
  background: rgba(255,255,255,0.1) !important;
  color: #fff !important;
}

/* Cart badge */
.cart-btn .badge-info {
  background-color: #6C63FF !important;
}

/* Primary buttons */
.btn-primary {
  background-color: #6C63FF !important;
  border-color: #6C63FF !important;
}
.btn-primary:hover, .btn-primary:focus {
  background-color: #5A52E0 !important;
  border-color: #5A52E0 !important;
}

/* Links */
a {
  color: #6C63FF;
}
a:hover {
  color: #5A52E0;
}

/* Footer */
#footer, .footer {
  background: #1a1a2e !important;
  color: #ccc !important;
}
.footer a, .footer .nav-link {
  color: #aaa !important;
}
.footer a:hover, .footer .nav-link:hover {
  color: #6C63FF !important;
}
.footer .copyright {
  color: #888 !important;
  font-size: 0.9em;
}

/* Panel headers */
.card-header, .panel-heading {
  background: linear-gradient(135deg, #6C63FF, #5A52E0) !important;
  color: #fff !important;
  border: none !important;
}

/* Sidebar active */
.list-group-item.active {
  background-color: #6C63FF !important;
  border-color: #6C63FF !important;
}

/* Badge primary */
.badge-primary {
  background-color: #6C63FF !important;
}
