/**
 * Enhanced Global Color Palette System
 * Comprehensive color system for impressive, attractive, and well-organized design
 * Primary: Black (#000000) and White (#ffffff)
 * Secondary: Red (#dc2626) - vibrant and modern
 * Supporting: Sophisticated grays and accent colors
 */

:root {
  /* === PRIMARY COLOR SYSTEM === */
  --color-black: #000000 !important;
  --color-white: #ffffff !important;
  --color-red: #dc2626 !important;
  --color-red-hover: #b91c1c !important;
  --color-red-light: #ef4444 !important;
  --color-red-dark: #991b1b !important;
  
  /* === SOPHISTICATED GRAYS === */
  --color-gray-50: #f9fafb !important;
  --color-gray-100: #f3f4f6 !important;
  --color-gray-200: #e5e7eb !important;
  --color-gray-300: #d1d5db !important;
  --color-gray-400: #9ca3af !important;
  --color-gray-500: #6b7280 !important;
  --color-gray-600: #4b5563 !important;
  --color-gray-700: #374151 !important;
  --color-gray-800: #1f2937 !important;
  --color-gray-900: #111827 !important;
  
  /* === SEMANTIC COLORS === */
  --color-primary: var(--color-black) !important;
  --color-primary-hover: var(--color-gray-800) !important;
  --color-secondary: var(--color-red) !important;
  --color-secondary-hover: var(--color-red-hover) !important;
  --color-accent: var(--color-red-light) !important;
  
  /* === BACKGROUND SYSTEM === */
  --color-bg-primary: var(--color-white) !important;
  --color-bg-secondary: var(--color-gray-50) !important;
  --color-bg-dark: var(--color-black) !important;
  --color-bg-card: var(--color-white) !important;
  --color-bg-overlay: rgba(0, 0, 0, 0.7) !important;
  --color-bg-gradient: linear-gradient(135deg, var(--color-black) 0%, var(--color-gray-800) 100%) !important;
  --color-bg-red-gradient: linear-gradient(135deg, var(--color-red) 0%, var(--color-red-dark) 100%) !important;
  
  /* === TEXT SYSTEM === */
  --color-text-primary: var(--color-black) !important;
  --color-text-secondary: var(--color-gray-600) !important;
  --color-text-muted: var(--color-gray-500) !important;
  --color-text-light: var(--color-white) !important;
  --color-text-red: var(--color-red) !important;
  
  /* === BORDER SYSTEM === */
  --color-border-light: var(--color-gray-200) !important;
  --color-border-medium: var(--color-gray-300) !important;
  --color-border-dark: var(--color-gray-400) !important;
  --color-border-red: var(--color-red) !important;
  
  /* === SHADOW SYSTEM === */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important;
  --shadow-red: 0 10px 25px rgba(220, 38, 38, 0.3) !important;
  
  /* === LEGACY SUPPORT === */
  --primary-color: var(--color-black) !important;
  --primary-color-hover: var(--color-gray-800) !important;
  --secondary-color: var(--color-red) !important;
  --secondary-color-hover: var(--color-red-hover) !important;
  --white-color: var(--color-white) !important;
  --light-gray: var(--color-gray-300) !important;
  --medium-gray: var(--color-gray-500) !important;
  --dark-gray: var(--color-gray-700) !important;
  --base: var(--color-black) !important;
  --base-rgb: 0, 0, 0 !important;
  --secondary: var(--color-red) !important;
  --secondary-rgb: 220, 38, 38 !important;
}

/* === COMPREHENSIVE COLOR OVERRIDES === */

/* Primary Text Colors */
.text--base, 
.text--primary, 
.text-primary,
.nav-link.active,
.page-link,
h1, h2, h3, h4, h5, h6,
.section-heading__title,
.banner-content__title {
  color: var(--color-text-primary) !important;
}

/* Secondary Text Colors */
a,
.text--secondary,
.text-secondary,
.dropdown-item.active, 
.dropdown-item:active,
.section-heading__subtitle,
.banner-badge {
  color: var(--color-text-red) !important;
}

a:hover,
.text--secondary:hover {
  color: var(--color-red-hover) !important;
}

/* Muted Text */
.text-muted,
.section-heading__desc,
p {
  color: var(--color-text-secondary) !important;
}

/* Button System */
.btn--base,
.btn-primary {
  background: var(--color-bg-red-gradient) !important;
  border-color: var(--color-red) !important;
  color: var(--color-white) !important;
  box-shadow: var(--shadow-red) !important;
  transition: all 0.3s ease !important;
}

.btn--base:hover,
.btn-primary:hover {
  background: var(--color-red-dark) !important;
  border-color: var(--color-red-dark) !important;
  color: var(--color-white) !important;
  transform: translateY(-2px) !important;
  box-shadow: var(--shadow-xl) !important;
}

.btn-outline-primary {
  border-color: var(--color-red) !important;
  color: var(--color-red) !important;
  background: transparent !important;
}

.btn-outline-primary:hover {
  background: var(--color-red) !important;
  border-color: var(--color-red) !important;
  color: var(--color-white) !important;
}

/* Card System */
.card,
.event-card,
.counter-card {
  background: var(--color-bg-card) !important;
  border: 1px solid var(--color-border-light) !important;
  box-shadow: var(--shadow-md) !important;
  transition: all 0.3s ease !important;
}

.card:hover,
.event-card:hover,
.counter-card:hover {
  box-shadow: var(--shadow-xl) !important;
  transform: translateY(-5px) !important;
}

/* Background System */
.bg--base, 
.bg--primary, 
.bg-primary,
.btn--base, 
.btn--primary, 
.btn-primary,
.badge--base, 
.badge--primary, 
.badge-primary,
.nav-pills .nav-link.active,
.page-item.active .page-link {
  background-color: #1a1a1a !important;
  border-color: #1a1a1a !important;
  color: #ffffff !important;
}

.bg--secondary, 
.bg-secondary,
.btn--secondary, 
.btn-secondary,
.badge--secondary,
.badge-secondary {
  background-color: #d11313 !important;
  border-color: #d11313 !important;
  color: #ffffff !important;
}

/* Button Hover States */
.btn--base:hover, 
.btn--primary:hover, 
.btn-primary:hover {
  background-color: #333333 !important;
  border-color: #333333 !important;
  color: #ffffff !important;
}

.btn--secondary:hover, 
.btn-secondary:hover {
  background-color: #b01010 !important;
  border-color: #b01010 !important;
  color: #ffffff !important;
}

/* Outline Buttons */
.btn--outline-base, 
.btn--outline-primary, 
.btn-outline-primary {
  background-color: transparent !important;
  color: #1a1a1a !important;
  border-color: #1a1a1a !important;
}

.btn--outline-base:hover, 
.btn--outline-primary:hover, 
.btn-outline-primary:hover {
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  border-color: #1a1a1a !important;
}

.btn--outline-secondary, 
.btn-outline-secondary {
  background-color: transparent !important;
  color: #d11313 !important;
  border-color: #d11313 !important;
}

.btn--outline-secondary:hover, 
.btn-outline-secondary:hover {
  background-color: #d11313 !important;
  color: #ffffff !important;
  border-color: #d11313 !important;
}

/* Form Elements */
.form-control:focus, 
.form--control:focus {
  border-color: #1a1a1a !important;
  box-shadow: 0 0 0 0.2rem rgba(26, 26, 26, 0.25) !important;
}

.form-check-input:checked {
  background-color: #1a1a1a !important;
  border-color: #1a1a1a !important;
}

/* Border Colors */
.border--base, 
.border--primary, 
.border-primary {
  border-color: #1a1a1a !important;
}

.border--secondary, 
.border-secondary {
  border-color: #d11313 !important;
}

/* Override any blue, green, or other primary colors that might be inline or in other CSS files */
[style*="color: #336699"], 
[style*="color:#336699"],
[style*="color: #0000ff"],
[style*="color:#0000ff"],
[style*="color: #3366cc"],
[style*="color:#3366cc"],
[style*="color: #0066cc"],
[style*="color:#0066cc"],
[style*="color: #007bff"],
[style*="color:#007bff"],
[style*="color: #0056b3"],
[style*="color:#0056b3"],
[style*="color: #28a745"],
[style*="color:#28a745"] {
  color: #d11313 !important;
}

[style*="background-color: #336699"], 
[style*="background-color:#336699"],
[style*="background-color: #0000ff"],
[style*="background-color:#0000ff"],
[style*="background-color: #3366cc"],
[style*="background-color:#3366cc"],
[style*="background-color: #0066cc"],
[style*="background-color:#0066cc"],
[style*="background-color: #007bff"],
[style*="background-color:#007bff"],
[style*="background-color: #0056b3"],
[style*="background-color:#0056b3"],
[style*="background-color: #28a745"],
[style*="background-color:#28a745"] {
  background-color: #d11313 !important;
}

[style*="border-color: #336699"], 
[style*="border-color:#336699"],
[style*="border-color: #0000ff"],
[style*="border-color:#0000ff"],
[style*="border-color: #3366cc"],
[style*="border-color:#3366cc"],
[style*="border-color: #0066cc"],
[style*="border-color:#0066cc"],
[style*="border-color: #007bff"],
[style*="border-color:#007bff"],
[style*="border-color: #0056b3"],
[style*="border-color:#0056b3"],
[style*="border-color: #28a745"],
[style*="border-color:#28a745"] {
  border-color: #d11313 !important;
}

/* Special elements */
.event-card__date,
.event-card__badge,
.event-card__price,
.event-card__meta i {
  color: #d11313 !important;
}

.banner-form__icon,
.dashboard-widget__icon {
  color: #d11313 !important;
}

.banner-form .search-btn button,
.dashboard-widget__icon {
  background-color: #d11313 !important;
}

.banner-content__subtitle {
  border-left-color: #d11313 !important;
}

.banner-thumb__shape {
  border-color: #d11313 !important;
}

/* Specific overrides for any remaining blue elements */
.text-info, .text--info {
  color: #d11313 !important;
}

.bg-info, .bg--info, 
.btn-info, .btn--info, 
.badge-info, .badge--info {
  background-color: #d11313 !important;
  border-color: #d11313 !important;
}

.border-info, .border--info {
  border-color: #d11313 !important;
} 