/* Layout only. Buttons, fields, tables, badges, alerts and empty states come from
 * the shared components and the .gk-admin-native base; every value is a shared
 * token. */
.waitlist-venue {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2xl);
  min-width: 0;
}

.waitlist-venue [hidden] {
  display: none !important;
}

.waitlist-venue .waitlist-workspace,
.waitlist-venue section[data-view],
.waitlist-venue .waitlist-directory {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2xl);
  min-width: 0;
}

/* The grid gap already separates the header from the first block. */
.waitlist-venue {
  --page-header-mb: 0;
}

.waitlist-venue h2,
.waitlist-venue h3,
.waitlist-venue p {
  margin: 0;
}

/* A heading that names the list under it: the panel heading step, 16px apart from the list. */
.waitlist-venue h3,
.waitlist-venue .waitlist-heading {
  font-size: var(--fs-panel);
  font-weight: var(--fw-title);
  line-height: var(--lh-snug);
}

.waitlist-venue .waitlist-block,
.waitlist-venue .waitlist-checks,
.waitlist-venue .waitlist-entry-checks {
  display: grid;
  gap: var(--space-lg);
  min-width: 0;
}

.waitlist-venue .waitlist-count {
  color: var(--text-muted);
  font-size: var(--fs-caption);
}

.waitlist-venue .waitlist-count:empty {
  display: none;
}

/* The disclosure under the list sits on the page's rhythm: the grid gap, not its own margin. */
.waitlist-venue gk-collapse {
  margin-block-end: 0;
}

.waitlist-venue [data-settings-status]:empty,
.waitlist-venue .admin-settings-section__body > [data-privacy-status]:empty {
  display: none;
}

.waitlist-venue .waitlist-metrics:empty {
  display: none;
}

.waitlist-venue .waitlist-detail-body {
  display: grid;
  gap: var(--space-2xl);
}

.waitlist-record-workspace {
  min-width: 0;
}

.waitlist-venue gk-sheet[inspector] .waitlist-detail-body {
  padding-bottom: var(--space-xl);
  overflow-wrap: anywhere;
}

.waitlist-venue gk-sheet[inspector] .waitlist-actions > gk-field {
  flex: 1 1 100%;
  min-width: 0;
}

.waitlist-venue gk-sheet[inspector] gk-button {
  --btn-white-space: normal;
  max-width: 100%;
}

/* The golfer's name is the row's link: plain text in the list's value size, not an underlined link. The whole row
 * opens the entry, so the row shows it is clickable. The entry open in the inspector is marked by its weight. */
.waitlist-venue .waitlist-row-link {
  appearance: none;
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--text);
  font: inherit;
  text-align: left;
  overflow-wrap: anywhere;
  cursor: pointer;
}
.waitlist-venue .waitlist-row-link:focus-visible {
  outline: var(--focus-outline-width) solid var(--focus-ring-color);
  outline-offset: var(--space-2xs);
  border-radius: var(--radius-control);
}
.waitlist-venue tr:has(.waitlist-row-link) { cursor: pointer; }
.waitlist-venue .waitlist-row-link[aria-pressed="true"] { font-weight: var(--fw-title); }

/* The list column is for a wide screen; a phone shows the golfer over what they watch, and the status. */
.waitlist-venue { container: waitlist / inline-size; }
@container waitlist (max-width: 640px) {
  .waitlist-venue .waitlist-col-list { display: none; }
}

.waitlist-venue .waitlist-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: var(--space-lg);
}

/* The adaptive layout top-aligns every cell, which leaves a list's 44px header text at the top edge. Recipe gap in
 * gk-data-table (list with adaptive): the header should stay centred. */
.waitlist-venue gk-data-table[list][adaptive] th {
  vertical-align: middle;
}

/* Status is quiet text beside the golfer; the status column holds its words on one line. */
.waitlist-venue .waitlist-col-status { color: var(--text-muted); font-size: var(--fs-body); white-space: nowrap; }
.waitlist-venue [data-leave] { --btn-link-color: var(--danger-text); }

/* The venue's availability checks: a disclosure under the entries, not a card around the tables. */
.waitlist-venue .waitlist-disclosure > summary {
  display: flex;
  align-items: center;
  min-height: var(--control-height);
  color: var(--text);
  font-size: var(--fs-panel);
  font-weight: var(--fw-title);
  cursor: pointer;
}
.waitlist-venue .waitlist-disclosure[open] > summary { margin-block-end: var(--space-lg); }
@container waitlist (max-width: 640px) {
  .waitlist-venue .waitlist-col-status { padding-inline-start: 0; text-align: right; }
}