@import url('./campus-tokens.css');

html[data-campus-legal="pending"] body > :not(.campus-legal-gate):not(.campus-legal-notice):not(noscript) { display:none !important; }

/* ---- First-run consent gate (Apple system style) ---- */
.campus-legal-gate,
.campus-legal-notice {
  position:fixed; inset:0; z-index:2147483000; overflow:auto;
  background:var(--ui-bg); color:var(--ui-text);
  font:var(--ui-text-body)/1.5 -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  display:grid; place-items:center; padding:var(--ui-space-6); box-sizing:border-box;
}
.legal-welcome,
.legal-notice-card {
  width:min(100%, 420px); box-sizing:border-box;
  padding:var(--ui-space-8) var(--ui-space-6);
  background:var(--ui-surface); border-radius:var(--ui-radius-xl);
  box-shadow:var(--ui-shadow-lg); text-align:center;
}
.legal-brand {
  display:block; font-size:var(--ui-text-subhead); font-weight:var(--ui-weight-semibold);
  color:var(--ui-secondary); text-transform:none; letter-spacing:0;
}
.legal-welcome h1,
.legal-notice-card h1 {
  font-size:var(--ui-text-title1); line-height:1.2; font-weight:var(--ui-weight-bold);
  margin:var(--ui-space-3) 0 0;
}
.legal-welcome p,
.legal-notice-card p { margin:var(--ui-space-3) 0 0; color:var(--ui-secondary); }
.legal-brief { font-size:var(--ui-text-subhead); color:var(--ui-secondary); }

.legal-welcome form { margin-top:var(--ui-space-6); text-align:left; }

/* Round agreement checkbox */
.legal-consent-row {
  display:flex; gap:var(--ui-space-3); align-items:flex-start;
  font-size:var(--ui-text-subhead); line-height:1.5; color:var(--ui-text);
  margin:0 0 var(--ui-space-5);
}
.legal-consent-row input[type="checkbox"] {
  appearance:none; -webkit-appearance:none; flex:none;
  width:24px; height:24px; margin:0; border:1.7px solid var(--ui-separator);
  border-radius:var(--ui-radius-pill); background:var(--ui-surface);
  cursor:pointer; display:grid; place-items:center;
  transition:background var(--ui-duration-fast) var(--ui-ease), border-color var(--ui-duration-fast) var(--ui-ease);
}
.legal-consent-row input[type="checkbox"]:checked {
  background:var(--ui-accent); border-color:var(--ui-accent);
}
.legal-consent-row input[type="checkbox"]:checked::after {
  content:""; width:12px; height:7px; margin-top:-2px;
  border-left:2px solid var(--ui-on-accent); border-bottom:2px solid var(--ui-on-accent);
  transform:rotate(-45deg);
}
.legal-consent-row input[type="checkbox"]:focus-visible {
  outline:3px solid var(--ui-focus); outline-offset:2px;
}
.legal-consent-row label { cursor:pointer; }

/* Links: accent text, no underline */
.campus-legal-gate a,
.campus-legal-notice a { color:var(--ui-accent-text); text-decoration:none; }
.campus-legal-gate a:hover,
.campus-legal-notice a:hover { text-decoration:none; }

/* Buttons */
.legal-primary {
  display:block; width:100%; min-height:var(--ui-hit); padding:13px var(--ui-space-5);
  border:0; border-radius:var(--ui-radius-pill); text-align:center; text-decoration:none;
  background:var(--ui-accent); color:var(--ui-on-accent);
  box-sizing:border-box;
  font:var(--ui-weight-semibold) var(--ui-text-body)/1 -apple-system, system-ui, sans-serif;
  cursor:pointer; transition:opacity var(--ui-duration-fast) var(--ui-ease);
}
.legal-primary:hover { opacity:.9; }
.legal-primary:disabled { background:var(--ui-fill-strong); color:var(--ui-tertiary); cursor:default; opacity:1; }
.legal-primary:focus-visible { outline:3px solid var(--ui-focus); outline-offset:2px; }
.legal-document a.legal-primary { color:var(--ui-on-accent); }
.legal-document a.legal-primary:hover { text-decoration:none; opacity:.9; }

.legal-error { margin-top:var(--ui-space-3); color:var(--ui-danger); font-size:var(--ui-text-footnote); text-align:center; }

/* Loading state while importing entry */
.legal-notice-card .legal-spinner {
  width:28px; height:28px; margin:var(--ui-space-2) auto 0;
  border:3px solid var(--ui-fill-strong); border-top-color:var(--ui-accent);
  border-radius:var(--ui-radius-pill); animation:legal-spin 1s linear infinite;
}
@keyframes legal-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .legal-notice-card .legal-spinner { animation-duration:2.4s; } }

/* ---- Reading page (terms / privacy / 404) ---- */
.legal-document {
  margin:0; background:var(--ui-bg); color:var(--ui-text);
  font:var(--ui-text-body)/1.6 -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}
.legal-document main { max-width:680px; margin:auto; padding:var(--ui-space-8) var(--ui-space-5) 72px; }
.legal-document nav {
  display:flex; gap:var(--ui-space-2); flex-wrap:wrap; margin-bottom:var(--ui-space-6);
}
.legal-document nav a {
  display:inline-flex; align-items:center; min-height:36px; padding:6px var(--ui-space-4);
  border-radius:var(--ui-radius-pill); background:var(--ui-fill); color:var(--ui-accent-text);
  text-decoration:none; font-size:var(--ui-text-subhead); font-weight:var(--ui-weight-medium);
}
.legal-document nav a:hover { background:var(--ui-fill-strong); }
.legal-document h1 { font-size:var(--ui-text-large); font-weight:var(--ui-weight-bold); line-height:1.2; margin:0 0 var(--ui-space-3); }
.legal-document h2 { font-size:var(--ui-text-title2); font-weight:var(--ui-weight-semibold); line-height:1.3; margin:var(--ui-space-8) 0 var(--ui-space-3); }
.legal-document p { margin:var(--ui-space-3) 0; }
.legal-document a { color:var(--ui-accent-text); text-decoration:none; }
.legal-document p a:hover { text-decoration:underline; }
.legal-document ul { padding-left:var(--ui-space-5); }
.legal-document li { margin:var(--ui-space-2) 0; }
.legal-document table { border-collapse:collapse; width:100%; font-size:var(--ui-text-subhead); margin:var(--ui-space-3) 0; }
.legal-document th, .legal-document td { border:1px solid var(--ui-line); padding:10px; text-align:left; vertical-align:top; overflow-wrap:anywhere; }
.legal-document th { background:var(--ui-surface-2); font-weight:var(--ui-weight-semibold); }
.legal-document .legal-important {
  background:var(--ui-surface); border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-m); padding:var(--ui-space-4); margin:var(--ui-space-4) 0;
}
.legal-document button {
  font:var(--ui-weight-medium) var(--ui-text-subhead)/1 -apple-system, system-ui, sans-serif;
  min-height:var(--ui-hit); padding:var(--ui-space-3) var(--ui-space-5);
  border:0; border-radius:var(--ui-radius-pill);
  background:var(--ui-fill); color:var(--ui-accent-text); cursor:pointer;
}
.legal-document button:hover { background:var(--ui-fill-strong); }
.legal-document button:disabled { color:var(--ui-tertiary); cursor:default; }
.legal-document button:focus-visible { outline:3px solid var(--ui-focus); outline-offset:2px; }
.legal-meta { color:var(--ui-secondary); font-size:var(--ui-text-subhead); }
.legal-links { font-size:var(--ui-text-footnote); display:flex; gap:var(--ui-space-4); flex-wrap:wrap; margin:var(--ui-space-4) 0; }

/* 404 */
.legal-notfound { display:grid; place-items:center; min-height:100vh; min-height:100svh; text-align:center; padding:var(--ui-space-6); }
.legal-notfound .legal-notice-card { text-align:center; }

@media (max-width:480px) {
  .legal-welcome, .legal-notice-card { padding:var(--ui-space-6) var(--ui-space-5); }
  .legal-document main { padding:var(--ui-space-6) var(--ui-space-4) 56px; }
  .legal-document table { font-size:var(--ui-text-footnote); }
  .legal-document th, .legal-document td { padding:7px; }
  .legal-document h1 { font-size:var(--ui-text-title1); }
}
.legal-consent-row a { white-space:nowrap; }

/* A quiet campus invitation. Scoped to welcome; legal documents/notices keep their layout. */
.campus-legal-gate {
  --welcome-ink:#193c33; --welcome-muted:#53665a; --welcome-paper:#f1f0e8;
  --ui-accent:#265f49; --ui-accent-text:#245a45; --ui-focus:#357653;
  background:#dce5dc; align-items:safe center;
  padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));
}
.campus-legal-gate .legal-welcome {
  display:grid; grid-template-columns:1.05fr 1fr; width:min(100%,940px);
  padding:0; border-radius:24px; border:1px solid #c4d1c3; background:var(--welcome-paper);
  box-shadow:0 18px 52px #2447351c; text-align:left; overflow:hidden;
}
.legal-campus-scene { position:relative; display:flex; flex-direction:column; justify-content:space-between; min-width:0; padding:32px; background:#183c34; color:#edf0dc; }
.campus-legal-gate .legal-brand { display:flex; align-items:center; gap:10px; color:#edf0dc; font-size:17px; font-weight:600; letter-spacing:-.2px; }
.legal-brand svg { width:27px; height:27px; flex:none; }
.legal-campus-art { margin:6px -22px 0; }
.legal-campus-art>svg { display:block; width:100%; height:auto; }
.legal-scene-caption { display:flex; flex-direction:column; gap:5px; margin-top:14px; }
.legal-scene-caption span:first-child { font-size:22px; letter-spacing:.04em; font-weight:550; }
.legal-scene-caption span:last-child { font-size:12px; color:#b6cbb8; }
.legal-welcome-content { display:flex; flex-direction:column; justify-content:center; min-width:0; padding:48px 40px; color:var(--welcome-ink); }
.campus-legal-gate .legal-welcome-kicker { margin:0 0 18px; color:#536e5b; font-size:13px; }
.campus-legal-gate .legal-welcome h1 { margin:0; color:var(--welcome-ink); font-size:clamp(28px,3vw,36px); font-weight:600; letter-spacing:-.04em; line-height:1.4; }
.campus-legal-gate .legal-welcome-intro { margin:12px 0 0; color:var(--welcome-muted); font-size:15px; line-height:1.8; }
.legal-entry-notes { margin-top:40px; padding-top:22px; border-top:1px solid #cfd7c9; }
.campus-legal-gate .legal-entry-notes p { margin:0; color:var(--welcome-muted); font-size:13px; line-height:1.8; }
.campus-legal-gate .legal-entry-notes .legal-brief { margin-top:4px; }
.campus-legal-gate .legal-welcome form { margin-top:22px; }
.campus-legal-gate .legal-consent-row { align-items:center; gap:8px; margin-bottom:20px; font-size:13px; line-height:1.8; color:#43594a; }
.campus-legal-gate .legal-consent-row input[type="checkbox"] { font:inherit; box-sizing:border-box; width:1em; height:1em; border-radius:.2em; border-color:#849b87; background:#e6eadd; }
.campus-legal-gate .legal-consent-row input[type="checkbox"]:checked::after { width:.5em; height:.25em; margin-top:-.15em; border-width:0 0 1.5px 1.5px; }
/* Keep the visible box text-sized while the associated labels remain easy to tap. */
.campus-legal-gate .legal-consent-row label { display:inline-flex; align-items:center; min-height:44px; vertical-align:middle; }
.campus-legal-gate .legal-consent-row input[type="checkbox"]:checked { background:var(--ui-accent); border-color:var(--ui-accent); }
.campus-legal-gate a { text-decoration:underline; text-underline-offset:3px; text-decoration-color:#819c85; }
.campus-legal-gate a:hover { text-decoration:underline; text-decoration-thickness:2px; }
.campus-legal-gate a:focus-visible { outline:3px solid var(--ui-focus); outline-offset:3px; border-radius:2px; }
.campus-legal-gate .legal-primary { min-height:52px; border-radius:12px; font-size:15px; }
.campus-legal-gate .legal-primary:disabled { background:#dce2d4; color:#667660; }
@media(max-width:720px) {
  .campus-legal-gate { padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); }
  .campus-legal-gate .legal-welcome { grid-template-columns:1fr; max-width:440px; border-radius:20px; }
  .legal-campus-scene { padding:20px 24px; min-height:0; overflow:hidden; }
  .legal-campus-art { display:flex; justify-content:center; height:142px; margin:0; }
  .legal-campus-art>svg { width:240px; height:175px; flex:none; margin-top:-18px; }
  .campus-legal-gate .legal-brand { font-size:14px; position:relative; z-index:1; }
  .legal-brand svg { width:23px; height:23px; }
  .legal-scene-caption { margin-top:6px; position:relative; z-index:1; }
  .legal-scene-caption span:first-child { font-size:19px; }
  .legal-scene-caption span:last-child { font-size:11px; }
  .legal-welcome-content { padding:28px 24px; }
  .campus-legal-gate .legal-welcome-kicker { margin-bottom:10px; font-size:12px; }
  .campus-legal-gate .legal-welcome h1 { font-size:29px; }
  .campus-legal-gate .legal-welcome-intro { margin-top:8px; font-size:14px; }
  .legal-entry-notes { margin-top:22px; padding-top:18px; }
  .campus-legal-gate .legal-welcome form { margin-top:18px; }
}
@media(max-width:360px) {
  .legal-campus-scene { padding:18px; }
  .legal-welcome-content { padding:24px 18px; }
  .campus-legal-gate .legal-consent-row { font-size:12px; }
}
@media(max-height:650px) { .campus-legal-gate { place-items:start center; } }
@media(prefers-reduced-motion:reduce) {
  .campus-legal-gate *, .campus-legal-gate *::before, .campus-legal-gate *::after { animation:none!important; transition:none!important; }
}
@media(forced-colors:active) {
  .campus-legal-gate .legal-welcome { border:1px solid CanvasText; }
  .campus-legal-gate .legal-consent-row input[type="checkbox"] { appearance:auto; }
  .campus-legal-gate .legal-consent-row input[type="checkbox"]::after { display:none; }
  .campus-legal-gate .legal-primary { border:1px solid ButtonText; }
}