/* ============================================================
   tables.css — canonical data-table styling.

   Hoisted from a header/nowrap/clickable-row block that was copy-pasted
   verbatim across 6+ dashboards (inventory_log, unloads, transfers,
   security_events, commercial, delivery_monitoring, …). Loaded after
   components.css in base.html; applies app-wide to Bootstrap .table.

   Scope is deliberately conservative: the nowrap rule only fires inside
   .table-responsive (pages opt in), and per-page general tr:hover and
   .clickable-row rules are intentionally left in place (their hover color
   varies #e9ecef vs slate, so consolidating them needs a token decision).
   ============================================================ */

/* Cells/headers don't wrap: the table keeps its natural width and
   .table-responsive scrolls horizontally instead of cramping columns. */
.table-responsive > .table th,
.table-responsive > .table td { white-space: nowrap; }

/* Header styling */
.table th { font-weight: 600; font-size: 0.85rem; letter-spacing: 0.5px; }

/* Tables wrapped directly in a card inset their edge cells so the first/last
   column lines up with the card header padding instead of crowding the
   border. (Standard dashboards put the table in the roomy page body, not a
   card, so they don't need this.) */
.card > .table-responsive > .table > thead > tr > *:first-child,
.card > .table-responsive > .table > tbody > tr > *:first-child { padding-left: 1rem; }
.card > .table-responsive > .table > thead > tr > *:last-child,
.card > .table-responsive > .table > tbody > tr > *:last-child { padding-right: 1rem; }
