/* [LEGAL BATCH A 2026-10-11] The five legal pages added with this batch
   (accessibility, sms-terms, cookies, acceptable-use, copyright) share this
   sheet. The card is terms.html's own inline style, copied as it is, so the
   seven legal pages read alike; the tables and the footer's link row are
   the additions. Body is style.css's wrapping flex row, so <main> takes the
   full row and the footer (`.fc-legal-footer`, style.css) sits under it. */
body {
  background: var(--background);
  min-height: 100vh;
}
main.legal-page {
  flex: 1 1 100%;
  min-width: 0;
}
.legal-wrapper {
  max-width: 800px;
  margin: 0 auto;
  padding: 2rem 1rem;
}
.legal-card {
  background: white;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  padding: 2rem;
}
.legal-card h1 {
  color: var(--text-primary);
  font-size: 1.75rem;
  font-weight: 600;
  border-bottom: 2px solid var(--primary-blue);
  padding-bottom: 1rem;
  margin-bottom: 0.5rem;
}
.legal-card h2 {
  color: var(--text-primary);
  font-size: 1.125rem;
  font-weight: 600;
  margin-top: 2rem;
  margin-bottom: 0.75rem;
}
.legal-card p,
.legal-card li {
  color: var(--text-secondary);
  line-height: 1.7;
  margin-bottom: 0.75rem;
}
.legal-card ul,
.legal-card ol {
  padding-left: 1.5rem;
  margin-bottom: 1rem;
}
.legal-card li {
  margin-bottom: 0.5rem;
}
.legal-card a {
  color: #1d4ed8;
  text-decoration: underline;
}
.last-updated {
  /* #475569 on white = 7.6:1 (terms.html's --text-light grey measured 3.9:1) */
  color: #475569;
  font-size: 0.875rem;
  margin-bottom: 1.5rem;
}
.back-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
  color: #1565c0; /* 5.8:1 (--primary-blue #1e88e5 is 3.7:1 on white) */
  text-decoration: none;
  font-weight: 500;
  padding: 0.5rem 0;
}
.back-link:hover {
  text-decoration: underline;
}
/* A table scrolls inside its own box on a phone; the page never scrolls
   sideways. */
.legal-table-wrap {
  overflow-x: auto;
  margin: 0 0 1rem;
}
.legal-card table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
  color: var(--text-secondary);
}
.legal-card th,
.legal-card td {
  text-align: left;
  vertical-align: top;
  padding: 0.5rem 0.6rem;
  border-bottom: 1px solid var(--border-color, #e2e8f0);
  line-height: 1.5;
}
.legal-card th {
  color: var(--text-primary);
  font-weight: 600;
  background: #f8fafc;
}
.legal-card code {
  font-size: 0.85em;
  background: #f1f5f9;
  padding: 0.05rem 0.3rem;
  border-radius: 4px;
  overflow-wrap: anywhere;
}
@media (max-width: 640px) {
  .legal-wrapper {
    padding: 1rem;
  }
  .legal-card {
    padding: 1.5rem 1rem;
  }
  .legal-card h1 {
    font-size: 1.5rem;
  }
  .legal-card table {
    min-width: 520px;
  }
}
