@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  body {
    @apply bg-surface-page text-ink-900 antialiased;
    font-family: Inter, "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
    font-variant-numeric: tabular-nums;
    font-size: 14px;
    line-height: 1.5;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    overscroll-behavior-y: none;
  }

  * {
    @apply box-border;
  }

  /* 移动端安全区工具类 */
  .pt-safe { padding-top: env(safe-area-inset-top); }
  .pb-safe { padding-bottom: env(safe-area-inset-bottom); }
  .pl-safe { padding-left: env(safe-area-inset-left); }
  .pr-safe { padding-right: env(safe-area-inset-right); }
}

@layer components {
  .btn {
    @apply inline-flex items-center justify-center px-3 py-1.5 rounded font-medium text-sm transition-colors disabled:opacity-50 disabled:cursor-not-allowed;
  }
  .btn-primary {
    @apply btn bg-brand-600 text-white hover:bg-brand-700;
  }
  .btn-secondary {
    @apply btn bg-surface-muted text-ink-700 hover:bg-surface-card;
  }
  .btn-danger {
    @apply btn bg-danger text-white hover:bg-danger-light;
  }
  .card {
    @apply bg-surface-card rounded-card border border-[#DDE1DD];
  }
  .input {
    @apply w-full px-2.5 py-2 rounded-md border border-[#DDE1DD] bg-surface-card text-sm text-ink-900 focus:outline-none focus:ring-2 focus:ring-brand-600/30 focus:border-brand-600 transition-colors;
  }
  .label {
    @apply block text-sm font-medium text-ink-700 mb-1;
  }
}

@media print {
  header, nav, .no-print { display: none !important; }
  main { padding: 0 !important; max-width: 100% !important; }
  .card { box-shadow: none !important; border: 1px solid #ccc !important; break-inside: avoid; }
  body { background: white !important; }
  a { color: inherit !important; text-decoration: none !important; }
}

/* Markdown 渲染美化增强（在 prose 基础上补充表格斑马纹和代码高亮） */
.prose tbody tr:nth-child(even) { background-color: rgb(249 250 251); }
.prose pre { @apply bg-gray-900 text-gray-100 rounded-md p-3 my-3 overflow-x-auto text-xs; }
.prose pre code { @apply bg-transparent text-gray-100 p-0; }
.prose code { @apply bg-gray-100 text-primary px-1 py-0.5 rounded text-xs font-mono; }