/* 黑色+黄色主题配色方案 */
:root {
    /* 主色调 - 黑色系 */
    --primary: #1a1a1a;
    --primary-hover: #2a2a2a;
    --primary-light: #3a3a3a;
    
    /* 黄色主色调 - 按钮和Logo */
    --accent: #fbbf24;
    --accent-hover: #f59e0b;
    --accent-dark: #d97706;
    --accent-light: #fde047;
    
    /* 功能色 - 统一使用黄色系 */
    --success: #fbbf24;
    --success-hover: #f59e0b;
    --warning: #fbbf24;
    --warning-hover: #f59e0b;
    --error: #ef4444;
    --error-hover: #dc2626;
    --info: #fbbf24;
    --info-hover: #f59e0b;
    
    /* 中性色 */
    --gray-50: #f9fafb;
    --gray-100: #f3f4f6;
    --gray-200: #e5e7eb;
    --gray-300: #d1d5db;
    --gray-400: #9ca3af;
    --gray-500: #6b7280;
    --gray-600: #4b5563;
    --gray-700: #374151;
    --gray-800: #1f2937;
    --gray-900: #111827;
    
    /* 文本色 */
    --text-on-primary: #ffffff;
    --text-on-light: #1a1a1a;
    --text-muted: #6b7280;
}

/* 统一按钮样式 - 黄色主题 */
.btn-primary {
    background-color: var(--accent) !important;
    color: var(--primary) !important;
    border-color: var(--accent) !important;
    font-weight: bold !important;
}

.btn-primary:hover {
    background-color: var(--accent-hover) !important;
    color: var(--primary) !important;
}

.btn-success {
    background-color: var(--accent) !important;
    color: var(--primary) !important;
    font-weight: bold !important;
}

.btn-success:hover {
    background-color: var(--accent-hover) !important;
}

.btn-warning {
    background-color: var(--accent) !important;
    color: var(--primary) !important;
    font-weight: bold !important;
}

.btn-warning:hover {
    background-color: var(--accent-hover) !important;
}

.btn-error {
    background-color: var(--error) !important;
    color: var(--text-on-primary) !important;
    font-weight: bold !important;
}

.btn-error:hover {
    background-color: var(--error-hover) !important;
}

.btn-info {
    background-color: var(--accent) !important;
    color: var(--primary) !important;
    font-weight: bold !important;
}

.btn-info:hover {
    background-color: var(--accent-hover) !important;
}

/* 黄色按钮样式 */
.btn-accent {
    background-color: var(--accent) !important;
    color: var(--primary) !important;
    border-color: var(--accent) !important;
    font-weight: bold !important;
}

.btn-accent:hover {
    background-color: var(--accent-hover) !important;
}

/* 游戏状态颜色 - 黄色主题 */
.game-correct {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
    color: var(--primary) !important;
    font-weight: bold !important;
}

.game-present {
    background-color: var(--accent-dark) !important;
    border-color: var(--accent-dark) !important;
    color: var(--text-on-primary) !important;
    font-weight: bold !important;
}

.game-absent {
    background-color: var(--gray-500) !important;
    border-color: var(--gray-500) !important;
    color: var(--text-on-primary) !important;
}

.game-hint {
    background-color: var(--accent-light) !important;
    border-color: var(--accent-light) !important;
    color: var(--primary) !important;
    font-weight: bold !important;
}

/* 语言切换器统一样式 - 黄色主题 */
.language-toggle {
    background-color: var(--accent) !important;
    color: var(--primary) !important;
    border-color: var(--accent) !important;
    font-weight: bold !important;
}

.language-toggle:hover {
    background-color: var(--accent-hover) !important;
}

/* 导航栏统一样式 */
.nav-primary {
    background-color: var(--primary) !important;
    color: var(--text-on-primary) !important;
}

/* Logo样式 */
.logo, .logo a {
    color: var(--accent) !important;
    font-weight: bold !important;
}

.logo:hover, .logo a:hover {
    color: var(--accent-hover) !important;
}

/* 卡片和面板 */
.card-primary {
    background-color: var(--gray-50) !important;
    border-color: var(--gray-200) !important;
}

.panel-dark {
    background-color: var(--primary) !important;
    color: var(--text-on-primary) !important;
}

/* 输入框 */
.input-primary {
    border-color: var(--gray-300) !important;
    background-color: var(--gray-50) !important;
}

.input-primary:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(26, 26, 26, 0.1) !important;
}

/* 覆盖Tailwind类 */
.bg-primary-custom {
    background-color: var(--primary) !important;
}

.text-primary-custom {
    color: var(--primary) !important;
}

.border-primary-custom {
    border-color: var(--primary) !important;
}

.hover\:bg-primary-custom:hover {
    background-color: var(--primary-hover) !important;
}

/* 全局背景和文本颜色 */
body {
    background-color: var(--primary) !important;
    color: var(--text-on-primary) !important;
}

/* 确保所有文本元素都使用白色 */
h1, h2, h3, h4, h5, h6, p, span, div, a {
    color: var(--text-on-primary) !important;
}

/* 链接颜色 */
a {
    color: var(--accent) !important;
}

a:hover {
    color: var(--accent-hover) !important;
}

/* 强制覆盖白色背景 */
.bg-white {
    background-color: var(--primary-hover) !important;
    color: var(--text-on-primary) !important;
}

/* 强制覆盖灰色背景 */
.bg-gray-100, .bg-gray-50 {
    background-color: var(--primary-hover) !important;
    color: var(--text-on-primary) !important;
}

/* 游戏卡片强制样式 */
.game-card, [class*="bg-white"] {
    background-color: var(--primary-hover) !important;
    color: var(--text-on-primary) !important;
}
/* F
AQ部分统一样式 */
.text-purple-600 {
    color: var(--accent) !important;
}

.text-purple-700 {
    color: var(--accent) !important;
}

.bg-purple-50 {
    background-color: var(--primary-hover) !important;
}

.border-purple-200 {
    border-color: var(--accent) !important;
}

.border-purple-500 {
    border-color: var(--accent) !important;
}

.hover\:bg-purple-50:hover {
    background-color: var(--primary-light) !important;
}

/* 模态框样式 */
.modal-content {
    background-color: var(--primary-hover) !important;
    color: var(--text-on-primary) !important;
}

/* 确保所有文本输入框在黑色主题下可见 */
input, textarea, select {
    background-color: var(--primary-hover) !important;
    color: var(--text-on-primary) !important;
    border-color: var(--accent) !important;
}

/* 按钮悬停效果 */
button:hover {
    opacity: 0.9 !important;
}