/*
 * Coach screens (wagon 3.3, 30/09/2026). Loaded by coach_base.html only,
 * after tokens.css, tokens-marca.css, app.css, telas.css and da.css.
 *
 * Every value here is a token of tokens.css or tokens-marca.css: no colour,
 * no family, no radius of its own. The coach reads on the same dark theme
 * as the member, with the same two families: Archivo for every word,
 * Azeret Mono (.dado) for a figure only (an hour, a date, a value).
 *
 * What the coach screens have and the member does not: a shell that
 * widens to the studio tablet and opens on two columns from 768 px, the
 * day header, the session cards, the neutral alert list, the sober perfil
 * line. Nothing here is a badge, a coloured button or a glyph.
 */

/* ============================================================
   Shell
   ============================================================ */

/* The member column is a phone (430 px). The coach also reads on the
   tablet of the studio: the column follows the viewport up to 1040 px,
   and the day screen opens on two columns from 768 px (below). */
.app-coquilha--coach {
  max-width: 1040px;
}

/* ============================================================
   Header of the coach screens
   ============================================================ */

/* A single row: identity on the left (papel in .rotulo, name in text: a
   name is a word, never a figure), actions on the right (« Modo aluno »
   in .link-discreto, Sair in .botao-fantasma). `wrap`: at 390 px, a long
   name drops down instead of crushing the two touch targets. */
.coach-cabecalho {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: var(--espaco-curto);
  padding-bottom: var(--espaco-curto);
  border-bottom: 1px solid var(--marca-linha);
  margin-bottom: var(--espaco-medio);
}

.coach-cabecalho__nome {
  font-family: var(--fonte-texto);
  font-weight: 600;
  font-size: var(--tamanho-corpo);
  color: var(--marca-texto);
}

.coach-cabecalho__acoes {
  display: flex;
  align-items: center;
  gap: var(--espaco-medio);
}

/* ============================================================
   Words and figures
   ============================================================ */

/* A value that is a WORD (a state, a name, a label served by the
   platform): Archivo, medium weight, text tone. Its counterpart for a
   figure is .dado (app.css), mono. */
.coach-texto {
  font-family: var(--fonte-texto);
  font-weight: 500;
  font-size: var(--tamanho-corpo);
  line-height: var(--altura-corpo);
  color: var(--marca-texto);
}

/* Abordagem, objetivo and envolvimento on one line, separated by a middle
   dot: « Suave · Reabilitação · Envolvido ». No outline, no colour per
   value: the word carries the meaning. */
.coach-perfil {
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-etiqueta);
  line-height: 1.4;
  color: var(--marca-texto-secundario);
}

/* ============================================================
   Day screen: navigation, filters, blocks
   ============================================================ */

/* Three links of equal width, 44 px target. The displayed day carries
   aria-current server side AND the accent ring: never colour alone. */
.coach-dias {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--espaco-micro);
  margin-bottom: var(--espaco-curto);
}

.coach-dias__item {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border: 1px solid var(--marca-texto-atenuado);
  border-radius: var(--raio-pequeno);
  background: var(--marca-superficie-cartao-2);
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-corpo);
  color: var(--marca-texto);
  text-decoration: none;
}

.coach-dias__item--atual {
  box-shadow: inset 0 0 0 3px var(--marca-acento-secundario);
  background: var(--marca-acento-claro);
  font-weight: 700;
}

/* Date and unit folded behind the 44 px gatilho of .dobra (the same
   component as the sugestoes). Open, the form is one row that wraps at
   390 px, the « Ver » button closing it (GET submission, no script). */
.coach-filtros {
  margin-bottom: var(--espaco-curto);
}

.coach-filtros__corpo {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--espaco-curto);
}

.coach-filtros__campo {
  display: flex;
  flex-direction: column;
  gap: var(--espaco-nano);
  flex: 1 1 140px;
}

/* Wagon A41, the agenda's selectors: the row this comment above describes.
   .dobra__corpo (telas.css) lays its children in a column, which
   .coach-filtros__corpo never undid: open, each field stood 140 px high on
   the right. Wagon A42: the day's filter of Hoje takes it too, under
   « Pessoas » only (coach_hoje.html); the legacy frame keeps its render. */
.coach-filtros__corpo--linha {
  flex-direction: row;
}

/* Wagon A42, visual review at 430 px: an equal 140 px share cut « Todas as
   unidades » under the select's chevron. In the row, a field starts from
   its own width and grows; what does not fit goes to the next line (a
   select keeps shrinking only when it is wider than the whole row). */
.coach-filtros__corpo--linha .coach-filtros__campo {
  flex: 1 1 auto;
}

/* Same rule as the .formulario fields (44 px, same tokens): the native
   rendering of a date field and a select measured 31.5 px and 27 px
   high, below the 44 px floor and below 16 px of text. */
.coach-filtros input[type="date"],
.coach-filtros select {
  min-height: 44px;
  padding: 0 var(--espaco-curto);
  border: 1px solid var(--marca-linha-alta);
  border-radius: var(--raio-pequeno);
  background: var(--marca-superficie-cartao);
  color: var(--marca-texto);
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-corpo);
}

.coach-filtros .botao {
  flex: 0 0 auto;
  width: auto;
  min-height: 44px;
  padding: 0 var(--espaco-medio);
}

.coach-sugestoes {
  margin-bottom: var(--espaco-curto);
}

.coach-sugestoes__lista {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--espaco-curto);
}

/* The day itself. One column on the phone; from 768 px the next session
   and its participants stand on the left, in large, and the lists of the
   day on the right (see the media query at the end of this file). */
.coach-dia {
  display: block;
}

.coach-bloco {
  margin-bottom: var(--espaco-largo);
}

.coach-bloco__titulo {
  display: flex;
  align-items: baseline;
  gap: var(--espaco-micro);
  font-family: var(--fonte-display);
  font-size: var(--tamanho-corpo);
  font-weight: 700;
  color: var(--marca-texto);
  margin-bottom: var(--espaco-curto);
}

/* Discrete counter: the muted tint of .rotulo, never a solid badge. */
.coach-contador {
  font-size: var(--tamanho-etiqueta);
  font-weight: 600;
  color: var(--marca-texto-atenuado);
  font-variant-numeric: tabular-nums;
}

.coach-vazio {
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-corpo);
  color: var(--marca-texto-atenuado);
  margin-bottom: var(--espaco-largo);
}

/* ============================================================
   The next session, in large
   ============================================================ */

/* The same surface as the member's home plate (.plate, da.css): a quiet
   card, the hour as the hero figure (Archivo widened, .numero-heroi),
   one line of meta, then the participants. Amber for the session in
   progress only (the imminence state of the tokens), nothing else is
   coloured. */
.coach-proxima {
  padding: var(--espaco-medio);
  margin-bottom: var(--espaco-largo);
  border: 1px solid var(--marca-linha);
  border-radius: var(--raio-grande);
  background: var(--marca-superficie-cartao);
}

.coach-proxima__cabecalho {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--espaco-curto);
}

.coach-proxima__cabecalho .plate-rotulo {
  margin-bottom: 0;
}

/* Same tone and size as .plate-state (imminence), without its dot. */
.coach-proxima__estado {
  font-family: var(--fonte-texto);
  font-weight: 600;
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-disc-amarelo);
}

.coach-proxima .numero-heroi {
  margin-top: var(--espaco-micro);
}

.coach-proxima__meta {
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-etiqueta);
  line-height: 1.5;
  color: var(--marca-texto-secundario);
  margin-top: var(--espaco-micro);
}

/* The participants: one block each, separated by a hairline, the name
   larger than any card title (this is what the coach reads first). */
.coach-participantes {
  list-style: none;
  margin: var(--espaco-medio) 0 0;
  padding: 0;
}

.coach-participante {
  display: flex;
  flex-direction: column;
  gap: var(--espaco-micro);
  padding: var(--espaco-curto) 0;
  border-top: 1px solid var(--marca-linha);
}

.coach-participante__nome {
  font-family: var(--fonte-display);
  font-weight: 700;
  font-size: var(--tamanho-h2);
  line-height: var(--altura-h2);
  color: var(--marca-texto);
  text-decoration: none;
}

/* One line, wrapped when it must: the segments are separated by a
   middle dot drawn in CSS with margins on both sides (a typed space
   would collapse at a line break), so nothing is typed between them. */
.coach-participante__linha {
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-etiqueta);
  line-height: 1.5;
  color: var(--marca-texto-secundario);
}

.coach-participante__segmento + .coach-participante__segmento::before {
  content: "\00b7";
  margin: 0 0.4em;
  color: var(--marca-texto-atenuado);
}

.coach-participante__linha .dado {
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto);
}

.coach-participante__estado {
  font-family: var(--fonte-texto);
  font-weight: 600;
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-sucesso-texto);
}

.coach-participante__gesto .botao {
  width: auto;
  align-self: flex-start;
  min-width: 160px;
}

.coach-participante__recusa {
  margin-bottom: var(--espaco-micro);
}

.coach-participante__ligacao {
  width: auto;
  align-self: flex-start;
}

.coach-proxima__deixar {
  margin-top: var(--espaco-curto);
  display: flex;
  justify-content: flex-end;
}

/* ============================================================
   Session card
   ============================================================ */

/* `position: relative` anchors the stretched link: the whole card is
   tappable WITHOUT a <form> inside an <a> (HTML forbids it). Tighter
   padding than .cartao: several fit on screen for one day. */
.coach-cartao {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--espaco-micro);
  padding: var(--espaco-curto);
  margin-bottom: var(--espaco-curto);
}

.coach-cartao__hora {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--espaco-micro);
}

.coach-cartao__titulo {
  font-family: var(--fonte-display);
  font-size: var(--tamanho-corpo);
  font-weight: 700;
  color: var(--marca-texto);
}

/* Stretched link: the ::after covers the whole card; the gestures below
   come back on top through z-index. Maximum target, valid HTML. */
.coach-cartao__ligacao {
  color: var(--marca-texto);
  text-decoration: none;
}

.coach-cartao__ligacao::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--raio-grande);
}

.coach-cartao__ligacao:focus-visible::after {
  outline: var(--foco-largura) solid var(--marca-acento-texto);
  outline-offset: -3px;
}

/* The actions row is a full width block raised above the stretched
   link: it lets the pointer through, only its button takes it back. */
.coach-cartao__acoes {
  position: relative;
  z-index: 1;
  pointer-events: none;
}

.coach-cartao__acoes .botao {
  pointer-events: auto;
  width: auto;
  align-self: flex-start;
  padding: 0 var(--espaco-medio);
}

.coach-cartao__estado {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--espaco-micro);
}

.coach-cartao__estado .coach-texto {
  font-size: var(--tamanho-etiqueta);
  font-weight: 600;
}

/* The three check-in values, compact: the field name, the figure, the
   label. Two gutters: rows at 8 px, columns at 14 px, so the triplet
   still reads as a group when it wraps at 390 px. */
.coach-checkin-valores {
  display: flex;
  flex-wrap: wrap;
  gap: var(--espaco-micro) var(--espaco-curto);
}

.coach-checkin-valor {
  display: inline-flex;
  align-items: baseline;
  gap: var(--espaco-nano);
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto-secundario);
}

.coach-checkin-valor__campo {
  font-weight: 600;
}

.coach-checkin-valor .dado {
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto);
}

/* A declared pain is information, in the text tone: red is kept for the
   cancellation alone. */
.coach-dor {
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-etiqueta);
  font-weight: 600;
  color: var(--marca-texto);
}

/* ============================================================
   Alerts: a list, a neutral bar, the severity written
   ============================================================ */

/* One item per alert, on the card as on the sheets. The bar on the left
   is the muted text tone whatever the severity (TextoAtenuado on the
   card surface, 4.54:1, and on the page, 5.07:1: both pairs already
   verified by scripts/contrast_check.py). The severity is a WORD, then
   the text, all of it visible: no fold, no button, no colour. */
.coach-alertas {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--espaco-micro);
}

.coach-alerta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--espaco-nano) var(--espaco-micro);
  padding: 2px 0 2px var(--espaco-curto);
  border-left: 2px solid var(--marca-texto-atenuado);
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-etiqueta);
  line-height: 1.4;
  color: var(--marca-texto);
}

.coach-alerta__severidade {
  font-weight: 600;
  color: var(--marca-texto-secundario);
}

/* ============================================================
   Mini trend: points drawn server side, no library
   ============================================================ */

.coach-tendencias {
  position: relative;
}

.coach-tendencias__gatilho {
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto-secundario);
}

.coach-tendencias__corpo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--espaco-curto);
  padding-bottom: var(--espaco-micro);
}

.coach-tendencia__valores {
  font-size: var(--tamanho-etiqueta);
}

.coach-tendencia-item {
  display: inline-flex;
  align-items: center;
  gap: var(--espaco-micro);
}

/* AcentoSecundario on the card surface: 4.73:1, above the 3:1 floor of a
   non-text component. */
.coach-tendencia {
  width: 72px;
  height: 24px;
  fill: var(--marca-acento-secundario);
}

/* ============================================================
   Session sheet and aluno sheet
   ============================================================ */

.coach-voltar {
  margin-bottom: var(--espaco-curto);
}

.coach-seccao {
  margin-bottom: var(--espaco-largo);
}

.coach-seccao > h2 {
  font-family: var(--fonte-display);
  font-size: var(--tamanho-h1);
  margin-bottom: var(--espaco-micro);
}

/* Label / value row: on one line while it fits, one under the other at
   390 px rather than breaking a word. */
.coach-linha {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--espaco-nano) var(--espaco-micro);
  margin-bottom: var(--espaco-micro);
}

.coach-valores {
  list-style: none;
  margin: 0 0 var(--espaco-curto);
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--espaco-micro);
}

.coach-valor {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--espaco-nano) var(--espaco-micro);
  padding-bottom: var(--espaco-micro);
  border-bottom: 1px solid var(--marca-linha);
}

/* Free text of the aluno or of the coach: never on a single line. */
.coach-nota {
  white-space: pre-line;
}

.coach-bandeira {
  margin-top: var(--espaco-curto);
  padding: var(--espaco-curto);
}

.coach-bandeira .aviso-mensagem {
  margin-bottom: var(--espaco-curto);
}

/* The banner is a .cartao, the same surface .botao-secundario carries:
   its only action read as bold text with no boundary. The outline takes
   TextoAtenuado, the component floor already used by .escala__botao. */
.coach-bandeira .botao-secundario {
  background: var(--marca-fundo-pagina);
  border-color: var(--marca-texto-atenuado);
}

.coach-preencher {
  margin-top: var(--espaco-curto);
}

.coach-acoes {
  margin-top: var(--espaco-curto);
}

/* Closing guard: the sentence and the link to the check-in, grouped
   just above the presenca choice. */
.coach-guarda {
  margin-bottom: var(--espaco-curto);
}

.coach-guarda .aviso-mensagem {
  margin-bottom: var(--espaco-micro);
}

/* Attendance option disabled by the closing guard: the label follows the
   greyed dot, so the state reads at 390 px. The guard sentence stays
   above the group: colour never carries the meaning alone. (The option
   labels of a form keep .dado, the field-label role the tokens give the
   mono family; a served VALUE is what .coach-texto is for.) */
.formulario__linha input:disabled + .dado {
  color: var(--marca-texto-atenuado);
}

/* History of the aluno sheet: one entry carries several label / value
   rows, so it cannot be a single .coach-valor row. */
.coach-historico {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--espaco-curto);
}

.coach-historico__item {
  padding-bottom: var(--espaco-curto);
  border-bottom: 1px solid var(--marca-linha);
}

.coach-historico__item .coach-valor {
  padding-bottom: 0;
  border-bottom: 0;
}

/* ============================================================
   From 768 px: the day on two columns
   ============================================================ */

@media (min-width: 768px) {
  .coach-dia {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 4fr);
    gap: var(--espaco-largo);
    align-items: start;
  }

  /* No next session (a past day, a day already done, a planner who holds
     no session): the lists take the whole width and each block lays its
     cards on two columns, the title across both. */
  .coach-dia__lista:only-child {
    grid-column: 1 / -1;
  }

  .coach-dia__lista:only-child .coach-bloco {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--espaco-curto);
    align-items: start;
  }

  .coach-dia__lista:only-child .coach-bloco__titulo,
  .coach-dia__lista:only-child .coach-bloco > .rotulo {
    grid-column: 1 / -1;
    margin-bottom: 0;
  }

  .coach-dia__lista:only-child .coach-cartao {
    margin-bottom: 0;
  }
}

/* ============================================================
   Numbered scales of the coach forms
   ============================================================ */

/* telas.css keeps the legend of a numbered scale small and muted, because
   on the member side that variant only dresses secondary questions
   (intensity, fatigue). On the coach forms the numbered boxes carry the
   MAIN questions: the legend takes the body size and the text tone, as
   the emoji variant does for the member. The fatigue questions, folded
   inside .dobra__corpo, keep the secondary legend. */
.formulario--checkin > .escala--numeros > legend,
.formulario--registo .escala--numeros > legend {
  font-size: var(--tamanho-corpo);
  font-weight: 600;
  color: var(--marca-texto);
}

/* ============================================================
   The offline write queue (coach.js)
   ============================================================ */

/* A line on the page background, between two hairlines: how many writes
   wait for the network, and the ones to review with the platform's
   sentence. TextoSecundario and RecusaTexto on FundoPagina, both pairs
   already verified by scripts/contrast_check.py. */
.coach-fila {
  padding: var(--espaco-curto) 0;
  border-top: 1px solid var(--marca-linha);
  border-bottom: 1px solid var(--marca-linha);
  margin-bottom: var(--espaco-medio);
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-etiqueta);
  line-height: 1.5;
  color: var(--marca-texto-secundario);
}

.coach-fila__contagem {
  font-weight: 600;
  color: var(--marca-texto);
}

.coach-fila__rever {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--espaco-micro) var(--espaco-curto);
  margin-top: var(--espaco-micro);
  color: var(--marca-recusa-texto);
}

.coach-fila__esquecer {
  min-height: 36px;
  padding: 0 var(--espaco-curto);
}

/* The answer of a write sent by fetch, in place, above its form: the
   platform's sentence on a refusal, the queue notice without network. */
.coach-escrita__estado {
  margin-bottom: var(--espaco-curto);
}

/* ============================================================
   Wagon A41 (01/10/2026): the coach's operation screens
   ============================================================ */

/* The tabs, under the header: Hoje, Agenda, Membros, Tarefas, only those
   whose flag is on (app/coach/sessao.abas_coach). Words, the current one
   in the accent tone, bold and underlined: never colour alone. */
.coach-abas {
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--espaco-largo);
  padding: 0 var(--espaco-medio);
  border-bottom: 1px solid var(--marca-linha);
}

.coach-abas__item {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-corpo);
  color: var(--marca-texto-secundario);
  text-decoration: none;
}

.coach-abas__item[aria-current="page"] {
  color: var(--marca-acento-texto);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 6px;
}

/* The fill of a slot: « 2 de 3 » and the level in words, beside a sober
   shape (one square per place, the booked ones filled; a bar beyond eight
   places). The shape repeats the words, it never carries them alone. */
.coach-lugares {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--espaco-nano) var(--espaco-micro);
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-etiqueta);
  line-height: 1.4;
  color: var(--marca-texto-secundario);
}

.coach-lugares__caixas {
  display: inline-flex;
  gap: 3px;
}

.coach-lugares__caixa {
  display: inline-block;
  width: 12px;
  height: 12px;
  border: 1px solid var(--marca-texto-atenuado);
}

.coach-lugares__caixa--cheia {
  border-color: var(--marca-texto);
  background: var(--marca-texto);
}

.coach-lugares__barra {
  display: inline-block;
  width: 96px;
  height: 10px;
  border: 1px solid var(--marca-texto-atenuado);
}

.coach-lugares__cheio {
  display: block;
  height: 100%;
  background: var(--marca-texto);
}

.coach-lugares__texto {
  font-variant-numeric: tabular-nums;
  color: var(--marca-texto);
}

.coach-lugares[data-preenchimento="completo"] .coach-lugares__nivel {
  font-weight: 700;
  color: var(--marca-texto);
}

/* The grid of a day, the coach's week: one line a slot, the whole line a
   link to the slot (44 px and more). The hour first, the professional
   under it, the fill on the right. */
.coach-grelha,
.coach-linhas {
  list-style: none;
  margin: 0 0 var(--espaco-largo);
  padding: 0;
}

.coach-slot__ligacao {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: var(--espaco-curto);
  row-gap: 2px;
  align-items: center;
  min-height: 44px;
  padding: var(--espaco-curto) 0;
  border-bottom: 1px solid var(--marca-linha);
  color: var(--marca-texto);
  text-decoration: none;
}

.coach-slot__hora,
.coach-slot__quem,
.coach-slot__sub {
  grid-column: 1;
  min-width: 0;
}

.coach-slot__hora {
  font-family: var(--fonte-display);
  font-weight: 700;
  font-size: var(--tamanho-h2);
  font-variant-numeric: tabular-nums;
}

.coach-slot__quem {
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-corpo);
}

.coach-slot__quem--sem,
.coach-slot__sub {
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto-secundario);
}

.coach-slot .coach-lugares {
  grid-column: 2;
  grid-row: 1 / span 3;
  display: grid;
  justify-items: end;
  text-align: right;
}

/* From 768 px, one dense row like a sheet's: the hours, the professional
   (its type, its unit under it), then the fill in three columns of fixed
   width (the shape, « 4 de 6 », the level), so every row has the same
   tracks and the columns align from one slot to the next; packed to the
   left, the eye does not cross the frame to read a line. */
@media (min-width: 768px) {
  .coach-slot__ligacao {
    grid-template-columns: 10rem minmax(0, 16rem) auto;
    justify-content: start;
    column-gap: var(--espaco-largo);
  }

  .coach-slot__hora {
    grid-row: 1 / span 2;
  }

  .coach-slot__quem,
  .coach-slot__sub {
    grid-column: 2;
  }

  .coach-slot .coach-lugares {
    grid-column: 3;
    grid-row: 1 / span 2;
    grid-template-columns: 120px 4.5rem 5.5rem;
    justify-items: start;
    align-items: center;
    column-gap: var(--espaco-curto);
    text-align: left;
  }

  .coach-slot .coach-lugares__caixas,
  .coach-slot .coach-lugares__barra {
    grid-column: 1;
  }

  .coach-slot .coach-lugares__texto {
    grid-column: 2;
  }

  .coach-slot .coach-lugares__nivel {
    grid-column: 3;
  }
}

.coach-agenda__semana {
  margin: 0 0 var(--espaco-medio);
}

.coach-creneau__quem {
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-corpo);
  color: var(--marca-texto-secundario);
  margin-bottom: var(--espaco-micro);
}

.coach-creneau__lugares {
  margin-bottom: var(--espaco-largo);
}

.coach-nota {
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto-secundario);
  margin-bottom: var(--espaco-medio);
}

/* A booking, a waiting entry, a member, a task: dense lines like a sheet,
   the initials in the first column, every line of text in the second.
   Wagon A47 (D82): in their lists (.coach-linhas) only. Written on the bare
   class, the grid also took A33's label and value lines (p.coach-linha, a
   session's sheet, an aluno's history): 56 px right, each under a filet. */
.coach-linhas .coach-linha {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  column-gap: var(--espaco-curto);
  row-gap: 2px;
  align-content: start;
  padding: var(--espaco-curto) 0;
  border-bottom: 1px solid var(--marca-linha);
}

.coach-linhas .coach-linha > :not(.coach-iniciais) {
  grid-column: 2;
  min-width: 0;
}

.coach-linhas--sem-iniciais .coach-linha {
  grid-template-columns: minmax(0, 1fr);
}

.coach-linhas.coach-linhas--sem-iniciais .coach-linha > * {
  grid-column: 1;
}

.coach-iniciais {
  grid-column: 1;
  grid-row: 1 / span 4;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--marca-superficie-cartao-2);
  color: var(--marca-texto);
  font-family: var(--fonte-texto);
  font-weight: 600;
  font-size: 14px;
}

.coach-linha__nome {
  display: inline-block;
  justify-self: start;
  padding-block: 12px;
  margin-block: -12px;
  font-family: var(--fonte-texto);
  font-weight: 600;
  font-size: var(--tamanho-corpo);
  color: var(--marca-texto);
}

.coach-linha__titulo {
  padding-block: 0;
  margin-block: 0;
}

/* A link inside a line of text (a task's member): the line keeps its
   height, the target reaches 44 px. */
.coach-linha__titulo a {
  display: inline-block;
  padding-block: 10px;
  margin-block: -10px;
}

/* The same in a sub line, whose text is smaller (13 px, 14 px under
   « Pessoas », at 1.5): 13 px each side reach 44 px. Wagon A44: the
   reevaluation's text, the platform's, linked to the member's plan; in the
   line's quiet ink (not a gesture in the brand's colour), underlined as the
   discreet links are. */
.coach-linha__sub a {
  display: inline-block;
  padding-block: 13px;
  margin-block: -13px;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.coach-linha__sub {
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-etiqueta);
  line-height: 1.5;
  color: var(--marca-texto-secundario);
}

.coach-linha__segmento + .coach-linha__segmento::before {
  content: "\00b7\00a0";
  font-weight: 400;
  color: var(--marca-texto-secundario);
}

.coach-linha__segmento + .coach-linha__segmento {
  margin-left: 0.3em;
}

.coach-linha__forte {
  font-weight: 600;
  color: var(--marca-texto);
}

/* Wagon A45: a booking's acompanhamento, one dense line of segments (the
   plan, the last workout, the open one, the tasks). A segment goes to the
   next line whole, never a fact cut in two at 390 px; one longer than the
   line wraps inside itself. */
.coach-acompanhamento .coach-linha__segmento {
  display: inline-block;
  max-width: 100%;
}

.coach-linha__gestos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 var(--espaco-medio);
  margin-top: var(--espaco-nano);
}

.coach-linha__gestos form {
  margin: 0;
}

.coach-linha__gestos .botao {
  width: auto;
  margin-top: 0;
  padding: 0 var(--espaco-medio);
}

/* « Feita » and « Cancelar » are two forms side by side: the margin
   telas.css gives a second stacked button (form + form) would put one
   word 4 px under the other. */
.coach-linha__gestos .botao-fantasma {
  margin-top: 0;
}

/* « Cancelar reserva » asks once more, in place: the question and the
   confirming button open under the word (no script, a <details>). */
.coach-confirmar > summary {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  cursor: pointer;
  list-style: none;
}

.coach-confirmar > summary::-webkit-details-marker {
  display: none;
}

.coach-confirmar__corpo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--espaco-micro) var(--espaco-medio);
  padding: var(--espaco-micro) 0;
}

.coach-confirmar__corpo p {
  margin: 0;
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto);
}

.coach-confirmar__corpo .botao {
  width: auto;
  margin-top: 0;
  padding: 0 var(--espaco-medio);
}

/* A search: the field and its button on one line, the filters under it,
   one column's measure (480 px) in the wide frame. */
.coach-pesquisa {
  max-width: 480px;
  margin-bottom: var(--espaco-medio);
}

.coach-pesquisa__linha {
  display: flex;
  align-items: stretch;
  gap: var(--espaco-micro);
}

.coach-pesquisa__linha input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 44px;
}

.coach-pesquisa__linha .botao {
  flex: 0 0 auto;
  width: auto;
  margin-top: 0;
  padding: 0 var(--espaco-medio);
}

.coach-pesquisa__filtros {
  display: flex;
  flex-wrap: wrap;
  gap: var(--espaco-curto);
  margin-top: var(--espaco-curto);
}

.coach-pesquisa select {
  min-height: 44px;
}

/* Two words (Todos, Os meus acompanhados; As minhas, Criadas por mim),
   three for the task states: the same component as the day's words. */
.coach-dias--dois {
  grid-template-columns: repeat(2, 1fr);
}

.coach-paginas {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--espaco-medio);
  margin-bottom: var(--espaco-largo);
}

.coach-titulo-com-acao {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--espaco-curto);
  margin-bottom: var(--espaco-curto);
}

.coach-titulo-com-acao h1 {
  margin: 0;
}

.coach-titulo-com-acao .botao {
  width: auto;
  margin-top: 0;
  padding: 0 var(--espaco-medio);
}

.coach-membros__total {
  margin-bottom: var(--espaco-micro);
}

/* The directory from 1024 px: two members a row, in the order served
   (left to right, then down). */
@media (min-width: 1024px) {
  .coach-linhas--colunas {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--espaco-amplo);
  }
}

/* A choice among a few words (the task's type, its member): each option a
   44 px line, the native radio inside its label. */
.coach-escolha {
  border: 0;
  margin: 0 0 var(--espaco-medio);
  padding: 0;
}

.coach-escolha__opcao {
  display: flex;
  align-items: center;
  gap: var(--espaco-micro);
  min-height: 44px;
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-corpo);
  color: var(--marca-texto);
}

.coach-tarefa-nova {
  max-width: 480px;
}

/* The task's due date takes the field of the selects and of the search
   (44 px, the same padding and text): the native rendering left it
   narrow, its digits against the border. */
.coach-tarefa-nova input[type="date"],
.coach-tarefa-nova select {
  min-height: 44px;
}

.coach-tarefa-nova input[type="date"] {
  padding: 0 var(--espaco-curto);
  border: 1px solid var(--marca-linha-alta);
  border-radius: var(--raio-pequeno);
  background: var(--marca-superficie-cartao);
  color: var(--marca-texto);
  font-family: var(--fonte-texto);
  font-size: var(--tamanho-corpo);
}

/* Wagon A42: a member's training plan in the coach app. Its gestures in one
   row (« Ativar » the strongest, then « Novo esquema a partir deste »,
   « Arquivar » a word behind its confirmation), the way to all the plans
   under them; the plan's component (telas.css) denser: less air per
   exercise, and from 768 px each exercise on one row of the record sheet,
   the name and equipment on the left, the prescription, the setting and
   the note on the right, aligned from one exercise to the next. */
.coach-plano__gestos {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: var(--espaco-micro) var(--espaco-medio);
  margin: var(--espaco-curto) 0 0;
}

.coach-plano__gestos form {
  margin: 0;
}

.coach-plano__gestos .botao {
  width: auto;
  margin-top: 0;
  padding: 0 var(--espaco-medio);
}

.coach-plano__todos {
  margin: var(--espaco-micro) 0 0;
}

/* The sheet's plan section closes its one line on the way to all the
   plans: the list's own bottom margin would open a gap no other section
   of the sheet has. */
.coach-plano-ficha .coach-linhas {
  margin-bottom: 0;
}

.plano-variante--denso .plano-elemento {
  padding: var(--espaco-micro) 0;
}

@media (min-width: 768px) {
  .plano-variante--denso .plano-elemento__corpo {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    column-gap: var(--espaco-largo);
    align-items: baseline;
  }

  .plano-variante--denso .plano-elemento__nome,
  .plano-variante--denso .plano-elemento__equipamento {
    grid-column: 1;
  }

  .plano-variante--denso .plano-elemento__prescricao,
  .plano-variante--denso .plano-elemento__regulacao,
  .plano-variante--denso .plano-elemento__nota {
    grid-column: 2;
  }

  .plano-variante--denso .plano-elemento__nome {
    grid-row: 1;
  }

  .plano-variante--denso .plano-elemento__equipamento {
    grid-row: 2;
  }

  .plano-variante--denso .plano-elemento__corpo > .plano-elemento__prescricao {
    grid-row: 1;
    margin-top: 0;
  }
}

/* Wagon A43: the guided workout in the coach app (app/coach/treinos.py).
   The choice of the variant: one button per variant of the active plan, its
   exercises named under it in the secondary ink, one column's measure.
   The workout's page holds in one hand during the session: each exercise
   under a hairline, its number, its name and its state in words on one
   line; under the name, the prescription in weight, the last registos and
   their trend, then the fields of its metrics two by two (three from
   768 px), « Feito » a 44 px target, the note and « Guardar ». Closing it,
   « Finalizar o treino » the strongest, « Abandonar » a word, each opening
   its confirmation on the spot. */
.coach-treino-iniciar__linha,
.coach-treino__linha {
  margin: 0;
}

.coach-treino-iniciar__acao {
  max-width: 480px;
  margin: var(--espaco-medio) 0 0;
}

.coach-treino-variantes {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: 480px;
}

.coach-treino-variante {
  padding: var(--espaco-micro) 0 var(--espaco-curto);
}

.coach-treino-variante form {
  margin: 0;
}

.coach-treino-variante__botao {
  width: 100%;
  justify-content: space-between;
}

.coach-treino-variante__titulo {
  display: flex;
  justify-content: space-between;
  margin: 0;
  font-weight: 600;
}

.coach-treino-variante__conta {
  font-weight: 400;
  color: var(--marca-texto-atenuado);
}

.coach-treino-variante__nomes {
  margin: var(--espaco-nano) 0 0;
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto-atenuado);
}

.coach-treino-exercicios {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--marca-linha);
}

.coach-treino-exercicio {
  padding: var(--espaco-curto) 0 var(--espaco-medio);
  border-bottom: 1px solid var(--marca-linha);
  scroll-margin-top: var(--espaco-micro);
}

.coach-treino-exercicio__corpo {
  margin: 0 0 0 calc(28px + var(--espaco-micro));
}

.coach-treino-exercicio__leitura > p,
.coach-treino-registos > p {
  margin: 0;
}

.coach-treino-exercicio__cabeca {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  column-gap: var(--espaco-micro);
  align-items: baseline;
}

.coach-treino-exercicio__ordem {
  color: var(--marca-texto-atenuado);
  font-variant-numeric: tabular-nums;
}

.coach-treino-exercicio__nome {
  margin: 0;
  font-size: var(--tamanho-corpo);
  font-weight: 600;
  color: var(--marca-texto);
}

.coach-treino-exercicio__estado {
  margin: 0;
  color: var(--marca-texto-atenuado);
}

.coach-treino-exercicio__estado--feito {
  font-weight: 600;
  color: var(--marca-texto);
}

.coach-treino-exercicio__equipamento,
.coach-treino-exercicio__regulacao {
  color: var(--marca-texto-atenuado);
}

.coach-treino-exercicio__leitura > .coach-treino-exercicio__prescricao,
.coach-treino-exercicio__leitura > .coach-treino-exercicio__realizado {
  margin-top: var(--espaco-nano);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.coach-treino-exercicio__prescricao .rotulo,
.coach-treino-exercicio__realizado .rotulo {
  font-weight: 400;
}

.coach-treino-exercicio__leitura > .coach-treino-registos {
  margin-top: var(--espaco-micro);
}

.coach-treino-registos__lista {
  list-style: none;
  margin: 0;
  padding: 0;
}

.coach-treino-registo {
  font-variant-numeric: tabular-nums;
}

.coach-treino-registo__data {
  color: var(--marca-texto-atenuado);
}

.coach-treino-registo__nota {
  display: block;
  color: var(--marca-texto-atenuado);
}

.coach-treino-registo-form {
  max-width: 480px;
  margin-top: var(--espaco-curto);
}

/* The platform's 422 at its exercise: the line of a state, close to the
   fields it speaks of. */
.coach-treino-registo-form .aviso-mensagem {
  margin: 0 0 var(--espaco-micro);
}

.coach-treino-campos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--espaco-micro) var(--espaco-medio);
}

.coach-treino-campo {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  margin: 0;
}

.coach-treino-campo input {
  width: 100%;
  min-height: 44px;
}

.coach-treino-feito {
  display: inline-flex;
  align-items: center;
  gap: var(--espaco-micro);
  min-height: 44px;
  margin: var(--espaco-micro) 0 0;
  font-weight: 600;
  cursor: pointer;
}

.coach-treino-feito input {
  width: 22px;
  height: 22px;
  margin: 0;
}

.coach-treino-nota {
  margin: var(--espaco-micro) 0 0;
}

.formulario .coach-treino-nota textarea {
  width: 100%;
  min-height: 64px;
}

.coach-treino-nota__ajuda {
  display: block;
  margin-top: var(--espaco-nano);
  font-size: var(--tamanho-etiqueta);
  color: var(--marca-texto-atenuado);
}

.coach-treino-guardar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--espaco-micro) var(--espaco-medio);
  margin-top: var(--espaco-micro);
}

.coach-treino-guardar .botao {
  width: auto;
  margin-top: 0;
  padding: 0 var(--espaco-largo);
}

.coach-treino-guardar .coach-nota {
  margin: 0;
}

.coach-treino-fecho {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--espaco-micro);
  max-width: 480px;
  margin-top: var(--espaco-largo);
}

.coach-treino-finalizar {
  width: 100%;
}

.coach-treino-finalizar > summary.botao {
  display: flex;
  width: 100%;
}

/* Opened, the summary steps back: the confirmation's button is the one
   strong thing on the screen. */
.coach-treino-finalizar[open] > summary.botao-primario {
  background: transparent;
  color: var(--marca-texto);
  border-color: var(--marca-linha-alta);
}

.coach-treino-fecho__corpo {
  flex-direction: column;
  align-items: flex-start;
}

.coach-historico .p-tendencia {
  margin: 0 0 var(--espaco-medio);
}

/* From 768 px, the exercise's reading on the left, its form on the right:
   the previous values beside the fields they precede. */
@media (min-width: 768px) {
  .coach-treino-exercicio__corpo {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: var(--espaco-largo);
    align-items: start;
  }

  .coach-treino-registo-form {
    margin-top: 0;
  }

  /* Wagon A44: an exercise rebuilt from its form alone (the platform did
     not answer): nothing to read beside it, the form under its name. */
  .coach-treino-exercicios--formulario .coach-treino-exercicio__corpo {
    display: block;
  }

  .coach-treino-exercicios--formulario .coach-treino-registo-form {
    margin-top: var(--espaco-curto);
  }
}

/* UX pass (09/11/2026): the participant's name is the way into the sheet; it
   was a bold word without a visible target. A 48 px row with an arrow. */
.coach-participante__nome {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
}

.coach-participante__nome::after {
  content: "\203A";
  font-family: var(--fonte-mono);
  color: var(--marca-acento-texto);
}

.coach-voltar .link-discreto {
  min-width: 44px;
}
