/* Customer-facing legal pages: privacy policy and order terms. */

[data-terms-lang][hidden] {
  display: none !important;
}

.customer-page.legal-page {
  --menu-bg: #fffcf7;
  --menu-surface: #ffffff;
  --menu-surface-soft: #fff8ee;
  --menu-ink: #181512;
  --menu-muted: #655c53;
  --menu-line: rgba(24, 21, 18, 0.12);
  --menu-line-strong: rgba(24, 21, 18, 0.18);
  --control-bg: var(--menu-surface);
  --control-muted-bg: #f5f1e9;
  --control-border: var(--menu-line-strong);
  --menu-shadow: 0 12px 30px rgba(28, 19, 11, 0.08);
  --menu-shadow-strong: 0 20px 52px rgba(28, 19, 11, 0.14);
  padding-bottom: 48px;
  background:
    radial-gradient(circle at top left, var(--menu-accent-soft), transparent 34rem),
    var(--menu-bg);
  color-scheme: light;
}

.legal-page .menu-shell.menu-readonly {
  width: min(980px, 100%);
  max-width: 980px;
  gap: 14px;
  padding: 12px;
}

.legal-page .customer-header {
  position: sticky;
  top: 0;
  z-index: 20;
}

.legal-page .customer-tools {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

.legal-page .theme-toggle {
  display: none !important;
}

.legal-page .legal-home-link {
  min-height: 30px;
  padding: 6px 10px;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
}

.privacy-policy-panel {
  display: grid;
  gap: 13px;
  width: min(100%, 880px);
  margin: 0 auto;
  border: 1px solid var(--menu-line);
  border-radius: 8px;
  background: var(--menu-surface);
  box-shadow: var(--menu-shadow);
  padding: clamp(18px, 4vw, 34px);
  color: var(--menu-ink);
  font-size: clamp(0.96rem, 1.7vw, 1.03rem);
  line-height: 1.72;
}

.privacy-policy-panel h2,
.privacy-policy-panel h3,
.privacy-policy-panel p,
.privacy-policy-panel ul {
  margin: 0;
}

.privacy-policy-panel h2 {
  margin-top: 18px;
  color: var(--menu-ink);
  font-size: clamp(1.24rem, 3.2vw, 1.48rem);
  font-weight: 300;
  letter-spacing: 0.01em;
  line-height: 1.16;
}

.privacy-policy-panel h2:first-child,
.privacy-policy-panel p + h2 {
  margin-top: 20px;
}

.privacy-policy-panel h3 {
  margin-top: 10px;
  color: var(--menu-accent-dark);
  font-size: clamp(1.04rem, 2.6vw, 1.16rem);
  font-weight: 800;
  line-height: 1.24;
}

.privacy-policy-panel p,
.privacy-policy-panel li {
  color: var(--menu-muted);
}

.privacy-policy-panel strong {
  color: var(--menu-ink);
}

.privacy-policy-panel ul {
  display: grid;
  gap: 7px;
  padding-left: 1.25rem;
}

.privacy-policy-panel li::marker {
  color: var(--menu-accent);
}

.privacy-policy-panel a {
  color: var(--menu-accent-dark);
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: rgba(27, 117, 109, 0.28);
  text-underline-offset: 3px;
}

.privacy-policy-panel a:hover,
.privacy-policy-panel a:focus-visible {
  color: var(--menu-accent);
  text-decoration-color: currentColor;
}

.terms-summary {
  display: grid;
  gap: 10px;
  margin: 4px 0 8px;
}

.terms-summary-item {
  border: 1px solid rgba(27, 117, 109, 0.18);
  border-radius: 8px;
  background: var(--menu-accent-soft);
  color: var(--menu-muted);
  padding: 12px 14px;
}

.terms-summary-item strong {
  display: block;
  margin-bottom: 3px;
  color: var(--menu-accent-dark);
}

.terms-link-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.terms-link-row .button {
  flex: 1 1 180px;
}

@media (min-width: 880px) {
  .legal-page .menu-shell.menu-readonly {
    padding: 16px;
  }

  .legal-page .customer-header {
    margin: -16px -16px 0;
  }
}

@media (max-width: 600px) {
  .legal-page .customer-header {
    align-items: flex-start;
  }

  .legal-page .customer-header-side {
    align-items: flex-end;
  }

  .legal-page .customer-tools {
    flex-wrap: wrap;
    max-width: 184px;
  }

  .legal-page .legal-home-link {
    order: 2;
  }

  .privacy-policy-panel {
    gap: 12px;
    padding: 18px 16px;
  }
}

@media (max-width: 420px) {
  .legal-page .menu-shell.menu-readonly {
    padding: 10px;
  }

  .legal-page .customer-header {
    margin: -10px -10px 0;
  }

  .legal-page .customer-tools {
    max-width: 152px;
  }

  .privacy-policy-panel {
    border-radius: 8px;
    padding: 16px 14px;
  }
}