/* ==========================================================================
   Светлая тема для /privacy и /consent
   Использует --legal-* переменные из design-system.css
   ========================================================================== */

body.legal-page {
  background: var(--legal-bg);
  color: var(--legal-text);
}

.legal-shell {
  max-width: 860px;
  margin: 0 auto;
  padding: var(--sp-8) var(--sp-6) var(--sp-20);
}

.legal-shell__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: var(--sp-8);
  color: var(--legal-text-muted);
  font-size: var(--fs-sm);
  transition: color var(--dur-fast) var(--ease-out);
}
.legal-shell__back:hover { color: var(--legal-text); }

.legal-shell h1 {
  font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.375rem);
  line-height: var(--lh-tight);
  margin-bottom: var(--sp-2);
  color: var(--legal-text);
}

.legal-shell .meta {
  color: var(--legal-text-muted);
  font-size: var(--fs-sm);
  margin-bottom: var(--sp-10);
}

.legal-shell h2 {
  font-size: var(--fs-xl);
  margin: var(--sp-10) 0 var(--sp-4);
  color: var(--legal-text);
  letter-spacing: -0.01em;
}

.legal-shell h3 {
  font-size: var(--fs-lg);
  margin: var(--sp-6) 0 var(--sp-2);
  color: var(--legal-text);
}

.legal-shell p,
.legal-shell li {
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--legal-text);
}

.legal-shell p {
  margin-bottom: var(--sp-3);
}

.legal-shell ul,
.legal-shell ol {
  padding-left: var(--sp-6);
  margin-bottom: var(--sp-4);
}

.legal-shell li {
  list-style: disc;
  margin-bottom: 6px;
}

.legal-shell ol li {
  list-style: decimal;
}

.legal-shell a {
  color: var(--legal-link);
  text-decoration: underline;
  text-decoration-color: rgba(29, 78, 216, 0.35);
  text-underline-offset: 2px;
  transition: text-decoration-color var(--dur-fast) var(--ease-out);
}
.legal-shell a:hover {
  text-decoration-color: var(--legal-link);
}

.legal-shell b,
.legal-shell strong {
  color: var(--legal-text);
  font-weight: var(--fw-semibold);
}

.legal-shell table {
  width: 100%;
  border-collapse: collapse;
  margin: var(--sp-4) 0 var(--sp-6);
  font-size: var(--fs-sm);
  background: var(--legal-surface);
  border: 1px solid var(--legal-border);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.legal-shell thead th {
  background: var(--legal-bg);
  text-align: left;
  padding: var(--sp-3) var(--sp-4);
  font-weight: var(--fw-semibold);
  border-bottom: 1px solid var(--legal-border);
}

.legal-shell tbody td {
  padding: var(--sp-3) var(--sp-4);
  border-bottom: 1px solid var(--legal-border);
  vertical-align: top;
}

.legal-shell tbody tr:last-child td {
  border-bottom: 0;
}

/* Заголовок страницы — тонкая брендовая полоса сверху */
.legal-header {
  background: var(--color-bg);
  color: var(--color-text);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.legal-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--sp-4) var(--sp-6);
  max-width: var(--container-max);
  margin: 0 auto;
  min-height: 64px;
}
.legal-header .brand__text {
  font-size: var(--fs-md);
  color: var(--color-text);
}

@media (max-width: 600px) {
  .legal-shell {
    padding: var(--sp-6) var(--sp-4) var(--sp-16);
  }
  .legal-shell table {
    font-size: var(--fs-xs);
  }
  .legal-shell thead th,
  .legal-shell tbody td {
    padding: var(--sp-2) var(--sp-3);
  }
}