/* ==================================================================
   The Longevity Edge — Legal pages (Privacy / Terms / Shipping)
   Shared CSS for the three policy templates:
   - page-privacy-policy.php
   - page-terms-of-service.php
   - page-shipping-returns.php
   ================================================================== */

/* Hide Kadence chrome that doesn't belong on a long-form legal doc. */
body.page-template-page-privacy-policy .entry-header,
body.page-template-page-privacy-policy .page-title,
body.page-template-page-privacy-policy .entry-title,
body.page-template-page-terms-of-service .entry-header,
body.page-template-page-terms-of-service .page-title,
body.page-template-page-terms-of-service .entry-title,
body.page-template-page-shipping-returns .entry-header,
body.page-template-page-shipping-returns .page-title,
body.page-template-page-shipping-returns .entry-title { display: none !important; }

body.page-template-page-privacy-policy .content-area,
body.page-template-page-terms-of-service .content-area,
body.page-template-page-shipping-returns .content-area { margin-top: 0 !important; padding: 0 !important; }

body.page-template-page-privacy-policy .entry-content-wrap,
body.page-template-page-terms-of-service .entry-content-wrap,
body.page-template-page-shipping-returns .entry-content-wrap { padding: 0 !important; }

body.page-template-page-privacy-policy main#main,
body.page-template-page-terms-of-service main#main,
body.page-template-page-shipping-returns main#main { padding: 0 !important; }

body.page-template-page-privacy-policy .primary-sidebar,
body.page-template-page-terms-of-service .primary-sidebar,
body.page-template-page-shipping-returns .primary-sidebar { display: none !important; }

/* ---------- Section frame ---------- */
.le-legal { background: var(--canvas); padding: 0 0 var(--s-9); width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; min-height: 60vh; }

/* ---------- Hero band ---------- */
.le-legal-hero { background: linear-gradient(180deg, var(--navy-50) 0%, var(--canvas) 100%); border-bottom: 1px solid var(--navy-100); padding: var(--s-8) 0 var(--s-7); margin: 0 0 var(--s-7); }
.le-legal-hero .container { max-width: var(--container); margin: 0 auto; padding: 0 var(--s-5); }
.le-legal-hero .eyebrow { font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 700; color: var(--gold-600); text-transform: uppercase; letter-spacing: var(--ls-widest); margin: 0 0 var(--s-3); }
.le-legal-hero h1 { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-4xl); color: var(--navy-900); margin: 0 0 var(--s-4); letter-spacing: var(--ls-tight); line-height: var(--lh-tight); max-width: 18ch; }
.le-legal-hero .le-legal-lede { font-size: var(--fs-lg); color: var(--ink-700); margin: 0 0 var(--s-5); line-height: var(--lh-relaxed); max-width: 64ch; }
.le-legal-meta { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-5); align-items: center; font-size: var(--fs-sm); color: var(--ink-700); }
.le-legal-meta .le-legal-pill { display: inline-flex; align-items: center; gap: 6px; padding: 6px var(--s-3); background: var(--gold-50); border: 1px solid var(--gold-100); border-radius: var(--r-pill); color: var(--navy-900); font-weight: 600; font-size: var(--fs-xs); letter-spacing: var(--ls-wide); text-transform: uppercase; }
.le-legal-meta .le-legal-pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold-600); }
.le-legal-meta .le-legal-updated { color: var(--ink-500); }

/* ---------- Two-column layout (TOC + body) ---------- */
.le-legal-layout { max-width: var(--container); margin: 0 auto; padding: 0 var(--s-5); display: grid; grid-template-columns: 240px 1fr; gap: var(--s-7); align-items: start; }

/* ---------- TOC sidebar ---------- */
.le-legal-toc { position: sticky; top: var(--s-6); padding: var(--s-5); background: var(--surface); border: 1px solid var(--navy-100); border-radius: var(--r-lg); max-height: calc(100vh - var(--s-7)); overflow-y: auto; }
.le-legal-toc h2 { font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 700; color: var(--ink-700); text-transform: uppercase; letter-spacing: var(--ls-widest); margin: 0 0 var(--s-3); }
.le-legal-toc ol { list-style: none; counter-reset: toc; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.le-legal-toc li { counter-increment: toc; }
.le-legal-toc a { display: grid; grid-template-columns: 24px 1fr; gap: 8px; padding: 6px 8px; border-radius: var(--r-sm); color: var(--ink-700); text-decoration: none; font-size: var(--fs-sm); line-height: var(--lh-snug); transition: background var(--t-fast) var(--ease-out), color var(--t-fast) var(--ease-out); }
.le-legal-toc a::before { content: counter(toc); font-family: var(--font-body); font-weight: 700; color: var(--gold-600); font-size: var(--fs-xs); padding-top: 1px; }
.le-legal-toc a:hover { background: var(--gold-50); color: var(--navy-900); }
.le-legal-toc a:focus { outline: 2px solid var(--gold-600); outline-offset: 2px; }

/* ---------- Body content ---------- */
.le-legal-content { max-width: 720px; font-family: var(--font-body); font-size: var(--body-fs); color: var(--ink-900); line-height: var(--lh-relaxed); }
.le-legal-content h2 { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xl); color: var(--navy-900); margin: var(--s-7) 0 var(--s-4); letter-spacing: var(--ls-tight); line-height: var(--lh-snug); scroll-margin-top: var(--s-6); }
.le-legal-content h2:first-child { margin-top: 0; }
.le-legal-content h3 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-xl); color: var(--navy-800); margin: var(--s-6) 0 var(--s-3); letter-spacing: var(--ls-tight); line-height: var(--lh-snug); }
.le-legal-content h4 { font-family: var(--font-body); font-weight: 700; font-size: var(--fs-lg); color: var(--navy-800); margin: var(--s-5) 0 var(--s-3); }
.le-legal-content p { margin: 0 0 var(--s-4); }
.le-legal-content p:last-child { margin-bottom: 0; }
.le-legal-content strong { color: var(--navy-900); font-weight: 700; }
.le-legal-content a { color: var(--gold-600); text-decoration: underline; text-underline-offset: 2px; transition: color var(--t-fast) var(--ease-out); }
.le-legal-content a:hover { color: var(--cta-600); }
.le-legal-content a:focus { outline: 2px solid var(--gold-600); outline-offset: 2px; border-radius: 2px; }

.le-legal-content ul,
.le-legal-content ol { margin: 0 0 var(--s-5); padding: 0 0 0 var(--s-5); }
.le-legal-content ul { list-style: none; }
.le-legal-content ul li { position: relative; padding-left: var(--s-4); margin-bottom: var(--s-3); line-height: var(--lh-relaxed); }
.le-legal-content ul li::before { content: ""; position: absolute; left: 0; top: 12px; width: 6px; height: 6px; border-radius: 50%; background: var(--gold-600); }
.le-legal-content ol li { margin-bottom: var(--s-3); padding-left: var(--s-2); line-height: var(--lh-relaxed); }
.le-legal-content ol li::marker { color: var(--gold-600); font-weight: 700; }

/* Callouts (blockquote + .le-legal-callout) */
.le-legal-content blockquote,
.le-legal-content .le-legal-callout { margin: var(--s-5) 0; padding: var(--s-4) var(--s-5); background: var(--gold-50); border: 1px solid var(--gold-100); border-left: 4px solid var(--gold-600); border-radius: var(--r-md); font-size: var(--fs-base); color: var(--navy-900); }
.le-legal-content blockquote p,
.le-legal-content .le-legal-callout p { margin: 0 0 var(--s-2); }
.le-legal-content blockquote p:last-child,
.le-legal-content .le-legal-callout p:last-child { margin-bottom: 0; }

/* Tables */
.le-legal-content table { width: 100%; border-collapse: collapse; margin: var(--s-5) 0; background: var(--surface); border: 1px solid var(--navy-100); border-radius: var(--r-md); overflow: hidden; }
.le-legal-content thead { background: var(--navy-50); }
.le-legal-content th { text-align: left; padding: var(--s-3) var(--s-4); font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 700; color: var(--navy-900); text-transform: uppercase; letter-spacing: var(--ls-wide); border-bottom: 1px solid var(--navy-100); }
.le-legal-content td { padding: var(--s-3) var(--s-4); font-size: var(--fs-sm); color: var(--ink-900); border-bottom: 1px solid var(--navy-100); vertical-align: top; line-height: var(--lh-relaxed); }
.le-legal-content tr:last-child td { border-bottom: 0; }

/* Address block */
.le-legal-content .le-legal-address { padding: var(--s-4) var(--s-5); background: var(--surface); border: 1px solid var(--navy-100); border-left: 4px solid var(--navy-700); border-radius: var(--r-md); font-family: var(--font-body); line-height: var(--lh-relaxed); margin: var(--s-4) 0; }

/* Medical disclaimer — extra visual weight (Terms §9) */
.le-legal-content .le-legal-medical { margin: var(--s-6) 0; padding: var(--s-6); background: var(--cta-100); border: 1px solid #F4C9C7; border-left: 4px solid var(--cta-600); border-radius: var(--r-md); }
.le-legal-content .le-legal-medical h2 { margin-top: 0; color: var(--cta-700); }
.le-legal-content .le-legal-medical strong { color: var(--cta-700); }

/* Arbitration emphasis block (Terms §16) */
.le-legal-content .le-legal-emphasis { padding: var(--s-4) var(--s-5); background: var(--navy-50); border: 1px solid var(--navy-100); border-radius: var(--r-md); font-weight: 600; color: var(--navy-900); margin: var(--s-4) 0; }

/* Cross-link footer (links to the other two legal docs + contact) */
.le-legal-related { max-width: var(--container); margin: var(--s-9) auto 0; padding: 0 var(--s-5); }
.le-legal-related h2 { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-xl); color: var(--navy-900); margin: 0 0 var(--s-4); letter-spacing: var(--ls-tight); }
.le-legal-related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-4); }
.le-legal-related-card { display: block; padding: var(--s-5); background: var(--surface); border: 1px solid var(--navy-100); border-radius: var(--r-lg); text-decoration: none; color: var(--navy-900); transition: border-color var(--t-default) var(--ease-out), box-shadow var(--t-default) var(--ease-out), transform var(--t-default) var(--ease-out); }
.le-legal-related-card:hover { border-color: var(--gold-300); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.le-legal-related-card .eyebrow { font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 700; color: var(--gold-600); text-transform: uppercase; letter-spacing: var(--ls-widest); margin: 0 0 var(--s-2); }
.le-legal-related-card .title { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-lg); margin: 0 0 var(--s-2); line-height: var(--lh-snug); }
.le-legal-related-card .desc { font-size: var(--fs-sm); color: var(--ink-700); margin: 0; line-height: var(--lh-relaxed); }

/* "Anything unclear? Email Doc" footer band */
.le-legal-contact { max-width: var(--container); margin: var(--s-7) auto 0; padding: 0 var(--s-5); }
.le-legal-contact-inner { padding: var(--s-6); background: var(--navy-900); color: #fff; border-radius: var(--r-lg); display: flex; flex-wrap: wrap; gap: var(--s-5); align-items: center; justify-content: space-between; }
.le-legal-contact h2 { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-xl); margin: 0 0 var(--s-2); color: #fff; letter-spacing: var(--ls-tight); }
.le-legal-contact p { margin: 0; color: var(--navy-100); font-size: var(--fs-base); line-height: var(--lh-relaxed); }
.le-legal-contact-btn { display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 var(--s-5); background: var(--gold-500); color: var(--navy-900); border-radius: var(--r-md); font-family: var(--font-body); font-size: var(--fs-base); font-weight: 700; text-decoration: none; transition: background var(--t-fast) var(--ease-out), transform var(--t-fast) var(--ease-out); }
.le-legal-contact-btn:hover { background: var(--gold-300); transform: translateY(-1px); color: var(--navy-900); }

/* ---------- Tablet / mobile ---------- */
@media (max-width: 960px) {
	.le-legal-layout { grid-template-columns: 1fr; gap: var(--s-5); }
	.le-legal-toc { position: static; max-height: none; }
	.le-legal-toc details { margin: 0; }
	.le-legal-toc summary { font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 700; color: var(--ink-700); text-transform: uppercase; letter-spacing: var(--ls-widest); cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; padding: 0; }
	.le-legal-toc summary::-webkit-details-marker { display: none; }
	.le-legal-toc summary::after { content: "+"; font-size: var(--fs-lg); color: var(--gold-600); font-weight: 700; }
	.le-legal-toc details[open] summary::after { content: "−"; }
	.le-legal-toc details ol { margin-top: var(--s-3); }
	.le-legal-related-grid { grid-template-columns: 1fr; }
	.le-legal-contact-inner { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 640px) {
	.le-legal-hero { padding: var(--s-6) 0 var(--s-5); margin-bottom: var(--s-5); }
	.le-legal-hero h1 { font-size: var(--fs-3xl); }
	.le-legal-content { font-size: var(--body-fs); }
	.le-legal-content h2 { font-size: var(--fs-xl); }
	.le-legal-content h3 { font-size: var(--fs-lg); }
	.le-legal-content table { font-size: var(--fs-xs); }
	.le-legal-content th, .le-legal-content td { padding: var(--s-2) var(--s-3); }
}

/* Print styles — for the legally-cautious customer who saves a PDF. */
@media print {
	.le-legal-toc, .le-legal-related, .le-legal-contact, .promo-bar, header, footer { display: none !important; }
	.le-legal-hero { background: none; border-bottom: 2px solid #000; padding: 0 0 12pt; margin: 0 0 12pt; }
	.le-legal-layout { display: block; max-width: none; padding: 0; }
	.le-legal-content { font-size: 11pt; color: #000; max-width: none; }
	.le-legal-content h2, .le-legal-content h3, .le-legal-content h4 { color: #000; }
	.le-legal-content a { color: #000; text-decoration: none; }
	.le-legal { padding: 0; background: none; min-height: 0; position: static; left: 0; right: 0; margin: 0; width: 100%; }
}