/* Dorabot Cung Hoc — giao dien rieng tung cap hoc (lib/tracks.php). body[data-track] dat trong app.js setTrackLook().
   th (tieu hoc) = giao dien goc trong app.css (kem cam, Dora cu meo). Cac cap khac doi bien mau, bo goc, chu, mascot, sao.
   Trang gioi thieu tung cap: landing.php (CSS rieng trong file do). */

/* ---------- Mam non: hong pastel, bo tron, chu to ---------- */
body[data-track="mn"] {
  --bg: #FFF1F4; --line: #FBD9E2; --card: #FFFFFF;
  --orange: #FF6F91; --orange-d: #E04A70;
  --green: #2FA36B; --green-d: #23804F;
  --radius: 28px;
  background-image: radial-gradient(rgba(255,111,145,.13) 2px, transparent 2.2px);
  background-size: 26px 26px;
  font-size: 18px;
}
body[data-track="mn"] .topbar { background: linear-gradient(var(--bg) 75%, rgba(255,241,244,0)); }

/* ---------- Cap 2: xanh ngoc, gon hon, van than thien ---------- */
body[data-track="thcs"] {
  --bg: #EEF8F6; --line: #CFE9E3; --ink: #1E3A3A; --ink-2: #44605E; --muted: #55706D;
  --orange: #0E9F86; --orange-d: #0A7A67;
  --green: #0E9F86; --green-d: #0A7A67;
  --radius: 18px;
  --shadow: 0 4px 0 rgba(14,80,70,.08), 0 8px 20px rgba(14,80,70,.06);
  background-image: radial-gradient(rgba(14,159,134,.08) 1.2px, transparent 1.3px);
  background-size: 20px 20px;
  font-size: 16.5px;
}
body[data-track="thcs"] .topbar { background: linear-gradient(var(--bg) 75%, rgba(238,248,246,0)); }
body[data-track="thcs"] .mascot-wrap .mascot { width: 72px; height: 72px; }
body[data-track="thcs"] .cc-card { border-radius: 20px; }

/* ---------- Cap 3, Dai hoc, Tu hoc: giao dien nguoi lon (khong mascot to, khong sao) ---------- */
body[data-track="thpt"], body[data-track="dh"], body[data-track="tu"] {
  --radius: 14px;
  --shadow: 0 1px 2px rgba(15,23,42,.06), 0 6px 18px rgba(15,23,42,.06);
  background-image: none;
  font-family: 'Be Vietnam Pro', 'Nunito', system-ui, sans-serif;
  font-size: 16px;
}
body[data-track="thpt"] :is(h1, h2, h3, .display, .topbar .title, .chip-stat),
body[data-track="dh"] :is(h1, h2, h3, .display, .topbar .title, .chip-stat),
body[data-track="tu"] :is(h1, h2, h3, .display, .topbar .title, .chip-stat) { font-family: 'Be Vietnam Pro', 'Nunito', sans-serif; letter-spacing: -.01em; }
body[data-track="thpt"] .mascot-wrap .mascot,
body[data-track="dh"] .mascot-wrap .mascot,
body[data-track="tu"] .mascot-wrap .mascot { display: none; }
body:is([data-track="thpt"], [data-track="dh"], [data-track="tu"]) .mascot-wrap .bubble { margin-left: 0; border-radius: var(--radius); box-shadow: none; border: 1px solid var(--line); }
body:is([data-track="thpt"], [data-track="dh"], [data-track="tu"]) .mascot-wrap .bubble::after { display: none; }
body:is([data-track="thpt"], [data-track="dh"], [data-track="tu"]) .chip-stat[onclick*="sao/"] { display: none; }   /* sao: chi cho cac be */
body:is([data-track="thpt"], [data-track="dh"], [data-track="tu"]) .chip-stat { box-shadow: none; border: 1px solid var(--line); font-size: 15px; }
body:is([data-track="thpt"], [data-track="dh"], [data-track="tu"]) .cc-card { border-radius: 16px; box-shadow: none; }
body:is([data-track="thpt"], [data-track="dh"], [data-track="tu"]) .btn { box-shadow: none; }
body:is([data-track="thpt"], [data-track="dh"], [data-track="tu"]) .btn.ghost { border: 1px solid var(--line); background: var(--card); }
body:is([data-track="thpt"], [data-track="dh"], [data-track="tu"]) .card { box-shadow: var(--shadow); }

/* Cap 3: cham / indigo, nen xam lanh */
body[data-track="thpt"] {
  --bg: #F3F4F9; --line: #E0E3EF; --ink: #1B1F3B; --ink-2: #4A4F6E; --muted: #5B6079;
  --orange: #4F46E5; --orange-d: #3730A3;
  --green: #4F46E5; --green-d: #3730A3;
}
body[data-track="thpt"] .topbar { background: linear-gradient(var(--bg) 75%, rgba(243,244,249,0)); }

/* Dai hoc: xanh navy, nen trang lanh */
body[data-track="dh"] {
  --bg: #F4F7FB; --line: #DCE4EF; --ink: #0F2A4A; --ink-2: #3D5573; --muted: #52677F;
  --orange: #1D5FD1; --orange-d: #1747A0;
  --green: #0F2A4A; --green-d: #081A30;
}
body[data-track="dh"] .topbar { background: linear-gradient(var(--bg) 75%, rgba(244,247,251,0)); }

/* Tu hoc: giay am + xanh reu, toi gian */
body[data-track="tu"] {
  --bg: #F8F6F1; --line: #E7E1D4; --ink: #22261F; --ink-2: #4C5246; --muted: #5E6457;
  --orange: #2F6B4F; --orange-d: #224F3A;
  --green: #2F6B4F; --green-d: #224F3A;
}
body[data-track="tu"] .topbar { background: linear-gradient(var(--bg) 75%, rgba(248,246,241,0)); }

/* nhan cap hoc tren trang chu */
.track-chip { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 800; background: var(--card); border: 1px solid var(--line); color: var(--ink-2); vertical-align: middle; }
.goal-card { display: flex; gap: 12px; align-items: center; }
.goal-card .goal-ic { font-size: 26px; }

/* Mau nen theo mon (app.css body[data-subj]) chi giu cho Tieu hoc / Mam non; cap 2 tro len dung nen cua cap */
body:is([data-track="thcs"], [data-track="thpt"], [data-track="dh"], [data-track="tu"])[data-subj] { background-color: var(--bg); }
body[data-track="thcs"][data-subj] { background-image: radial-gradient(rgba(14,159,134,.08) 1.2px, transparent 1.3px); background-size: 20px 20px; }
body:is([data-track="thpt"], [data-track="dh"], [data-track="tu"])[data-subj] { background-image: none; }
body[data-track="thcs"][data-subj] .topbar { background: linear-gradient(var(--bg) 75%, rgba(238,248,246,0)); }
body[data-track="thpt"][data-subj] .topbar { background: linear-gradient(var(--bg) 75%, rgba(243,244,249,0)); }
body[data-track="dh"][data-subj] .topbar { background: linear-gradient(var(--bg) 75%, rgba(244,247,251,0)); }
body[data-track="tu"][data-subj] .topbar { background: linear-gradient(var(--bg) 75%, rgba(248,246,241,0)); }

/* Cap 3 / Dai hoc / Tu hoc: bo chu tron Baloo (tre con) o moi cho app.css / session.css / stars.css / exam.css dat rieng */
body:is([data-track="thpt"], [data-track="dh"], [data-track="tu"]) :is(.profile-card .nm, .book-opt b, label.lbl, .tile b, .tile .badge, .ex-head .ins, .qno, .opt .l, .score-hero .num, .day-h, .score-badge, .kpi b, .kbd-pin button, .g-num, .shot.add, .nt-card b, .door b, .door .badge, .rstep b, .cc-head b, .cc-btn, .guide-card b, .cc-stats .cs b, .timer-card .t-num, .und-head .und-ht, .sug-t, .st-big, .st-step b, .xm-count b, .xm-hero b, .xm-big, .xm-timer, .xm-sec-h, .subj-go) { font-family: 'Be Vietnam Pro', 'Nunito', sans-serif; letter-spacing: -.01em; }