﻿table.custom-table {
    width: 100%;
    border-collapse: collapse;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    border-radius: 8px;
    overflow: hidden;
}

    table.custom-table thead {
        background-color: #2c7be5; /* آبی ملایم */
        color: white;
    }

    table.custom-table th, table.custom-table td {
        padding: 12px 15px;
        text-align: center;
        border-bottom: 1px solid #ddd;
        font-size: 14px;
    }

    table.custom-table tbody tr:hover {
        background-color: #f1f7ff;
        cursor: pointer;
    }

/* برای ریسپانسیو کردن جدول */
@media (max-width: 768px) {
    table.custom-table thead {
        display: none;
    }

    table.custom-table,
    table.custom-table tbody,
    table.custom-table tr,
    table.custom-table td {
        display: block;
        width: 100%;
    }

        table.custom-table tr {
            margin-bottom: 15px;
            border-radius: 8px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
            padding: 15px;
            background: white;
        }

        table.custom-table td {
            text-align: right;
            padding-left: 50%;
            position: relative;
            border: none;
            border-bottom: 1px solid #eee;
            font-size: 13px;
        }

            table.custom-table td::before {
                content: attr(data-label);
                position: absolute;
                left: 15px;
                width: 45%;
                padding-left: 10px;
                font-weight: 600;
                white-space: nowrap;
                text-align: left;
                color: #2c7be5;
            }

            table.custom-table td:last-child {
                border-bottom: 0;
            }
}
