/* Ukoli Tickets — Onboarding (reuses login.css tokens & .lg-* classes) */
.ob-shell { align-items: center; }
.ob-grid { align-items: center; }

/* Terms (RGPD) — single centered card */
.ob-terms { position: relative; z-index: 1; width: 100%; max-width: 560px; }
.ob-terms-head { margin-bottom: 22px; }
.ob-terms-box { background: var(--surface-card); border: 1px solid var(--border-subtle);
  border-radius: 20px; box-shadow: var(--shadow-md); padding: 22px 24px; max-height: 46vh; overflow-y: auto; }
.ob-terms-eyebrow { font-family: var(--font-ui); font-size: 11px; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--brown); margin-bottom: 16px; }
.ob-scrollhint { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 12px;
  font-family: var(--font-ui); font-size: var(--text-xs); font-weight: 600; color: var(--text-subtle); }

.ob-check { display: flex; align-items: flex-start; gap: 11px; margin-top: 20px; cursor: pointer;
  font-size: var(--text-sm); color: var(--text-body); line-height: 1.45; }
.ob-check input { position: absolute; opacity: 0; width: 0; height: 0; }
.ob-check-box { flex-shrink: 0; width: 22px; height: 22px; border-radius: 7px; border: 1.5px solid var(--border-strong);
  background: var(--surface-card); display: inline-flex; align-items: center; justify-content: center;
  color: #fff; transition: background var(--dur-fast), border-color var(--dur-fast); margin-top: 1px; }
.ob-check input:checked + .ob-check-box { background: var(--green); border-color: var(--green); }
.ob-check input:focus-visible + .ob-check-box { box-shadow: var(--shadow-focus); }

.ob-accept-btn { margin-top: 20px; }

/* Done */
.ob-done { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; }
.ob-done-ring { width: 84px; height: 84px; border-radius: 50%; background: var(--surface-brand-soft);
  color: var(--green); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 26px;
  border: 1.5px solid var(--green-200); }

@media (max-width: 920px) {
  .ob-terms-box { max-height: 50vh; }
}