/* Elwekalah legal template (Terms, Privacy), v13.3. Loads after home.css. */

.lg { max-width: 820px; margin: 0 auto; padding: clamp(40px, 8cqi, 96px) clamp(16px, 4cqi, 40px) clamp(40px, 6cqi, 80px); display: grid; gap: 28px; }

.lg__tabs { display: inline-flex; justify-self: start; gap: 4px; padding: 4px; border: 1px solid var(--hair); border-radius: 999px; background: var(--surface); }
.lg__tabs a { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 16px; border-radius: 999px; text-decoration: none; color: var(--muted); font-size: 14px; font-weight: 500; }
@container site (max-width: 559px) {
  .lg__tabs a { min-height: 44px; }
}
.lg__tabs a:hover { color: var(--text); }
.lg__tabs a[aria-current="page"] { background: var(--accent); color: #111827; }
.lg__tabs a:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

.lg h1 { margin: 0; font-weight: 700; font-size: clamp(2.3rem, 6cqi, 4.2rem); line-height: 1.02; letter-spacing: -.045em; }
.site:lang(ar) .lg h1 { letter-spacing: 0; line-height: 1.3; }

.lg__status { display: grid; gap: 16px; padding: 22px; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius: 22px; background: var(--surface); }
.lg__status p { margin: 0; font-size: clamp(1.02rem, 1.6cqi, 1.15rem); line-height: 1.6; }
.lg__soon { display: inline-flex; align-items: center; gap: 10px; justify-self: start; font-weight: 700; }
.lg__soon::before { content: ""; width: 12px; height: 12px; border-radius: 50%; border: 2px dashed var(--accent); }
.lg__ask { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.lg__ask span { font: 400 13px/1.4 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.site:lang(ar) .lg__ask span { font: 700 15px/1.4 var(--font-ar); letter-spacing: 0; }
.lg__ask a { font-weight: 700; color: var(--text); text-underline-offset: 4px; text-decoration-color: var(--accent); }

.lg__sec { display: grid; gap: 14px; padding-top: 28px; border-top: 1px solid var(--hair); }
.lg__sec h2 { margin: 0; font-size: clamp(1.4rem, 2.8cqi, 2rem); line-height: 1.15; letter-spacing: -.02em; }
.site:lang(ar) .lg__sec h2 { letter-spacing: 0; line-height: 1.4; }
.lg__sec p { margin: 0; font-size: 17px; line-height: 1.7; max-width: 68ch; }
.lg__note { color: var(--muted); font-size: 15px !important; }

.lg--404 { gap: 20px; }
.lg__code { margin: 0; font: 400 13px/1.4 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.site:lang(ar) .lg__code { font: 700 15px/1.4 var(--font-ar); letter-spacing: 0; }
.lg__ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }

.lg__table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--hair); border-radius: 18px; overflow: hidden; background: var(--surface); font-size: 15px; line-height: normal; }
.lg__table th, .lg__table td { padding: 14px 16px; text-align: start; vertical-align: top; }
.lg__table thead th { font: 400 12px/1.4 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); background: var(--surface-2); }
.site:lang(ar) .lg__table thead th { font: 700 14px/1.4 var(--font-ar); letter-spacing: 0; }
.lg__table tbody th { font-weight: 700; white-space: nowrap; }
@container site (max-width: 599px) {
  .lg__table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .lg__table, .lg__table tbody, .lg__table tr, .lg__table th, .lg__table td { display: block; }
  .lg__table tbody th { white-space: normal; padding-bottom: 4px; }
  .lg__table td { padding-top: 6px; }
  .lg__table td::before { content: attr(data-label); display: block; font: 400 12px/1.4 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-bottom: 2px; }
  .site:lang(ar) .lg__table td::before { font: 700 14px/1.4 var(--font-ar); letter-spacing: 0; }
}
