/* ========== GLASSMORPHISM EFFECTS ========== */

.glass {
  background: var(--glass-bg);
  backdrop-filter: var(--backdrop-blur);
  -webkit-backdrop-filter: var(--backdrop-blur);
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}

.glass-card {
  background: var(--bg-card);
  backdrop-filter: var(--backdrop-blur);
  -webkit-backdrop-filter: var(--backdrop-blur);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  padding: var(--spacing-xl);
  box-shadow: var(--shadow-md);
  transition: all var(--transition-base);
}

.glass-card:hover {
  background: var(--bg-card-hover);
  box-shadow: var(--shadow-lg);
  transform: translateY(-4px);
}

.glass-button {
  background: var(--glass-bg);
  backdrop-filter: var(--backdrop-blur);
  -webkit-backdrop-filter: var(--backdrop-blur);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-md);
  padding: var(--spacing-sm) var(--spacing-lg);
  font-weight: var(--font-weight-medium);
  transition: all var(--transition-fast);
}

.glass-button:hover {
  background: var(--bg-card-hover);
  transform: scale(1.02);
}

.glass-button:active {
  transform: scale(0.98);
}