// DEPRECATED: This file is being replaced by designSystem.ts
// Please use the new design system for new components
// This file is kept for backward compatibility during migration

// Re-export the legacy commonStyles structure for backward compatibility
export const commonStyles = {
  // Gradients - Keep existing structure
  gradients: {
    primary: "bg-gradient-to-r from-banquise-blue to-banquise-blue-light",
    primaryBr: "bg-gradient-to-br from-banquise-blue to-banquise-blue-light",
    card: "bg-gradient-to-br from-banquise-blue-dark/10 to-banquise-blue-dark/5",
    cardHover: "hover:from-banquise-blue-dark/15 hover:to-banquise-blue-dark/8",
    discord: "bg-gradient-to-r from-indigo-600 to-purple-600",
    discordHover: "hover:from-indigo-500 hover:to-purple-500"
  },

  // Buttons - Keep existing structure
  buttons: {
    primary: "inline-flex items-center justify-center font-bold text-white border-0 rounded-2xl transition-all duration-300 hover:shadow-xl hover:-translate-y-1 hover:scale-105 active:scale-95",
    discord: "group relative overflow-hidden px-4 lg:px-6 py-2.5 lg:py-3 text-white font-semibold text-sm lg:text-base rounded-xl transition-all duration-300 hover:shadow-xl hover:shadow-indigo-500/25 hover:-translate-y-1 hover:scale-105",
    auth: "group relative overflow-hidden px-4 lg:px-6 py-2.5 lg:py-3 text-white font-semibold text-sm lg:text-base rounded-xl transition-all duration-300 hover:shadow-xl hover:-translate-y-1 hover:scale-105"
  },

  // Cards - Keep existing structure
  cards: {
    base: "backdrop-blur-lg rounded-2xl border border-banquise-blue-lightest/30 transition-all duration-300",
    hover: "hover:shadow-xl hover:border-banquise-blue-lightest/50",
    interactive: "cursor-pointer hover:-translate-y-4 hover:shadow-2xl active:scale-95"
  },

  // Text - Keep existing structure
  text: {
    heading: "font-heading font-bold tracking-tight",
    headingXl: "text-3xl sm:text-4xl md:text-5xl text-banquise-gray font-heading font-bold tracking-tight",
    headingLg: "text-2xl sm:text-3xl md:text-4xl text-banquise-gray font-heading font-bold tracking-tight",
    headingMd: "text-xl sm:text-2xl md:text-3xl text-banquise-blue-dark font-heading font-bold tracking-tight",
    headingSm: "text-lg sm:text-xl md:text-2xl text-banquise-blue-dark font-heading font-semibold tracking-tight",
    subheading: "text-base sm:text-lg md:text-xl text-banquise-gray/90 font-medium leading-relaxed",
    body: "text-sm sm:text-base md:text-lg text-banquise-blue-dark/90 leading-relaxed",
    description: "text-banquise-gray/80 leading-relaxed",
    muted: "text-banquise-gray/90 leading-relaxed",
    lightHeading: "text-banquise-blue-lightest font-heading font-bold tracking-tight",
    lightBody: "text-white/90 leading-relaxed"
  },

  // Layout - Keep existing structure
  layout: {
    section: "py-12 sm:py-16 md:py-20 w-full max-w-6xl mx-auto px-4 sm:px-6 md:px-8",
    container: "max-w-6xl mx-auto",
    divider: "w-20 h-1 bg-gradient-to-r from-banquise-blue-lightest to-banquise-blue mx-auto mb-6 sm:mb-8 rounded-full"
  },

  // Icons - Keep existing structure
  icons: {
    base: "w-16 h-16 sm:w-20 sm:h-20 lg:w-24 lg:h-24 rounded-2xl flex items-center justify-center text-3xl sm:text-4xl lg:text-5xl shadow-lg",
    small: "w-10 h-10 rounded-lg flex items-center justify-center text-white"
  },

  // Navigation - Keep existing structure
  nav: {
    link: "px-4 lg:px-6 py-2.5 lg:py-3 text-white/90 hover:text-white font-medium text-sm lg:text-base rounded-xl transition-all duration-300 hover:bg-white/10 hover:backdrop-blur-sm relative group",
    mobileItem: "group flex items-center p-4 text-white/90 hover:text-white no-underline rounded-2xl hover:bg-gradient-to-r hover:from-banquise-blue/20 hover:to-banquise-blue-light/20 transition-all duration-300 border border-transparent hover:border-banquise-blue-lightest/20"
  }
} as const;
