/* 移动端表格优化样式 */

/* 组长功能相关表格优化 */
#group-products-result table,
#employee-products-result table {
    font-size: 14px !important;
    width: 100% !important;
    table-layout: auto !important; /* 改为自动布局,让内容自适应 */
    border-collapse: collapse !important;
    margin-bottom: 10px !important;
}

#group-products-result table th,
#group-products-result table td,
#employee-products-result table th,
#employee-products-result table td {
    padding: 8px 6px !important;
    text-align: left !important;
    vertical-align: middle !important;
    border: 1px solid #ddd !important;
    word-wrap: break-word !important;
    word-break: normal !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
}

/* 产品型号列适当宽度,避免过度换行 */
#group-products-result table td:first-child,
#employee-products-result table td:first-child {
    min-width: 120px !important;
    max-width: 200px !important;
}

/* 数量列固定宽度 */
#group-products-result table td:last-child,
#employee-products-result table td:last-child {
    width: 80px !important;
    text-align: center !important;
}

/* 如果有多列数量,调整宽度 */
#employee-products-result table td:nth-last-child(1),
#employee-products-result table td:nth-last-child(2) {
    width: 90px !important;
    text-align: center !important;
}

/* 表头样式 */
#group-products-result table th,
#employee-products-result table th {
    background-color: #f5f5f5 !important;
    font-weight: bold !important;
    font-size: 13px !important;
}

/* 表尾(总计行)样式 */
#group-products-result tfoot th,
#employee-products-result tfoot th {
    background-color: #e9ecef !important;
    font-weight: bold !important;
}

/* 响应式优化 - 小屏幕 */
@media (max-width: 576px) {
    /* 所有表格的基础优化 */
    table {
        font-size: 12px !important;
        display: block !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    table thead {
        display: table-header-group !important;
    }
    
    table tbody {
        display: table-row-group !important;
    }
    
    table th, table td {
        padding: 6px 4px !important;
        font-size: 12px !important;
        min-width: auto !important;
    }
    
    /* 组长功能表格在小屏幕上的优化 */
    #group-products-result table,
    #employee-products-result table {
        font-size: 13px !important;
        display: table !important;
        width: 100% !important;
    }
    
    /* 产品型号列 */
    #group-products-result table td:first-child,
    #employee-products-result table td:first-child {
        min-width: 100px !important;
        max-width: none !important;
        word-break: break-all !important; /* 允许在任意字符处换行 */
        hyphens: auto !important; /* 自动断字 */
    }
    
    /* 数量列 */
    #group-products-result table td:last-child,
    #employee-products-result table td:last-child {
        width: 60px !important;
        min-width: 60px !important;
        white-space: nowrap !important;
    }
    
    /* 如果有多列数量 */
    #employee-products-result table td:nth-last-child(1),
    #employee-products-result table td:nth-last-child(2) {
        width: 70px !important;
        min-width: 70px !important;
        white-space: nowrap !important;
    }
    
    /* 本月台账查询和删除记录表格 */
    #monthly-transactions-container table,
    #delete-records-content table {
        font-size: 11px !important;
        display: table !important;
    }
    
    #monthly-transactions-container table th,
    #monthly-transactions-container table td,
    #delete-records-content table th,
    #delete-records-content table td {
        padding: 4px 2px !important;
        font-size: 11px !important;
    }
    
    /* 工序列 */
    #monthly-transactions-container table th:nth-child(1),
    #delete-records-content table th:nth-child(1) {
        width: 50px !important;
        min-width: 50px !important;
    }
    
    /* 产品编码列 */
    #monthly-transactions-container table th:nth-child(2),
    #delete-records-content table th:nth-child(2) {
        width: 90px !important;
        min-width: 90px !important;
        word-break: break-all !important;
    }
    
    /* 型号列 */
    #monthly-transactions-container table th:nth-child(3),
    #delete-records-content table th:nth-child(3) {
        width: auto !important;
        min-width: 100px !important;
        word-break: break-all !important;
    }
    
    /* 时间列 */
    #monthly-transactions-container table th:nth-child(4),
    #delete-records-content table th:nth-child(4) {
        width: 120px !important;
        min-width: 120px !important;
        font-size: 10px !important;
    }
}

/* 响应式优化 - 中等屏幕 */
@media (min-width: 577px) and (max-width: 768px) {
    table {
        font-size: 13px !important;
    }
    
    table th, table td {
        padding: 7px 5px !important;
        font-size: 13px !important;
    }
    
    #group-products-result table td:first-child,
    #employee-products-result table td:first-child {
        min-width: 140px !important;
    }
}

/* 卡片内的表格容器 */
.card-body .table-responsive {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    margin-bottom: 1rem !important;
}

/* 优化表格滚动条样式(仅WebKit浏览器) */
.table-responsive::-webkit-scrollbar {
    height: 6px !important;
}

.table-responsive::-webkit-scrollbar-track {
    background: #f1f1f1 !important;
    border-radius: 3px !important;
}

.table-responsive::-webkit-scrollbar-thumb {
    background: #888 !important;
    border-radius: 3px !important;
}

.table-responsive::-webkit-scrollbar-thumb:hover {
    background: #555 !important;
}

/* 数字内容不换行 */
table td.number-cell,
table th.number-cell {
    white-space: nowrap !important;
    text-align: right !important;
}

/* 长文本单元格样式 */
table td.long-text,
table th.long-text {
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    hyphens: auto !important;
    max-width: 200px !important;
}

/* 产品编码单元格 - 允许在连字符处换行 */
table td.product-code {
    word-break: break-all !important;
    hyphens: manual !important;
}

/* 日期时间单元格 - 小屏幕上可能需要显示在两行 */
table td.datetime-cell {
    white-space: normal !important;
    min-width: 100px !important;
}

@media (max-width: 576px) {
    table td.datetime-cell {
        font-size: 10px !important;
        line-height: 1.3 !important;
    }
}

/* 为分配产品界面的多选框优化 */
#product-model-select {
    max-height: 200px !important;
    overflow-y: auto !important;
}

#product-model-select option {
    padding: 8px !important;
    word-wrap: break-word !important;
    white-space: normal !important;
}

/* 移动端下拉框优化 */
@media (max-width: 576px) {
    select.form-select {
        font-size: 14px !important;
        padding: 8px 12px !important;
    }
    
    select.form-select option {
        font-size: 14px !important;
    }
    
    /* 按钮优化 */
    .btn {
        padding: 10px 15px !important;
        font-size: 14px !important;
    }
    
    /* 卡片间距优化 */
    .card {
        margin-bottom: 12px !important;
    }
    
    .card-body {
        padding: 12px !important;
    }
}

/* 提示信息样式优化 */
.alert {
    font-size: 14px !important;
    padding: 12px !important;
    margin-bottom: 15px !important;
}

@media (max-width: 576px) {
    .alert {
        font-size: 13px !important;
        padding: 10px !important;
    }
}

