@tailwind base;
@tailwind components;
@tailwind utilities;

/* Custom components using Tailwind @apply directives */
@layer components {
  .dashboard-card {
    @apply bg-white rounded-lg shadow-sm border border-gray-200 p-6 transition-shadow duration-150;
  }
  
  .dashboard-card:hover {
    @apply shadow-md;
  }
  
  .metric-card {
    @apply bg-gradient-to-r from-blue-50 to-indigo-50 rounded-xl p-6 border border-blue-100;
  }
  
  .status-badge-success {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800;
  }
  
  .status-badge-warning {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800;
  }
  
  .status-badge-error {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800;
  }
}

/* Ant Design overrides */
.ant-layout-header {
  @apply bg-white border-b border-gray-200 px-6;
}

.ant-layout-sider {
  @apply bg-white border-r border-gray-200;
}

.ant-menu {
  @apply border-none;
}

.ant-card {
  @apply shadow-sm border border-gray-200;
}

/* Custom styles */
.dashboard-header {
  @apply flex items-center justify-between h-16;
}

.dashboard-sidebar {
  @apply h-full;
}

.dashboard-content {
  @apply p-6 bg-gray-50 min-h-screen;
}
