/* Make DataTables responsive row full-width and styled like Sneat cards */
table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control::before {
    top: 16px;
    left: 8px;
}

table.dataTable > tbody > tr.child ul.dtr-details {
    width: 100%;
    display: block;
    background-color: #fff;
    border-radius: 0.5rem;
    padding: 1rem;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
    font-size: 14px;
}

table.dataTable > tbody > tr.child ul.dtr-details > li {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f0f0f0;
}

table.dataTable > tbody > tr.child ul.dtr-details > li:last-child {
    border-bottom: none;
}

table.dataTable > tbody > tr.child span.badge {
    font-size: 12px;
    padding: 4px 8px;
    border-radius: 0.375rem;
}

table.dataTable > tbody > tr.child .btn-icon {
    padding: 6px;
}