/* 5.0.9 — Theme mau (Python Lab & ML Academy, file mau Võ gui 31/10).
   Tokens dung goc mau: tim #5B3FD6, tim nhat #7B62E0, tim mo #EDE9FF,
   do #D3263A, xanh la #138A5A, cam #B86E00, nen #F5F6FA, nen phu #ECEEF5,
   muc #1A1B2E / #4A4B6A / #8A8BA8, vien #D8DAE8, sidebar 248px, topbar 60px,
   bo goc 10px, font Be Vietnam Pro + JetBrains Mono (da co o index.html).
   File nay chi can chinh token + them lop dung chung cho mau; khong viet lai
   toan bo CSS cua he thong (he thong von da dung cung bo token nay). */
:root {
  --brand: #5B3FD6;
  --brand-light: #7B62E0;
  --brand-dim: #EDE9FF;
  --do: #D3263A;
  --la: #138A5A;
  --cam: #B86E00;
  --paper: #F5F6FA;
  --paper2: #ECEEF5;
  --ink: #1A1B2E;
  --ink2: #4A4B6A;
  --ink3: #8A8BA8;
  --border: #D8DAE8;
  --line: #D8DAE8;
  --line-2: #C9CDE0;
  --ink-2: #4A4B6A;
  --ink-3: #8A8BA8;
  --tim: #5B3FD6;
  --tim-soft: #EDE9FF;
  --tim-2: #4B32B8;
  /* Bien dung chung cho ML Academy (ban 4.2.0 dung ten nay) */
  --sheet: #FFFFFF;
  --soft: #ECEEF5;
  --muted: #8A8BA8;
  --text: #1A1B2E;
  --bg: #F5F6FA;
}
:root[data-theme="dark"] {
  --brand: #7B62E0;
  --brand-light: #9B85E8;
  --brand-dim: #2A2050;
  --paper: #0F1623;
  --paper2: #1A2130;
  --ink: #E8F0F8;
  --ink2: #9AAFC8;
  --ink3: #5A7090;
  --border: #2A3A50;
  --line: #2A3A50;
  --line-2: #3A4E6B;
  --ink-2: #9AAFC8;
  --ink-3: #5A7090;
  --tim: #7B62E0;
  --tim-soft: #2A2050;
  --sheet: #1A2130;
  --soft: #1A2130;
  --muted: #5A7090;
  --text: #E8F0F8;
  --bg: #0F1623;
}
/* Trang chu: duong hoc + tinh nang theo mau */
.lp-paths { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.lp-path { display: block; background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 22px; text-decoration: none; color: var(--ink); }
.lp-path:hover { border-color: var(--brand); }
.lp-path-ico { font-size: 32px; }
.lp-path h3 { margin: 10px 0 4px; font-size: 19px; }
.lp-path p { margin: 4px 0; line-height: 1.5; }
.lp-path .btn { display: inline-block; margin-top: 12px; }
.lp-path-soon { opacity: .75; }
.lp-feats { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.lp-feat { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 20px; }
.lp-feat-ico { font-size: 26px; }
.lp-feat h3 { margin: 8px 0 6px; font-size: 17px; }
.lp-feat p { color: var(--ink2); line-height: 1.6; margin: 0; }
:root[data-theme="dark"] .lp-path, :root[data-theme="dark"] .lp-feat { background: var(--paper2); }
/* Dashboard theo mau: the thong ke + tiep tuc hoc */
.dash-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px; margin-bottom: 20px; }
.dash-stat { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 16px; }
.dash-stat-ico { font-size: 22px; display: block; margin-bottom: 6px; }
.dash-stat b { display: block; font-size: 26px; }
.dash-stat span:last-child { color: var(--ink2); font-size: 13px; }
.dash-next { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; background: var(--brand-dim); border: 1px solid var(--border); border-radius: 10px; padding: 16px 18px; margin-bottom: 4px; }
.dash-next small { display: block; color: var(--ink2); margin-bottom: 2px; }
.dash-next b { display: block; }
:root[data-theme="dark"] .dash-stat { background: var(--paper2); }

/* 5.0.11 — Khung demo code o hero trang chu (nhu mau) */
.lp-demo { background: #fff; border: 1px solid var(--border); border-radius: 16px; overflow: hidden; box-shadow: 0 10px 30px -12px rgba(36, 30, 90, 0.25); min-width: 0; }
.lp-demo-head { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--border); background: var(--paper2); }
.lp-demo-dots { display: flex; gap: 6px; }
.lp-demo-dots i { width: 11px; height: 11px; border-radius: 50%; background: var(--border); display: block; }
.lp-demo-dots i:first-child { background: #FF5F57; }
.lp-demo-dots i:nth-child(2) { background: #FEBC2E; }
.lp-demo-dots i:nth-child(3) { background: #28C840; }
.lp-demo-file { font-family: "JetBrains Mono", monospace; font-size: 13px; font-weight: 600; }
.lp-demo-ver { margin-left: auto; font-size: 12px; color: var(--ink2); }
.lp-demo-code { margin: 0; padding: 18px; font-family: "JetBrains Mono", monospace; font-size: 14px; line-height: 1.7; overflow-x: auto; background: #fff; }
.lp-demo-code .cm { color: var(--ink3); font-style: italic; }
.lp-demo-code .kw { color: #7A2FD0; font-weight: 600; }
.lp-demo-code .str { color: #0F7A46; }
.lp-demo-out { border-top: 1px solid var(--border); background: #1B2034; color: #E6E9F5; padding: 14px 18px; display: grid; gap: 2px; font-family: "JetBrains Mono", monospace; font-size: 13.5px; }
.lp-demo-out b { color: #9FE5A6; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 4px; }
.lp-demo-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 16px; border-top: 1px solid var(--border); }
@media (max-width: 960px) { .lp-demo { margin-top: 8px; } }