/* 轻量级样式修复 - 只修复关键问题 */

/* 导航栏修复 */
nav {
    background-color: #374151 !important;
    color: #FFFFFF !important;
}

nav a {
    color: #FFFFFF !important;
}

nav a:hover {
    color: #3B82F6 !important;
}

nav .bg-primary {
    background-color: #3B82F6 !important;
    color: #FFFFFF !important;
}

/* 按钮布局修复 */
.flex-col {
    flex-direction: column !important;
}

.sm\:flex-row {
    flex-direction: row !important;
}

.sm\:flex-col {
    flex-direction: column !important;
}

/* 网格基础修复 */
.grid {
    display: grid !important;
}

.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)) !important; }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
.grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }

/* 响应式网格修复 */
@media (min-width: 640px) {
    .sm\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)) !important; }
    .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    .sm\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}

@media (min-width: 768px) {
    .md\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)) !important; }
    .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    .md\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
}

@media (min-width: 1024px) {
    .lg\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)) !important; }
    .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    .lg\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
}

/* 基础颜色修复 */
.bg-gray-600 { background-color: #6B7280 !important; }
.bg-gray-700 { background-color: #374151 !important; }
.bg-gray-800 { background-color: #1F2937 !important; }
.bg-dark { background-color: #1F2937 !important; }
.bg-primary { background-color: #3B82F6 !important; }
.text-primary { color: #3B82F6 !important; }
.bg-primary\/10 { background-color: rgba(59, 130, 246, 0.1) !important; }

.text-secondary { color: #6B7280 !important; }
.bg-secondary { background-color: #6B7280 !important; }
.bg-secondary\/10 { background-color: rgba(107, 114, 128, 0.1) !important; }

.text-accent { color: #8B5CF6 !important; }
.bg-accent { background-color: #8B5CF6 !important; }
.bg-accent\/10 { background-color: rgba(139, 92, 246, 0.1) !important; }

.text-warning { color: #F59E0B !important; }
.bg-warning { background-color: #F59E0B !important; }
.bg-warning\/10 { background-color: rgba(245, 158, 11, 0.1) !important; }

/* 基础间距修复 */
.gap-4 { gap: 1rem !important; }
.gap-6 { gap: 1.5rem !important; }

/* 基础尺寸修复 */
.w-full { width: 100% !important; }
.max-w-md { max-width: 28rem !important; }
.max-w-lg { max-width: 32rem !important; }
.max-w-xl { max-width: 36rem !important; }

/* 图标圆形背景修复 */
.fa-stack {
    display: inline-block !important;
    height: 2em !important;
    line-height: 2em !important;
    position: relative !important;
    vertical-align: middle !important;
    width: 2em !important;
}

.fa-stack-1x,
.fa-stack-2x {
    left: 0 !important;
    position: absolute !important;
    text-align: center !important;
    width: 100% !important;
}

.fa-stack-1x {
    line-height: inherit !important;
}

.fa-stack-2x {
    font-size: 2em !important;
}

/* 为没有圆形背景的图标添加圆形背景 */
.fa-circle {
    background-color: currentColor !important;
    border-radius: 50% !important;
    width: 1em !important;
    height: 1em !important;
    display: inline-block !important;
}

/* 确保圆形图标正确显示 */
.fa-circle:before {
    content: "" !important;
}

/* 图标颜色修复 */
.fa-check-circle { color: #10B981 !important; }
.fa-exclamation-circle { color: #F59E0B !important; }
.fa-times-circle { color: #EF4444 !important; }
.fa-info-circle { color: #6B7280 !important; }
.fa-question-circle { color: #8B5CF6 !important; }
.fa-user-circle { color: #6B7280 !important; }

/* 圆形背景容器修复 */
.rounded-full {
    border-radius: 9999px !important;
}

/* 图标居中对齐 */
.flex.items-center.justify-center i {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* 移动端修复 */
@media (max-width: 640px) {
    .grid-cols-2 { grid-template-columns: repeat(2, 1fr) !important; }
    .grid-cols-3 { grid-template-columns: repeat(3, 1fr) !important; }
    .grid-cols-4 { grid-template-columns: repeat(2, 1fr) !important; }
    .grid-cols-6 { grid-template-columns: repeat(3, 1fr) !important; }
}