/* ============================================================
   模拟法庭页面专用样式 (content.html / court.html)
   v1.0 2026-09-01
   用途：3D模拟法庭全屏交互 + SEO内容渲染
   依赖：3d-courtroom.css（3D核心组件）
   ============================================================ */

/* ===== 1. 全站主导航固定顶栏（防 3D canvas 覆盖） ===== */
header > nav.navbar.navbar-light.bg-light {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    width: 100% !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}
main#main-content { 
    padding-top: 72px; 
    min-height: 0; 
}

/* ===== 2. 3D 全屏核心样式（覆盖全站容器高度约束） ===== */
html, body { 
    width: 100%; 
    margin: 0; 
    padding: 0; 
}
body.page-court, 
body { 
    background-color: #06090c; 
    overflow: hidden; 
}
.container, 
.pages, 
#wrapper { 
    width: 100% !important; 
    max-width: none !important; 
    padding: 0 !important; 
    margin: 0 !important; 
    min-height: 0 !important; 
}
main#main-content > .container,
main#main-content > .container-fluid,
main#main-content > * { 
    width: 100% !important; 
    max-width: none !important; 
    padding: 0 !important; 
    margin: 0 !important; 
}

.court-wrap { 
    position: relative; 
    width: 100%; 
    height: calc(100vh - 72px); 
    height: calc(100dvh - 72px); 
    min-height: calc(100vh - 72px); 
    overflow: hidden; 
}
@media(max-width:768px){
    main#main-content { padding-top: 62px; }
    .court-wrap { 
        height: calc(100vh - 62px); 
        height: calc(100dvh - 62px); 
        min-height: calc(100vh - 62px); 
    }
}
#app { 
    position: relative; 
    width: 100%; 
    height: 100%; 
    z-index: 1; 
}
#canvas-container { 
    position: absolute; 
    inset: 0; 
    width: 100%; 
    height: 100%; 
}
#canvas-container canvas { 
    display: block; 
    width: 100% !important; 
    height: 100% !important; 
}

/* ===== 3. SEO 内容区（visually-hidden：爬虫可见 + 用户视觉隐藏 + 不影响3D浏览） =====
   Google 官方推荐：display:none 内容会被降权，visually-hidden 不降权
   原理：position:absolute + clip:rect(0,0,0,0) 让内容脱离文档流不可见但仍在 DOM 中
===== */
.seo-content {
    position: absolute !important;
    width: 1px; 
    height: 1px;
    padding: 0; 
    margin: -1px;
    overflow: hidden; 
    clip: rect(0,0,0,0);
    white-space: nowrap; 
    border: 0;
}

/* 案情详情行高与字号 */
.case-detail-structured {
    line-height: 1.9;
    font-size: 15px;
    margin: 0;
}

/* PHP 动态输出的案情标签与内容 */
.case-detail-dt {
    font-weight: 700;
    color: #1e40af;
    margin-top: 8px;
    display: inline;
}
.case-detail-dd {
    display: inline;
    margin: 0;
    color: #334155;
}
.case-detail-paragraph {
    margin: 8px 0;
    color: #334155;
}

/* 证据列表基础样式 */
.evidence-list-structured {
    list-style: decimal;
    padding-left: 20px;
}

/* 证据列表项（PHP 动态输出） */
.evidence-row {
    padding: 8px 12px;
    border-left: 3px solid #3b82f6;
    margin-bottom: 8px;
    background: #f8fafc;
    border-radius: 4px;
    font-size: 14px;
}
.er-title {
    font-weight: 700;
    color: #1e40af;
}
.er-meta {
    font-size: 12px;
    color: #64748b;
    margin-left: 8px;
}
.er-desc {
    margin-top: 4px;
    font-size: 13px;
    color: #334155;
}

/* 争议焦点列表 */
.dispute-list {
    list-style: decimal;
    padding-left: 20px;
    line-height: 1.9;
    font-size: 15px;
}
.dispute-list li {
    margin-bottom: 8px;
}
.dispute-list li strong {
    color: #1e40af;
}

/* 争议焦点文本区域 */
.dispute-focus-text {
    line-height: 1.9;
    font-size: 15px;
}

/* 庭审对话区无底部边框 */
.trial-dialogues.product-section {
    border-bottom: none;
}

/* 免责声明框 */
.disclaimer-box {
    background: linear-gradient(90deg, #fee2e2, #fecaca);
    border: 2px solid #dc2626;
    border-radius: 10px;
    padding: 14px 18px;
    margin: 0 0 16px 0;
}
.disclaimer-title {
    margin: 0 0 8px 0;
    color: #7f1d1d;
    font-weight: 700;
    font-size: 15px;
}
.disclaimer-content {
    margin: 0;
    color: #7f1d1d;
    font-size: 13px;
    line-height: 1.7;
}
.disclaimer-content strong {
    font-weight: 700;
}
.disclaimer-content .strong-underline {
    font-weight: 700;
    text-decoration: underline;
}

/* Logo加载图片 */
.loading-logo img {
    width: 80px;
    height: 80px;
    object-fit: contain;
    display: block;
}

/* 角色选择弹窗容器 */
.role-box-max-width {
    max-width: 460px;
}

/* 角色弹窗标题 */
.role-modal-title {
    font-size: 24px;
    font-weight: 700;
    color: #f1f5f9;
    line-height: 1.35;
    margin: 0 0 6px;
    text-align: center;
    letter-spacing: 0;
}

/* 角色弹窗副标题 */
.role-modal-subtitle {
    margin: 0 0 14px;
    font-size: 12px;
    font-weight: 400;
    color: #94a3b8;
    line-height: 1.5;
    text-align: center;
    letter-spacing: 0;
}

/* 橙色提示框 */
.orange-notice-box {
    background: linear-gradient(90deg, #fff7ed, #ffedd5);
    border-left: 3px solid #ea580c;
    border-radius: 6px;
    padding: 8px 12px;
    margin-bottom: 14px;
    font-size: 12px;
    color: #7c2d12;
    line-height: 1.5;
}

/* 角色提示文本 */
.role-hint-text {
    margin: 10px 2px 12px;
    font-size: 11px;
    color: #64748b;
    text-align: center;
    line-height: 1.5;
}

/* 角色摘要信息 */
.role-summary-info {
    margin-bottom: 14px;
}

/* 面板头部无边框 */
.panel-header-no-border {
    border-bottom: none;
    padding-bottom: 6px;
}

/* 隐藏数据容器 */
.hidden-data-container {
    display: none !important;
}

/* ===== 4. SSR 产品字段样式（JS 禁用 fallback 可见） ===== */
.dialogue-content {
    white-space: pre-line;
    line-height: 2.2;
    font-size: 15px;
}

.compliance-notice {
    background: linear-gradient(90deg, #fff7ed, #ffedd5);
    border: 2px solid #ea580c;
    border-radius: 10px;
    padding: 14px 18px;
    margin: 18px 0 24px;
}
.compliance-notice p {
    margin: 0;
    color: #7c2d12;
    font-size: 13px;
    line-height: 1.7;
}
.compliance-notice .cn-title {
    color: #7c2d12;
    font-weight: 700;
    font-size: 15px;
    margin-bottom: 8px;
}

.product-section {
    padding: 14px 0;
    border-bottom: 1px dashed #cbd5e1;
}
.product-section:last-child {
    border-bottom: none;
}
.product-section h2 {
    font-size: 18px;
    color: #1e3a8a;
    border-left: 4px solid #3b82f6;
    padding-left: 10px;
    margin-bottom: 10px;
}

.evidence-row {
    padding: 8px 12px;
    border-left: 3px solid #3b82f6;
    margin-bottom: 8px;
    background: #f8fafc;
    border-radius: 4px;
    font-size: 14px;
}
.evidence-row .er-title {
    font-weight: 700;
    color: #1e40af;
}
.evidence-row .er-meta {
    font-size: 12px;
    color: #64748b;
    margin-left: 8px;
}

/* ===== 律师团队 SSR 盒子（JS 读 data-lawyer-name 作为固定角色名，不展示UI） ===== */
#seo-lawyer-box { 
    display: none; 
}

/* ===== 5. roleModal 进入前：参与执业律师 · 头像卡片（可点击跳律师详情页） ===== */
.lawyer-court-title {
    margin: 10px -2px 8px; 
    padding: 6px 10px; 
    font-size: 12px; 
    font-weight: 700;
    color: #dbeafe; 
    background: linear-gradient(90deg, rgba(59,130,246,0.18), rgba(37,99,235,0.08));
    border-left: 3px solid #3b82f6; 
    border-radius: 4px; 
    letter-spacing: 0.3px;
}

.lawyer-court-grid {
    display: flex; 
    flex-wrap: nowrap; 
    justify-content: space-between;
    gap: 10px; 
    padding: 4px 2px 2px;
}

.lawyer-court-card, 
a.lawyer-court-card, 
div.lawyer-court-card {
    flex: 1 1 0; 
    min-width: 0;
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    gap: 5px;
    padding: 10px 4px 8px; 
    border-radius: 10px; 
    text-decoration: none;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(148,163,184,0.12);
    transition: all .22s ease; 
    cursor: pointer;
}
.lawyer-court-card:hover {
    background: rgba(59,130,246,0.08);
    border-color: rgba(212,175,55,0.5);
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(212,175,55,0.10);
    text-decoration: none;
}

.lcc-avatar {
    width: 60px; 
    height: 60px; 
    border-radius: 50%; 
    overflow: hidden;
    background: #1e293b; 
    border: 2px solid #374151; 
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}
.lcc-avatar img {
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
    display: block;
}

.lcc-name {
    font-size: 13px; 
    font-weight: 700; 
    color: #e2e8f0; 
    text-align: center;
    line-height: 1.25; 
    max-width: 100%; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap;
}
.lawyer-court-card:hover .lcc-name { 
    color: #fbbf24; 
}

.lcc-role {
    text-align: center; 
    font-size: 11px; 
    font-weight: 600; 
    line-height: 1.2;
    padding: 2px 6px; 
    border-radius: 999px; 
    width: fit-content; 
    max-width: 100%;
    color: #93c5fd; 
    background: rgba(59,130,246,0.12);
}

/* 固定 4 席位 → 角色标签 CSS 注入（第1审判长 / 第2书记员 / 第3原告代理 / 第4被告代理） */
.lawyer-court-grid > .lawyer-court-card:nth-child(1) .lcc-role::before { 
    content: "审判长"; 
    color: #fde68a; 
    background: rgba(245,158,11,0.14); 
    padding: 2px 8px; 
    border-radius: 999px; 
}
.lawyer-court-grid > .lawyer-court-card:nth-child(2) .lcc-role::before { 
    content: "书记员";  
    color: #a5f3fc; 
    background: rgba(6,182,212,0.14);  
    padding: 2px 8px; 
    border-radius: 999px; 
}
.lawyer-court-grid > .lawyer-court-card:nth-child(3) .lcc-role::before { 
    content: "原告代理律师"; 
    color: #fecaca; 
    background: rgba(239,68,68,0.12); 
    padding: 2px 8px; 
    border-radius: 999px; 
}
.lawyer-court-grid > .lawyer-court-card:nth-child(4) .lcc-role::before { 
    content: "被告代理律师"; 
    color: #bfdbfe; 
    background: rgba(59,130,246,0.14); 
    padding: 2px 8px; 
    border-radius: 999px; 
}

/* 移动端：头像缩小，避免弹窗横向溢出 */
@media (max-width: 420px) {
    .lawyer-court-grid { gap: 6px; }
    .lcc-avatar { width: 48px; height: 48px; }
    .lcc-name { font-size: 12px; }
    .lcc-role { font-size: 10px; padding: 1px 5px; }
}

/* ===== 6. 左侧参与者列表：律师角色 整卡可点击跳转律师详情（a/div 双标签兼容） ===== */
#participantList > a.pc-link,
#participantList > div.pc-link {
    display: block; 
    text-decoration: none; 
    color: inherit;
    border-radius: 8px; 
    transition: background .18s ease; 
    cursor: pointer;
}
#participantList > a.pc-link:hover,
#participantList > div.pc-link:hover {
    background: rgba(59,130,246,0.06);
    text-decoration: none;
}
#participantList > a.pc-link:hover .p-name,
#participantList > div.pc-link:hover .p-name { 
    color: #d4af37; 
}

/* ===== 7. 参与者列表头像：律师角色显示真实头像图片 img（圆形适配） ===== */
.participant .p-avatar img {
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
    border-radius: 50%;
    display: block; 
    position: absolute; 
    inset: 0;
    background: #fff;
}
.participant .p-avatar { 
    position: relative; 
    overflow: hidden; 
}
.participant .p-avatar::after {
    /* 真实头像图覆盖在首字母之上：首字母作为 img 加载失败时的降级（onerror 不存在时首字母兜底可见） */
    content: "";
}

/* ===== 8. HTML 内联样式转CSS类 ===== */
.case-detail-line-height {
    line-height: 1.9;
    font-size: 15px;
}

.disclaimer-box {
    background: linear-gradient(90deg, #fee2e2, #fecaca);
    border: 2px solid #dc2626;
    border-radius: 10px;
    padding: 14px 18px;
    margin: 0 0 16px 0;
}

.disclaimer-title {
    margin: 0 0 8px 0;
    color: #7f1d1d;
    font-weight: 700;
    font-size: 15px;
}

.disclaimer-content {
    margin: 0;
    color: #7f1d1d;
    font-size: 13px;
    line-height: 1.7;
}

.disclaimer-highlight {
    font-weight: 700;
    text-decoration: underline;
}

.loading-logo img {
    width: 80px;
    height: 80px;
    object-fit: contain;
    display: block;
}

.role-box-max-width {
    max-width: 460px;
}

.role-modal-title {
    font-size: 20px;
    font-weight: 700;
    color: #f1f5f9;
    margin: 0 0 2px;
    text-align: center;
    letter-spacing: 0.5px;
}

.role-modal-title-large {
    font-size: 24px;
    font-weight: 700;
    color: #f1f5f9;
    line-height: 1.35;
    margin: 0 0 6px;
    text-align: center;
    letter-spacing: 0;
}

.role-modal-subtitle {
    margin: 0 0 14px;
    font-size: 12px;
    color: #64748b;
    text-align: center;
}

.role-modal-subtitle-court {
    margin: 0 0 14px;
    font-size: 12px;
    font-weight: 400;
    color: #94a3b8;
    line-height: 1.5;
    text-align: center;
    letter-spacing: 0;
}

.role-modal-warning {
    background: linear-gradient(90deg, #fff7ed, #ffedd5);
    border-left: 3px solid #ea580c;
    border-radius: 6px;
    padding: 8px 12px;
    margin-bottom: 14px;
    font-size: 12px;
    color: #7c2d12;
    line-height: 1.5;
}

.role-summary-info {
    margin-bottom: 14px;
}

.role-info-text {
    margin: 10px 2px 12px;
    font-size: 11px;
    color: #64748b;
    text-align: center;
    line-height: 1.5;
}

.panel-header-no-border {
    border-bottom: none;
    padding-bottom: 6px;
}

.hidden-data-container {
    display: none !important;
}

.trial-dialogues-no-border {
    border-bottom: none;
}

.case-detail-structured {
    line-height: 1.9;
    font-size: 15px;
    margin: 0;
}

.evidence-list-structured {
    list-style: decimal;
    padding-left: 20px;
}

.dispute-list {
    list-style: decimal;
    padding-left: 20px;
    line-height: 1.9;
    font-size: 15px;
}

.court-empty-display {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.court-pagination-no-top-padding {
    padding-top: 0;
}