/* Padrões compartilhados entre administração, professor e aluno. */
:root {
  --text-caption: 0.75rem;
  --text-small: 0.8125rem;
  --text-body: 0.9375rem;
  --text-section: 1.25rem;
  --text-title: clamp(1.75rem, 3vw, 2.25rem);
  --text-metric: clamp(1.5rem, 2.5vw, 2rem);
}
body { font-size: var(--text-body); }
button, input, select, textarea { font-family: var(--font); }
h1, .exercise-library .page-head h1 { font-size: var(--text-title); letter-spacing: -.035em; line-height: 1.2; }
h2, .h2, .library-heading h2 { font-size: var(--text-section); font-weight: 600; line-height: 1.3; letter-spacing: -.02em; }
h3, .h3, .trainer-head h3, .exercise-card h3 { font-size: 1.0625rem; font-weight: 600; line-height: 1.4; }
.small, .list-item .small, .field-hint { font-size: var(--text-small); }
.eyebrow { font-size: 0.6875rem; letter-spacing: .1em; }
.tag, .badge { font-size: var(--text-caption); line-height: 1.4; }
.btn, .text-link, .field > label { font-size: 0.875rem; }
.page-description { font-size: var(--text-body); line-height: 1.6; max-width: 80ch; }
.list-item-title { font-size: var(--text-body); }
.metric-value, .stat-card .metric-value, .admin-page .card > .h2 {
  font-size: var(--text-metric); font-weight: 600; line-height: 1.2;
  letter-spacing: -.035em; font-variant-numeric: tabular-nums;
  margin: 12px 0 8px; overflow-wrap: anywhere;
}
.wrap, .card, .grid > *, .exercise-form-grid > *, .page-head > * { min-width: 0; }
.grid { gap: 20px; }
.page-head { margin-bottom: 28px; }
.page-head h1 { overflow-wrap: anywhere; }
.page-head.row-between { flex-wrap: wrap; align-items: flex-start; gap: 20px; }
.page-head.row-between > div { flex: 1 1 260px; }
.card > h2, .card > h3 { margin-bottom: 16px; }
.card > p:last-child { margin-bottom: 0; }
.field > label { line-height: 1.5; }
.field > label > input, .field > label > select, .field > label > textarea { margin-top: 8px; }
.exercise-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.exercise-form-grid > .btn { align-self: end; justify-self: start; }
.exercise-form-grid > [data-erro] { grid-column: 1 / -1; }
.list-item-main > span { display: block; }
.list-item-main > span.row-between { display: flex; }
.list-item-main > .small { margin-top: 4px; }
.list-item .btn { flex-shrink: 0; }
.text-link { white-space: normal; }
:where(a, button, input, select, textarea, summary):focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }

/* Componentes administrativos antes presentes no HTML sem definição visual. */
.admin-page .mb-4 { margin-bottom: 24px; }
.admin-page .mt-4 { margin-top: 24px; }
.admin-page .mb-2 { margin-bottom: 8px; }
.admin-page .mt-2 { margin-top: 8px; }
.admin-page .ml-1 { margin-left: 4px; }
.admin-page .ml-2 { margin-left: 8px; }
.admin-page .m-0 { margin: 0; }
.admin-page .p-0 { padding: 0; }
.admin-page .p-3 { padding: 16px; }
.admin-page .p-4 { padding: 24px; }
.admin-page .card-header { padding-bottom: 16px; }
.admin-page .p-0 > .card-header { padding: 20px 24px; }
.admin-page .border-bottom { border-bottom: var(--border); }
.admin-page .card-header h2 { margin: 0; font-size: var(--text-section); }
.admin-page .card.p-0 { overflow: hidden; }
.admin-page > .card + p { margin-top: 16px; }
.admin-page .list-item-main > .eyebrow { margin-bottom: 6px; }
.admin-page > form, .admin-page > #resultado:not(:empty) { padding: 24px; background: white; border: var(--border); border-radius: var(--radius); }
.admin-page > #resultado .list-item:last-child { border-bottom: 0; }
.admin-page summary { cursor: pointer; min-height: 24px; }
.table-wrap { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
.table { width: 100%; border-collapse: collapse; text-align: left; font-size: 0.875rem; line-height: 1.6; }
.table th { padding: 14px 20px; background: #fafafa; color: var(--gray-500); font-size: var(--text-caption); font-weight: 600; white-space: nowrap; }
.table td { padding: 18px 20px; vertical-align: top; border-top: var(--border); overflow-wrap: anywhere; min-width: 100px; max-width: 280px; }
.table tbody tr:hover { background: #fafafa; }
.table td:first-child { min-width: 180px; }
.table td .small { display: inline-block; margin-top: 4px; }
.table td a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
.table .center { text-align: center; padding: 32px 20px; }
/* Estado nas telas de administração usa o mesmo sistema do resto do app:
   `tag` + `tag-solid` / `tag-quiet`, sem cor de destaque. A versão anterior
   trouxe verde, vermelho e âmbar — o que, além de furar a regra do projeto,
   contava o estado só pela cor numa tabela lida de relance.

   Quem fica preto (solid) é a EXCEÇÃO, não o "bom": bloqueado, inativo,
   suspenso, pendente, ação que falhou. O normal fica discreto. Assim o admin
   varre a tabela e o que salta é o que ele precisa resolver. */
/* Dentro da tabela a etiqueta não quebra no meio da palavra; quando duas
   aparecem na mesma célula, elas se acomodam lado a lado e descem juntas. */
.table .tag { white-space: nowrap; }
.table td > .tag + .tag { margin-left: 6px; }

/* Cartão e número que pedem atenção: peso e contraste, não cor. */
.texto-atencao { color: var(--ink); font-weight: 600; }
.card-atencao { border: var(--border-strong); }
.audit-table td:first-child { width: 180px; font-variant-numeric: tabular-nums; }
.audit-table td:nth-child(2) { width: 26%; }
.audit-table td:nth-child(3) { min-width: 160px; }
@media (max-width: 700px) {
  .wrap { padding: 28px 20px 118px; }
  .grid { gap: 16px; }
  .grid-3 { grid-template-columns: 1fr; }
  .card:not(.card-calendario) { padding: 20px; }
  .admin-page .card.p-0 { padding: 0; }
  .exercise-form-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .exercise-form-grid > .btn { width: 100%; }
  .admin-page > form, .admin-page > #resultado:not(:empty) { padding: 18px; }
  .admin-page .list-item { flex-wrap: wrap; }
  .table th, .table td { padding: 14px 16px; }
  .navlink { font-size: 0.6875rem; }
  .topbar nav:has(.navlink:nth-child(6)) { padding-inline: 4px; gap: 0; }
  .topbar nav:has(.navlink:nth-child(6)) .navlink { font-size: 0.625rem; padding-inline: 1px; }
  .navlink > span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
  .weekly-card { gap: 16px; }
  .weekly-content { min-width: 0; }
  .row-between:has(#mes-titulo) { flex-wrap: wrap; gap: 16px; }
  /* Auditoria em registros verticais: todos os campos visíveis no celular. */
  .audit-table, .audit-table tbody, .audit-table tr { display: block; }
  .audit-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .audit-table tr { padding: 16px 20px; border-top: var(--border); }
  .audit-table tr:first-child { border-top: 0; }
  .audit-table td, .audit-table td:first-child, .audit-table td:nth-child(2), .audit-table td:nth-child(3) {
    display: block; width: auto; min-width: 0; max-width: none; border: 0; padding: 6px 0;
  }
  .audit-table td[data-label]::before { content: attr(data-label); display: block; margin-bottom: 3px; color: var(--gray-500); font-size: var(--text-caption); font-weight: 600; }
}
