/* ---------------------------------------------------------------
   Detail panels + document tables
   Two separate things live here:

   1. .detail-panel / .detail-map / .detail-table - the contact and
      support pages. These sit on top of the theme's .instrument-table
      and only adjust corners and cell alignment.

   2. .doc-table - the regulatory document pages (investor charter).
      These tables are dense and text-heavy, so they opt OUT of
      .instrument-table entirely and own their styling.
   --------------------------------------------------------------- */

/* =============================================================
   1. Contact / support panels
   ============================================================= */

/* ---- panels: same corner radius as .form-panel ---- */
.detail-panel.shadow-light,
.detail-map {
  border-radius: var(--form-panel-radius);
  /* the rounded corner has to clip the table / iframe inside it */
  overflow: hidden;
}

.detail-map iframe {
  display: block;
  border-radius: var(--form-panel-radius);
}

/* ---- centred cells ----
   theme.css sets `.instrument-table th/td { text-align:left !important }`
   for every table on the site, so this needs both the extra class and
   !important to win. */
.detail-table.instrument-table th,
.detail-table.instrument-table td {
  text-align: center !important;
  vertical-align: middle;
}


/* =============================================================
   2. Document tables
   ============================================================= */

.doc-table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: #4a5561;
  background: #fff;
}

.doc-table th,
.doc-table td {
  padding: 0.75rem 1rem;
  border: 1px solid #e6eaef;
  text-align: left;
  vertical-align: top;
  white-space: normal;
  word-break: normal;
  overflow-wrap: break-word;
}

/* ---- header ---- */
.doc-table thead th {
  background: #f6f9fc;
  color: #2d343e;
  font-weight: 600;
  text-align: center;
  vertical-align: middle;
}

/* the row that closes the header needs a firmer edge against the body */
.doc-table thead tr:last-child th {
  border-bottom: 2px solid #d7dee6;
}

/* ---- body ---- */
.doc-table tbody tr:nth-child(even) td {
  background: #fbfcfd;
}

.doc-table tbody tr:hover td {
  background: #f4f8fb;
}

/* ---- a leading serial-number column stays narrow and centred ----
   scoped to the first header row and the body: a plain th:first-child
   would also catch the leading cell of a second header row, which in a
   table with stacked headers is a real column heading, not a serial. */
.doc-table.has-snum thead tr:first-child th:first-child,
.doc-table.has-snum tbody td:first-child {
  width: 1%;
  white-space: nowrap;
  text-align: center;
}

.doc-table.has-snum tbody td:first-child {
  color: #6a747b;
}

/* ---- centred value tables ----
   short values - exchange codes, phone numbers, ids - sit under centred
   headings, so range them centre too and pull them off the top edge. */
.doc-table.is-centered tbody td {
  text-align: center;
  vertical-align: middle;
}

/* ---- trailing download column ----
   a column of icons has no text to range against; centre it under its
   heading and let it stay as narrow as its content. */
.doc-table.has-download thead tr:first-child th:last-child,
.doc-table.has-download tbody td:last-child {
  width: 1%;
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
}

/* ---- numeric tables ----
   every value is a figure, so centre the grid and keep only the
   leading label column ranged left. */
.doc-table.is-data {
  font-size: 0.875rem;
}

.doc-table.is-data td {
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}

.doc-table.is-data td:nth-child(2) {
  text-align: left;
  white-space: normal;
}

/* ---- two-column comparison tables (DOs / DON'Ts) ---- */
.doc-table.is-split th,
.doc-table.is-split td {
  width: 50%;
}

/* ---- authorised-person table ----
   eleven columns, so trade a little cell padding and type size for the
   ~100px it needs to sit inside the page instead of scrolling. */
.doc-table.is-ap {
  font-size: 0.875rem;
}

.doc-table.is-ap th,
.doc-table.is-ap td {
  padding: 0.6rem 0.5rem;
}

/* ---- narrow screens ---- */
@media (max-width: 575.98px) {
  .doc-table,
  .doc-table.is-data {
    font-size: 0.8125rem;
  }

  .doc-table th,
  .doc-table td {
    padding: 0.5rem 0.625rem;
  }
}

/* ---- numeric column sizing ----
   left to itself the browser hands a long header like "Carried forward
   from previous month" a column three times wider than its single-digit
   values. Fixing the layout evens the grid out and wraps the header
   instead. */
.doc-table.is-data {
  table-layout: fixed;
}

.doc-table.is-data.has-snum thead tr:first-child th:first-child,
.doc-table.is-data.has-snum tbody td:first-child {
  width: 3.75rem;
}

.doc-table.is-data thead tr:first-child th:nth-child(2),
.doc-table.is-data tbody td:nth-child(2) {
  width: 22%;
}

/* the 9-column monthly table has too many columns to squeeze into the
   page width - let it keep its natural size and scroll inside
   .table-responsive instead. */
.doc-table.is-data.is-wide {
  table-layout: auto;
  min-width: 58rem;
}

/* Authorised Person list: street address hidden for privacy */
.addr-masked{color:#9aa0a6;letter-spacing:0.12em;cursor:help;white-space:nowrap}