/*
 * ยกระดับหน้าตาตารางเรื่องร้องเรียน (ticket list) ให้สวย/อ่านง่ายขึ้น
 * อิงโครงเดิม (.table-wrap > table.ticket-list) — โหลดต่อจาก bento-theme.css
 * ของใหม่เน้นจอ >= 900px (มือถือยังใช้ responsive เดิม)
 */

@media screen and (min-width: 900px) {

    /* กรอบการ์ดของตาราง: มน + เงานุ่มขึ้น */
    .table-wrap:has(.ticket-list),
    .tickets--table-actions .table-wrap {
        border: 1px solid #e7e9ee;
        border-radius: 16px !important;
        box-shadow: 0 6px 22px rgba(16, 24, 40, .06), 0 1px 2px rgba(16, 24, 40, .04);
        background: #fff;
    }

    /* หัวตารางติดบนเวลาเลื่อน (sticky) + ไล่เฉดบาง ๆ */
    .ticket-list thead th {
        position: sticky;
        top: 0;
        z-index: 3;
        background: linear-gradient(180deg, #fbfcfe, #f4f6fa) !important;
        color: #475467 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        letter-spacing: .01em;
        border-bottom: 1px solid #e7e9ee !important;
        box-shadow: inset 0 -1px 0 #e7e9ee;
        white-space: nowrap;
    }

    .ticket-list thead .sort:hover,
    .ticket-list thead th:hover {
        color: var(--bento-primary, #1877f2) !important;
    }

    /* แถว: เพิ่มช่องไฟ + เส้นบาง + zebra อ่อน ๆ + ทรานสิชัน */
    .ticket-list tbody td {
        padding: 15px 14px !important;
        border-bottom: 1px solid #f1f2f5 !important;
        transition: background-color .14s ease;
    }

    .ticket-list tbody tr {
        transition: background-color .14s ease, box-shadow .14s ease;
    }

    .ticket-list tbody tr:nth-child(even) td {
        background: #fcfcfd;
    }

    /* hover: เด่นขึ้น ทั้งแถว */
    .ticket-list tbody tr:hover td {
        background: #eef5ff !important;
    }

    /* เลือกอยู่ */
    .ticket-list tbody tr.is-checked td {
        background: #e3eeff !important;
    }

    /* แถบสีซ้ายบอกสถานะของแถว (ใช้ box-shadow inset ที่เซลล์แรก เพื่อให้ขึ้นชัวร์) */
    .ticket-list tbody tr > td:first-child {
        box-shadow: inset 4px 0 0 transparent;
    }

    /* เรื่องใหม่/ยังไม่มีเจ้าของ -> แถบน้ำเงิน + พื้นเน้น + ตัวหนา */
    .ticket-list tbody tr.new > td:first-child {
        box-shadow: inset 4px 0 0 #1877f2;
    }

    .ticket-list tbody tr.new td {
        background: #f5f9ff;
        font-weight: 600;
    }

    .ticket-list tbody tr.new:hover td {
        background: #e9f2ff !important;
    }

    /* เรื่องด่วน (critical) -> แถบแดง + พื้นแดงอ่อน */
    .ticket-list tbody tr.bg-critical > td:first-child {
        box-shadow: inset 4px 0 0 #e0245e;
    }

    .ticket-list tbody tr.bg-critical td {
        background: #fff5f7 !important;
    }

    .ticket-list tbody tr.bg-critical:hover td {
        background: #ffe9ef !important;
    }

    /* ลิงก์ในตาราง: เน้น + ขีดเส้นใต้ตอน hover */
    .ticket-list tbody td > a,
    .ticket-list tbody .subject a,
    .ticket-list tbody .trackid a {
        font-weight: 600;
        text-decoration: none;
    }

    .ticket-list tbody td > a:hover,
    .ticket-list tbody .subject a:hover,
    .ticket-list tbody .trackid a:hover {
        text-decoration: underline;
    }

    /* หัวข้อเรื่อง: อ่านง่าย ไม่ล้น */
    .ticket-list tbody .subject {
        max-width: 360px;
        color: #1f2937;
        font-weight: 600;
    }

    /* เซลล์สถานะ/owner เป็น chip กลม ๆ ให้ดูเป็นระเบียบ */
    .ticket-list tbody td .status,
    .ticket-list tbody td .label {
        border-radius: 999px;
    }

    /* แถวสุดท้ายไม่มีเส้น */
    .ticket-list tbody tr:last-child td {
        border-bottom: 0 !important;
    }
}