:root {
  --navbar-gradient: linear-gradient(45deg, #020024, #090979, #00d4ff);
  --hero-gradient: linear-gradient(45deg, #020024, #090979);
  --sidebar-gradient: linear-gradient(45deg, #020024, #090979);
  --btn-gradient: linear-gradient(90deg, #090979, #00d4ff);
  --btn-text: #ffffff;
  --card-bg: #ffffff;
  --card-title: #0a2540;
  --card-text: #334155;
  --page-bg: #f1f5f9;
   --base-hue: 210;        /* Base color (Blue) */
  --base-sat: 70%;        /* Saturation */

}

.light-shade { background-color: hsl(var(--base-hue), var(--base-sat), 75%); }
.base-shade  { background-color: hsl(var(--base-hue), var(--base-sat), 45%); }
.dark-shade  { background-color: hsl(var(--base-hue), var(--base-sat), 30%); }
.normal-shade { background-color: hsl(var(--base-hue), var(--base-sat), 65%); }


/* FONT */
body {
  font-family: 'Inter', sans-serif;
  background: var(--page-bg);
}


/* NAVBAR */
.navbar {
  background: var(--navbar-gradient) !important;
}

.navbar .nav-link,
.navbar-brand {
  color: #ffffff !important;
}

/* HERO */
.hero-section {
  background: var(--hero-gradient);
  color: #ffffff;
}

/* BUTTONS */
.btn-primary {
  background: var(--btn-gradient);
  border: none;
  color: var(--btn-text);
}

.btn-primary:hover {
  opacity: 0.9;
}

/* FEATURED PRODUCT CARDS */
.featured-card {
  background: var(--card-bg);
  border-radius: 14px;
  transition: all 0.3s ease;
}

.featured-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 45px rgba(2,0,36,0.45);
}
.featured-product-card .card-body {
  color: var(--card-text);
  padding: 20px;
}
.featured-title .featured-price {  color: var(--card-text);
}

/* CARDS */
.card {
  background: var(--card-bg);
  border-radius: 14px;
  border: none;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}

/* PRODUCT TEXT */
.card h6 {
  color: var(--card-title);
  font-weight: 600;
}

.card p,
.card .text-muted {
  color: var(--card-text);
}

.card-body h6{
  color: var(--card-text);
}

.card strong {
  color: var(--card-text);
}