/*
 * tables.css — ListingTable and all data table variants
 */

/* ─── Base Table ─────────────────────────────────────────────────────────── */

table.ListingTable {
  width: 100%;
  border: 1px solid var(--color-border-soft);
  border-collapse: collapse;
}
table.ListingTable.Natural,
table.ListingTable.natural {
  width: auto;
}
table.ListingTable.Natural th,
table.ListingTable.natural th {
  padding-left: 0.2em;
  padding-right: 0.2em;
}

/* ─── Cells ──────────────────────────────────────────────────────────────── */

table.ListingTable td img {
  display: inline-block;
  vertical-align: middle;
  max-width: none;
  height: auto;
}

table.ListingTable tr td {
  font-size: var(--font-size-base);
  padding: 3px 6px;
  text-align: right;
  border-bottom: 1px solid var(--color-border-soft);
}

table.ListingTable tr th {
  font-size: var(--font-size-base);
  font-weight: 600;
  text-align: center;
  vertical-align: bottom;
  padding: 3px 6px;
  background-color: var(--color-heading-bg);
  color: var(--color-heading-text);
  border-bottom: 1px solid var(--color-border-soft);
  /* white-space: nowrap; */
}
table.ListingTable tr td.RowHeader {
  text-align: left;
  /* white-space: nowrap; */
}

/* ─── Alignment Utilities ────────────────────────────────────────────────── */

table.ListingTable tr td.LeftAligned,
table.ListingTable tr th.LeftAligned {
  text-align: left;
  padding-left: 4px;
}
table.ListingTable tr td.RightAligned,
table.ListingTable tr th.RightAligned {
  text-align: right;
  padding-right: 4px;
}
table.ListingTable tr td.CenterAligned,
table.ListingTable tr th.CenterAligned {
  text-align: center;
}
table.ListingTable tr.ColumnData td.LeftAligned  { padding-left:  20px; }
table.ListingTable tr.ColumnData td.RightAligned { padding-right: 30px; }

/* Row-action column (delete / icons). width:1% collapses the cell to its
   content; data columns absorb the remaining width. */
table.ListingTable th.control,
table.ListingTable td.control {
  width: 1%;
  white-space: nowrap;
  text-align: center;
}

/* ─── Border Utilities ───────────────────────────────────────────────────── */

table.ListingTable tr th.TopLine,
table.ListingTable tr td.TopLine    { border-top:    1px solid var(--color-border-soft); }
table.ListingTable tr th.LeftLine,
table.ListingTable tr td.LeftLine   { border-left:   1px solid var(--color-border-soft); }
table.ListingTable tr th.RightLine,
table.ListingTable tr td.RightLine  { border-right:  1px solid var(--color-border-soft); }
table.ListingTable tr th.SideLine,
table.ListingTable tr td.SideLine   { border-left:   1px solid var(--color-border-soft); border-right: 1px solid var(--color-border-soft); }
table.ListingTable tr th.NoLine,
table.ListingTable tr td.NoLine     { border-bottom: none; }

/* ─── Alternating Rows ───────────────────────────────────────────────────── */

table.ListingTable tbody tr:nth-child(even):not(.IgnoreAlternate) td {
  background-color: var(--color-row-alt-light);
}
table.ListingTable tbody tr:nth-child(even):not(.IgnoreAlternate) td.Alternate {
  background-color: var(--color-row-alt-dark);
}
table.ListingTable tbody tr:nth-child(odd):not(.IgnoreAlternate) td.Alternate {
  background-color: var(--color-row-alt-light);
}
table.ListingTable thead tr th.Alternate {
  background-color: var(--color-row-alt-light);
}

/* Column grouping classes introduced on branch Issue-5604-css — bgcolor replacements */
table.ListingTable thead tr td.ColGroupLight,
table.ListingTable thead tr th.ColGroupLight,
table.ListingTable tr td.ColGroupLight,
table.ListingTable tr th.ColGroupLight {
  background-color: var(--color-row-even);
}
table.ListingTable thead tr td.ColGroupDark,
table.ListingTable thead tr th.ColGroupDark,
table.ListingTable tr td.ColGroupDark,
table.ListingTable tr th.ColGroupDark {
  background-color: var(--color-row-alt);
}

/* ─── Colored Row Variants ───────────────────────────────────────────────── */

table.ListingTable tbody tr.purpleRow td                 { background-color: var(--row-purple-odd); }
table.ListingTable tbody tr.purpleRow:nth-child(even) td { background-color: var(--row-purple-even); }
table.ListingTable tbody tr.blueRow td                   { background-color: var(--row-blue-odd); }
table.ListingTable tbody tr.blueRow:nth-child(even) td   { background-color: var(--row-blue-even); }
table.ListingTable tbody tr.redRow td                    { background-color: var(--row-red-odd); }
table.ListingTable tbody tr.redRow:nth-child(even) td    { background-color: var(--row-red-even); }
table.ListingTable tbody tr.orangeRow td                 { background-color: var(--row-orange-odd); }
table.ListingTable tbody tr.orangeRow:nth-child(even) td { background-color: var(--row-orange-even); }
table.ListingTable tbody tr.yellowRow td                 { background-color: var(--row-yellow-odd); }
table.ListingTable tbody tr.yellowRow:nth-child(even) td { background-color: var(--row-yellow-even); }
table.ListingTable tbody tr.greenRow td                  { background-color: var(--row-green-odd); }
table.ListingTable tbody tr.greenRow:nth-child(even) td  { background-color: var(--row-green-even); }

/* ─── Row Semantic States ────────────────────────────────────────────────── */

table.ListingTable tr.SubHeading td {
  font-weight: 600;
  padding-top: 6px;
  border-bottom: 1px solid var(--color-border-soft);
  background-color: var(--color-heading-bg);
}
table.ListingTable tr.SubHeading.NoBold td { font-weight: normal; }
table.ListingTable tr.Total td {
  border-top: 2px solid var(--color-border);
  font-weight: 600;
  position: sticky;
  bottom: 0;
  background-color: var(--color-bg);
  z-index: 1;
}
table.ListingTable tr.SubTotal td { border-top: 1px solid var(--color-border); }
table.ListingTable tr.Total td.NoLine,
table.ListingTable tr.SubTotal td.NoLine { border-top: none; }

table.ListingTable tr.Hover:hover td {
  background-color: var(--color-row-hover) !important;
}
table.ListingTable tr.Link {
  cursor: pointer;
}
table.ListingTable tr.Link:hover td {
  background-color: var(--color-accent) !important;
  color: var(--color-accent-text);
}

/* ─── Sort Controls ──────────────────────────────────────────────────────── */

table.ListingTable tr th.sort {
  cursor: pointer;
  text-decoration: underline;
}
table.ListingTable tr th.sort:hover { text-decoration: none; }
table.ListingTable tr th.sort.asc  { background: url(../../../images/sort-asc.png)  bottom right no-repeat; padding-right: 14px; }
table.ListingTable tr th.sort.desc { background: url(../../../images/sort-desc.png) bottom right no-repeat; padding-right: 14px; }

/* ─── Inline Form Rows ───────────────────────────────────────────────────── */

table.ListingTable tr.Form td {
  margin: 0;
  padding: 2px 0;
  vertical-align: middle;
}
table.ListingTable tr.Form td.Buttons {
  padding-top: 6px;
  padding-right: 4px;
}
table.ListingTable tr.Form.QuickAdd    td { background-color: var(--color-quick-add); }
table.ListingTable tr.Form.QuickFilter td { background-color: var(--color-quick-filter); }
table.ListingTable tr.Form.QuickFilter .filterLink {
  padding: 0 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: normal;
}
table.ListingTable tr.Form td input:not([type=checkbox]):not([type=radio]),
table.ListingTable tr.Form td select,
table.ListingTable tr.Form td textarea {
  font-family: var(--font-base);
  font-size: var(--font-size-base);
  width: 100%;
  margin: 0;
  padding: 2px 6px;
  border: 1px solid var(--input-border);
  border-radius: var(--radius);
  background-color: var(--input-bg);
  color: var(--input-fg);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
table.ListingTable td input:disabled,
table.ListingTable td select:disabled,
table.ListingTable td textarea:disabled {
  background-color: transparent;
  border-color: transparent;
  cursor: default;
}

/* Textareas in form rows collapse to single-line height until focused,
   then grow to show full content. Keeps row tight when scanning a long PO.
   Hover-expand was distracting on many-row forms — focus only. */
table.ListingTable tr.Form td textarea {
  height: 1.8em;
  min-height: 1.8em;
  resize: vertical;
  overflow: hidden;
}
/* table.ListingTable tr.Form td textarea:hover { */
table.ListingTable tr.Form td textarea:focus {
  height: auto;
  min-height: 4em;
  overflow: auto;
}

table.ListingTable tr.Form td:has(> input[type=checkbox]:only-of-type),
table.ListingTable tr.Form td:has(> input[type=radio]:only-of-type) {
  text-align: center;
}
table.ListingTable tr.Form td.period-checks input[type=checkbox],
table.ListingTable tr.Form td.period-checks input[type=radio] {
  float: none;
}
table.ListingTable tr.Form td.period-checks label {
  display: inline-block;
  float: none;
}
table.ListingTable tr.Form td input:focus,
table.ListingTable tr.Form td select:focus,
table.ListingTable tr.Form td textarea:focus {
  outline: none;
  border-color: var(--color-focus-ring);
  box-shadow: 0 0 0 3px var(--color-focus-ring-soft);
}
table.ListingTable tr.Form div.group { float: none; }

/* Inline form icon buttons */
table.ListingTable tr.Form td input.search[type=submit] {
  cursor: pointer;
  background: url('../../../images/zoom.png') center center no-repeat;
  border: none;
  width: 16px;
}
table.ListingTable tr.Form td input.clear[type=button] {
  cursor: pointer;
  background: url('../../../images/eraser.png') center center no-repeat;
  border: none;
  width: 16px;
}
table.ListingTable tr.Form td input.add[type=submit] {
  cursor: pointer;
  background: url('../../../images/add.png') center center no-repeat;
  border: none;
  width: 16px;
}

/* ─── Legend Color Swatch ────────────────────────────────────────────────── */

table.ListingTable tr td div.LegendColor {
  display: inline-block;
  width: 0;
  height: 0;
  border-width: 8px;
  border-style: solid;
  vertical-align: bottom;
}

/* ─── Floating (Sticky) Header ───────────────────────────────────────────── */

table.ListingTable .FloatingHeader {
  background: var(--color-bg);
  opacity: 0.9;
}
table.ListingTable .FloatingHeader th {
  background: var(--color-bg);
}

/* ─── Link count badge ───────────────────────────────────────────────────── */

table.ListingTable td a[count] { position: relative; }
table.ListingTable td a[count]::before {
  content: attr(count);
  display: inline-block;
  text-align: center;
  background: var(--color-badge-bg);
  font-size: 8px;
  font-weight: bold;
  width: 12px;
  height: 12px;
  line-height: 12px;
  vertical-align: middle;
  color: #fff;
  border-radius: 6px;
  position: absolute;
  top: -3px;
  right: -3px;
}

/* ─── Detail Tab ─────────────────────────────────────────────────────────── */

td.detailtab { cursor: pointer; }

/* ─── Column header helper icon ──────────────────────────────────────────── */

thead th span.helper::after,
table.ListingTable tr td.help::after,
table.ListingTable tr th.help::after {
  content: '';
  display: inline-block;
  vertical-align: text-top;
  margin-left: 5px;
  width: 16px;
  height: 16px;
  background: url(../../../images/help.png) center center no-repeat;
}

/* ─── Section Dividers ───────────────────────────────────────────────────── */
/* Used by *History/*Report pages to separate sections (heavy/thin/spacer).
   Zero out padding/line-height so the row's height="N" attribute is honored
   and the divider stays as compact as it is in classic.                     */

table.ListingTable tr.Divider-spacer td,
table.ListingTable tr.Divider-heavy  td,
table.ListingTable tr.Divider-thin   td {
  padding: 0;
  line-height: 0;
  font-size: 0;
  border: 0;
}
table.ListingTable tr.Divider-spacer td { background-color: var(--color-bg); }
table.ListingTable tr.Divider-heavy  td { background-color: var(--color-divider-heavy); }
table.ListingTable tr.Divider-thin   td { background-color: var(--color-divider-thin); }

/* ─── AP bank reconciliation ─────────────────────────────────────────────── */
.ap-bank-balance {
    color: var(--color-bank-balance);
    font-weight: 500;
}