@charset "utf-8";

/* ---------------- 卡片内存在表格时：容器适配 ----------------
 * 横向滚动容器：窄屏时表格可左右滑动，不挤压列宽 */
:is(.accordion2, .accordion-light) .card:has(table) {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    /* 细滚动条：避免默认滚动条又粗又丑、还遮挡表格边线 */
    scrollbar-width: thin;
    scrollbar-color: #c9c9c9 transparent;
}

:is(.accordion2, .accordion-light) .card:has(table)::-webkit-scrollbar {
    height: 6px;
    width: 6px;
}

:is(.accordion2, .accordion-light) .card:has(table)::-webkit-scrollbar-track {
    background: transparent;
}

:is(.accordion2, .accordion-light) .card:has(table)::-webkit-scrollbar-thumb {
    background-color: #cccccc;
    border-radius: 3px;
}

:is(.accordion2, .accordion-light) .card:has(table)::-webkit-scrollbar-thumb:hover {
    background-color: #a8a8a8;
}

/* 富文本内层若是 bootstrap 的 .row：清掉负外边距（flex 保留，不影响两栏排版）。
   负外边距会把表格拉出滚动容器可视区，导致左右被裁 */
:is(.accordion2, .accordion-light) .card:has(table) > div.row {
    margin-left: 0;
    margin-right: 0;
}

:is(.accordion2, .accordion-light) .card:has(table) > div.row > [class*="col-"] {
    padding-left: 0;
    padding-right: 0;
}

/* 富文本内层容器：左右留 10px，保证表格外框不被滚动容器裁掉 */
:is(.accordion2, .accordion-light) .card:has(table) > div {
    padding-left: 10px;
    padding-right: 10px;
}

/* ---------------- 表格本体 ---------------- */
:is(.accordion2, .accordion-light) .card table {
    width: 100%;
    min-width: 820px; /* 列较多，窄屏触发横向滚动 */
    margin: 0;
    /* separate 才能画出表格自身的左右外框；collapse 下外框会和单元格边框冲突而消失 */
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #dcdcdc;
    table-layout: auto;
    background-color: #fff;
    font-size: 1rem;
    line-height: 0.4;
}

/* ---------------- 表头：保持白色，不加装饰 ---------------- */
:is(.accordion2, .accordion-light) .card table th {
    padding: 14px 12px;
    border: 0;
    border-right: 1px solid #e3e3e3;
    border-bottom: 1px solid #e3e3e3;
    background-color: #fff;
    color: #1a1a1a;
    font-weight: 700;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}

:is(.accordion2, .accordion-light) .card table th[rowspan] {
    /*text-align: left;*/
}


/* 第一行分组表头下的分隔线略深 */
:is(.accordion2, .accordion-light) .card table thead tr:first-child th {
    border-bottom: 1px solid #dcdcdc;
}

/* 单元格不画左线（首列左边界由表格外框负责） */
:is(.accordion2, .accordion-light) .card table tbody th,
:is(.accordion2, .accordion-light) .card table tbody td {
    padding: 13px 12px;
    border: 0;
    border-right: 1px solid #e3e3e3;
    border-bottom: 1px solid #e3e3e3;
    color: #333;
    vertical-align: middle;
}

/* 末列不画右线、末行不画底线，避免与外框叠成双线 */
:is(.accordion2, .accordion-light) .card table tr > th:last-child,
:is(.accordion2, .accordion-light) .card table tr > td:last-child {
    border-right: 0;
}

:is(.accordion2, .accordion-light) .card table tbody tr:last-child > th,
:is(.accordion2, .accordion-light) .card table tbody tr:last-child > td {
    border-bottom: 0;
}

:is(.accordion2, .accordion-light) .card table tbody th {
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
}

:is(.accordion2, .accordion-light) .card table tbody td {
    text-align: center;
    white-space: nowrap;
}

/* 斑马纹：tbody 基数行（第 1、3、5… 行）浅色背景 */
:is(.accordion2, .accordion-light) .card table tbody tr:nth-child(odd) > th,
:is(.accordion2, .accordion-light) .card table tbody tr:nth-child(odd) > td {
    background-color: #f7f7f7;
}

/* ---------------- 移动端适配 ---------------- */
@media (max-width: 767px) {
    :is(.accordion2, .accordion-light) .card table {
        min-width: 720px;
        font-size: 0.875rem;
    }

    :is(.accordion2, .accordion-light) .card table th,
    :is(.accordion2, .accordion-light) .card table td {
        padding: 10px 8px;
    }
}
