/* Group Enquiries venue layout. Every rule is scoped under .gev, the controller's own wrapper, so the
   same file loads in Enquiries' admin console and in Core's tenant admin. Surfaces, controls, tables,
   dialogs, the board and the timeline are gk-* components and the shared base; this file places them
   with the shared spacing, type and radius tokens. The attribute `hidden` has to win over the display
   rules below, so it is restated for the whole wrapper. */

.gev {
  min-width: 0;
  color: var(--text);
}

.gev [hidden] {
  display: none !important;
}

.gev h1,
.gev h2,
.gev h3,
.gev h4 {
  color: var(--text);
}

/* A sub-heading inside a section sits on the section's own rhythm, not the browser's em margins. */
.gev h4 {
  margin: var(--space-sm) 0 var(--space-xs);
  font-size: var(--fs-14);
}

.gev-hint {
  color: var(--text-muted);
  font-size: var(--fs-12);
  line-height: var(--lh-snug);
}

.gev-status {
  min-height: calc(var(--fs-13) * var(--lh-normal));
  margin: 0;
  color: var(--text-muted);
  font-size: var(--fs-13);
}

.gev-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-md);
}

.gev-stack {
  display: grid;
  gap: var(--space-md);
}

.gev-view,
.gev-workspace,
.gev-queue {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
}

.gev-view {
  gap: var(--space-2xl);
  /* The grid gap already separates the header from the first block. */
  --page-header-mb: 0;
}

/* A failed first load keeps the header and the error slot; the rest of the view has nothing to show. */
.gev-view > [data-gev-error-slot] {
  display: contents;
}

[data-gev="workspace"][data-unavailable] .gev-view > :not(gk-page-header):not([data-gev-error-slot]) {
  display: none;
}

.gev-workspace,
.gev-queue {
  gap: var(--space-xl);
}

/* A section heading with the actions that belong to it. */
.gev-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-xl);
}

.gev-heading > div {
  display: grid;
  gap: var(--space-2xs);
  min-width: 0;
}

.gev-heading h2,
.gev-heading h3,
.gev-heading p {
  margin: 0;
}

.gev-heading h2 {
  font-size: var(--fs-20);
  line-height: var(--lh-snug);
}

.gev-panel-body {
  display: grid;
  gap: var(--space-lg);
  min-width: 0;
}

.gev-panel-body > h2 {
  margin: 0;
  font-size: var(--fs-20);
  line-height: var(--lh-snug);
}

.gev-rates {
  display: grid;
  gap: var(--space-lg);
  padding-top: var(--space-xl);
  border-top: 1px solid var(--border);
}

.gev-rates h3 {
  margin: 0;
  font-size: var(--fs-16);
}

.gev-rates p {
  margin: 0;
}

.gev-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3xl);
}

.gev-toggle-row > div {
  display: grid;
  gap: var(--space-2xs);
  min-width: 0;
}

.gev-toggle-row p {
  margin: 0;
}

.gev-toggle-row > gk-toggle {
  flex: none;
}

.gev-code {
  max-width: 12rem;
  letter-spacing: var(--ls-caps);
  font-variant-numeric: tabular-nums;
}

/* Group enquiries off: one empty state and the switch under it, shown only while capture is off. */
.gev-off {
  display: grid;
  justify-items: center;
  gap: var(--space-lg);
  text-align: center;
}

.gev-off__switch {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-md);
}

/* The stage-gated board. The service owns the workflow invariants; this view owns the board, the
   cards and the detail drawer. The board scrolls inside its own region, so the box that holds it
   must be allowed to shrink below the width of its columns. */
.gev [data-gev="entries"] {
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  /* The wide board must never size the page: it scrolls inside this box. */
  contain: inline-size;
}

/* The board: a column per stage side by side, scrolling inside its own box; stacked on a phone. */
.gev { container: gev / inline-size; }
.gev-board {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(16rem, 1fr);
  align-items: start;
  gap: var(--space-lg);
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}
@container gev (max-width: 720px) {
  .gev-board {
    grid-auto-flow: row;
    grid-auto-columns: minmax(0, 1fr);
    overflow-x: visible;
  }
}

.gev-column__header {
  display: grid;
  gap: var(--space-xs);
}

/* The stage is a plain heading with its count; no pill. */
.gev-column__title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-sm);
  margin: 0;
  font-size: var(--fs-14);
  font-weight: var(--fw-title);
}

.gev-column__count {
  color: var(--text-muted);
  font-weight: 400;
}

.gev-quiet { color: var(--text-muted); }
.gev-late { color: var(--warning-text); }

.gev-column__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  color: var(--text-muted);
  font-size: var(--fs-12);
}

.gev-card[data-moving="true"] {
  opacity: .5;
  pointer-events: none;
}

.gev-card__body {
  display: grid;
  gap: var(--space-md);
}

.gev-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-sm);
}

.gev-card__top > div {
  display: grid;
  gap: var(--space-2xs);
  min-width: 0;
}

.gev-card__kind,
.gev-card__meta {
  color: var(--text-muted);
  font-size: var(--fs-12);
}

/* Event types arrive as stored words ("society"); show them in sentence case. */
.gev-card__kind {
  display: inline-block;
}

.gev-card__kind::first-letter {
  text-transform: uppercase;
}

.gev-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}

.gev-card__meta span + span::before {
  margin-right: var(--space-xs);
  content: "\2022";
}

.gev-load-more {
  display: flex;
  justify-content: center;
  margin-top: var(--space-md);
}

.gev-list__customer {
  display: grid;
  gap: var(--space-3xs);
}

.gev-list__customer span,
.gev-list__request,
.gev-list__status-detail {
  color: var(--text-muted);
  font-size: var(--fs-12);
  line-height: var(--lh-snug);
}

.gev-list__request,
.gev-list__status {
  display: grid;
  gap: var(--space-3xs);
}

.gev-list__status {
  justify-items: start;
}

/* The selected enquiry stays identifiable while its inspector is open. */
.gev-card[data-gev-selected="true"] {
  outline: var(--focus-outline-width, 2px) solid var(--accent);
  outline-offset: -2px;
}

.gev [data-gev-selected="true"] > td {
  background: var(--primary-surface);
}

.gev-drawer[data-transition="true"] .gev-section--workflow {
  outline: var(--focus-outline-width) solid var(--accent);
  border-radius: var(--radius-card);
}

.gev-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
  gap: var(--space-lg);
}

.gev-form-grid__wide {
  grid-column: 1 / -1;
}

.gev-form-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-md);
  margin-top: var(--space-xl);
}

.gev-form-actions__status {
  flex: 1 1 100%;
  min-height: calc(var(--fs-12) * var(--lh-snug));
}

.gev-detail {
  display: grid;
  gap: var(--space-md);
  container-type: inline-size;
}

.gev-detail__title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-md);
}

.gev-detail__title-row h3 {
  margin: 0;
  font-size: var(--fs-20);
  line-height: var(--lh-snug);
  overflow-wrap: anywhere;
}

.gev-detail__context {
  display: grid;
  grid-template-columns: minmax(min(100%, 12rem), .75fr) minmax(0, 1.8fr);
  gap: var(--space-lg);
  margin-top: var(--space-lg);
}

.gev-detail__context > div {
  min-width: 0;
}

.gev-detail__label {
  display: block;
  margin-bottom: var(--space-xs);
  color: var(--text-muted);
  font-size: var(--fs-12);
  font-weight: 600;
}

.gev-contact {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
}

.gev-contact a {
  font-weight: 600;
  overflow-wrap: anywhere;
}

.gev-request {
  color: var(--text-muted);
  line-height: var(--lh-relaxed);
  white-space: pre-line;
}

.gev-detail__workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-md);
}

.gev-section__head {
  display: flex;
  align-items: flex-start;
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
}

.gev-section__head h3,
.gev-section__head p {
  margin: 0;
}

.gev-section__head h3 {
  font-size: var(--fs-16);
}

.gev-section__head p {
  margin-top: var(--space-2xs);
  color: var(--text-muted);
  font-size: var(--fs-13);
}

.gev-section gk-collapse {
  margin-top: var(--space-md);
}

.gev-version {
  display: grid;
  gap: var(--space-sm);
  padding: var(--space-lg) 0;
  border-bottom: 1px solid var(--border);
}

.gev-version:first-child {
  padding-top: 0;
}

.gev-version h4 {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin: 0;
  font-size: var(--fs-14);
}

.gev-version p {
  margin: 0;
}

.gev-line-card {
  display: block;
  margin-bottom: var(--space-lg);
}

.gev-reply-form {
  display: grid;
  gap: var(--space-lg);
}

.gev-email-history {
  display: grid;
  gap: var(--space-lg);
}

.gev-email-history h4,
.gev-email-history p {
  margin: 0;
}

.gev-feed {
  display: grid;
  gap: var(--space-md);
  margin: 0;
  padding: 0;
  list-style: none;
}

.gev-comments {
  margin-bottom: var(--space-lg);
}

.gev-feed__subject {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-md);
}

.gev-feed__subject strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.gev-feed__meta {
  margin: var(--space-xs) 0 var(--space-md);
  color: var(--text-muted);
  font-size: var(--fs-12);
  overflow-wrap: anywhere;
}

.gev-feed__body {
  margin: 0;
  font-size: var(--fs-13);
  line-height: var(--lh-normal);
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.gev-note {
  margin: 0 0 var(--space-lg);
  color: var(--text-muted);
  font-size: var(--fs-12);
  line-height: var(--lh-normal);
}

.gev-requirements {
  display: grid;
  gap: var(--space-sm);
}

.gev-requirements:empty {
  display: none;
}

.gev-requirements p {
  margin: 0;
  font-size: var(--fs-12);
  font-weight: 700;
}

.gev-requirements__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  margin: 0;
  padding: 0;
  list-style: none;
}

.gev-document .admin-support-details dd { margin-inline-start: 0; overflow-wrap: anywhere; }
.gev-document .admin-support-details code { white-space: pre-wrap; }
.gev-document iframe {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-height: 40rem;
  border: 1px solid var(--border);
  background: var(--card);
}

.gev-audit__status[data-status="sent"] {
  color: var(--success-text);
}

.gev-audit__status[data-status="failed"] {
  color: var(--danger-text);
}

@container (max-width: 560px) {
  .gev-detail__context {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 720px) {
  .gev-heading {
    align-items: center;
  }
}

/* Settings: a field is as wide as what is typed or chosen in it. */
.gev [data-gev="settings-body"] gk-field:has(input[type="number"]) {
  max-width: var(--control-width-md);
}

.gev [data-gev="settings-body"] gk-field:has(select) {
  max-width: var(--control-width-lg);
}

/* A card's facts: a muted label over its value, so a status pill never shares a narrow card's row with its label. */
.gev-card {
  --card-pad: var(--space-2xl);
}

.gev-card__facts {
  display: grid;
  gap: var(--space-md);
  margin: 0;
}

.gev-card__fact {
  display: grid;
  gap: var(--space-2xs);
  min-width: 0;
}

.gev-card__fact dt {
  color: var(--text-muted);
  font-size: var(--fs-12);
}

.gev-card__fact dd {
  margin: 0;
  font-size: var(--fs-14);
  overflow-wrap: anywhere;
}

.gev-card__fact gk-badge {
  max-width: 100%;
}

/* Delete is a quiet danger action at the far end, away from Save. */
.gev-delete {
  --btn-link-color: var(--danger-text);
  margin-inline-start: auto;
}

/* Settings sections are ruled apart by their own recipe. */
.gev-settings {
  display: block;
}

.gev-settings__save {
  justify-content: flex-end;
  margin-top: var(--space-2xl);
}
