/* ============================================
   PROFESSIONAL COLOR ENHANCEMENTS
   This file overrides colors from style.css with modern palette
   ============================================ */

/* Remove ugly gradient backgrounds */
.join-community-container {
  background: transparent !important;
}

.join-community-container .join-community {
  background: transparent !important;
}

.join-community-container .join-community .recipe-container {
  background: rgba(15, 23, 42, 0.6) !important;
  backdrop-filter: blur(30px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(180%) !important;
  border: 2px solid rgba(99, 102, 241, 0.3) !important;
  box-shadow: 0 8px 40px rgba(99, 102, 241, 0.2) !important;
}

.join-community-container .join-community .recipe-container h2 {
  color: #14B8A6 !important;
  text-shadow: 0 0 20px rgba(20, 184, 166, 0.5) !important;
}

.join-community-container .join-community .post {
  background: rgba(99, 102, 241, 0.1) !important;
  border: 1px solid rgba(99, 102, 241, 0.3) !important;
  backdrop-filter: blur(10px) !important;
  transition: all 0.3s ease !important;
}

.join-community-container .join-community .post:hover {
  background: rgba(99, 102, 241, 0.2) !important;
  border-color: rgba(99, 102, 241, 0.5) !important;
  transform: translateY(-5px) !important;
  box-shadow: 0 10px 30px rgba(99, 102, 241, 0.3) !important;
}

/* Enhanced Logo Sphere */
.logo-sphere-container .sphere {
  background: linear-gradient(135deg, 
    rgba(99, 102, 241, 0.4), 
    rgba(20, 184, 166, 0.4), 
    rgba(59, 130, 246, 0.4)) !important;
  box-shadow: 
    0 0 30px rgba(99, 102, 241, 0.6), 
    0 0 60px rgba(20, 184, 166, 0.4), 
    inset 0 0 30px rgba(255, 255, 255, 0.1) !important;
}

.logo-sphere-container .sphere:hover {
  box-shadow: 
    0 0 40px rgba(99, 102, 241, 0.8), 
    0 0 80px rgba(20, 184, 166, 0.6), 
    inset 0 0 40px rgba(255, 255, 255, 0.2) !important;
}

/* Enhanced Logo Text Gradient */
.logo-text h2 {
  background: linear-gradient(135deg, #fff, #6366F1) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(0 0 10px rgba(99, 102, 241, 0.8)) !important;
}

/* Enhanced Nav Links */
.nav-link {
  border: 1.5px solid rgba(99, 102, 241, 0.4) !important;
}

.nav-link::before {
  background: linear-gradient(135deg, #6366F1, #14B8A6) !important;
  box-shadow: 0 0 10px rgba(99, 102, 241, 0.8) !important;
}

.nav-link::after {
  background: linear-gradient(90deg, #6366F1, #14B8A6, #3B82F6) !important;
}

.nav-link:hover {
  box-shadow: 0 0 50px rgba(99, 102, 241, 0.9), 
              0 0 100px rgba(20, 184, 166, 0.6), 
              inset 0 0 50px rgba(255, 255, 255, 0.3) !important;
}

/* Enhanced Neural Particles */
.neural-particle {
  background: linear-gradient(135deg, 
    rgba(99, 102, 241, 0.3), 
    rgba(20, 184, 166, 0.3)) !important;
}

.neural-glow {
  background: radial-gradient(circle, 
    rgba(99, 102, 241, 0.6), 
    transparent) !important;
}

/* Enhanced CTA Buttons */
.cta-button,
.btn-primary {
  background: linear-gradient(135deg, #6366F1, #14B8A6) !important;
  box-shadow: 0 10px 30px rgba(99, 102, 241, 0.4) !important;
}

.cta-button:hover,
.btn-primary:hover {
  background: linear-gradient(135deg, #4F46E5, #0D9488) !important;
  box-shadow: 0 15px 40px rgba(99, 102, 241, 0.6) !important;
  transform: translateY(-3px);
}

/* Enhanced Section Backgrounds */
.section-gradient {
  background: linear-gradient(135deg, #0F172A 0%, #1E293B 50%, #334155 100%) !important;
}

.section-gradient-light {
  background: linear-gradient(135deg, 
    rgba(99, 102, 241, 0.05) 0%, 
    rgba(20, 184, 166, 0.05) 100%) !important;
}

/* Enhanced Cards */
.card,
.project-card,
.skill-card {
  background: rgba(15, 23, 42, 0.8) !important;
  border: 1px solid rgba(99, 102, 241, 0.3) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
}

.card:hover,
.project-card:hover,
.skill-card:hover {
  border-color: rgba(99, 102, 241, 0.6) !important;
  box-shadow: 0 20px 60px rgba(99, 102, 241, 0.3), 
              0 10px 30px rgba(20, 184, 166, 0.2) !important;
}

/* Enhanced Progress Bars */
.progress-bar {
  background: linear-gradient(90deg, #6366F1 0%, #14B8A6 50%, #3B82F6 100%) !important;
}

/* Enhanced Links */
a.text-primary {
  color: #6366F1!important;
}

a.text-primary:hover {
  color: #818CF8 !important;
  text-shadow: 0 0 10px rgba(99, 102, 241, 0.5);
}

/* Enhanced Badges */
.badge-primary {
  background: linear-gradient(135deg, #6366F1, #8B5CF6) !important;
}

.badge-success {
  background: linear-gradient(135deg, #10B981, #14B8A6) !important;
}

/* Enhanced Borders */
.border-primary {
  border-color: rgba(99, 102, 241, 0.5) !important;
}

/* Enhanced Shadows */
.shadow-primary {
  box-shadow: 0 10px 40px rgba(99, 102, 241, 0.3) !important;
}

/* Enhanced Glows */
.glow-effect {
  box-shadow: 
    0 0 20px rgba(99, 102, 241, 0.4),
    0 0 40px rgba(20, 184, 166, 0.3),
    0 0 60px rgba(59, 130, 246, 0.2) !important;
}

/* Enhanced Icons */
.icon-primary {
  color: #6366F1!important;
  filter: drop-shadow(0 0 8px rgba(99, 102, 241, 0.5));
}

.icon-secondary {
  color: #14B8A6 !important;
  filter: drop-shadow(0 0 8px rgba(20, 184, 166, 0.5));
}

/* Enhanced Form Inputs */
.form-control:focus,
.form-select:focus {
  border-color: #6366F1 !important;
  box-shadow: 0 0 0 0.25rem rgba(99, 102, 241, 0.25) !important;
}

/* Enhanced Animated Backgrounds */
@keyframes gradientShift {
  0%, 100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

.animated-gradient {
  background: linear-gradient(270deg, #6366F1, #14B8A6, #3B82F6, #8B5CF6);
  background-size: 400% 400%;
  animation: gradientShift 15s ease infinite;
}

/* Enhanced Scrollbar */
::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, #6366F1, #14B8A6);
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(135deg, #4F46E5, #0D9488);
}

/* Enhanced Selection */
::selection {
  background: rgba(99, 102, 241, 0.3);
  color: #fff;
}

::-moz-selection {
  background: rgba(99, 102, 241, 0.3);
  color: #fff;
}

/* Enhanced Loading States */
.loading-spinner {
  border-color: rgba(99, 102, 241, 0.2);
  border-top-color: #6366F1;
}

/* Enhanced Tooltips */
.tooltip-inner {
  background: linear-gradient(135deg, #1E293B, #334155);
  border: 1px solid rgba(99, 102, 241, 0.3);
}

/* Enhanced Modals */
.modal-content {
  background: rgba(15, 23, 42, 0.95);
  border: 2px solid rgba(99, 102, 241, 0.3);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.modal-header {
  border-bottom-color: rgba(99, 102, 241, 0.2);
}

.modal-footer {
  border-top-color: rgba(99, 102, 241, 0.2);
}

/* Enhanced Alerts */
.alert-primary {
  background: linear-gradient(135deg, 
    rgba(99, 102, 241, 0.1), 
    rgba(129, 140, 248, 0.1));
  border-color: rgba(99, 102, 241, 0.3);
  color: #818CF8;
}

.alert-success {
  background: linear-gradient(135deg, 
    rgba(16, 185, 129, 0.1), 
    rgba(20, 184, 166, 0.1));
  border-color: rgba(20, 184, 166, 0.3);
  color: #2DD4BF;
}

/* Enhanced Tables */
.table-hover tbody tr:hover {
  background: rgba(99, 102, 241, 0.05);
}

/* Enhanced Dropdowns */
.dropdown-menu {
  background: rgba(15, 23, 42, 0.95);
  border: 1px solid rgba(99, 102, 241, 0.3);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.dropdown-item:hover {
  background: rgba(99, 102, 241, 0.1);
  color: #818CF8;
}

/* Enhanced Pagination */
.page-link {
  background: rgba(15, 23, 42, 0.8);
  border-color: rgba(99, 102, 241, 0.3);
  color: #818CF8;
}

.page-link:hover {
  background: rgba(99, 102, 241, 0.2);
  border-color: rgba(99, 102, 241, 0.5);
  color: #A5B4FC;
}

.page-item.active .page-link {
  background: linear-gradient(135deg, #6366F1, #8B5CF6);
  border-color: #6366F1;
}

/* Enhanced Accordion */
.accordion-button:not(.collapsed) {
  background: rgba(99, 102, 241, 0.1);
  color: #818CF8;
}

.accordion-button:focus {
  border-color: rgba(99, 102, 241, 0.5);
  box-shadow: 0 0 0 0.25rem rgba(99, 102, 241, 0.25);
}

/* Enhanced Tabs */
.nav-tabs .nav-link.active {
  background: rgba(99, 102, 241, 0.1);
  border-color: rgba(99, 102, 241, 0.5);
  color: #818CF8;
}

.nav-tabs .nav-link:hover {
  border-color: rgba(99, 102, 241, 0.3);
  color: #A5B4FC;
}

/* Enhanced Progress */
.progress {
  background: rgba(15, 23, 42, 0.5);
}

/* Enhanced List Groups */
.list-group-item {
  background: rgba(15, 23, 42, 0.8);
  border-color: rgba(99, 102, 241, 0.2);
}

.list-group-item:hover {
  background: rgba(99, 102, 241, 0.1);
}

.list-group-item.active {
  background: linear-gradient(135deg, #6366F1, #8B5CF6);
  border-color: #6366F1;
}

/* Responsive Enhancements */
@media (max-width: 768px) {
  .glow-effect {
    box-shadow: 
      0 0 15px rgba(99, 102, 241, 0.3),
      0 0 30px rgba(20, 184, 166, 0.2) !important;
  }
}
