/* ===== 3D 模拟法庭 · 列表页 · 简洁深色风格 ===== */

/* CSS 变量：全局颜色管理 */
:root {
  --court-bg: #0a0a0a;
  --court-text: #e5e7eb;
  --court-text-secondary: #9ca3af;
  --court-accent-gold: #d4af37;
  --court-card-bg: #111317;
  --court-border: rgba(255,255,255,.06);
  --court-hover-border: rgba(212,175,55,.45);
}

html, body { 
  background: var(--court-bg); 
  color: var(--court-text); 
  font-family:'PingFang SC','Microsoft YaHei','Helvetica Neue',Arial,sans-serif; 
}
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }
a { text-decoration:none; }

/* ===== 统一对齐规则：所有 section 与顶部 navbar logo / footer container 一致 ===== */
/* mirror Bootstrap 4 .container：15px 左右 padding，max-width 按 4 档断点递进 */
.listing-breadcrumb, .court-hero-inner, .court-toolbar, .court-grid-wrap, .court-pagination-wrap {
  box-sizing: border-box;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
}
@media (min-width: 576px) {
  .listing-breadcrumb, .court-hero-inner, .court-toolbar, .court-grid-wrap, .court-pagination-wrap { max-width: 540px; }
}
@media (min-width: 768px) {
  .listing-breadcrumb, .court-hero-inner, .court-toolbar, .court-grid-wrap, .court-pagination-wrap { max-width: 720px; }
}
@media (min-width: 992px) {
  .listing-breadcrumb, .court-hero-inner, .court-toolbar, .court-grid-wrap, .court-pagination-wrap { max-width: 960px; }
}
@media (min-width: 1200px) {
  .listing-breadcrumb, .court-hero-inner, .court-toolbar, .court-grid-wrap, .court-pagination-wrap { max-width: 1140px; }
}
.court-pagination-wrap { padding-top: 0; padding-bottom: 40px; }

/* ---- 面包屑 ---- */
.listing-breadcrumb { padding-top:16px; padding-bottom:0; color:#9ca3af; font-size:13px; }
@media(min-width:768px){ .listing-breadcrumb { padding-top:16px; } }
.listing-breadcrumb a { color:#9ca3af; text-decoration:none; transition:color .25s ease; }
.listing-breadcrumb a:hover { color:#d4af37; }
.listing-breadcrumb .breadcrumb-list { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.listing-breadcrumb .breadcrumb-item { display:inline-flex; align-items:center; }
.listing-breadcrumb .breadcrumb-item:not(:last-child)::after { content:"\203A"; margin-left:8px; color:rgba(255,255,255,0.3); }
.listing-breadcrumb .breadcrumb-item.active { color:#d1d5db; }

/* ---- Hero ---- */
.court-hero { position:relative; padding:32px 0 28px; overflow:hidden; }
@media(min-width:768px){ .court-hero { padding:40px 0 36px; } }
.court-hero::before {
  content:""; position:absolute; right:-120px; top:-120px; width:380px; height:380px;
  background:radial-gradient(circle, rgba(212,175,55,.14) 0%, transparent 70%);
  filter:blur(30px); z-index:0; pointer-events:none;
}
.court-hero-inner { position:relative; z-index:1; display:flex; flex-direction:column; gap:12px; }
.court-badge { display:inline-flex; align-items:center; gap:6px; padding:3px 12px; background:rgba(212,175,55,.08); border:1px solid rgba(212,175,55,.22); border-radius:9999px; width:fit-content; }
.court-badge .dot { width:6px; height:6px; border-radius:50%; background:#d4af37; animation:pulse 2.2s infinite; }
.court-badge span { font-size:11px; color:#d4af37; letter-spacing:.08em; font-weight:600; }
@keyframes pulse { 0%,100%{opacity:1;} 50%{opacity:.35;} }

.court-hero-row { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.court-hero-text { display:flex; flex-direction:column; gap:8px; }
.court-hero-title { font-size:28px; font-weight:800; line-height:1.2; letter-spacing:.01em; margin:0; color:#fff; }
@media(min-width:768px){ .court-hero-title { font-size:38px; } }
.court-hero-title .accent {
  background:linear-gradient(135deg,#d4af37 0%, #f4cf65 55%, #d4af37 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.court-hero-desc { font-size:14px; line-height:1.8; color:#9ca3af; max-width:620px; margin:0; }
@media(min-width:768px){ .court-hero-desc { font-size:15px; } }

/* ---- 统计卡组 ---- */
.court-stats { display:flex; gap:12px; flex-shrink:0; }
.c-stat {
  min-width:118px; padding:12px 16px; border-radius:12px;
  background:rgba(255,255,255,.025); border:1px solid rgba(212,175,55,.14);
  display:flex; flex-direction:column; gap:4px;
}
.c-stat .k { font-size:11px; color:#6b7280; letter-spacing:.04em; }
.c-stat .v { font-size:22px; font-weight:800; color:#f9fafb; line-height:1.1; }
.c-stat .v.gold { color:#d4af37; }
.c-stat .v small { font-size:13px; font-weight:500; color:#9ca3af; }

/* ---- 工具栏（只有关键词条，占满宽度） ---- */
.court-toolbar {
  margin-bottom: 28px;
  padding-top: 0;
  padding-bottom: 0;
}
@media(min-width:768px){ .court-toolbar { margin-bottom: 36px; } }

.court-cats {
  display:flex; gap:8px; flex:1 1 auto; flex-wrap:nowrap; overflow-x:auto;
  padding:10px 12px; border-radius:12px;
  background:rgba(255,255,255,.02); border:1px solid rgba(255,255,255,.06);
}
.court-cats::-webkit-scrollbar { display:none; }
.ct-cat {
  flex-shrink:0; white-space:nowrap; padding:7px 16px; border-radius:9999px;
  background:transparent; border:1px solid transparent;
  color:#cbd5e1; font-size:13px; font-weight:500; transition:all .25s ease;
  cursor:pointer;
}
.ct-cat:hover { background:rgba(255,255,255,.05); color:#fff; }
.ct-cat.active { background:#d4af37; color:#0a0a0a; font-weight:700; box-shadow:0 6px 14px rgba(212,175,55,.2); }

.court-kws-strip {
  display:flex; gap:10px; flex-wrap:wrap; overflow:visible;
  padding:14px 16px; border-radius:14px;
  background:linear-gradient(180deg, rgba(212,175,55,.07), rgba(212,175,55,.02));
  border:1px solid rgba(212,175,55,.18);
  align-items:center; width:100%; box-sizing:border-box;
  box-shadow: inset 0 1px 0 rgba(212,175,55,.08);
  row-gap:10px;
}
.court-kws-strip::-webkit-scrollbar { display:none; }
.court-kws-strip::before {
  content:"\5927\5BB6\90FD\5728\770B"; flex-shrink:0;
  display:inline-flex; align-items:center; gap:6px;
  height:30px; padding:0 12px;
  border-radius:9999px;
  font-size:13px; color:#0a0a0a; font-weight:700; letter-spacing:.04em;
  background:#d4af37;
  border:none; margin-right:2px;
  box-shadow:0 6px 14px rgba(212,175,55,.18);
}
.ck-tag {
  flex-shrink:0; white-space:nowrap;
  display:inline-flex; align-items:center; gap:5px;
  padding:6px 14px; border-radius:9999px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(148,163,184,.2);
  color:#cbd5e1; font-size:13px; line-height:1;
  height:30px;
  transition:all .22s ease;
}
.ck-tag i { color:#d4af37; font-size:11px; }
.ck-tag.hot {
  color:#fbbf24;
  background:linear-gradient(180deg, rgba(212,175,55,.2), rgba(212,175,55,.08));
  border-color:rgba(212,175,55,.45);
}
.ck-tag.hot i { color:#f59e0b; }
.ck-tag:hover {
  color:#fef3c7;
  border-color:rgba(212,175,55,.55);
  background:rgba(212,175,55,.12);
  transform:translateY(-1px);
  box-shadow:0 8px 20px -10px rgba(212,175,55,.35);
}

/* ---- 卡片网格 ---- */
.court-grid-wrap { padding-bottom:56px; padding-top:0; }
@media(min-width:768px){ .court-grid-wrap { padding-bottom:80px; } }
.court-grid { display:grid; grid-template-columns:1fr; gap:20px; }
@media(min-width:720px){ .court-grid { grid-template-columns:repeat(2,1fr); gap:22px; } }
@media(min-width:1080px){ .court-grid { grid-template-columns:repeat(3,1fr); gap:24px; } }

/* ---- 卡片 ---- */
.court-card {
  position:relative; display:flex; flex-direction:column; height:100%;
  background:#111317;
  border:1px solid rgba(255,255,255,.06);
  border-radius:16px; overflow:hidden;
  transition:all .4s cubic-bezier(.4,0,.2,1);
  color:inherit;
}
.court-card:hover {
  transform:translateY(-4px);
  border-color:rgba(212,175,55,.45);
  box-shadow:0 18px 40px -22px rgba(212,175,55,.35), 0 2px 0 rgba(212,175,55,.4) inset;
}
.court-card::before {
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,transparent, rgba(212,175,55,.7), transparent);
  opacity:0; transition:opacity .4s; z-index:2;
}
.court-card:hover::before { opacity:1; }

.court-card-cover { position:relative; aspect-ratio: 16 / 9; overflow:hidden; background:#1a1d21; }
.court-card-cover img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .9s cubic-bezier(.2,.8,.2,1), filter .6s ease;
  filter:brightness(.88) saturate(1.05);
}
.court-card:hover .court-card-cover img { transform:scale(1.06); filter:brightness(1) saturate(1.18); }
.court-card-cover::after {
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(10,10,10,.0) 50%, rgba(10,10,10,.7) 100%);
  pointer-events:none;
}
.cc-chip {
  position:absolute; top:12px; z-index:3;
  display:inline-flex; align-items:center; gap:5px;
  padding:4px 10px; border-radius:9999px;
  font-size:11px; font-weight:600; line-height:1.2;
  background:rgba(10,10,10,.7); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.1);
}
.cc-chip.case-num {
  left:12px; color:#d4af37;
  background:rgba(10,10,10,.75); border-color:rgba(212,175,55,.35);
}
.cc-chip.case-type { right:12px; }
.cc-chip.civil     { background:rgba(59,130,246,.18);  border-color:rgba(59,130,246,.4);  color:#93c5fd; }
.cc-chip.criminal  { background:rgba(168,85,247,.18);  border-color:rgba(168,85,247,.4);  color:#d8b4fe; }
.cc-chip.labor     { background:rgba(249,115,22,.18);  border-color:rgba(249,115,22,.4);  color:#fdba74; }
.cc-chip.commercial{ background:rgba(16,185,129,.18);  border-color:rgba(16,185,129,.4);  color:#6ee7b7; }
.cc-chip.marriage  { background:rgba(236,72,153,.18);  border-color:rgba(236,72,153,.4);  color:#f9a8d4; }
.cc-chip.traffic   { background:rgba(34,197,94,.18);   border-color:rgba(34,197,94,.4);   color:#86efac; }

.court-card-body { padding:18px 18px 16px; flex:1; display:flex; flex-direction:column; gap:10px; }
.cc-meta { display:flex; align-items:center; gap:10px; color:#71717a; font-size:12px; }
.cc-meta i { color:#d4af37; opacity:.9; }
.cc-meta .sep { width:3px; height:3px; border-radius:50%; background:#3f3f46; }

.cc-title {
  font-size:18px; font-weight:700; line-height:1.45; color:#f8fafc; margin:0;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  transition:color .25s;
}
@media(min-width:720px){ .cc-title { font-size:17px; } }
@media(min-width:1080px){ .cc-title { font-size:18px; } }
.court-card:hover .cc-title { color:#fde68a; }

.cc-desc {
  font-size:13px; line-height:1.75; color:#94a3b8; margin:0;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}

.cc-points { display:flex; flex-direction:column; gap:6px; margin-top:2px; }
.ccp-line {
  display:flex; align-items:flex-start; gap:8px;
  padding:6px 10px; border-radius:8px;
  background:rgba(255,255,255,.02); border:1px solid rgba(255,255,255,.04);
}
.ccp-idx {
  flex-shrink:0; width:16px; height:16px; margin-top:1px; border-radius:4px;
  background:rgba(239,68,68,.14); color:#fca5a5; font-size:10px; font-weight:800;
  display:flex; align-items:center; justify-content:center;
}
.ccp-txt {
  flex:1; font-size:12px; line-height:1.55; color:#cbd5e1;
  display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden;
}

.cc-foot {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-top:auto; padding-top:12px; border-top:1px solid rgba(255,255,255,.05);
}
.cc-foot-tags { display:flex; gap:6px; flex-wrap:wrap; }
.cft {
  display:inline-flex; align-items:center; gap:4px;
  padding:3px 8px; border-radius:6px;
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.05);
  color:#a1a1aa; font-size:11px; line-height:1.5; white-space:nowrap;
}
.cft i { color:#d4af37; font-size:10px; }
.cft.red i { color:#f87171; }
.cft.blue i { color:#60a5fa; }

.cc-enter {
  flex-shrink:0;
  display:inline-flex; align-items:center; gap:4px;
  padding:6px 10px; border-radius:8px;
  background:transparent; border:1px solid rgba(212,175,55,.3);
  color:#d4af37; font-size:12px; font-weight:600;
  transition:all .25s ease;
}
.court-card:hover .cc-enter {
  background:#d4af37; color:#0a0a0a; border-color:#d4af37;
  box-shadow:0 6px 16px rgba(212,175,55,.3);
}
.cc-enter .arr { width:18px; height:18px; display:inline-flex; align-items:center; justify-content:center; transition:transform .25s; }
.court-card:hover .cc-enter .arr { transform:translateX(2px); }

.court-empty { text-align:center; padding:80px 20px; color:#909097; }
.court-empty i { font-size:48px; color:#d4af37; opacity:.6; }
.court-empty p { margin-top:16px; font-size:16px; }

/* =============================================================
   页面专属：3D 模拟法庭列表页 联系按钮 — 溢出安全修复（**仅本页生效，完全不改视觉**）
   · 起因：本页原有 3 张 Hero 统计卡曾写通用类名 .cs-item，与公共联系按钮 .online .cs-item
     类名撞，导致 min-width:118 / display:flex 污染联系按钮 → 飘出 58px 溢出。
     （现统计卡已改专用名 .c-stat，本节留作「未来再撞类名时的最后一道保险」）
   · 只施加 2 条 NON-VISUAL 硬约束：
     ① cs-item 总宽 60px 不得撑破（宽度不变、视觉不变）；
     ② cs-panel 向左弹出最大宽度不超过视口 - 88px（窄屏不冲出边界）。
   · 其余 100% 依赖公共 aoyun.css / aoyun.js，保证与首页/全站观感与交互完全一致。
   ============================================================= */
body .online .cs-item {
  /* 硬约束：外部盒宽 60px，哪怕有其它选择器（通用 .cs-item）改 width/min-width，这里用
     body + 后代选择器 (0,2,1,0) 压过普通 class (0,2,0)，保证基准稳定。
     注意：绝不能加 overflow-x: clip —— .cs-item 是 .cs-panel（absolute; right:60px 向左弹出）
     的定位包含块，clip 会把整个面板横向裁成不可见（2026-08-29 悬浮按钮弹窗消失的根因）。 */
  max-width: 60px !important;
  box-sizing: border-box !important;
}
body .online .cs-panel {
  /* 窄屏不冲出 viewport：默认情况下首页也是 150/300/200px（由内联 style 控制）远小于 calc(100vw-88px)
     这个规则只在 >500px 级面板（极端）与 <370px 手机激活，正常 PC 视觉 0 差异。 */
  max-width: calc(100vw - 88px) !important;
  max-height: calc(100vh - 40px) !important;
}
body .online .cs-panel img {
  max-width: 100% !important;
  height: auto !important;
  display: block;
  margin: 0 auto;
}