/* Rich lesson components (chx-*) for Bihar portal chapters, layered on theme.css. Copied from the Class 11/Economics lesson styles. */
body .chx { --chx-ink: #0f172a; --chx-muted: #475569; }
body .chx .chx-sub { margin: -6px 0 14px; color: var(--muted, #64748b); font-size: .92em; font-style: italic; }
body .chx sub, body .chx sup { font-size: .72em; line-height: 0; }

/* ---------- callout boxes ---------- */
body .chx-box {
    margin: 16px 0;
    border-radius: 12px;
    border: 1px solid var(--chx-b, #cbd5e1);
    background: var(--chx-bg, #f8fafc);
    overflow: hidden;
}
body .chx-box-h {
    padding: 9px 14px;
    font-weight: 700;
    color: var(--chx-h, #0f172a);
    background: var(--chx-hbg, rgba(15, 23, 42, .04));
    border-bottom: 1px solid var(--chx-b, #cbd5e1);
}
body .chx-box-b { padding: 10px 14px; }
body .chx-box-b > :last-child { margin-bottom: 0; }
body .chx-box-b ul, body .chx-box-b ol { margin: 6px 0; }
body .chx-def     { --chx-b: #93c5fd; --chx-bg: #eff6ff; --chx-h: #1d4ed8; --chx-hbg: #dbeafe; }
body .chx-law     { --chx-b: #a5b4fc; --chx-bg: #eef2ff; --chx-h: #4338ca; --chx-hbg: #e0e7ff; }
body .chx-tip     { --chx-b: #86efac; --chx-bg: #f0fdf4; --chx-h: #15803d; --chx-hbg: #dcfce7; }
body .chx-trap    { --chx-b: #fca5a5; --chx-bg: #fef2f2; --chx-h: #b91c1c; --chx-hbg: #fee2e2; }
body .chx-jee     { --chx-b: #fdba74; --chx-bg: #fff7ed; --chx-h: #c2410c; --chx-hbg: #ffedd5; }
body .chx-india   { --chx-b: #fcd34d; --chx-bg: #fffbeb; --chx-h: #b45309; --chx-hbg: #fef3c7; }
body .chx-note    { --chx-b: #c4b5fd; --chx-bg: #f5f3ff; --chx-h: #6d28d9; --chx-hbg: #ede9fe; }
body .chx-formula-box { --chx-b: #5eead4; --chx-bg: #f0fdfa; --chx-h: #0f766e; --chx-hbg: #ccfbf1; }

/* ---------- formula cards ---------- */
body .chx-fgrid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 10px;
    margin: 14px 0 18px;
}
body .chx-formula {
    position: relative;
    margin: 12px 0;
    padding: 12px 14px 12px 16px;
    border-radius: 12px;
    background: linear-gradient(135deg, #f0fdfa, #eff6ff);
    border: 1px solid #99f6e4;
    box-shadow: inset 4px 0 0 #0d9488;
}
body .chx-fgrid .chx-formula { margin: 0; }
body .chx-f-name { font-size: .78em; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #0f766e; margin-bottom: 4px; }
body .chx-f-expr {
    font-family: "Cambria Math", "STIX Two Math", "Times New Roman", serif;
    font-size: 1.12em;
    font-weight: 600;
    color: #0f172a;
    line-height: 1.6;
    overflow-x: auto;
}
body .chx-f-note { margin-top: 4px; font-size: .86em; color: #475569; }
body .chx-frac {
    display: inline-flex;
    flex-direction: column;
    vertical-align: middle;
    text-align: center;
    margin: 0 3px;
    line-height: 1.25;
}
body .chx-frac > span:first-child { border-bottom: 1.5px solid currentColor; padding: 0 4px 1px; }
body .chx-frac > span:last-child { padding: 1px 4px 0; }

/* ---------- solved problems ---------- */
body .chx-solved {
    margin: 18px 0;
    border-radius: 14px;
    border: 1px solid #c7d2fe;
    background: #fafaff;
    padding: 14px 16px;
    box-shadow: 0 6px 18px -14px rgba(67, 56, 202, .5);
}
body .chx-s-tag {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    background: #4338ca;
    color: #fff;
    font-size: .76em;
    font-weight: 700;
    letter-spacing: .03em;
}
body .chx-s-q { margin: 10px 0 8px; font-weight: 600; color: #1e1b4b; }
body .chx-s-given {
    margin: 0 0 8px;
    padding: 7px 12px;
    border-radius: 8px;
    background: #eef2ff;
    font-size: .93em;
    color: #312e81;
}
body .chx ol.chx-steps { counter-reset: st; list-style: none; padding-left: 0; margin: 8px 0; }
body .chx ol.chx-steps > li {
    counter-increment: st;
    position: relative;
    padding: 6px 0 6px 38px;
    margin: 0;
    border-bottom: 1px dashed #e0e7ff;
}
body .chx ol.chx-steps > li::before {
    content: counter(st);
    position: absolute;
    left: 0;
    top: 6px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #e0e7ff;
    color: #3730a3;
    font-weight: 700;
    font-size: .82em;
    display: grid;
    place-items: center;
}
body .chx-s-ans {
    margin-top: 10px;
    padding: 9px 12px;
    border-radius: 10px;
    background: #dcfce7;
    border: 1px solid #86efac;
    color: #14532d;
    font-weight: 700;
}
body .chx-s-ans::before { content: "✔ "; }

/* ---------- tables ---------- */
body .chx .table-scroll { overflow-x: auto; margin: 14px 0; }
body .chx table.chx-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: .93em;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    overflow: hidden;
    display: table;
}
body .chx table.chx-table caption { caption-side: top; text-align: left; font-weight: 700; padding: 0 0 6px; color: #334155; }
body .chx table.chx-table th {
    background: #1e3a8a;
    color: #fff;
    text-align: left;
    padding: 8px 10px;
    font-weight: 700;
}
body .chx table.chx-table td { padding: 7px 10px; border-top: 1px solid #e2e8f0; vertical-align: top; }
body .chx table.chx-table tbody tr:nth-child(even) td { background: #f8fafc; }

/* ---------- figures ---------- */
body .chx-fig {
    margin: 18px 0;
    padding: 12px;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    text-align: center;
}
body .chx-svg { width: 100%; height: auto; max-width: 720px; display: block; margin: 0 auto; }
body .chx-fig figcaption { margin-top: 8px; font-size: .86em; color: #475569; font-style: italic; }

/* key–value highlight used inside steps */
body .chx .hl { background: #fef08a; padding: 0 3px; border-radius: 4px; }
body .chx .unit { color: #0f766e; font-weight: 600; }

@media (max-width: 640px) {
    body .chx-fgrid { grid-template-columns: 1fr; }
    body .chx-solved { padding: 12px; }
    body .chx ol.chx-steps > li { padding-left: 32px; }
}
@media print {
    body .chx-solved, body .chx-box, body .chx-fig { break-inside: avoid; }
}

/* ---------- level boxes (school / competitive) ---------- */
body .chx-neet    { --chx-b: #67e8f9; --chx-bg: #ecfeff; --chx-h: #0e7490; --chx-hbg: #cffafe; }
body .chx-adv     { --chx-b: #f9a8d4; --chx-bg: #fdf2f8; --chx-h: #be185d; --chx-hbg: #fce7f3; }
body .chx-poly    { --chx-b: #a7f3d0; --chx-bg: #ecfdf5; --chx-h: #047857; --chx-hbg: #d1fae5; }
