/* 按钮样式 */
.btn-primary {
    @apply px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2;
}

.btn-success {
    @apply px-4 py-2 bg-green-600 text-white rounded-md hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-offset-2;
}

.btn-secondary {
    @apply px-4 py-2 bg-gray-600 text-white rounded-md hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2;
}

.btn-info {
    @apply px-4 py-2 bg-blue-400 text-white rounded-md hover:bg-blue-500 focus:outline-none focus:ring-2 focus:ring-blue-300 focus:ring-offset-2;
}

.btn-danger {
    @apply px-4 py-2 bg-red-600 text-white rounded-md hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2;
}

/* 表单样式 */
.form-group {
    @apply space-y-1;
}

.label {
    @apply block text-sm font-medium text-gray-700;
}

.input {
    @apply w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500;
}

/* 表格样式 */
.table-container {
    @apply overflow-x-auto;
}

.table {
    @apply min-w-full divide-y divide-gray-200;
}

.table-header {
    @apply bg-gray-50;
}

.table-header-cell {
    @apply px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider;
}

.table-body {
    @apply bg-white divide-y divide-gray-200;
}

.table-cell {
    @apply px-6 py-4 whitespace-nowrap text-sm text-gray-900;
}

/* 图表容器样式 */
.chart-container {
    @apply bg-white rounded-lg shadow-md p-4;
}

.chart-title {
    @apply text-lg font-semibold mb-4;
}

/* 动画效果 */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in {
    animation: fadeIn 0.3s ease-out;
}

/* 响应式调整 */
@media (max-width: 768px) {
    .container {
        @apply px-2;
    }
    
    .grid {
        @apply grid-cols-1;
    }
}

/* 自定义滚动条 */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    @apply bg-gray-100;
}

::-webkit-scrollbar-thumb {
    @apply bg-gray-400 rounded-full;
}

::-webkit-scrollbar-thumb:hover {
    @apply bg-gray-500;
}

/* 下拉菜单样式 */
.dropdown {
    @apply absolute z-10 mt-1 w-full bg-white shadow-lg rounded-md;
}

.dropdown-item {
    @apply flex items-center px-3 py-2 hover:bg-gray-100 cursor-pointer;
}

/* 提示框样式 */
.toast {
    @apply fixed bottom-4 right-4 bg-gray-800 text-white px-6 py-3 rounded-lg shadow-lg;
}

/* 加载动画 */
.loading-spinner {
    @apply animate-spin rounded-full h-4 w-4 border-b-2 border-white;
} 