/* V83 — Topic Wise Practice parity with PYQ/Sample Paper CBT experience.
   Layout/colour only. Questions, answers, scoring and timer logic remain unchanged. */

/* Keep the four action controls immediately after the options, exactly like V70. */
body.topic-exam-active #topicTestPanel .topic-test-wrap>div:first-child{
  overflow:auto!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  display:block!important;
}
body.topic-exam-active #topicQuestionBox{
  flex:none!important;
  min-height:0!important;
  overflow:visible!important;
  padding-bottom:8px!important;
}
body.topic-exam-active .topic-actions{
  position:static!important;
  margin:0 12px 14px!important;
  padding:10px!important;
  border:1px solid #d8e2ec!important;
  border-radius:12px!important;
  background:#f8fafc!important;
  box-shadow:0 5px 14px rgba(17,49,84,.07)!important;
  display:grid!important;
  grid-template-columns:1fr 1fr 1fr 1.2fr!important;
  gap:8px!important;
}
body.topic-exam-active .topic-action{
  min-height:42px!important;
  width:100%!important;
  margin:0!important;
  border-radius:9px!important;
  font-weight:850!important;
}

/* Match PYQ/Sample Paper button palette. */
body.topic-exam-active .topic-action.clear{background:#eef2f6!important;color:#415267!important;border:1px solid #d8e1ea!important}
body.topic-exam-active .topic-action.review{background:#fff4cf!important;color:#775600!important;border:1px solid #ecd487!important}
body.topic-exam-active .topic-action.prev{background:#eaf1fb!important;color:#123b68!important;border:1px solid #cddcec!important}
body.topic-exam-active .topic-action.next{background:#0d4d87!important;color:#fff!important;border:1px solid #0d4d87!important}

/* OMR colours aligned with Online PYQs & Sample Papers. */
body.topic-exam-active .topic-bubble{
  background:#fff!important;
  border:1px solid #cbd7e5!important;
  color:#243b56!important;
  box-shadow:none!important;
}
body.topic-exam-active .topic-bubble.answered{
  background:#dff4e6!important;
  border-color:#7fca98!important;
  color:#1d6538!important;
}
body.topic-exam-active .topic-bubble.review{
  background:#fff4cf!important;
  border-color:#d8aa35!important;
  color:#765500!important;
  box-shadow:0 0 0 2px #e8b84b inset!important;
}
body.topic-exam-active .topic-bubble.current{
  background:#0d4d87!important;
  border-color:#0d4d87!important;
  color:#fff!important;
  box-shadow:none!important;
}
body.topic-exam-active .topic-bubble.correct{background:#dff4e6!important;border-color:#64b783!important;color:#155f32!important}
body.topic-exam-active .topic-bubble.wrong{background:#fde7e7!important;border-color:#d97b7b!important;color:#8f2f2f!important}
body.topic-exam-active .topic-bubble.unattempted{background:#eef1f5!important;border-color:#c7d0db!important;color:#647184!important}

/* Instruction screen: reproduce the same multicolour card treatment as PYQ/Sample Papers. */
.topic-instruction-overlay{background:linear-gradient(145deg,#eef4fb 0%,#f8fafc 45%,#eef2f7 100%)!important}
.topic-instruction-head{background:linear-gradient(135deg,#071f42,#0d4f91)!important;border-bottom:3px solid #d7ad55!important}
.topic-instruction-head small{color:#f2cf83!important}
.topic-test-facts{background:linear-gradient(135deg,#f7fbff,#edf5ff)!important;border-color:#bfd2e8!important;color:#0c2c55!important;box-shadow:0 5px 14px rgba(20,55,95,.06)!important}
.topic-instruction-list{list-style:none!important;counter-reset:topicInstruction!important;margin:0!important;padding:0!important;display:grid!important;gap:8px!important}
.topic-instruction-list li{counter-increment:topicInstruction;position:relative!important;margin:0!important;padding:11px 14px 11px 48px!important;border-radius:11px!important;border:1px solid #dbe5f0!important;color:#243f62!important;font-weight:600!important;line-height:1.55!important;box-shadow:0 3px 10px rgba(15,43,78,.035)!important}
.topic-instruction-list li::before{content:counter(topicInstruction);position:absolute;left:12px;top:10px;width:25px;height:25px;display:flex;align-items:center;justify-content:center;border-radius:50%;color:#fff;font-size:12px;font-weight:900;box-shadow:0 3px 8px rgba(0,0,0,.12)}
.topic-instruction-list li:nth-child(1){background:#eef5ff!important;border-color:#bfd5f4!important}.topic-instruction-list li:nth-child(1)::before{background:#2b67ad!important}
.topic-instruction-list li:nth-child(2){background:#fff8e9!important;border-color:#ead39a!important}.topic-instruction-list li:nth-child(2)::before{background:#c28b1d!important}
.topic-instruction-list li:nth-child(3){background:#eef9f2!important;border-color:#b8dec5!important}.topic-instruction-list li:nth-child(3)::before{background:#388a58!important}
.topic-instruction-list li:nth-child(4){background:#fff1f4!important;border-color:#ebc0cb!important}.topic-instruction-list li:nth-child(4)::before{background:#b85470!important}
.topic-instruction-list li:nth-child(5){background:#f4f1fc!important;border-color:#cec3e9!important}.topic-instruction-list li:nth-child(5)::before{background:#6c58a7!important}
.topic-instruction-list li:nth-child(6){background:#eef9fb!important;border-color:#b9dce3!important}.topic-instruction-list li:nth-child(6)::before{background:#34839a!important}
.topic-instruction-list li:nth-child(7){background:#fff5ed!important;border-color:#e9c8ac!important}.topic-instruction-list li:nth-child(7)::before{background:#b96d37!important}
.topic-instruction-actions .start{background:linear-gradient(135deg,#d9ad4b,#f0cc78)!important;color:#13213b!important;box-shadow:0 10px 24px rgba(195,145,43,.28)!important}

/* Real mobile viewport AND browser Desktop Site mode: keep controls visible after options. */
@media(max-width:820px), (max-device-width:820px){
  body.topic-exam-active #topicTestPanel .topic-test-wrap>div:first-child{
    overflow:auto!important;
    -webkit-overflow-scrolling:touch;
  }
  body.topic-exam-active #topicQuestionBox{
    flex:none!important;
    overflow:visible!important;
  }
  body.topic-exam-active .topic-actions{
    margin:0 8px 12px!important;
    padding:8px!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
  }
  body.topic-exam-active .topic-action{
    min-height:44px!important;
    font-size:12px!important;
  }
}