.data-models-page {
  max-width: 1400px;
  margin: 0 auto;
  padding: 20px;
}

.page-header {
  margin-bottom: 2rem;
  padding: 1.5rem;
  border-radius: 8px;
  background-color: white;
  border: 1px solid #dee2e6;
}

/* Dark theme override */
[data-theme='dark'] .page-header {
  background-color: #1a1b1e !important;
  border-color: #373A40 !important;
}

.models-content {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}

.category-section {
  margin-bottom: 2rem;
}

.model-card {
  transition: all 0.2s ease;
  border: 1px solid var(--color-border-light);
  background: var(--color-bg-primary);
}

.model-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg) !important;
  border-color: var(--color-border);
}

.model-card:active {
  transform: translateY(0);
}

/* Dark theme specific adjustments - removed as handled by Mantine component */

[data-theme='dark'] .model-card {
  background: var(--color-bg-secondary);
  border-color: var(--color-border);
}

[data-theme='dark'] .model-card:hover {
  background: var(--color-bg-tertiary);
  border-color: var(--color-border-light);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

/* Responsive Design - Sidebar-aware breakpoints */
/* Large desktop screens - sidebar + content fits comfortably */

/* Medium desktop - account for sidebar width (1024px - 280px = 744px content) */

/* Small desktop/large tablet - sidebar significantly reduces available width */

/* Small tablets and large mobile screens */

/* Mobile phone screens */

/* Very small mobile screens */
