/* BTA33KAR — bta-detail-1.0.css (UI-W2, 2026-10-14). Unit / project detail pages.
   The "Overview" was a 17-row, two-column striped table (~830px tall). Same markup, same data, shown as a
   responsive grid of fact tiles (label above, value below) — the way big property portals present key facts.
   CSS only; no Blade or data change. Immutable filename: a correction ships as 1.1. */

.detailproject table.table-striped.table-bordered {
    display: block;
    border: 0 !important;
    margin-bottom: 8px;
}
.detailproject table.table-striped.table-bordered > tbody {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.detailproject table.table-striped.table-bordered > tbody > tr {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    min-width: 0;
    background: #f6f8fb !important;
    border: 1px solid #e6ecf3;
    border-radius: 12px;
    padding: 10px 14px;
}
.detailproject table.table-striped.table-bordered > tbody > tr > td,
.detailproject table.table-striped.table-bordered > tbody > tr > th {
    display: block;
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    min-width: 0;
    overflow-wrap: anywhere;
}
.detailproject table.table-striped.table-bordered > tbody > tr > :first-child {
    font-size: .78rem;
    color: #5b6876;
    font-weight: 500;
}
.detailproject table.table-striped.table-bordered > tbody > tr > :last-child {
    font-size: .98rem;
    color: #0b2540;
}
.detailproject table.table-striped.table-bordered > tbody > tr > :last-child strong { font-weight: 700; }
@media (min-width: 768px) {
    .detailproject table.table-striped.table-bordered > tbody { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
}
@media (min-width: 1200px) {
    .detailproject table.table-striped.table-bordered > tbody { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
