/* V355 shared Payments / My Payment Requests layout correction. Theme colors
   and server data/access decisions stay intact. A wide ledger may scroll; the
   page and filters must not. AP Settlement and detail views are not targeted. */
.aw339:is(.apx-payments338,.aw339-mine) {
  min-width:0;
  max-width:100%;
}
.aw339:is(.apx-payments338,.aw339-mine) :is(#listGrid,.apx-ledger-zone,.apx-table-wrap) {
  min-width:0;
  max-width:100%;
}
.aw339:is(.apx-payments338,.aw339-mine) .apx-table-wrap {
  width:100%;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scrollbar-width:auto;
}
.aw339:is(.apx-payments338,.aw339-mine) .apx-table-wrap:focus-visible {
  outline:2px solid var(--primary);
  outline-offset:-2px;
}
.aw339:is(.apx-payments338,.aw339-mine) .list-toolbar {
  flex-wrap:wrap;
  gap:10px 12px;
}
.aw339:is(.apx-payments338,.aw339-mine) .list-search {
  flex:1 1 260px;
  min-width:0;
  max-width:420px;
}
.aw339:is(.apx-payments338,.aw339-mine) .list-search input,
.aw339:is(.apx-payments338,.aw339-mine) .list-toolbar select {
  min-width:0;
  max-width:100%;
}

@media(min-width:601px) {
  /* V343 fixed both width and min-width at 1723px. Percentage column widths
     now fill the available workspace while the 1440px floor keeps 14 columns
     readable. Narrower workspaces use this one contained scroll region. */
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger {
    table-layout:fixed;
    width:100%;
    min-width:1440px;
  }
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col] {
    min-width:0;
    box-sizing:border-box;
  }
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=row] {width:2%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=payment_no] {width:9%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=created_at],
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=approved_at] {width:7%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=entity] {width:5.3%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=nature_of_transaction] {width:8.2%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=department] {width:7.5%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=requester] {width:7%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=payment_priority] {width:5.5%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=beneficiary_name] {width:9%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=currency] {width:5.5%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=total_amount] {width:7%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=pending_with] {width:10%}
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=action] {width:10%}

  /* Do not freeze the middle of the ledger: V343's 408px right-hand stack
     covered Currency and Beneficiary before the user reached the scroll end. */
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=total_amount],
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=pending_with] {
    position:static;
    right:auto;
    z-index:auto;
    box-shadow:none;
  }
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger th[data-ledger-col] {
    height:56px;
    padding:6px 7px;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    line-height:14px;
  }
  .aw339:is(.apx-payments338,.aw339-mine) .apx-ledger .apx-col-head {
    min-width:0;
    gap:4px;
  }
  .aw339:is(.apx-payments338,.aw339-mine) .apx-ledger .apx-col-head>span {
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    overflow-wrap:anywhere;
    line-height:14px;
  }
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger tbody tr,
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger td[data-ledger-col] {
    height:48px;
  }
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger td[data-ledger-col] {
    padding:0 8px;
    vertical-align:middle;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    overflow-wrap:normal;
    line-height:16px;
    max-width:none;
  }
  .aw339:is(.apx-payments338,.aw339-mine) .apx-ledger :is(.apx-ledger-nature,.apx-pending-name) {
    display:block;
    max-width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    overflow-wrap:normal;
    margin:0;
    line-height:16px;
  }
  .aw339:is(.apx-payments338,.aw339-mine) .apx-ledger .apx-waiting-owner {
    display:block;
    padding:0;
    line-height:16px;
  }
  .aw339:is(.apx-payments338,.aw339-mine) .apx-ledger .apx-row-actions {
    display:flex;
    flex-direction:row;
    justify-content:center;
    align-items:center;
    min-width:0;
    max-width:none;
  }
  .aw339:is(.apx-payments338,.aw339-mine) .apx-ledger .apx-row-actions .btn {
    min-height:28px;
    max-height:44px;
    margin:0;
    padding:4px 8px;
    font-size:11px;
    gap:6px;
    white-space:nowrap;
  }
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=total_amount] {
    text-align:right;
    font-variant-numeric:tabular-nums;
  }
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=action] {
    text-align:center;
  }
}

@media(min-width:901px) {
  /* Only the final Action column stays pinned; no width-dependent offsets. */
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger [data-ledger-col=action] {
    position:sticky;
    right:0;
    z-index:2;
    background:var(--apx-surface,var(--surface));
    box-shadow:-1px 0 0 var(--apx-grid);
  }
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger th[data-ledger-col=action] {
    background:color-mix(in srgb,var(--primary) 7%,var(--apx-surface,var(--surface)));
  }
}
@media(pointer:coarse) and (min-width:601px) {
  /* Preserve the existing 44px touch targets without squeezing header text. */
  .aw339:is(.apx-payments338,.aw339-mine) .apx-ledger .apx-col-head {
    flex-direction:column;
    align-items:flex-start;
  }
  .aw339:is(.apx-payments338,.aw339-mine).apx-queue332.apx-ledger338 .apx-table.apx-ledger th[data-ledger-col] {
    height:88px;
  }
  .aw339:is(.apx-payments338,.aw339-mine) .apx-ledger .apx-row-actions .btn {
    min-height:44px;
  }
}
@media(max-width:760px) {
  .aw339:is(.apx-payments338,.aw339-mine) .list-search {flex-basis:100%;max-width:none}
  .aw339:is(.apx-payments338,.aw339-mine) .list-toolbar select {flex:1 1 130px}
}
/* The existing <=600px payment cards and their column filters are unchanged. */