:root { --bs-body-bg: #f5f1e8; }

html, body { height: 100%; }
body { overflow: hidden; }

.terms-wrapper {
  height: 60vh;
  overflow-y: auto;
  border: 1px solid #e1d8c1;
  background: #fffdf9;
  padding: 1.25rem;
  border-radius: .5rem;
}

.section-number {
  font-weight: bold;
  color: #666;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bs-secondary: #cdcdcd;
    --bs-body-color: #ffffff;
    --bs-body-bg: #1b1b1b;
  }
  a { color: #2196f3; }
  hr { color: #ffffff; opacity: .75; }
  .spinner-border { color: #2196f3; }
  .terms-wrapper {
    border-color: #444;
    background: #272727;
  }
  .section-number {
    color: #aaa;
  }
  .text-muted {
    color: #aaa !important;
  }
}

.back-to-top-btn {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  width: 3em;
  height: 3em;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid #e1d8c1;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  z-index: 1000;
}

.back-to-top-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
  background: #f8f9fa;
}

.back-to-top-btn svg {
  width: 3rem;
  height: 3rem;
  margin-bottom: .2rem;
}

#backToTopIcon path {
  stroke: #333;
}

@media (prefers-color-scheme: dark) {
  .back-to-top-btn {
    background: #272727;
    border-color: #444;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  }

  .back-to-top-btn:hover {
    background: #333;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
  }

  #backToTopIcon path {
    stroke: #ffffff;
  }
}