/* Legal / Policy pages — professional light layout */
.legal-page{
  --legal-accent:#0066ff;
  --legal-accent-soft:#eff6ff;
  --legal-accent-mid:#dbeafe;
  --legal-text:#0f172a;
  --legal-body:#374151;
  --legal-muted:#64748b;
  --legal-border:#e2e8f0;
  --legal-card:#fff;
  --legal-danger:#dc2626;
  --legal-danger-bg:#fff1f2;
  --legal-danger-soft:#fee2e2;
  --legal-danger-title:#991b1b;
}

.legal-crumb{
  display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;
  font-size:.75rem;color:var(--legal-muted);margin-bottom:1rem;
}
.legal-crumb a{color:inherit;text-decoration:none}
.legal-crumb a:hover{color:var(--legal-accent)}
.legal-crumb .current{color:var(--legal-text);font-weight:600}

.legal-hero{
  background:var(--legal-card);
  border:1px solid var(--legal-border);
  border-radius:1rem;
  padding:1.75rem 1.5rem;
  margin-bottom:1.5rem;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.legal-hero-top{display:flex;align-items:flex-start;gap:1.15rem}
.legal-hero-icon{
  width:56px;height:56px;border-radius:1rem;flex-shrink:0;
  background:var(--legal-accent-soft);color:var(--legal-accent);
  display:inline-flex;align-items:center;justify-content:center;font-size:1.5rem;
}
.legal-title{font-size:clamp(1.35rem,2.4vw,1.75rem);font-weight:800;color:var(--legal-text);margin:0 0 .4rem;letter-spacing:-.02em;line-height:1.25}
.legal-meta{color:var(--legal-muted);font-size:.875rem;margin:0}
.legal-meta strong{color:var(--legal-text);font-weight:600}
.legal-hero-intro{
  margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid #f1f5f9;
  color:var(--legal-body);font-size:.875rem;line-height:1.7;
}
.legal-hero-intro .legal-brand,.legal-brand{color:var(--legal-accent);font-weight:700}
.legal-notice{
  background:var(--legal-accent-soft);
  border:1px solid rgba(0,102,255,.18);
  border-radius:.75rem;padding:.85rem 1rem;
  color:var(--legal-text);font-size:.875rem;margin-top:1rem;line-height:1.55;
}

.legal-layout{
  display:grid;grid-template-columns:260px 1fr;gap:2rem;align-items:start;
}
@media (max-width:991.98px){.legal-layout{grid-template-columns:1fr;gap:1.25rem}}

.legal-toc-wrap{position:sticky;top:88px;display:flex;flex-direction:column;gap:1rem}
@media (max-width:991.98px){.legal-toc-wrap{position:static}}
.legal-toc{
  background:var(--legal-card);
  border:1px solid var(--legal-border);
  border-radius:.85rem;padding:1.15rem 1.1rem;
  max-height:calc(100vh - 180px);overflow:auto;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
@media (max-width:991.98px){.legal-toc{max-height:none}}
.legal-toc-title{
  font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--legal-text);margin:0 0 1rem;
}
.legal-toc ol{list-style:none;margin:0;padding:0}
.legal-toc a{
  display:block;padding:.45rem .7rem;border-radius:.55rem;
  color:var(--legal-muted);text-decoration:none;font-size:.8125rem;line-height:1.4;
  transition:background .15s,color .15s;
}
.legal-toc a:hover,.legal-toc a.is-active{
  background:var(--legal-accent-soft);color:var(--legal-accent);
}
.legal-compliance-card{
  text-align:center;padding:1rem;
  border-radius:.85rem;border:1px solid #a7f3d0;background:#f0fdf4;
}
.legal-compliance-ico{
  width:40px;height:40px;border-radius:999px;margin:0 auto .5rem;
  display:flex;align-items:center;justify-content:center;
  background:#d1fae5;color:#059669;font-size:1.15rem;
}
.legal-compliance-title{margin:0 0 .15rem;font-size:.75rem;font-weight:800;color:#065f46}
.legal-compliance-sub{margin:0;font-size:.6875rem;color:#047857}

.legal-main-col{min-width:0;display:flex;flex-direction:column;gap:1.15rem}

.legal-content{
  display:flex;
  flex-direction:column;
  gap:1.15rem;
}
.legal-content .legal-intro{display:none} /* intro đã hiện ở hero khi tách; giữ trong content nếu admin edit */

.legal-sec{
  background:var(--legal-card);
  border:1px solid var(--legal-border);
  border-radius:.85rem;overflow:hidden;
  scroll-margin-top:96px;
  box-shadow:0 1px 2px rgba(15,23,42,.03);
  margin:0;
}
.legal-sec-head{
  display:flex;align-items:center;gap:.75rem;
  padding:.9rem 1.25rem;border-bottom:1px solid #f1f5f9;
  background:#f8fafc;
}
.legal-sec-num{
  width:32px;height:32px;border-radius:999px;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:.8125rem;font-weight:800;
  background:var(--legal-accent-mid);color:#1d4ed8;
}
.legal-sec-head h2{
  margin:0;font-size:1rem;font-weight:800;color:var(--legal-text);line-height:1.3;
}
.legal-badge{
  margin-left:auto;flex-shrink:0;
  font-size:.6875rem;font-weight:700;
  padding:.2rem .65rem;border-radius:999px;
  background:var(--legal-danger-soft);color:var(--legal-danger);
}
.legal-sec--danger .legal-sec-head{background:var(--legal-danger-bg)}
.legal-sec--danger .legal-sec-num{background:var(--legal-danger-soft);color:var(--legal-danger)}
.legal-sec--danger .legal-sec-head h2{color:var(--legal-danger-title)}

.legal-sec-body{padding:1.15rem 1.25rem 1.35rem}
.legal-sec-body > p,.legal-lead{
  margin:0 0 .75rem;font-size:.875rem;color:var(--legal-body);font-weight:600;line-height:1.55;
}
.legal-sec-body > p:not(.legal-lead){font-weight:400;line-height:1.7}
.legal-sec-body .legal-lead + .legal-checks,
.legal-sec-body .legal-lead + .legal-bans{margin-top:0}
.legal-sec-body .legal-checks + .legal-lead,
.legal-sec-body .legal-bans + .legal-lead{margin-top:1.15rem}

.legal-checks,.legal-bans{list-style:none;margin:0;padding:0}
.legal-checks li,.legal-bans li{
  position:relative;padding-left:1.85rem;margin:0 0 .55rem;
  font-size:.875rem;color:var(--legal-body);line-height:1.55;
}
.legal-checks li:last-child,.legal-bans li:last-child{margin-bottom:0}
.legal-checks li::before,.legal-bans li::before{
  content:"✓";position:absolute;left:0;top:.1rem;
  width:20px;height:20px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:800;line-height:1;
  background:var(--legal-accent-soft);color:var(--legal-accent);
}
.legal-bans li::before{
  content:"✕";background:var(--legal-danger-soft);color:var(--legal-danger);
}

.legal-dl{margin:0}
.legal-dl > div{display:flex;gap:.75rem;margin:0 0 .75rem}
.legal-dl > div:last-child{margin-bottom:0}
.legal-dl dt{font-size:.875rem;font-weight:700;color:var(--legal-text);flex-shrink:0;min-width:110px}
.legal-dl dd{margin:0;font-size:.875rem;color:var(--legal-body);line-height:1.55}

/* Fallback: nội dung CKEditor cũ (h2/ul) */
.legal-content > h2,.legal-content > h3{
  background:#f8fafc;border:1px solid var(--legal-border);border-bottom:0;
  border-radius:.85rem .85rem 0 0;padding:.9rem 1.25rem;margin:1.15rem 0 0;
  font-size:1rem;font-weight:800;color:var(--legal-text);scroll-margin-top:96px;
}
.legal-content > h2:first-child,.legal-content > h3:first-child{margin-top:0}
.legal-content > p,.legal-content > ul,.legal-content > ol,.legal-content > dl{
  background:#fff;border:1px solid var(--legal-border);border-top:0;
  margin:0;padding:1rem 1.25rem 1.25rem;border-radius:0 0 .85rem .85rem;
}
.legal-content > h2 + p,.legal-content > h2 + ul,.legal-content > h2 + ol,.legal-content > h2 + dl,
.legal-content > h3 + p,.legal-content > h3 + ul,.legal-content > h3 + ol,.legal-content > h3 + dl{
  border-radius:0 0 .85rem .85rem;
}

.legal-empty{text-align:center;padding:3rem 1rem;color:var(--legal-muted);background:#fff;border:1px solid var(--legal-border);border-radius:.85rem}
.legal-empty i{font-size:2.5rem;opacity:.45;display:block;margin-bottom:.75rem}

.legal-related{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.25rem}
.legal-related a{
  border:1px solid var(--legal-border);border-radius:999px;padding:.4rem .9rem;
  font-size:.85rem;color:var(--legal-text);text-decoration:none;background:#fff;
}
.legal-related a:hover{border-color:var(--legal-accent);color:var(--legal-accent)}

.legal-cta{
  display:flex;flex-wrap:wrap;align-items:center;gap:1rem;
  background:#fff;border:1px solid var(--legal-border);
  border-radius:.85rem;padding:1.25rem 1.35rem;margin-top:.25rem;
  box-shadow:0 1px 2px rgba(15,23,42,.03);
}
.legal-cta-text{flex:1;min-width:200px}
.legal-cta-text strong{display:block;color:var(--legal-text);font-size:.875rem;margin-bottom:.2rem}
.legal-cta-text span{font-size:.75rem;color:var(--legal-muted)}
.legal-cta-actions{display:flex;flex-wrap:wrap;gap:.6rem}
.legal-cta-actions a{
  display:inline-flex;align-items:center;justify-content:center;
  padding:.65rem 1.15rem;border-radius:.55rem;font-size:.875rem;font-weight:600;text-decoration:none;
}
.legal-cta-actions .btn-primary-legal{background:var(--legal-accent);color:#fff}
.legal-cta-actions .btn-primary-legal:hover{background:#0047cc;color:#fff}
.legal-cta-actions .btn-facebook-legal{background:#1877F2}
.legal-cta-actions .btn-facebook-legal:hover{background:#0f66d8;color:#fff}
.legal-cta-actions .btn-ghost-legal{border:1px solid var(--legal-border);color:#1d4ed8;background:#fff}
.legal-cta-actions .btn-ghost-legal:hover{border-color:#bfdbfe;background:var(--legal-accent-soft)}

/* Privacy theme (xanh lá) */
.legal-page--privacy{
  --legal-accent:#059669;
  --legal-accent-soft:#f0fdf4;
  --legal-accent-mid:#d1fae5;
}
.legal-page--privacy .legal-hero-icon{background:#d1fae5;color:#059669}
.legal-page--privacy .legal-sec-num{background:#d1fae5;color:#059669}
.legal-page--privacy .legal-toc a:hover,
.legal-page--privacy .legal-toc a.is-active{background:#f0fdf4;color:#059669}
.legal-page--privacy .legal-cta-actions .btn-primary-legal{background:#059669}
.legal-page--privacy .legal-cta-actions .btn-primary-legal:hover{background:#047857;color:#fff}
.legal-page--privacy .legal-cta-actions .btn-ghost-legal{border-color:#a7f3d0;color:#065f46}
.legal-page--privacy .legal-cta-actions .btn-ghost-legal:hover{background:#f0fdf4;border-color:#6ee7b7}
.legal-page--privacy .legal-related a:hover{border-color:#059669;color:#059669}
.legal-page--privacy .legal-cta-text strong{color:#065f46}

.legal-alert{
  display:flex;align-items:flex-start;gap:.75rem;
  padding:1rem;border-radius:.75rem;border:1px solid #a7f3d0;background:#f0fdf4;
}
.legal-alert i{color:#059669;font-size:1.1rem;margin-top:.1rem;flex-shrink:0}
.legal-alert p{margin:0;font-size:.875rem;color:#065f46;line-height:1.6}
.legal-alert strong{font-weight:700}

.legal-data-grid{
  display:grid;grid-template-columns:1fr;gap:.75rem;
}
@media (min-width:640px){.legal-data-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:992px){.legal-data-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.legal-data-card{
  border:1px solid #a7f3d0;background:#f0fdf4;border-radius:.85rem;padding:1rem;
}
.legal-data-card-title{
  display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem;
  font-size:.75rem;font-weight:800;color:#065f46;
}
.legal-data-card-title i{
  width:28px;height:28px;border-radius:.5rem;
  display:inline-flex;align-items:center;justify-content:center;
  background:#d1fae5;color:#059669;font-size:.95rem;
}
.legal-mini-checks{list-style:none;margin:0;padding:0}
.legal-mini-checks li{
  position:relative;padding-left:1.35rem;margin:0 0 .4rem;
  font-size:.75rem;color:#374151;line-height:1.4;
}
.legal-mini-checks li:last-child{margin-bottom:0}
.legal-mini-checks li::before{
  content:"✓";position:absolute;left:0;top:0;color:#059669;font-size:.7rem;font-weight:800;
}

.legal-note-box{
  display:flex;align-items:flex-start;gap:.65rem;
  margin-top:.85rem;padding:.85rem 1rem;border-radius:.75rem;
  border:1px solid #f1f5f9;background:#f8fafc;
}
.legal-note-box i{color:var(--legal-muted);flex-shrink:0;margin-top:.1rem}
.legal-note-box p{margin:0;font-size:.8125rem;color:var(--legal-body);line-height:1.55}

.legal-contact-list{display:flex;flex-direction:column;gap:.65rem}
.legal-contact-item{
  display:flex;align-items:center;gap:1rem;text-decoration:none;
  padding:.85rem 1rem;border-radius:.75rem;border:1px solid #f1f5f9;background:#f8fafc;
  transition:border-color .15s;
}
.legal-contact-item:hover{border-color:#a7f3d0}
.legal-contact-item.is-static{cursor:default}
.legal-contact-ico{
  width:32px;height:32px;border-radius:.5rem;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  background:#d1fae5;color:#059669;
}
.legal-contact-item small{
  display:block;font-size:.65rem;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:#94a3b8;margin-bottom:.1rem;
}
.legal-contact-item strong{font-size:.875rem;font-weight:600;color:#059669}
.legal-contact-item.is-static strong{color:#374151}

/* Hub Điều khoản & Chính sách */
.legal-hub-hero{
  display:flex;align-items:flex-start;gap:1.15rem;
  background:#fff;border:1px solid #e2e8f0;border-radius:1rem;
  padding:1.75rem 1.5rem;margin-bottom:1.75rem;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.legal-hub-hero-ico{
  width:56px;height:56px;border-radius:1rem;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  background:#eff6ff;color:#2563eb;font-size:1.5rem;
}
.legal-hub-hero h1{margin:0 0 .4rem;font-size:clamp(1.35rem,2.4vw,1.75rem);font-weight:800;color:#0f172a;letter-spacing:-.02em}
.legal-hub-hero p{margin:0;font-size:.9rem;color:#64748b;line-height:1.55;max-width:52rem}
.legal-hub-group{margin-bottom:1.75rem}
.legal-hub-group-title{
  display:flex;align-items:center;gap:.65rem;
  margin:0 0 .85rem;font-size:1rem;font-weight:800;color:#0f172a;
}
.legal-hub-group-title::before{
  content:"";width:4px;height:1.1rem;border-radius:999px;background:#2563eb;flex-shrink:0;
}
.legal-hub-grid{
  display:grid;grid-template-columns:1fr;gap:.65rem;
}
@media (min-width:768px){.legal-hub-grid{grid-template-columns:1fr 1fr}}
.legal-hub-card{
  display:flex;align-items:center;gap:.85rem;
  background:#fff;border:1px solid #e2e8f0;border-radius:.85rem;
  padding:1rem 1.1rem;text-decoration:none;color:inherit;
  transition:border-color .15s,box-shadow .15s,transform .15s;
}
.legal-hub-card:hover{border-color:#bfdbfe;box-shadow:0 8px 24px rgba(37,99,235,.08);transform:translateY(-1px)}
.legal-hub-card-ico{
  width:40px;height:40px;border-radius:.65rem;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  background:#eff6ff;color:#2563eb;font-size:1.15rem;
}
.legal-hub-card-text{flex:1;min-width:0}
.legal-hub-card-text strong{display:block;font-size:.925rem;font-weight:700;color:#0f172a;margin-bottom:.15rem}
.legal-hub-card-text span{display:block;font-size:.8rem;color:#64748b;line-height:1.4}
.legal-hub-card-arrow{color:#94a3b8;font-size:1.25rem;flex-shrink:0}

.d-none{display:none!important}
@media (min-width:992px){.d-lg-block{display:block!important}}
