/* 
   Bootstrap Theme Integration File - Optimized for Lux Theme
   This file works with Bootswatch Lux theme colors and styling
*/

/* Override Bootstrap's CSS custom properties to match Lux theme exactly */
:root {
  /* Primary Lux theme color overrides */
  --bs-primary: #375a7f;
  --bs-primary-rgb: 55, 90, 127;
  --bs-secondary: #444;
  --bs-secondary-rgb: 68, 68, 68;
  --bs-success: #00bc8c;
  --bs-success-rgb: 0, 188, 140;
  --bs-info: #3498db;
  --bs-info-rgb: 52, 152, 219;
  --bs-warning: #f39c12;
  --bs-warning-rgb: 243, 156, 18;
  --bs-danger: #e74c3c;
  --bs-danger-rgb: 231, 76, 60;
  --bs-light: #f8f9fa;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark: #222;
  --bs-dark-rgb: 34, 34, 34;
  
  /* Lux theme colors - For reference and custom use */
  --lux-primary: #375a7f;
  --lux-secondary: #444;
  --lux-success: #00bc8c;
  --lux-info: #3498db;
  --lux-warning: #f39c12;
  --lux-danger: #e74c3c;
  --lux-light: #f8f9fa;
  --lux-dark: #222;
}

/* Ensure primary color classes use Lux navy blue */
.text-primary {
  color: var(--bs-primary) !important;
}

.bg-primary {
  background-color: var(--bs-primary) !important;
}

.btn-primary {
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: #2c4a66 !important;
  border-color: #2c4a66 !important;
}

.badge.bg-primary {
  background-color: var(--bs-primary) !important;
}

/* Custom enhancements that work well with Lux */
.btn-custom {
  background: linear-gradient(45deg, var(--lux-primary), var(--lux-info));
  border: none;
  color: white;
  transition: all 0.3s ease;
}

.btn-custom:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

/* Enhanced card styling for Lux theme */
.card {
  border: none !important;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
  transition: all 0.3s ease !important;
}

.card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

/* Navbar improvements for Lux */
.navbar-brand {
  font-weight: 700 !important;
  color: var(--lux-primary) !important;
}

/* Hero section that complements Lux colors */
.hero-section {
  background: linear-gradient(135deg, var(--lux-primary) 0%, var(--lux-info) 100%) !important;
}