/**
 * Modern Base - Design System
 * GSM TOOL: переменные, типографика, spacing (8px grid), состояния
 */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700&family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  /* Colors */
  --modern-primary: #2563eb;
  --modern-primary-hover: #1d4ed8;
  --modern-primary-active: #1e40af;
  --modern-success: #10b981;
  --modern-danger: #ef4444;
  --modern-warning: #f59e0b;
  --modern-text: #1f2937;
  --modern-text-muted: #6b7280;
  --modern-bg: #f9fafb;
  --modern-card-bg: #ffffff;
  --modern-border: #e5e7eb;
  --modern-disabled: #9ca3af;

  /* Status color tokens */
  --color-success: #10b981;
  --color-success-bg: #d1fae5;
  --color-success-text: #065f46;
  --color-warning: #f59e0b;
  --color-warning-bg: #fef3c7;
  --color-warning-text: #92400e;
  --color-danger: #ef4444;
  --color-danger-bg: #fee2e2;
  --color-danger-text: #991b1b;
  --color-info: #3b82f6;
  --color-info-bg: #dbeafe;
  --color-info-text: #1e40af;

  /* 8px grid spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;

  /* Radius */
  --modern-radius: 10px;
  --modern-radius-sm: 6px;
  --modern-radius-lg: 14px;

  /* Shadows */
  --modern-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  --modern-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);

  /* Transitions */
  --modern-transition: 0.2s ease;
}

/* Typography - use under .modern-ui */
.modern-ui h1 { font-size: 2rem; font-weight: 600; line-height: 1.2; margin: 0 0 var(--space-4); }
.modern-ui h2 { font-size: 1.5rem; font-weight: 600; line-height: 1.3; margin: 0 0 var(--space-3); }
.modern-ui h3 { font-size: 1.25rem; font-weight: 600; line-height: 1.4; margin: 0 0 var(--space-3); }
.modern-ui h4 { font-size: 1.125rem; font-weight: 600; margin: 0 0 var(--space-2); }
.modern-ui h5 { font-size: 1rem; font-weight: 600; margin: 0 0 var(--space-2); }
.modern-ui h6 { font-size: 0.875rem; font-weight: 600; margin: 0 0 var(--space-2); }
.modern-ui .text-sm { font-size: 0.875rem; }
.modern-ui .text-muted { color: var(--modern-text-muted); }
.modern-ui .text-success { color: var(--modern-success); }
.modern-ui .text-danger { color: var(--modern-danger); }

/* Base */
.modern-ui {
  font-family: 'DM Sans', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  color: var(--modern-text);
}

/* States */
.modern-ui [disabled],
.modern-ui .disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}

/* Focus-visible (accessibility) */
.modern-ui *:focus-visible {
  outline: 2px solid var(--modern-primary);
  outline-offset: 2px;
}

.modern-ui button:focus-visible,
.modern-ui a:focus-visible,
.modern-ui input:focus-visible,
.modern-ui select:focus-visible,
.modern-ui [tabindex]:focus-visible {
  outline: 2px solid var(--modern-primary);
  outline-offset: 2px;
}