/* Terms acceptance panel (GL-003), drawn by workspace-terms.js on every workspace page.
   Colours come from the workspace tokens, so light and dark themes both work. */
.terms-panel {
  display: grid;
  gap: 10px;
  margin: 0 0 18px;
  padding: 16px 18px;
  border: 1px solid var(--accent-soft);
  border-radius: 12px;
  background: var(--card);
  color: var(--ink);
}
.terms-panel:focus { outline: none; }
.terms-panel h2 { margin: 0; color: var(--ink); font-size: 17px; line-height: 1.3; }
.terms-panel p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.terms-panel a { color: var(--accent-ink); text-decoration: underline; text-underline-offset: 3px; }
.terms-panel-check { display: flex; align-items: flex-start; gap: 10px; color: var(--ink); font-size: 14px; line-height: 1.45; cursor: pointer; }
.terms-panel-check input { flex: none; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--accent); }
.terms-panel .btn { justify-self: start; }
.terms-panel-message:empty { display: none; }

/* While the Terms wait, the controls that start new work look unavailable. workspace-terms.js
   also marks them aria-disabled and holds back their clicks; the server refuses the work too. */
html[data-terms-pending] :is([data-terms-gated], [data-invitation-action="resend"], [data-join-request-action="approve"], [data-checkout-plan], [data-pack-code]) {
  opacity: .55;
  cursor: not-allowed;
}
html[data-terms-pending] form[data-terms-gated] { opacity: 1; cursor: auto; }
html[data-terms-pending] form[data-terms-gated] :is(button[type="submit"], [type="submit"]) { opacity: .55; cursor: not-allowed; }