/* Modify court dialog on training venue detail page (#130) */
.modify-court-dialog {
  width: min(56rem, calc(100vw - 2rem));
}

/* Per-weekday weekly slots list on venue detail page (#130) */
.weekday-slot-list {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  line-height: 1.35;
}

.weekday-slot-row {
  white-space: nowrap;
}

.weekday-slot-day {
  font-weight: var(--meta-strong-weight);
}

/* Consistent breathing room above an action row that follows a table or
   the venue panel's last form field, per #123 decision 23. */
.panel-action-row {
  margin-top: var(--space-4);
  margin-bottom: var(--space-5);
}

.panel-heading-gap {
  margin-top: var(--space-7);
}

/* A gap separating one form field group from the previous one, e.g. the
   attribute form's Visibility group from Name (#123 decision 23). */
.form-field-gap {
  margin-top: var(--space-6);
}

/* Weekly Timetable Grid (#115). .table-scroll already provides the
   horizontal scrolling; these rules shape the grid itself and keep the
   page controls and dialogs outside the scrolled region. */
.timetable-scroll table {
  min-width: 48rem;
}

.timetable-scroll td,
.timetable-scroll th {
  vertical-align: top;
}

.weekday-row th {
  text-align: left;
  font-weight: var(--meta-strong-weight);
  background: var(--color-surface-muted, rgba(127, 127, 127, 0.08));
}

.slot-none {
  background: repeating-linear-gradient(
    45deg,
    transparent,
    transparent 6px,
    rgba(127, 127, 127, 0.06) 6px,
    rgba(127, 127, 127, 0.06) 12px
  );
}

.slot-team {
  display: block;
  font-weight: var(--meta-strong-weight);
}

.slot-meta {
  display: block;
  font-size: 0.8125rem;
  color: var(--color-text-muted, #555);
}

/* Team page action row inside a table cell (#115). */
.allocation-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

/* Archive confirmation's freed-allocation list (#115). */
.archive-allocation-list li {
  margin-bottom: 0.5rem;
}

.archive-allocation-list .slot-meta {
  display: block;
}

/* Week navigation row on the timetable. */
.week-nav {
  align-items: center;
}

/* ==========================================================================
   Phase D — internal club records (#117): one venue's contacts, costs and
   invoices on /training/venues/<id>/internal. Scoped to the page wrapper so
   the side-by-side form rule never changes any other screen's layout.
   ========================================================================== */

.venue-records > h2 {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.record-group {
  margin-top: 1.25rem;
}

.record-group-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.record-group-heading h3 {
  margin: 0;
}

.record-table td {
  white-space: normal;
}

/* Inactive subsection heading under the Active / All filter. */
.record-state-heading {
  margin: 0.9rem 0 0.4rem;
  font-size: 1rem;
}

.record-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin: 1rem 0;
}

.record-filter-label {
  margin-right: 0.25rem;
  font-weight: var(--meta-strong-weight);
}

.record-filter button[aria-pressed="true"] {
  background: var(--md-sys-color-primary);
  color: var(--md-sys-color-on-primary);
}

.venue-records .empty-state {
  margin: 0.75rem 0;
  color: var(--md-sys-color-on-surface-variant);
  font-size: var(--meta-size);
}

/* Row actions carry up to three controls (Edit + a state form); they must
   wrap rather than clip or push the page sideways. */
.venue-records .row-actions {
  flex-wrap: wrap;
}

.venue-records .row-actions button {
  white-space: nowrap;
}

.venue-records .row-actions form {
  display: inline-flex;
  margin: 0;
}

/* Validation messages stay under their own input: the Amount/Period and
   Issued on/Amount rows are side-by-side, and a taller error must not drag
   the neighbouring field down with it. */
.internal-records-page .form-field-row {
  align-items: flex-start;
}

.internal-records-page .form-field-row .form-field {
  align-content: start;
}

/* The empty-state notices are single lines, not cards with their own
   heading, so keep them quiet inside the records panel. */

@media (max-width: 767px) {
  /* Stacked card rows come from .table-scroll.table-stack; nothing here
     needs a horizontal scroll. */
  .record-filter {
    margin: 0.75rem 0;
  }
}