/* /Pages/Edge.cshtml.rz.scp.css */
/* Release notes table, styled after the Table component in the Control Edge component library
   sample app: a card with a muted header strip, 40px rows, a neutral-alt header row, and a
   per-column filter popover opened from the funnel button in each header cell. */

.vud-intro[b-zf4o2b5n9u] {
  max-width: 70ch;
  margin-bottom: var(--space-5);
  color: var(--text-idle);
}

.vud-intro p:last-child[b-zf4o2b5n9u] {
  margin-bottom: 0;
}

/* ---- Table ---- */

.vud-table-wrap[b-zf4o2b5n9u] {
  overflow-x: auto;
}

.vud-table[b-zf4o2b5n9u] {
  width: 100%;
  /* Below this the columns stop being readable, so the wrapper scrolls instead of squashing
     them - the library's table behaves the same way (its demo table is 1500px wide). */
  min-width: 1100px;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 0.875rem;
  color: var(--text-idle);
}

/* One line per cell, clipped with an ellipsis, which is what keeps every row exactly 40px like
   the library's. Release-note prose is far longer than the sample app's data, so each cell
   carries its full text in a title attribute, and the whole value is still what gets filtered,
   searched and exported - clipping is purely visual. */
.vud-table th[b-zf4o2b5n9u],
.vud-table td[b-zf4o2b5n9u] {
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

/* Clipping is on the data cells only. A th must not clip, because the filter popover is
   positioned from it - with overflow:hidden here the popover is trapped inside a 40px cell.
   The header's own text is ellipsised by .vud-th-label instead. */
.vud-table td[b-zf4o2b5n9u] {
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Matching Visma.UI.Blazor/Table/style/vud.css: normal-weight headers on neutral-alt-10,
   4px/8px padding, and a grid drawn with border-left on cells plus border-top on rows. */
.vud-table thead th[b-zf4o2b5n9u] {
  position: relative;
  background-color: var(--surface-default-muted);
  border-left: 1px solid var(--divider-muted);
  border-bottom: 1px solid var(--divider-muted);
  font-weight: var(--font-weight-normal);
  padding: var(--space-1) var(--space-2);
  height: var(--vud-row-height);
  white-space: nowrap;
}

.vud-table tbody tr[b-zf4o2b5n9u] {
  border-top: 1px solid var(--divider-muted);
  background-color: var(--surface-default-idle);
}

.vud-table tbody td[b-zf4o2b5n9u] {
  border-left: 1px solid var(--divider-muted);
  padding: var(--space-1) var(--space-2);
  height: var(--vud-row-height);
}

.vud-table thead th:first-child[b-zf4o2b5n9u],
.vud-table tbody td:first-child[b-zf4o2b5n9u] {
  border-left: 0;
}

/* Hover and selection, taken verbatim from .ant-table-tbody > tr:hover and
   .ant-table-row-selected in the library's table stylesheet. */
.vud-table tbody tr:hover[b-zf4o2b5n9u] {
  background-color: var(--secondary-10);
  color: var(--secondary-70);
  border-color: var(--secondary-60);
}

.vud-table tbody tr.is-selected[b-zf4o2b5n9u] {
  background-color: var(--neutral-alt-10);
  color: var(--neutral-80);
  border-color: var(--neutral-60);
}

.vud-table tbody tr.is-selected:hover[b-zf4o2b5n9u] {
  background-color: var(--secondary-10);
  color: var(--secondary-70);
  border-color: var(--secondary-60);
}

/* The sorted column is tinted, the way the library marks the active sort - but the tint must
   step aside on hover and selection so the row colour reads as one band. */
.vud-table tbody td:nth-child(5)[b-zf4o2b5n9u] {
  background-color: var(--neutral-alt-05);
}

.vud-table tbody tr:hover td:nth-child(5)[b-zf4o2b5n9u],
.vud-table tbody tr.is-selected td:nth-child(5)[b-zf4o2b5n9u] {
  background-color: transparent;
}

/* Widths are sized to the longest value each column actually holds, now that cells no longer
   wrap: "Confirmed Error" needs 11%, and Version and Key are fixed-format so they need little.
   Summary and Documentation take the rest. */
.vud-table th:nth-child(1)[b-zf4o2b5n9u], .vud-table td:nth-child(1)[b-zf4o2b5n9u] { width: 11%; }
.vud-table th:nth-child(2)[b-zf4o2b5n9u], .vud-table td:nth-child(2)[b-zf4o2b5n9u] { width: 11%; }
.vud-table th:nth-child(3)[b-zf4o2b5n9u], .vud-table td:nth-child(3)[b-zf4o2b5n9u] { width: 26%; }
.vud-table th:nth-child(4)[b-zf4o2b5n9u], .vud-table td:nth-child(4)[b-zf4o2b5n9u] { width: 28%; }
.vud-table th:nth-child(5)[b-zf4o2b5n9u], .vud-table td:nth-child(5)[b-zf4o2b5n9u] { width: 11%; }
.vud-table th:nth-child(6)[b-zf4o2b5n9u], .vud-table td:nth-child(6)[b-zf4o2b5n9u] { width: 13%; }

/* ---- Header cell contents ---- */

.vud-th[b-zf4o2b5n9u] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-1);
}

.vud-th-label[b-zf4o2b5n9u] {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

button.vud-th-label[b-zf4o2b5n9u] {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
}

button.vud-th-label:hover[b-zf4o2b5n9u] {
  color: var(--text-emphasis);
}

.vud-sort-icon[b-zf4o2b5n9u] {
  color: var(--icon-emphasis);
}

/* Geometry taken from .ant-table-filter-trigger in the library's table stylesheet. */
.vud-filter-btn[b-zf4o2b5n9u] {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: -4px -8px -4px 4px;
  padding: 0 4px;
  height: 24px;
  background: none;
  border: 1px solid transparent;
  border-radius: 2px;
  color: var(--icon-idle);
  font-size: 12px;
  cursor: pointer;
  transition: all 0.3s;
}

.vud-filter-btn:hover[b-zf4o2b5n9u] {
  background-color: rgba(0, 0, 0, 0.04);
  color: var(--neutral-50);
}

.vud-filter-btn:focus-visible[b-zf4o2b5n9u] {
  outline: 2px solid var(--border-focus);
  outline-offset: 1px;
}

/* An applied filter is visible without opening the popover. */
.vud-filter-btn.is-active[b-zf4o2b5n9u] {
  color: var(--text-inverse);
  background-color: var(--surface-secondary-idle);
  border-color: var(--surface-secondary-idle);
}

th.is-filtered[b-zf4o2b5n9u] {
  background-color: var(--secondary-10);
}

/* ---- Filter popover ---- */

/* Fixed, and moved to the end of <body> when it opens, so it escapes both the header cell and
   the table's scroll container - neither of which can show an overflowing child. edge-table.js
   sets top/left from the column header, so it drops directly beneath it. The library does the
   same thing, portalling its dropdowns to body inside an .ant-dropdown wrapper. */
.vud-filter-pop[b-zf4o2b5n9u] {
  position: fixed;
  z-index: 1050;
  width: 353px;
  max-width: calc(100vw - 2rem);
  padding: var(--space-4);
  background-color: var(--neutral-05);
  border-radius: var(--rounded-sm);
  /* The library's three-layer dropdown shadow, measured off .ant-table-filter-dropdown. */
  box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.1), 0 6px 16px 0 rgba(0, 0, 0, 0.1), 0 9px 28px 8px rgba(0, 0, 0, 0.1);
  white-space: normal;
  font-weight: var(--font-weight-normal);
}

.vud-filter-row[b-zf4o2b5n9u] {
  display: flex;
  gap: var(--space-2);
}

.vud-filter-op[b-zf4o2b5n9u] {
  width: 120px;
  flex: none;
}

.vud-filter-value[b-zf4o2b5n9u] {
  flex: 1 1 auto;
  min-width: 0;
}

/* Reset sits at the left and Apply at the right, the way the library lays the row out (its
   dropdown puts the add-condition and Reset buttons left, Apply hard right). */
.vud-filter-actions[b-zf4o2b5n9u] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  margin-top: var(--space-3);
}

.vud-filter-actions .btn[b-zf4o2b5n9u] {
  min-height: var(--height-7);
}

/* Reset reads as text, not a button: no fill, no border, and no underline - matching the
   library's .ant-btn-link. Both actions stay disabled until there is something to apply or
   clear. */
.vud-filter-reset[b-zf4o2b5n9u] {
  background: none;
  border-color: transparent;
  color: var(--text-link);
  padding: var(--space-1) var(--space-4);
}

.vud-filter-reset:hover:not(:disabled)[b-zf4o2b5n9u] {
  background: none;
  border-color: transparent;
  color: var(--secondary-80);
}

/* Scoped to Apply: the same rule applied to both put a fill and a border back on the disabled
   Reset, which is what made it read as a button again. */
.vud-filter-actions .vud-filter-apply:disabled[b-zf4o2b5n9u] {
  color: var(--text-disabled);
  background-color: var(--neutral-05);
  border-color: var(--border-default-disabled);
  cursor: default;
}

.vud-filter-actions .vud-filter-reset:disabled[b-zf4o2b5n9u] {
  background: none;
  border-color: transparent;
  color: var(--text-disabled);
  cursor: default;
}



/* ---- Footer, paging ---- */

.vud-card-footer[b-zf4o2b5n9u] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  /* Left padding matches a cell's 8px so "Total: N records" lines up with the Type column's
     text rather than sitting inboard of it. */
  padding: var(--space-1) var(--space-4) var(--space-1) var(--space-2);
  border-top: 1px solid var(--divider-muted);
  background-color: var(--surface-default-idle);
  border-radius: 0 0 var(--rounded-sm) var(--rounded-sm);
}

/* Footer text is full-size and full-contrast in the library, not muted small print. */
.vud-total[b-zf4o2b5n9u],
.vud-pager-info[b-zf4o2b5n9u] {
  color: var(--text-idle);
  font-size: 0.875rem;
  padding: var(--space-1);
}

/* The footer already supplies the 8px; another 4px here would push it out of line again. */
.vud-total[b-zf4o2b5n9u] {
  padding-left: 0;
}

.vud-pager[b-zf4o2b5n9u] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
}

.vud-page-size[b-zf4o2b5n9u] {
  width: 110px;
}

/* ---- Row visibility ---- */

.rn-filtered-out[b-zf4o2b5n9u] {
  display: none !important;
}

.rn-paged-out[b-zf4o2b5n9u] {
  display: none;
}

/* ---- Print ---- */

@media print {
  @page {
    size: A4 landscape;
    margin: 12mm;
  }

  .vud-card-header[b-zf4o2b5n9u],
  .vud-card-footer[b-zf4o2b5n9u],
  .vud-filter-btn[b-zf4o2b5n9u],
  .vud-filter-pop[b-zf4o2b5n9u],
  .vud-intro[b-zf4o2b5n9u] {
    display: none !important;
  }

  .rn-paged-out[b-zf4o2b5n9u] {
    display: table-row !important;
  }

  .vud-card[b-zf4o2b5n9u] {
    border: 0;
  }

  .vud-table-wrap[b-zf4o2b5n9u] {
    overflow: visible !important;
  }

  .vud-table[b-zf4o2b5n9u] {
    font-size: 9pt;
  }

  /* On paper there is nothing to scroll and no hover to reveal a title, so cells wrap and show
     their full text instead of being clipped. */
  .vud-table[b-zf4o2b5n9u] {
    min-width: 0;
  }

  .vud-table thead th[b-zf4o2b5n9u],
  .vud-table tbody td[b-zf4o2b5n9u] {
    padding: 3px 6px;
    white-space: normal;
    overflow: visible;
    height: auto;
    overflow-wrap: break-word;
  }
}
/* /Pages/EdgeDetails.cshtml.rz.scp.css */
/* Single release note, presented on the same card as the table so the two pages read as one app. */

.vud-back[b-k9p9zlzwic] {
  display: inline-block;
  margin-bottom: var(--space-4);
}

.vud-detail .vud-card-title[b-k9p9zlzwic] {
  font-size: 1rem;
}

.vud-detail-body[b-k9p9zlzwic] {
  padding: var(--space-4);
}

.vud-detail-meta[b-k9p9zlzwic] {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-5);
  margin: 0 0 var(--space-4);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--divider-muted);
}

.vud-detail-meta dt[b-k9p9zlzwic] {
  font-weight: var(--font-weight-normal);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-secondary);
}

.vud-detail-meta dd[b-k9p9zlzwic] {
  margin: 0;
  color: var(--text-idle);
}

.vud-detail-documentation[b-k9p9zlzwic] {
  max-width: 80ch;
  white-space: pre-line;
}
/* /Pages/Shared/_Layout.cshtml.rz.scp.css */
/* Application shell, styled after the Control Edge component library sample app: a dark
   secondary-100 top bar over a neutral page background, with content sitting on white cards. */

.vud-topbar[b-diuxrm7id4] {
  background-color: var(--secondary-100);
  color: var(--text-inverse);
  height: var(--height-10);
  display: flex;
  align-items: center;
}

.vud-topbar-inner[b-diuxrm7id4] {
  width: 100%;
  max-width: 1725px;
  margin: 0 auto;
  padding: 0 var(--space-5);
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

/* Plain white text on the bar - not a link, so there is nothing to hover and no underline or
   link colour to override. */
.vud-brand[b-diuxrm7id4] {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--text-inverse);
  font-weight: var(--font-weight-semi-bold);
  font-size: 1rem;
  cursor: default;
}

.vud-brand-divider[b-diuxrm7id4] {
  width: 1px;
  height: var(--height-6);
  background-color: rgba(255, 255, 255, 0.3);
}

.vud-brand-app[b-diuxrm7id4] {
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.85);
}

.vud-main[b-diuxrm7id4] {
  max-width: 1725px;
  margin: 0 auto;
  padding: var(--space-5) var(--space-5) var(--space-6);
}

.vud-footer[b-diuxrm7id4] {
  border-top: 1px solid var(--divider-muted);
  background-color: var(--surface-background-05);
  color: var(--text-secondary);
  font-size: 0.8125rem;
}

.vud-footer-inner[b-diuxrm7id4] {
  max-width: 1725px;
  margin: 0 auto;
  padding: var(--space-4) var(--space-5);
}

@media (max-width: 640px) {
  .vud-topbar-inner[b-diuxrm7id4],
  .vud-main[b-diuxrm7id4],
  .vud-footer-inner[b-diuxrm7id4] {
    padding-left: var(--space-3);
    padding-right: var(--space-3);
  }
}

@media print {
  .vud-topbar[b-diuxrm7id4],
  .vud-footer[b-diuxrm7id4] {
    display: none !important;
  }

  .vud-main[b-diuxrm7id4] {
    padding: 0;
    max-width: none;
  }
}