/* =====================================================================
   JM RADIO — legal.css : mentions légales, confidentialité, CGU, règlement
   ===================================================================== */
.lg-layout { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 20px; align-items: start; max-width: 1180px; }
.lg-aside { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 14px; }
.lg-box { padding: 14px; border-radius: 18px; background: var(--jm-panel, rgba(12,16,27,.78)); border: 1px solid var(--jm-border, rgba(255,255,255,.07)); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.lg-box-title { font-size: 0.66rem; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; color: #64748B; margin: 2px 6px 8px; }
.lg-toc, .lg-docs { display: flex; flex-direction: column; gap: 2px; }
.lg-toc a, .lg-docs a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; color: #A3AEC2; text-decoration: none; font-size: 0.84rem; font-weight: 600; line-height: 1.3; transition: background .15s ease, color .15s ease; }
.lg-toc a span { width: 22px; height: 22px; flex: none; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; font-size: 0.7rem; font-weight: 800; color: #94A3B8; background: rgba(255, 255, 255, 0.05); }
.lg-toc a:hover, .lg-docs a:hover { background: rgba(255, 255, 255, 0.05); color: #fff; }
.lg-toc a.active { color: #fff; background: rgba(251, 191, 36, 0.1); }
.lg-toc a.active span { background: var(--gradient-gold); color: #111; }
.lg-docs a i { width: 16px; text-align: center; color: #64748B; }
.lg-docs a.active { color: #fff; background: rgba(251, 191, 36, 0.12); box-shadow: inset 0 0 0 1px rgba(251, 191, 36, 0.25); }
.lg-docs a.active i { color: var(--gold); }

.lg-article { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.lg-section { scroll-margin-top: 20px; padding: 22px 24px; border-radius: var(--jm-radius, 22px); background: var(--jm-panel, rgba(12,16,27,.78)); border: 1px solid var(--jm-border, rgba(255,255,255,.07)); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.lg-section:target { border-color: rgba(251, 191, 36, 0.45); }
.lg-section h2 { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; font-size: 1.12rem; font-weight: 800; color: #fff; line-height: 1.3; }
.lg-ico { width: 38px; height: 38px; flex: none; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; font-size: 0.95rem; color: var(--gold); background: rgba(251, 191, 36, 0.12); border: 1px solid rgba(251, 191, 36, 0.25); }
.lg-n { font-size: 0.75rem; font-weight: 800; color: #475569; font-variant-numeric: tabular-nums; }
.lg-body { color: #CBD5E1; font-size: 0.93rem; line-height: 1.7; }
.lg-body p { margin: 0 0 12px; }
.lg-body p:last-child { margin-bottom: 0; }
.lg-body strong { color: #fff; }
.lg-body a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.lg-body { overflow-wrap: anywhere; }
.lg-note { position: relative; margin: 0 0 14px; padding: 11px 14px 11px 40px; border-radius: 12px; font-size: 0.86rem; font-weight: 600; color: #FDE68A; background: rgba(251, 191, 36, 0.08); border: 1px solid rgba(251, 191, 36, 0.22); line-height: 1.55; }
.lg-note > i:first-child { position: absolute; left: 14px; top: 14px; color: var(--gold); }
.lg-list { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.lg-list li { position: relative; padding: 10px 12px 10px 40px; border-radius: 12px; background: rgba(255, 255, 255, 0.025); border: 1px solid rgba(255, 255, 255, 0.05); line-height: 1.6; }
.lg-list li > i:first-child { position: absolute; left: 12px; top: 15px; width: 18px; text-align: center; color: var(--gold); font-size: 0.85rem; }
.lg-list li > i.fa-ban { color: #F87171; }
.lg-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.lg-badge { display: inline-flex; align-items: center; padding: 6px 12px; border-radius: 999px; font-size: 0.78rem; font-weight: 700; color: #E2E8F0; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.1); }
.lg-foot { margin: 4px 0 0; padding: 14px 18px; border-radius: 16px; font-size: 0.88rem; color: var(--text-secondary); background: rgba(255, 255, 255, 0.03); border: 1px dashed rgba(255, 255, 255, 0.1); }
.lg-foot i { color: var(--gold); margin-right: 6px; }
.lg-foot a { color: var(--gold); font-weight: 700; }

@media (max-width: 1100px) {
    .lg-layout { grid-template-columns: minmax(0, 1fr); }
    .lg-aside { position: static; }
    .lg-aside .lg-box:first-child { display: none; }
    .lg-docs { flex-direction: row; flex-wrap: wrap; gap: 6px; }
    .lg-docs a { padding: 7px 12px; background: rgba(255, 255, 255, 0.04); }
}
@media (max-width: 760px) {
    .lg-section { padding: 16px; }
    .lg-section h2 { font-size: 1rem; gap: 10px; }
    .lg-ico { width: 32px; height: 32px; font-size: 0.85rem; }
    .lg-n { display: none; }
    .lg-body { font-size: 0.9rem; }
    .lg-docs a { font-size: 0.78rem; }
}
