/*
 * Privacy notice + consent pages (ADR-64/65): /{slug}/privacy, /privacy, the
 * consent / decline / withdraw screens and the invite page's notice block.
 *
 * Follows the template's layout rules (MEMBER-PRIVACY-NOTICE-TEMPLATE.md §4):
 * a SOLID light panel rather than the sign-in pages' see-through glass (hard
 * for older eyes), body text 17px at ~1.55 line height, inputs >= 16px so
 * iPhones don't zoom, whole checkbox labels tappable, tap targets >= 44px,
 * and two buttons of equal size and weight, "I don't agree" in a neutral
 * colour. Loaded with a ?v=<mtime> cache-buster (Cloudflare caches 7 days).
 */

*, *::before, *::after { box-sizing: border-box; }

:root {
  --pv-bg-deep: #0A1628;
  --pv-bg-mid:  #0E1D34;
  --pv-panel:   #FFFFFF;
  --pv-text:    #16202E;
  --pv-muted:   #4A5566;
  --pv-line:    #D9DEE6;
  --pv-soft:    #F3F5F8;
  --pv-accent:  #1E63C2;
  --pv-accent-dark: #174E9E;
  --pv-warn-bg: #FFF4E5;
  --pv-warn:    #8A4B00;
  --pv-err-bg:  #FDECEA;
  --pv-err:     #9B2C1F;
  --pv-ok-bg:   #E8F6F1;
  --pv-ok:      #1D6B55;
}

html, body { margin: 0; padding: 0; }

body.pv {
  min-height: 100vh;
  font-family: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 17px;
  line-height: 1.55;
  color: var(--pv-text);
  background: linear-gradient(135deg, var(--pv-bg-deep) 0%, var(--pv-bg-mid) 100%);
  background-attachment: fixed;
  padding: 24px 16px 48px;
}

.pv-wrap { max-width: 720px; margin: 0 auto; }

.pv-panel {
  background: var(--pv-panel);
  border-radius: 18px;
  padding: 28px 26px;
  box-shadow: 0 24px 48px -24px rgba(0,0,0,0.6);
}
@media (max-width: 480px) {
  .pv-panel { padding: 22px 16px; border-radius: 14px; }
}

.pv-org { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.pv-org img { width: 48px; height: 48px; border-radius: 12px; object-fit: cover; background: var(--pv-soft); }
.pv-org-name { font-weight: 600; font-size: 15px; color: var(--pv-muted); }

.pv h1 { font-family: 'Nunito Sans', system-ui, sans-serif; font-size: 26px; line-height: 1.25; margin: 0 0 10px; }
.pv h2 { font-family: 'Nunito Sans', system-ui, sans-serif; font-size: 20px; line-height: 1.3; margin: 26px 0 10px; }
.pv p { margin: 0 0 12px; }
.pv a { color: var(--pv-accent); }
.pv .muted { color: var(--pv-muted); font-size: 15px; }

.pv-test {
  background: var(--pv-warn-bg); color: var(--pv-warn); border: 1px solid #F2C27A;
  border-radius: 10px; padding: 10px 14px; font-weight: 600; margin-bottom: 16px;
}
.pv-msg { border-radius: 10px; padding: 12px 14px; margin-bottom: 16px; }
.pv-msg--error { background: var(--pv-err-bg); color: var(--pv-err); }
.pv-msg--ok    { background: var(--pv-ok-bg); color: var(--pv-ok); }
.pv-msg--info  { background: var(--pv-soft); color: var(--pv-text); }

/* Summary layer */
.pv-summary { list-style: none; margin: 0 0 16px; padding: 0; }
.pv-summary li { padding: 8px 0; border-bottom: 1px solid var(--pv-line); }
.pv-summary li:last-child { border-bottom: 0; }

/* Full notice: one <details> per section */
.pv-notice { border: 1px solid var(--pv-line); border-radius: 12px; margin: 10px 0 18px; }
.pv-notice > summary {
  list-style: none; cursor: pointer; padding: 12px 16px; min-height: 44px;
  font-weight: 600; color: var(--pv-accent);
}
.pv-notice > summary::-webkit-details-marker { display: none; }
.pv-notice[open] > summary { border-bottom: 1px solid var(--pv-line); }
.pv-notice-inner { padding: 8px 16px 16px; }
.pv-toc { margin: 8px 0 12px; padding-left: 20px; }
.pv-toc li { margin: 4px 0; }
.pv-sec { border-top: 1px solid var(--pv-line); }
.pv-sec:first-of-type { border-top: 0; }
.pv-sec > summary {
  list-style: none; cursor: pointer; padding: 12px 0; min-height: 44px;
  font-weight: 600; font-size: 18px;
}
.pv-sec > summary::-webkit-details-marker { display: none; }
.pv-sec > summary::before { content: '▸ '; color: var(--pv-muted); }
.pv-sec[open] > summary::before { content: '▾ '; }
.pv-sec ul { margin: 0 0 12px; padding-left: 22px; }
.pv-sec li { margin: 6px 0; }
.pv-back { font-size: 15px; margin: 4px 0 12px; }
.pv-seal { font-size: 15px; color: var(--pv-muted); border-left: 3px solid var(--pv-line); padding-left: 10px; }

/* Boxes */
.pv-intro { font-weight: 600; margin: 18px 0 10px; }
.pv-box {
  display: block; border: 2px solid var(--pv-line); border-radius: 12px;
  padding: 14px 16px; margin: 0 0 12px; cursor: pointer; background: #fff;
}
.pv-box:has(input:checked) { border-color: var(--pv-accent); background: #F4F8FE; }
.pv-box--error { border-color: var(--pv-err); }
.pv-box-row { display: flex; gap: 12px; align-items: flex-start; }
.pv-box input[type=checkbox] { width: 26px; height: 26px; flex: 0 0 26px; margin: 2px 0 0; accent-color: var(--pv-accent); }
.pv-tag {
  display: inline-block; font-size: 13px; font-weight: 700; letter-spacing: .02em;
  border-radius: 999px; padding: 2px 10px; margin-bottom: 8px; background: var(--pv-soft); color: var(--pv-muted);
}
.pv-tag--req { background: #E6EEFA; color: var(--pv-accent-dark); }
.pv-box ul { margin: 6px 0 8px; padding-left: 20px; }
.pv-box .help { font-size: 15px; color: var(--pv-muted); margin: 6px 0 0; }
.pv-optional { margin-top: 22px; padding-top: 14px; border-top: 1px dashed var(--pv-line); }
.pv-lead { font-size: 16px; color: var(--pv-muted); margin: 0 0 10px; }

/* Fields (invite page) */
.pv-field { margin: 0 0 14px; }
.pv-field label { display: block; font-size: 15px; font-weight: 600; margin-bottom: 6px; }
.pv-field input {
  width: 100%; font-size: 16px; padding: 12px 14px; min-height: 48px;
  border: 1px solid #B8C1CE; border-radius: 10px; font-family: inherit; color: var(--pv-text);
}
.pv-field input:disabled { background: var(--pv-soft); color: var(--pv-muted); }
.pv-field input:focus { outline: 3px solid rgba(30,99,194,0.25); border-color: var(--pv-accent); }
.pv-field .err, .pv-err { color: var(--pv-err); font-size: 15px; margin: 6px 0 0; }

/* Buttons: equal size and weight */
.pv-pre { font-size: 15px; color: var(--pv-muted); margin: 16px 0 10px; }
.pv-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0 0 10px; }
@media (max-width: 480px) { .pv-buttons { grid-template-columns: 1fr; } }
.pv-btn {
  display: flex; align-items: center; justify-content: center; text-align: center;
  min-height: 52px; padding: 12px 16px; border-radius: 12px;
  font: 600 17px/1.2 'DM Sans', system-ui, sans-serif; cursor: pointer; text-decoration: none;
  border: 2px solid var(--pv-accent); background: var(--pv-accent); color: #fff;
}
.pv-btn:hover { background: var(--pv-accent-dark); border-color: var(--pv-accent-dark); }
.pv-btn--neutral { background: #fff; color: var(--pv-text); border-color: #8A95A5; }
.pv-btn--neutral:hover { background: var(--pv-soft); border-color: #6B7686; }
.pv-post { background: var(--pv-soft); border-radius: 12px; padding: 14px 16px; margin: 14px 0; font-size: 16px; }
.pv-post ul { margin: 4px 0 10px; padding-left: 20px; }
.pv-links { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 18px; font-size: 15px; }
.pv-links form { display: inline; }
.pv-linkbtn { background: none; border: 0; padding: 0; font: inherit; color: var(--pv-accent); text-decoration: underline; cursor: pointer; }
.pv-foot { text-align: center; color: rgba(242,244,248,0.55); font-size: 13px; margin-top: 20px; }
.pv-foot a { color: rgba(242,244,248,0.8); }
.pv-history { font-size: 15px; }
.pv-history li { margin: 4px 0; }
