/* ==========================================================
   BUZZNOON DARK THEME - Complete CSS Variables
   Version: 2.2.1
   ========================================================== */

:root,
.theme-dark {
  /* ========== BACKGROUND COLORS ========== */
  --bg-body: #07080c;
  --bg-primary: #07080c;
  --bg-secondary: #0f111a;
  --bg-tertiary: #0d1117;
  --bg-card: rgba(13, 17, 23, 0.95);
  --bg-glass: rgba(10, 12, 19, 0.88);
  --bg-overlay: rgba(0, 0, 0, 0.6);
  --bg-dark-card: #0f111a;
  --bg-dark-deep: #07080c;
  
  /* ========== TEXT COLORS ========== */
  --text-white: #ffffff;
  --text-pure: #ffffff;
  --text-primary: #ffffff;
  --text-secondary: #b2b7cb;
  --text-muted: #8b949e;
  --text-white-50: rgba(255, 255, 255, 0.76);
  --text-disabled: rgba(255, 255, 255, 0.5);
  --text-body: #ffffff;
  
  /* ========== BORDER COLORS ========== */
  --border-primary: rgba(255, 255, 255, 0.08);
  --border-secondary: rgba(255, 255, 255, 0.12);
  --border-input: #21262d;
  --border-dark: rgba(255, 255, 255, 0.10);
  
  /* ========== ACCENT COLORS ========== */
  --accent-blue: #2697ff;
  --accent-cyan: #00f2fe;
  --accent-purple: #a391ff;
  --accent-green: #34d399;
  --accent-emerald: #34d399;
  --accent-amber: #fbbf24;
  --accent-rose: #fb7185;
  --accent-red: #dc3545;
  --accent-info: #0dcaf0;
  --accent-warning: #ffc107;
  --accent-success: #20c997;
  --accent-danger: #dc3545;
  
  /* ========== GRADIENTS ========== */
  --gradient-primary: linear-gradient(135deg, #0088ff 0%, #795ff3 100%);
  --gradient-hover: linear-gradient(135deg, #00bcfd 0%, #907aff 100%);
  --gradient-cyan: linear-gradient(135deg, #00f2fe, #4facfe);
  --gradient-purple: linear-gradient(135deg, #a391ff, #7c3aed);
  --gradient-green: linear-gradient(135deg, #34d399, #059669);
  
  /* ========== HERO GRADIENTS ========== */
  --hero-gradient-start: #0a0e27;
  --hero-gradient-end: #0d1117;
  
  /* ========== NAVBAR ========== */
  --navbar-bg: rgba(7, 8, 12, 0.92);
  --navbar-border: rgba(255, 255, 255, 0.07);
  --dropdown-bg: #0f111a;
  --dropdown-border: rgba(255, 255, 255, 0.08);
  --dropdown-item-hover: rgba(255, 255, 255, 0.04);
  
  /* ========== CARDS ========== */
  --card-bg: #0f111a;
  --card-border: rgba(255, 255, 255, 0.12);
  --card-shadow: 0 30px 60px rgba(0, 0, 0, 0.6);
  --card-shadow-hover: 0 20px 40px rgba(0, 0, 0, 0.3);
  
  /* ========== INPUTS ========== */
  --input-bg: #0d1117;
  --input-border: #21262d;
  --input-text: #ffffff;
  --input-placeholder: #8b949e;
  --input-focus-ring: rgba(0, 242, 254, 0.2);
  
  /* ========== BUTTONS ========== */
  --btn-primary-bg: linear-gradient(135deg, #00f2fe, #4facfe);
  --btn-primary-hover: linear-gradient(135deg, #00f2fe, #4facfe);
  --btn-primary-shadow: 0 4px 20px rgba(0, 136, 255, 0.3);
  --btn-primary-hover-shadow: 0 6px 25px rgba(0, 188, 253, 0.45);
  --btn-primary-color: #0d1117;
  
  --btn-secondary-bg: rgba(255, 255, 255, 0.03);
  --btn-secondary-border: rgba(255, 255, 255, 0.20);
  --btn-secondary-hover-bg: rgba(255, 255, 255, 0.07);
  --btn-secondary-hover-border: rgba(255, 255, 255, 0.4);
  --btn-secondary-color: #ffffff;
  
  /* ========== FOOTER ========== */
  --footer-bg: #07080c;
  --footer-text: #b2b7cb;
  --footer-border: rgba(255, 255, 255, 0.10);
  --footer-link-hover: #ffffff;
  
  /* ========== SCROLLBAR ========== */
  --scrollbar-track: #0f111a;
  --scrollbar-thumb: #21262d;
  --scrollbar-thumb-hover: #30363d;
  
  /* ========== CODE & MONO ========== */
  --code-bg: #0d1117;
  --code-text: #e2e6f0;
  --code-border: #21262d;
  
  /* ========== UTILITIES ========== */
  --btn-close-filter: invert(1) grayscale(1) brightness(2);
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}

/* Dark Theme Base Styles */
.theme-dark {
  color-scheme: dark;
  background-color: var(--bg-body);
}

/* Text Color Classes */
.text-white { color: var(--text-white) !important; }
.text-white-50 { color: var(--text-white-50) !important; }
.text-muted { color: var(--text-muted) !important; }
.text-primary { color: var(--accent-blue) !important; }
.text-cyan { color: var(--accent-cyan) !important; }
.text-purple { color: var(--accent-purple) !important; }
.text-blue { color: var(--accent-blue) !important; }
.text-emerald { color: var(--accent-emerald) !important; }
.text-amber { color: var(--accent-amber) !important; }
.text-rose { color: var(--accent-rose) !important; }
.text-danger { color: var(--accent-danger) !important; }
.text-success { color: var(--accent-success) !important; }
.text-warning { color: var(--accent-warning) !important; }
.text-info { color: var(--accent-info) !important; }

/* Background Color Classes */
.bg-dark-deep { background-color: var(--bg-dark-deep) !important; }
.bg-dark-card { background-color: var(--bg-dark-card) !important; }
.bg-primary { background-color: var(--accent-blue) !important; }
.bg-secondary { background-color: var(--bg-secondary) !important; }

/* Border Color Classes */
.border-dark { border-color: var(--border-dark) !important; }
.border-primary { border-color: var(--border-primary) !important; }
.border-secondary { border-color: var(--border-secondary) !important; }

/* Dark Scrollbar */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: var(--scrollbar-track);
}
::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover);
}

/* Additional utility classes for products and other pages */
.bg-dark-deep {
  background-color: var(--bg-dark-deep) !important;
}

.bg-dark-card {
  background-color: var(--bg-dark-card) !important;
}

.text-gradient {
  background: linear-gradient(135deg, var(--accent-cyan), var(--accent-blue));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Product card specific styles - make sure they use theme variables */
.case-study-card,
.product-card {
  background: var(--card-bg) !important;
  backdrop-filter: blur(10px);
  border: 1px solid var(--card-border);
}

.case-study-content,
.product-content {
  background: var(--card-bg) !important;
}

.text-white-50 {
  color: var(--text-white-50) !important;
}

.text-white {
  color: var(--text-white) !important;
}

.bg-purple {
  background: linear-gradient(135deg, #6f42c1, #6610f2) !important;
}

/* Ensure dropdown menus work with theme */
.dropdown-menu {
  background-color: var(--dropdown-bg) !important;
  border: 1px solid var(--dropdown-border) !important;
}

.dropdown-item {
  color: var(--text-secondary) !important;
}

.dropdown-item:hover {
  background-color: var(--dropdown-item-hover) !important;
  color: var(--text-primary) !important;
}