/* ==========================================
   Bootstrap Gradient Background Library (Lite)
   Optimized for Performance
   Compatible: Bootstrap 3 – 5
   Author: Tangdu Edition
   ========================================== */

/* Base Gradient Styling */
.bg-gradient-primary,
.bg-gradient-secondary,
.bg-gradient-success,
.bg-gradient-danger,
.bg-gradient-warning,
.bg-gradient-info,
.bg-gradient-light,
.bg-gradient-dark,
.bg-gradient-sunset,
.bg-gradient-ocean,
.bg-gradient-forest,
.bg-gradient-night,
.bg-gradient-rainbow,
.bg-gradient-animated {
  color: #fff !important;
  background-size: 200% 200%;
  transition: all 0.5s ease-in-out;
}

.bg-gradient-primary:hover,
.bg-gradient-secondary:hover,
.bg-gradient-success:hover,
.bg-gradient-danger:hover,
.bg-gradient-warning:hover,
.bg-gradient-info:hover,
.bg-gradient-light:hover,
.bg-gradient-dark:hover,
.bg-gradient-sunset:hover,
.bg-gradient-ocean:hover,
.bg-gradient-forest:hover,
.bg-gradient-night:hover,
.bg-gradient-rainbow:hover,
.bg-gradient-animated:hover {
  background-position: right center;
  transform: scale(1.01);
}

/* ===== Gradient Color Variants ===== */
.bg-gradient-primary {
  background: linear-gradient(45deg, #007bff, #00c6ff);
}

.bg-gradient-secondary {
  background: linear-gradient(45deg, #6c757d, #adb5bd);
}

.bg-gradient-success {
  background: linear-gradient(45deg, #28a745, #85e085);
}

.bg-gradient-danger {
  background: linear-gradient(45deg, #dc3545, #ff758c);
}

.bg-gradient-warning {
  background: linear-gradient(45deg, #ffc107, #ffdd57);
  color: #333 !important;
}

.bg-gradient-info {
  background: linear-gradient(45deg, #17a2b8, #5ee7df);
}

.bg-gradient-light {
  background: linear-gradient(45deg, #f8f9fa, #e9ecef);
  color: #333 !important;
}

.bg-gradient-dark {
  background: linear-gradient(45deg, #343a40, #000000);
}

/* ===== Fancy Custom Gradients ===== */
.bg-gradient-sunset {
  background: linear-gradient(90deg, #ff9966, #ff5e62);
}

.bg-gradient-ocean {
  background: linear-gradient(135deg, #2193b0, #6dd5ed);
}

.bg-gradient-forest {
  background: linear-gradient(135deg, #5a3f37, #2c7744);
}

.bg-gradient-night {
  background: linear-gradient(135deg, #141e30, #243b55);
}

.bg-gradient-rainbow {
  background: linear-gradient(90deg, red, orange, yellow, green, blue, indigo, violet);
}

/* ===== Animated Gradient ===== */
@keyframes gradientMove {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.bg-gradient-animated {
  background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
  background-size: 400% 400%;
  animation: gradientMove 10s ease infinite;
}

/* ===== Optional Rounded Box Style ===== */
.rounded-gradient {
  border-radius: 1rem;
  padding: 1rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}