/* GENERATED COPY — run CustomerFrontEnd/scripts/sync-shared-design.cjs
 * Source SHA-256: 28f3e3e7ac4d9165b560985bf2a31992c9cbbc98d73c0d92ba7c82fa3a961b63
 */
/* Canonical data-table style: Customer loan transaction table.
 * Keep page-specific column sizing, sorting, pagination and mobile cards.
 * Sync with scripts/sync-shared-design.cjs after edits.
 */
@layer plexe-shared-design {
  /* Explicitly applied by the application templates, not just the audit fixture. */
  .plexe-design-system .pds-table {
    table-layout: fixed !important;
    margin: 18px 0 0 !important;
    max-height: none !important;
  }
  .plexe-design-system .pds-table:not(.d-none) { display: table !important; }
  @media (min-width: 576px) {
    .plexe-design-system .pds-table.d-sm-flex { display: table !important; }
  }
  @media (min-width: 768px) {
    .plexe-design-system .pds-table.d-md-flex { display: table !important; }
  }
  .plexe-design-system .pds-table thead { display: table-header-group !important; }
  .plexe-design-system .pds-table tbody { display: table-row-group !important; max-height: none !important; overflow: visible !important; }
  .plexe-design-system .pds-table tr { display: table-row !important; }
  .plexe-design-system .pds-table :where(th, td) { display: table-cell !important; overflow-wrap: anywhere; }
  /* The table owns its border and shadow; wrappers must not add a second frame. */
  .plexe-design-system .pds-table-wrap {
    border: 0 solid transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    overflow: auto !important;
    width: 100%;
  }
  .plexe-design-system :where(.transaction-table, .documents-table, table.table, table.table-scroll, .cf-table, .site-shell table, .manager-shell table, .pds-table) {
    width: 100% !important;
    background: var(--pds-surface) !important;
    color: var(--pds-body) !important;
    font: 400 16px/24px var(--pds-font) !important;
    border: 1px solid var(--pds-border) !important;
    border-radius: 16px !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    box-shadow: 0 18px 48px var(--pds-table-shadow) !important;
    overflow: hidden;
  }
  .plexe-design-system :where(.transaction-table, .documents-table, table.table, table.table-scroll, .cf-table, .site-shell table, .manager-shell table, .pds-table) :where(thead, tr.title, thead tr) {
    background: var(--pds-soft) !important;
  }
  .plexe-design-system :where(.transaction-table, .documents-table, table.table, table.table-scroll, .cf-table, .site-shell table, .manager-shell table, .pds-table) :where(th, td) {
    font-family: var(--pds-font) !important;
    font-weight: 400 !important;
    letter-spacing: normal !important;
    background: transparent !important;
    border: 0 solid var(--pds-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    vertical-align: middle !important;
    text-align: start;
  }
  .plexe-design-system :where(.transaction-table, .documents-table, table.table, table.table-scroll, .cf-table, .site-shell table, .manager-shell table, .pds-table) th {
    color: var(--pds-muted) !important;
    font-size: 12px !important;
    line-height: 18px !important;
    text-transform: uppercase !important;
    padding: 14px 18px !important;
  }
  .plexe-design-system :where(.transaction-table, .documents-table, table.table, table.table-scroll, .cf-table, .site-shell table, .manager-shell table, .pds-table) td {

    font-size: 13px !important;
    line-height: 20px !important;
    text-transform: none !important;
    padding: 16px 18px !important;
    border-bottom: 1px solid var(--pds-border) !important;
  }
  .plexe-design-system :where(.transaction-table, .documents-table, table.table, table.table-scroll, .cf-table, .site-shell table, .manager-shell table, .pds-table) tr:last-child td {
    border-bottom: 0 !important;
  }
  .plexe-design-system :where(.transaction-table, .documents-table, table.table, table.table-scroll, .cf-table, .site-shell table, .manager-shell table, .pds-table) tr:not(.title):hover td {
    background: var(--pds-soft) !important;
  }
  .plexe-design-system :where(.transaction-table, .documents-table, table.table, table.table-scroll, .cf-table, .site-shell table, .manager-shell table, .pds-table) td:not(.approved-status, .waiting-status, .expires-status, .text-success, .text-danger, .text-warning) {
    color: var(--pds-ink) !important;
  }
  /* Unclassified text cells use logical start; numeric/action classes keep their alignment. */
  .plexe-design-system :where(.transaction-table, .documents-table, table.table, table.table-scroll, .cf-table, .site-shell table, .manager-shell table, .pds-table) td:not([class]) {
    text-align: start !important;
  }
  /* Help's data table stays a scrollable table at narrow widths. */
  .plexe-design-system :is(.site-shell, .manager-shell) .table-wrap { overflow-x: auto !important; }
  .plexe-design-system :is(.site-shell, .manager-shell) table { display: table !important; }
  .plexe-design-system :is(.site-shell, .manager-shell) table thead { display: table-header-group !important; }
  .plexe-design-system :is(.site-shell, .manager-shell) table tbody { display: table-row-group !important; }
  .plexe-design-system :is(.site-shell, .manager-shell) table tr { display: table-row !important; border: 0 solid transparent !important; padding: 0 !important; }
  .plexe-design-system :is(.site-shell, .manager-shell) table :where(th, td) { display: table-cell !important; width: auto !important; }
}
