/* ═══════════════════════════════════════════════════════════════════════
   天讯 API · 模型广场（/pricing）注入层 (tx-pricing.css) —— Riso 版
   ═══════════════════════════════════════════════════════════════════════
   2026-10-23 重做视觉，**网格布局逻辑一字未改**（保留原文件的全部
   @media 断点与 grid-auto-flow 规则 —— 那些是踩过坑调出来的，动不得）。

   本文件只做两件事：
     1. 保留原有的网格排布（xl 一行 4 张 / md 2 张 / 移动端 1 张）
     2. 追加 Riso 视觉层：纸白卡 + 墨线 + 0 圆角 + 朱红价格
   ═══════════════════════════════════════════════════════════════════════ */

/* ═══════════ 原有网格逻辑（原样保留，勿改） ═══════════ */

/* xl：一行 4 张，按行铺开 */
@media (min-width: 1280px) {
  .tx-pricing-grid {
    grid-auto-flow: row !important;
    grid-template-rows: none !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 20px 18px !important;
  }
}
/* md：2 列 */
@media (min-width: 768px) and (max-width: 1279px) {
  .tx-pricing-grid {
    grid-auto-flow: row !important;
    grid-template-rows: none !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px 16px !important;
  }
}

/* 卡片别挤：内边距与行距拉开，模型名别截断 */
.tx-pricing-grid > [data-slot='card'] {
  min-width: 0;
  padding: 18px 18px 16px !important;
  align-self: stretch;
}
.tx-pricing-grid > [data-slot='card'] h3[title] {
  font-size: 15px !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: break-all;
}
/* 底部「状态/延迟」行允许换行，别挤成一团 */
.tx-pricing-grid > [data-slot='card'] [class*="flex"][class*="items-center"] {
  flex-wrap: wrap !important;
  row-gap: 6px;
}

/* ═══════════ Riso 视觉层（本次新增） ═══════════ */

/* 卡片：纸白 + 1px 墨线 + 0 圆角 + 左上朱红套准块 */
.tx-pricing-grid > [data-slot='card']{
  position: relative;
  background: var(--riso-paper-3, #F7F3E8) !important;
  background-image: none !important;
  border: 1px solid var(--riso-line-2, #C3B79C) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: none !important;
}
.tx-pricing-grid > [data-slot='card']::before{
  content: "";
  position: absolute; top: -1px; left: -1px;
  width: 12px; height: 12px;
  background: var(--riso-red, #E04A2B);
}
.tx-pricing-grid > [data-slot='card']:hover{
  transform: none !important;
  border-color: var(--riso-ink, #241C18) !important;
  box-shadow: none !important;
}

/* 模型名：等宽（价格表要能扫读） */
.tx-pricing-grid > [data-slot='card'] h3[title]{
  font-family: "SFMono-Regular", Consolas, Menlo, monospace !important;
  font-weight: 700 !important;
  color: var(--riso-ink, #241C18) !important;
  letter-spacing: -.01em;
}

/* 价格数字：等宽 + tabular（避免跳动），朱红留给"当前档" */
.tx-pricing-grid > [data-slot='card'] [class*="font-mono"],
.tx-pricing-grid > [data-slot='card'] [class*="tabular"]{
  font-family: "SFMono-Regular", Consolas, Menlo, monospace !important;
  font-variant-numeric: tabular-nums;
}

/* 卡片内的分隔线：虚线（账页感） */
.tx-pricing-grid > [data-slot='card'] hr,
.tx-pricing-grid > [data-slot='card'] [class*="border-t"]{
  border-top: 1px dashed var(--riso-line, #D5CBB4) !important;
  border-color: var(--riso-line, #D5CBB4) !important;
}

/* 卡片内的徽标/标签：0 圆角 + 油青描边 */
.tx-pricing-grid > [data-slot='card'] [class*="bg-blue"],
.tx-pricing-grid > [data-slot='card'] [class*="bg-green"],
.tx-pricing-grid > [data-slot='card'] [class*="bg-secondary"]{
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 1px solid var(--riso-cyan, #1D6B87) !important;
  color: var(--riso-cyan, #1D6B87) !important;
}

/* ── 卡片内的文字色：把 Tailwind 的彩色文字统一到 Riso 两色 ──
   实测残留：「按量计费」是 text-blue-*、状态数字是 text-green-*、
   延迟是 text-amber-*。逐个点名覆盖。 */
.tx-pricing-grid > [data-slot='card'] [class*="text-blue"],
.tx-pricing-grid > [data-slot='card'] [class*="text-primary"],
.tx-pricing-grid > [data-slot='card'] [class*="text-sky"],
.tx-pricing-grid > [data-slot='card'] [class*="text-cyan"],
.tx-pricing-grid > [data-slot='card'] [class*="text-teal"]{
  color: var(--riso-cyan, #1D6B87) !important;
}
.tx-pricing-grid > [data-slot='card'] [class*="text-green"],
.tx-pricing-grid > [data-slot='card'] [class*="text-emerald"]{
  color: var(--riso-cyan, #1D6B87) !important;
}
.tx-pricing-grid > [data-slot='card'] [class*="text-amber"],
.tx-pricing-grid > [data-slot='card'] [class*="text-yellow"],
.tx-pricing-grid > [data-slot='card'] [class*="text-orange"]{
  color: var(--riso-red, #E04A2B) !important;
}
.tx-pricing-grid > [data-slot='card'] [class*="text-red"],
.tx-pricing-grid > [data-slot='card'] [class*="text-rose"]{
  color: var(--riso-red, #E04A2B) !important;
}

/* ── 卡片内的进度条 / 状态条：绿→油青，橙→朱红 ──
   实测：状态条是几个 div 拼的，用 bg-green-*/bg-emerald-* 上色。 */
.tx-pricing-grid > [data-slot='card'] [class*="bg-green"],
.tx-pricing-grid > [data-slot='card'] [class*="bg-emerald"]{
  background: var(--riso-cyan, #1D6B87) !important;
  background-image: none !important;
  border-radius: 0 !important;
}
.tx-pricing-grid > [data-slot='card'] [class*="bg-amber"],
.tx-pricing-grid > [data-slot='card'] [class*="bg-yellow"],
.tx-pricing-grid > [data-slot='card'] [class*="bg-orange"]{
  background: var(--riso-red, #E04A2B) !important;
  background-image: none !important;
  border-radius: 0 !important;
}
/* 进度条容器：纸深底 */
.tx-pricing-grid > [data-slot='card'] [class*="bg-muted"],
.tx-pricing-grid > [data-slot='card'] [class*="bg-secondary"]{
  background: var(--riso-paper-2, #EAE3D0) !important;
  background-image: none !important;
  border-radius: 0 !important;
}

/* ── 卡片内的 SVG 图标：颜色跟随 currentColor，但显式写的 fill 要压 ── */
.tx-pricing-grid > [data-slot='card'] svg[class*="text-"]{
  color: var(--riso-cyan, #1D6B87) !important;
}

/* ── 兜底：把卡片内所有"蓝青色"文字压到油青 ──
   实测「按量计费」那个 span 是 `min-w-0 truncate leading-normal`，
   **没有任何颜色类**，颜色来自 new-api 的主题变量（computed = rgb(0,132,204)）。
   点名覆盖不到，所以两路一起上：
     ① 改主题变量（影响面最大，但最干净）
     ② 精确命中那个无颜色类的 truncate 标签（见下） */
html:not(.dark){
  --primary: #1D6B87;
  --primary-foreground: #FAF6EC;
  --ring: #1D6B87;
}
/* 精确命中那个"计费方式"标签（唯一一个无颜色类的蓝字） */
.tx-pricing-grid > [data-slot='card'] span[class*="truncate"][class*="leading-normal"] {
  color: var(--riso-cyan, #1D6B87) !important;
}

/* 页头标题：错版字（与全站一致） */
.tx-pricing-grid ~ * h1,
body:has(.tx-pricing-grid) h1{
  letter-spacing: -.03em;
  text-shadow: var(--riso-mis, 2px) var(--riso-mis, 2px) 0 var(--riso-cyan, #1D6B87);
}

/* 筛选/排序控件：0 圆角 */
body:has(.tx-pricing-grid) [role="tablist"],
body:has(.tx-pricing-grid) select,
body:has(.tx-pricing-grid) input{
  border-radius: 0 !important;
}

/* 暗色（Riso 夜印） */
html.dark .tx-pricing-grid > [data-slot='card']{
  background: var(--riso-paper-3, #252019) !important;
  border-color: var(--riso-line-2, #43392F) !important;
}
html.dark .tx-pricing-grid > [data-slot='card'] h3[title]{
  color: var(--riso-ink, #EDE6D8) !important;
}
html.dark .tx-pricing-grid > [data-slot='card']::before{
  background: var(--riso-red, #F0603F);
}

/* 移动端：单列，间距收紧 */
@media (max-width: 767px){
  .tx-pricing-grid{
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  .tx-pricing-grid > [data-slot='card']{
    padding: 16px 16px 14px !important;
  }
}
