/* Formal legal pages (/terms, /privacy/policy). Long-form Thai legal text:
   one sheet of paper on the daylight tray, ~68ch measure, Thai line-height
   1.8, numbered clauses with a hanging number, sticky contents on wide
   screens and a collapsible one on phones. Both languages ship in the page;
   the html[lang] that site.js sets shows one. Prints as a clean document. */

/* one language at a time (html lang is "th" until site.js says otherwise) */
html[lang="en"] .lg-doc[data-doc-lang="th"],
html:not([lang="en"]) .lg-doc[data-doc-lang="en"]{display:none}

.lg{max-width:var(--wrap);margin:0 auto;padding:var(--sp-6) 20px var(--sp-8)}
.lg-head{margin:0 0 var(--sp-6)}
.lg-head>*{max-width:68ch}
.lg-kicker{font-size:var(--fs-xs);font-weight:600;letter-spacing:.04em;color:var(--forest2);text-transform:uppercase}
.lg-head h1{font-family:var(--display);font-size:var(--fs-h1);margin:var(--sp-2) 0 var(--sp-2);letter-spacing:-.01em;color:var(--gink)}
.lg-meta{display:inline-block;padding:4px 12px;border-radius:12px;background:#fff;box-shadow:0 0 0 1px var(--gline);font-size:var(--fs-sm);font-weight:500;color:var(--gink2)}
.lg-lead{margin-top:var(--sp-4);font-size:var(--fs-lead);line-height:1.7;color:var(--gink2);max-width:68ch}
.lg-note{margin-top:var(--sp-3);padding:10px 14px;border-radius:var(--r-sm);background:var(--unsure-soft);color:var(--unsure-ink);font-size:var(--fs-sm);max-width:68ch}
.lg-actions{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-5)}
.lg-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:var(--r-pill);background:#fff;border:0;box-shadow:0 0 0 1px var(--line2);color:var(--ink);font-size:var(--fs-sm);font-weight:500;text-decoration:none;cursor:pointer;transition:box-shadow var(--dur-fast) ease}
.lg-btn:hover{color:var(--ink);box-shadow:0 0 0 1.5px var(--ink)}

.lg-body{display:grid;grid-template-columns:260px minmax(0,1fr);gap:var(--sp-6);align-items:start}
.lg-toc{position:sticky;top:calc(var(--nav-h) + 16px);max-height:calc(100vh - var(--nav-h) - 32px);overflow:auto;padding:var(--sp-4);border-radius:var(--r);background:rgba(255,255,255,.7);box-shadow:0 0 0 1px var(--gline);font-size:var(--fs-sm)}
.lg-toc summary{font-weight:700;color:var(--gink);cursor:pointer;min-height:32px;display:flex;align-items:center}
.lg-toc ol{list-style:none;margin-top:var(--sp-2);display:grid;gap:2px}
.lg-toc a{display:block;padding:5px 8px;border-radius:8px;color:var(--gink2);text-decoration:none;line-height:1.45}
.lg-toc a:hover,.lg-toc a.on{background:var(--mint);color:var(--gink)}
.lg-toc a.on{font-weight:600}

.lg-text{background:#fff;border-radius:var(--r-lg);box-shadow:var(--sh-soft),0 0 0 1px rgba(13,43,29,.05);padding:var(--sp-7) clamp(20px,5vw,64px);max-width:860px;font-size:var(--fs-body);line-height:1.8;color:var(--ink)}
.lg-text section{max-width:68ch;scroll-margin-top:calc(var(--nav-h) + 16px)}
.lg-text section+section{margin-top:var(--sp-7);padding-top:var(--sp-6);border-top:1px solid var(--line-soft)}
.lg-text h2{font-family:var(--display);font-size:clamp(21px,2.2vw,25px);color:var(--gink);margin-bottom:var(--sp-4);display:flex;gap:12px;align-items:baseline}
.lg-n{flex:none;font-size:var(--fs-sm);font-weight:700;color:var(--forest2);background:var(--mint);border-radius:var(--r-pill);padding:2px 10px;font-variant-numeric:tabular-nums}
.lg-text h3{font-size:var(--fs-body);margin:var(--sp-5) 0 var(--sp-2);color:var(--gink)}
.lg-text p+p{margin-top:var(--sp-3)}
.lg-text ul{margin:var(--sp-2) 0 0;padding-left:1.3em;display:grid;gap:6px}
.lg-text ul+p,.lg-text .lg-table+p{margin-top:var(--sp-4)}
.lg-text a{color:var(--forest2);text-decoration:underline}
.lg-c{position:relative;padding-left:3.2em}
.lg-c>b:first-child{position:absolute;left:0;top:0;font-weight:600;color:var(--gink3);font-variant-numeric:tabular-nums}
dfn{font-style:normal;font-weight:600}
.lg-callout{margin:0 0 var(--sp-4);padding:var(--sp-4) var(--sp-5);border-radius:var(--r);background:var(--scam-soft);color:var(--scam-ink);box-shadow:inset 3px 0 0 var(--scam)}
.lg-callout b{color:var(--scam-ink)}
.lg-tbd{background:var(--unsure-soft);color:var(--unsure-ink);border-radius:4px;padding:0 4px;font-weight:600;box-decoration-break:clone;-webkit-box-decoration-break:clone}

.lg-table{margin-top:var(--sp-4);overflow-x:auto;border-radius:var(--r-sm);box-shadow:0 0 0 1px var(--line)}
.lg-table:focus-visible{outline:3px solid var(--brand-ink);outline-offset:2px}
.lg-table table{width:100%;border-collapse:collapse;font-size:var(--fs-sm);line-height:1.6}
.lg-table th,.lg-table td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--line-soft)}
.lg-table th{background:var(--gpaper);font-weight:600;color:var(--gink);white-space:nowrap}
.lg-table tr:last-child td{border-bottom:0}
.lg-log{color:var(--ink3);font-size:var(--fs-sm)}
.lg-log h2{font-size:var(--fs-body)}

@media (max-width:900px){
  .lg-body{grid-template-columns:minmax(0,1fr);gap:var(--sp-4)}
  .lg-toc{position:static;max-height:none}
  .lg-text{padding:var(--sp-6) 20px}
}
@media (max-width:560px){
  .lg{padding:var(--sp-5) 16px var(--sp-7)}
  .lg-text{border-radius:var(--r);padding:var(--sp-5) 16px;line-height:1.75}
  .lg-c{padding-left:2.8em}
  .lg-text h2{flex-direction:column;gap:6px}
  /* tables become one card per row; legal.js copies each header into data-label */
  .lg-table{box-shadow:none;overflow:visible}
  .lg-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .lg-table table,.lg-table tbody,.lg-table tr,.lg-table td{display:block}
  .lg-table tr{padding:12px 14px;border-radius:var(--r-sm);box-shadow:0 0 0 1px var(--line)}
  .lg-table tr+tr{margin-top:10px}
  .lg-table td{padding:2px 0;border:0}
  .lg-table td:first-child{font-weight:600;color:var(--gink);padding-bottom:4px}
  .lg-table td[data-label]:not(:first-child)::before{content:attr(data-label);display:block;font-size:var(--fs-xs);font-weight:600;color:var(--gink3);margin-top:6px}
}

@media print{
  @page{margin:18mm 16mm}
  body,body.soft{background:#fff!important}
  .nav,.foot,.lg-toc,.lg-actions{display:none!important}
  .lg{padding:0;max-width:none}
  .lg-body{display:block}
  .lg-text{box-shadow:none;padding:0;max-width:none;font-size:11pt;line-height:1.6}
  .lg-text section{max-width:none;break-inside:auto}
  .lg-text section+section{margin-top:14pt;padding-top:10pt}
  .lg-text h2{break-after:avoid}
  .lg-c{break-inside:avoid}
  .lg-text a{color:inherit}
  .lg-n{background:none;padding:0}
  .lg-table{box-shadow:none;overflow:visible}
  .lg-table th,.lg-table td{border:1px solid #bbb}
}