/* Tailwind 自定义与主题覆盖（从内联样式抽离） */

/* 实用工具 */
.text-shadow { text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); }
.transition-height { transition: height 0.3s ease; }
.scrollbar-thin { scrollbar-width: thin; }
.scrollbar-thin::-webkit-scrollbar { width: 6px; height: 6px; }
.scrollbar-thin::-webkit-scrollbar-track { background: #f1f5f9; }
.scrollbar-thin::-webkit-scrollbar-thumb { background-color: #cbd5e1; border-radius: 3px; }
.scrollbar-thin::-webkit-scrollbar-thumb:hover { background-color: #94a3b8; }

/* 差异高亮（替代 @apply） */
.diff-added {
  background-color: #dcfce7; /* bg-green-100 */
  color: #166534;            /* text-green-800 */
  padding: 0.125rem 0.25rem; /* py-0.5 px-1 */
  border-radius: 0.25rem;    /* rounded */
}
.diff-removed {
  background-color: #fee2e2; /* bg-red-100 */
  color: #991b1b;            /* text-red-800 */
  padding: 0.125rem 0.25rem; /* py-0.5 px-1 */
  border-radius: 0.25rem;    /* rounded */
  text-decoration: line-through; /* line-through */
}
.diff-modified {
  background-color: #fef9c3; /* bg-yellow-100 */
  color: #854d0e;            /* text-yellow-800 */
  padding: 0.125rem 0.25rem; /* py-0.5 px-1 */
  border-radius: 0.25rem;    /* rounded */
}

/* Tooltip（替代 @apply） */
.tooltip {
  position: absolute; /* absolute */
  background-color: #0f172a; /* bg-dark */
  color: #ffffff;            /* text-white */
  font-size: 0.75rem;        /* text-xs */
  border-radius: 0.25rem;    /* rounded */
  padding: 0.25rem 0.5rem;   /* py-1 px-2 */
  margin-top: -2rem;         /* -mt-8 */
  opacity: 0;                /* opacity-0 */
  transition: opacity 0.3s ease; /* transition-opacity duration-300 */
  visibility: hidden;        /* invisible */
  width: 200px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
}
.has-tooltip:hover .tooltip { visibility: visible; opacity: 1; }

/* 主题变量与暗色模式 */
:root {
  --bg: #f1f5f9;        /* 亮背景 */
  --panel: #ffffff;     /* 卡片背景 */
  --panel-alt: #f8fafc; /* 次级背景 */
  --text: #1e293b;      /* 主要文本 */
  --text-secondary: #64748b; /* 次级文本 */
  --border: #e2e8f0;    /* 边框 */
}
body { background-color: var(--bg); color: var(--text); }
.dark-theme {
  --bg: #0f172a;
  --panel: #0b1220;
  --panel-alt: #0f172a;
  --text: #e2e8f0;
  --text-secondary: #cbd5e1;
  --border: #334155;
}
body.dark-theme { background-color: var(--bg) !important; color: var(--text) !important; }
.dark-theme .bg-white { background-color: var(--panel) !important; }
.dark-theme .bg-gray-50 { background-color: var(--panel-alt) !important; }
.dark-theme .text-dark { color: var(--text) !important; }
.dark-theme .text-secondary { color: var(--text-secondary) !important; }
.dark-theme .border-gray-200 { border-color: var(--border) !important; }
.dark-theme .border-gray-300 { border-color: var(--border) !important; }
.dark-theme textarea { background-color: var(--panel); color: var(--text); }
.dark-theme .shadow-md { box-shadow: 0 1px 2px rgba(0,0,0,0.4), 0 2px 8px rgba(0,0,0,0.35) !important; }
.dark-theme .bg-blue-50,
.dark-theme .bg-green-50,
.dark-theme .bg-amber-50 { background-color: var(--panel) !important; border-color: var(--border) !important; }
#themeToggle { transition: background-color .2s, color .2s, border-color .2s; }
.dark-theme #themeToggle { background-color: #1f2937 !important; color: #e2e8f0 !important; border-color: #334155 !important; }

/* 打字效果 */
.typing-cursor {
  display: inline-block;
  width: 1px;
  height: 1em;
  background: currentColor;
  margin-left: 2px;
  vertical-align: baseline;
  animation: typingBlink 1s step-end infinite;
}
@keyframes typingBlink { 50% { opacity: 0; } }

/* 自定义颜色类（替代 tailwind.config 扩展） */
.text-primary { color: #3b82f6; }
.bg-primary { background-color: #3b82f6; }
.border-primary { border-color: #3b82f6; }
.text-secondary { color: #64748b; }
.bg-secondary { background-color: #64748b; }
.text-success { color: #22c55e; }
.bg-success { background-color: #22c55e; }
.text-danger { color: #ef4444; }
.bg-danger { background-color: #ef4444; }
.text-warning { color: #f59e0b; }
.bg-warning { background-color: #f59e0b; }
.text-info { color: #0ea5e9; }
.bg-info { background-color: #0ea5e9; }
.text-dark { color: #1e293b; }
.bg-dark { background-color: #0f172a; }
.bg-bg-light { background-color: #f1f5f9; }
.bg-bg-dark { background-color: #0f172a; }

/* 交互状态类（自定义 primary 变体） */
.hover\:text-primary:hover { color: #3b82f6; }
.focus\:ring-primary:focus { outline: 2px solid #3b82f6; }