/* Minimal Gaming Studio Theme - Apple Style */
:root {
  /* Primary Colors - Clean and Minimal */
  --color-primary: #1d1d1f;
  --color-secondary: #f5f5f7;
  --color-accent: #007AFF;
  
  /* Background Colors */
  --color-bg: #ffffff;
  --color-surface: #f5f5f7;
  --color-card: #ffffff;
  
  /* Text Colors */
  --color-text: #1d1d1f;
  --color-text-muted: #86868b;
  --color-text-secondary: #515154;
  
  /* Apple-style grays */
  --gray-50: #f9f9f9;
  --gray-100: #f5f5f7;
  --gray-200: #e5e5e7;
  --gray-300: #d2d2d7;
  --gray-400: #a1a1a6;
  --gray-500: #86868b;
  --gray-600: #6e6e73;
  --gray-700: #515154;
  --gray-800: #1d1d1f;
  --gray-900: #000000;
}

/* CSS Variables for Tailwind */
.theme-minimal {
  --tw-bg-opacity: 1;
  
  /* Minimal specific custom properties */
  --minimal-bg: 255 255 255;
  --minimal-surface: 245 245 247;
  --minimal-text: 29 29 31;
  --minimal-accent: 0 122 255;
  --minimal-secondary: 81 81 84;
}

/* Apple-style typography */
.apple-font {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Smooth transitions */
.minimal-transition {
  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Subtle shadows */
.minimal-shadow {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.minimal-shadow-lg {
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* Hover effects */
.minimal-hover:hover {
  transform: translateY(-2px);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

/* Button styles */
.minimal-button {
  background: linear-gradient(135deg, var(--color-primary), var(--gray-700));
  border: none;
  border-radius: 8px;
  color: white;
  font-weight: 600;
  transition: all 0.2s ease-in-out;
}

.minimal-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.minimal-button-secondary {
  background: transparent;
  border: 2px solid var(--gray-300);
  border-radius: 8px;
  color: var(--color-text);
  font-weight: 600;
  transition: all 0.2s ease-in-out;
}

.minimal-button-secondary:hover {
  border-color: var(--gray-400);
  background: var(--gray-50);
}

/* Card styles */
.minimal-card {
  background: var(--color-card);
  border-radius: 16px;
  border: 1px solid var(--gray-200);
  transition: all 0.3s ease;
}

.minimal-card:hover {
  border-color: var(--gray-300);
  transform: translateY(-4px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}

/* Grid system */
.minimal-grid {
  display: grid;
  gap: 2rem;
}

/* Responsive grid */
@media (min-width: 640px) {
  .minimal-grid-sm {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .minimal-grid-md {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .minimal-grid-lg {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* Text styles */
.minimal-heading {
  font-weight: 300;
  letter-spacing: -0.025em;
  color: var(--color-text);
}

.minimal-subheading {
  font-weight: 400;
  color: var(--color-text-secondary);
  line-height: 1.6;
}

/* Subtle animations */
@keyframes minimal-fade-in {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.minimal-fade-in {
  animation: minimal-fade-in 0.6s ease-out;
}

/* Focus states */
.minimal-focus:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.3);
}