/* Fatia F · Abrir contrato, página do contrato e troca de contrato. Só tokens (tokens.css); nada de hex solto. */

/* ── Abrir contrato (uma página) ── */
.contract-open { max-width: 920px; }
.contract-question { margin: 0; font-size: var(--fs-lg); font-weight: 600; }
.contract-form { display: grid; gap: var(--s-5); }
.contract-section { min-width: 0; }
.contract-section > .card-title { display: flex; align-items: center; gap: var(--s-2); }
.contract-section > .hint { margin: 0; }
.contract-section .error { margin: 0; font-size: var(--fs-sm); color: var(--bad); display: flex; gap: var(--s-1); align-items: center; }
.choices { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: var(--s-2); }
.choices:focus-visible { outline: none; box-shadow: var(--focus); border-radius: var(--r-md); }
.field-row { display: grid; gap: var(--s-4); grid-template-columns: 1fr; }
@media (min-width: 720px) {
  .field-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .field-row-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.contract-form .field { align-content: start; }
.contract-form .field select { width: 100%; min-width: 0; }
@media (min-width: 768px) { .contract-form .field textarea { font-size: var(--fs-md); } }

.discipline-rows { list-style: none; margin: 0; padding: 0; display: grid; }
.discipline-row { display: grid; gap: var(--s-3); padding: var(--s-4) 0; border-top: 1px solid var(--line); max-width: none; }
.discipline-row:first-child { border-top: 0; padding-top: var(--s-2); }
.discipline-name { display: grid; gap: 2px; min-width: 0; }
.discipline-name .muted { font-size: var(--fs-sm); }
@media (min-width: 720px) {
  .discipline-row { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); align-items: start; column-gap: var(--s-4); }
  .discipline-team { grid-column: 1 / -1; }
}
.discipline-team summary { display: inline-flex; align-items: center; min-height: var(--tap); cursor: pointer; color: var(--link);
  gap: var(--s-1); font-size: var(--fs-sm); font-weight: 500; list-style: none; }
.discipline-team summary::-webkit-details-marker { display: none; }
.discipline-team summary .icon { width: 16px; height: 16px; transition: transform var(--t-fast); }
.discipline-team[open] summary .icon { transform: rotate(45deg); }
.discipline-team summary:focus-visible { outline: none; box-shadow: var(--focus); border-radius: var(--r-sm); }
.team-options { border: 0; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; column-gap: var(--s-4); }
@media (min-width: 720px) { .team-options { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.choice { display: flex; align-items: flex-start; gap: var(--s-3); padding: var(--s-3); border: 1px solid var(--line);
  border-radius: var(--r-md); cursor: pointer; min-height: var(--tap); }
.choice input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--ink); flex: none; }
.choice > span { display: grid; gap: 2px; }
.choice:has(input:checked) { border-color: var(--ink); background: var(--surface-2); }
.choice:has(input:focus-visible) { box-shadow: var(--focus); }
.contract-section.field-error .choice { border-color: var(--bad); }

/* Ação principal sempre à vista: no celular gruda em cima da barra inferior. */
.contract-submit { position: sticky; bottom: var(--bottomnav-h); z-index: 50; display: grid; gap: var(--s-3);
  margin: 0 calc(-1 * var(--s-4)); padding: var(--s-3) var(--s-4); background: var(--surface); border-top: 1px solid var(--line); }
.contract-submit .hint { margin: 0; }
.contract-submit .btn-primary { flex: 1; justify-content: center; }
@media (max-width: 719px) { .contract-submit .hint { display: none; } }
@media (min-width: 720px) {
  .contract-submit { position: static; margin: 0; padding: 0; background: none; border: 0; }
  .contract-submit .btn-primary { flex: none; }
}

/* ── Página do contrato: equipe e pastas ── */
.contract-facts { grid-template-columns: max-content minmax(0, 1fr); }
.team-list .list-item { align-items: flex-start; }
.team-list .list-main { gap: 2px; }
.team-list .list-main strong { font-weight: 600; }
.team-access { font-size: var(--fs-sm); color: var(--muted); }
.folder-tree, .folder-tree ul { list-style: none; margin: 0; padding: 0; }
.folder-tree ul { padding-left: var(--s-5); border-left: 1px solid var(--line); margin-left: var(--s-2); }
.folder-tree li { padding: 2px 0; max-width: none; }
.folder-tree .folder-line { display: grid; grid-template-columns: 16px 2.6em minmax(0, 1fr) auto; align-items: center; gap: var(--s-2); min-height: 32px; }
.folder-tree .folder-line .icon { width: 16px; height: 16px; color: var(--muted); flex: none; }
.folder-tree .folder-number { font-variant-numeric: tabular-nums; color: var(--muted); }
.folder-tree > li > .folder-line { font-weight: 600; }
@media (min-width: 1024px) { .contract-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: var(--s-6); align-items: start; } }
.contract-grid { display: grid; gap: var(--s-6); }

/* ── Troca de contrato (barra superior + gaveta) ── */
button.contract-switcher { border: 1px solid transparent; background: none; font: inherit; font-size: var(--fs-sm); cursor: pointer;
  min-height: 40px; padding: 0 var(--s-2); border-radius: var(--r-md); color: var(--muted); }
button.contract-switcher:hover { background: var(--surface-2); }
button.contract-switcher:focus-visible { outline: none; box-shadow: var(--focus); }
button.contract-switcher .chevron { width: 16px; height: 16px; flex: none; }
.contract-options { display: grid; gap: var(--s-2); }
.contract-option { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--s-1) var(--s-3); width: 100%; text-align: left;
  padding: var(--s-3); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); color: var(--ink);
  font: inherit; cursor: pointer; min-height: var(--tap); }
.contract-option:hover { background: var(--surface-2); }
.contract-option:focus-visible { outline: none; box-shadow: var(--focus); }
.contract-option[aria-current="true"] { border-color: var(--ink); }
.contract-option .icon { margin-top: 2px; color: var(--muted); }
.contract-option[aria-current="true"] .icon { color: var(--ok); }
.contract-option .who { display: grid; gap: 2px; min-width: 0; }
.contract-option .who span { font-size: var(--fs-sm); color: var(--muted); }

/* Resumo de erros e campos: ao receber foco ou rolar até eles, ficam abaixo da barra superior fixa. */
.contract-form .error-summary, .contract-form .field input, .contract-form .field select, .contract-form .field textarea,
.contract-form .choices { scroll-margin-top: calc(var(--topbar-h) + var(--s-4)); scroll-margin-bottom: calc(var(--bottomnav-h) + 120px); }