/* Encoding Layout */
.encoding-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

@media (max-width: 768px) {
  .encoding-layout { grid-template-columns: 1fr; }
}

/* Column Tools Layout */
.column-tools {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.column-manager { grid-column: 1; }
.column-actions-panel { grid-column: 2; display: flex; flex-direction: column; gap: 0; }

@media (max-width: 768px) {
  .column-tools { grid-template-columns: 1fr; }
  .column-manager, .column-actions-panel { grid-column: 1; }
}

/* Highlight search matches (theme-aware, see components.css) */

/* Clean tools layout */
.clean-tools {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 16px;
  align-items: start;
}

@media (max-width: 768px) {
  .clean-tools { grid-template-columns: 1fr; }
}

/* Convert panel spacing */
.convert-input, .convert-output { display: flex; flex-direction: column; }
.convert-input textarea, .convert-output textarea { flex: 1; min-height: 200px; }

/* Sort panel keep select width */
.sort-panel select { min-width: 160px; }

/* 单元格双击编辑 */
.cell-edit-input {
  width: 100%;
  box-sizing: border-box;
  font: inherit;
  color: var(--color-text);
  background: var(--color-bg);
  border: 1px solid var(--color-border-focus);
  border-radius: var(--radius-sm);
  padding: 2px 6px;
  outline: none;
  min-width: 80px;
}

.cell-edit-input:focus {
  box-shadow: 0 0 0 2px var(--color-primary-light);
}

/* Clipboard paste textarea: mono font for data legibility */
.paste-area textarea {
  font-family: var(--font-mono);
  font-size: 13px;
}

/* Make checkbox/radio option rows clickable + keep cursor consistent */
.tool-options, .tool-options label { cursor: pointer; }

/* Find & replace scoped-column select */
#findReplaceCol { flex: 1; min-width: 160px; }


/* ============================================
   增强美化（enhanced polish）
   ============================================ */

/* 模块标题：左侧强调条 + 层级 */
.module-header h2 {
  position: relative;
  padding-left: 14px;
}
.module-header h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 1em;
  border-radius: 2px;
  background: var(--color-primary, #2563EB);
  opacity: 0.85;
}

.module-section > .module-header {
  margin-bottom: 18px;
}

/* 工具卡片：温和悬停反馈 */
.tool-card {
  transition: box-shadow var(--transition-slow), border-color var(--transition-slow), transform var(--transition);
}
.tool-card:hover {
  box-shadow: var(--shadow-hover);
  border-color: var(--color-link);
}
.tool-card:focus-within {
  border-color: var(--color-link);
}
[data-theme="dark"] .tool-card:hover {
  box-shadow: var(--shadow-hover);
}
@media (prefers-color-scheme: dark) {
  .tool-card:hover {
    box-shadow: var(--shadow-hover);
  }
}

/* 上传区：悬停微抬升 */
.upload-zone {
  transition: border-color var(--transition-slow), background-color var(--transition-slow), transform 0.1s ease;
}
.upload-zone:hover,
.upload-zone.dragover {
  transform: translateY(-1px);
}

/* 模块切换淡入 */
.module-section.active {
  animation: moduleFadeIn 0.25s ease;
}
@keyframes moduleFadeIn {
  from { opacity: 0.45; transform: translateY(4px); }
  to   { opacity: 1; transform: none; }
}

/* 状态栏数值高亮 */
.status-num-value {
  font-weight: 600;
  color: var(--color-primary, #2563EB);
}

/* Toast 加强阴影 + 主题化配色（兼容 utils.showToast，背景/文字走 CSS 变量） */
.toast-msg {
  background: var(--color-toast-bg, #1E293B);
  color: var(--color-toast-text, #FFFFFF);
  /* 圆角与静态页 .site-toast 对齐（此前 SPA 提示条是方角，与全站圆角体系脱节） */
  border-radius: var(--radius-md);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18) !important;
  border: 1px solid rgba(255, 255, 255, 0.12);
}

/* ============================================
   本轮增强（enhancement round）
   ============================================ */

/* 生成列配置行：悬停高亮，可读性更佳 */
.gen-col-row {
  border-radius: var(--radius-sm);
  transition: background-color var(--transition), box-shadow var(--transition);
}
.gen-col-row:hover {
  background: var(--color-surface-hover);
}

/* 文本操作下拉：中文长选项不被截断 */
#textTransformOp { min-width: 168px; }

/* 生成预览首行表头吸顶，长表格滚动时表头常驻 */
.gen-preview-table thead th {
  position: sticky;
  top: 0;
  background: var(--color-surface);
  z-index: 1;
}

/* 统计卡片数值：等宽数字更整齐 */
.stat-card .stat-value {
  font-variant-numeric: tabular-nums;
  font-family: var(--font-mono);
  letter-spacing: -0.5px;
}

/* 模块切换后给当前工具卡片一个淡入强调 */
.module-section.active > .tool-card {
  animation: cardPop 0.3s ease;
}
@keyframes cardPop {
  from { opacity: 0.6; transform: translateY(3px); }
  to   { opacity: 1; transform: none; }
}