/* layout-table.css */
/* 表格配置 */
table.docutils td, table.docutils th {
    padding: 0px; /* 增加上下内边距以增大行距 */
    border-bottom: 1px solid #ddd;
}

table.docutils tr:nth-child(even) {
    background-color: #f9f9f9; /* 可选：设置斑马纹 */
}

.wy-table-responsive table td,
.wy-table-responsive table th {
    text-align: left; /* left, right， center */
    white-space: normal;
    word-wrap: break-word !important;
    max-width: 100%;
}

.wy-table-responsive table {
    width: 100% !important;
    table-layout: fixed !important;
}

.wy-table-responsive {
    margin-top: 24px !important;
}

@media screen and (max-width: 1500px) {
    /* 1. 確保外部容器可以滾動 */
    .wy-table-responsive {
        width: 100%;
        overflow-x: auto; /* 啟用水平捲動 */
        -webkit-overflow-scrolling: touch; /* 在 iOS 上提供更流暢的滾動體驗 */
    }

    /* 2. 覆寫表格本身的寬度限制，讓它可以自由伸展 */
    .wy-table-responsive table.docutils {
        width: auto !important; /* 關鍵：移除 100% 寬度限制，讓表格根據內容決定自身寬度 */
        table-layout: auto !important; /* 允許瀏覽器根據內容自動調整欄寬 */
    }

    /* 3. 禁止單元格內的文字換行，確保表格列寬由最長內容決定 */
    .wy-table-responsive table.docutils td,
    .wy-table-responsive table.docutils th {
        white-space: nowrap !important; /* 關鍵：防止文字換行 */
    }
}