/* ===========================================================================
   Shareet — terms & privacy page
   The document body is injected verbatim from src/data/legal_text.rs, so the
   selectors below target that markup's own structure (.legal-section, h1-h3,
   ul/ol, .legal-date, .legal-acknowledgment).
   =========================================================================== */

.terms-page {
  position: relative;
  z-index: 1;
  min-height: 100vh;
  padding: 128px 0 96px;
}

.terms-page__container {
  width: 100%;
  max-width: 820px;
  margin: 0 auto;
  padding: 0 24px;
  direction: rtl;
}

/* ===== Back link ===== */
.terms-page__back-wrap {
  margin-bottom: 40px;
}

.terms-page__back {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  height: 40px;
  padding: 0 18px;
  border-radius: 999px;
  border: 1px solid var(--btn-ghost-border);
  background: var(--btn-ghost-bg);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--muted);
  transition:
    color 0.28s var(--ease),
    border-color 0.28s var(--ease),
    background 0.28s var(--ease),
    transform 0.28s var(--ease);
}

.terms-page__back:hover {
  color: var(--text);
  border-color: var(--btn-ghost-border-hover);
  background: var(--btn-ghost-bg-hover);
  transform: translateX(4px);
}

.terms-page__back:focus-visible {
  outline: 2px solid var(--mint);
  outline-offset: 3px;
}

/* The chevron ships pointing left; flip it to point back along an RTL line. */
.terms-page__back svg { transform: scaleX(-1); }

/* ===== Document surface ===== */
.terms-page__content {
  padding: 48px 44px;
  border-radius: 26px;
  border: 1px solid var(--line);
  background: var(--surface);
  box-shadow: 0 30px 80px -40px rgba(0, 0, 0, 0.6);
  color: var(--legal-text);
  font-size: 0.95rem;
  line-height: 2;
  text-align: right;
}

:root[data-theme="light"] .terms-page__content {
  box-shadow: 0 30px 70px -40px rgba(13, 20, 17, 0.18);
}

@media (max-width: 720px) {
  .terms-page { padding: 104px 0 64px; }
  .terms-page__content { padding: 30px 22px; border-radius: 20px; }
}

/* ===== Sections ===== */
.legal-section + .legal-section {
  margin-top: 40px;
  padding-top: 40px;
  border-top: 1px solid var(--line);
}

/* ===== Headings ===== */
.terms-page__content h1 {
  font-size: clamp(1.5rem, 3.4vw, 2rem);
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: -0.01em;
  color: var(--text);
  margin-bottom: 12px;
}

.terms-page__content h2 {
  font-size: clamp(1.2rem, 2.4vw, 1.5rem);
  font-weight: 700;
  line-height: 1.5;
  color: var(--text);
  margin-bottom: 22px;
  padding-right: 16px;
  border-right: 3px solid var(--accent-light);
}

.terms-page__content h3 {
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.6;
  color: var(--legal-accent);
  margin: 32px 0 10px;
}

.terms-page__content h3:first-of-type { margin-top: 24px; }

/* ===== Body copy ===== */
.terms-page__content p {
  margin-bottom: 12px;
}

.legal-date {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface-3);
  font-size: 0.8rem;
  color: var(--faint);
  margin-bottom: 20px !important;
}

.terms-page__content strong {
  color: var(--text);
  font-weight: 700;
}

.terms-page__content a {
  color: var(--legal-link);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: opacity 0.25s var(--ease);
}

.terms-page__content a:hover { opacity: 0.75; }

/* ===== Lists ===== */
.terms-page__content ul,
.terms-page__content ol {
  margin: 0 0 14px;
  padding-right: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.terms-page__content li {
  position: relative;
  padding-right: 24px;
}

/* Bulleted list: a small brand-green diamond */
.terms-page__content ul > li::before {
  content: "";
  position: absolute;
  top: 0.85em;
  right: 6px;
  width: 6px;
  height: 6px;
  border-radius: 1px;
  background: var(--accent-light);
  transform: rotate(45deg);
}

/* Numbered list: keep the numerals, styled in brand green */
.terms-page__content ol {
  counter-reset: legal-item;
}

.terms-page__content ol > li {
  counter-increment: legal-item;
}

.terms-page__content ol > li::before {
  content: counter(legal-item) ".";
  position: absolute;
  top: 0;
  right: 0;
  font-family: var(--font-en);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--legal-accent);
  line-height: 2.2;
}

/* ===== Closing acknowledgment block ===== */
.legal-acknowledgment {
  margin-top: 40px;
  padding: 28px;
  border-radius: 18px;
  border: 1px solid var(--line-green);
  background:
    radial-gradient(ellipse 100% 140% at 50% 0%, var(--glow-soft), transparent 70%),
    var(--surface-3);
}

.legal-acknowledgment h2 {
  border-right: 0;
  padding-right: 0;
  margin-bottom: 14px;
}

.legal-acknowledgment p:last-child { margin-bottom: 0; }