/* Competitive Exam Platform – exam screens. Everything is scoped under .cep-exam. */
.cep-exam {
	--cep-primary: #1d4ed8;
	--cep-primary-dark: #1e3a8a;
	--cep-border: #d0d7e5;
	--cep-bg: #f4f7fc;
	--cep-text: #101828;
	font-family: "Noto Sans Bengali", "Hind Siliguri", "Nirmala UI", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	color: var(--cep-text);
	line-height: 1.55;
	box-sizing: border-box;
}

.cep-exam *,
.cep-exam *::before,
.cep-exam *::after {
	box-sizing: inherit;
}

.cep-notice {
	background: #eff4ff;
	border: 1px solid #c3d4fb;
	border-radius: 8px;
	padding: 12px 16px;
	margin: 12px 0;
}

.cep-error,
.cep-notice.cep-error {
	background: #fef3f2;
	border-color: #fecdca;
	color: #912018;
}

.cep-error-text {
	color: #b42318;
	min-height: 1.4em;
	margin: 4px 0 0;
}

.cep-btn {
	display: inline-block;
	background: #fff;
	color: var(--cep-primary-dark);
	border: 1px solid var(--cep-primary);
	border-radius: 6px;
	padding: 9px 16px;
	font: inherit;
	font-size: 15px;
	cursor: pointer;
	text-decoration: none;
	line-height: 1.3;
}

.cep-btn:hover:not(:disabled) {
	background: #eaf0ff;
}

.cep-btn:focus-visible,
.cep-pq:focus-visible,
.cep-option:focus-within {
	outline: 3px solid #f59e0b;
	outline-offset: 2px;
}

.cep-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.cep-btn-primary {
	background: var(--cep-primary);
	color: #fff;
}

.cep-btn-primary:hover:not(:disabled) {
	background: var(--cep-primary-dark);
}

.cep-btn-review {
	border-color: #7e22ce;
	color: #581c87;
}

.cep-btn-danger {
	background: #b42318;
	border-color: #b42318;
	color: #fff;
}

.cep-btn-danger:hover:not(:disabled) {
	background: #912018;
}

/* ---- Instructions ---- */
.cep-instructions {
	max-width: 820px;
	margin: 0 auto;
	background: #fff;
	border: 1px solid var(--cep-border);
	border-radius: 10px;
	padding: 20px 24px;
}

.cep-title {
	margin-top: 0;
	color: var(--cep-primary-dark);
}

.cep-facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 10px;
	margin: 0 0 16px;
}

.cep-facts div {
	background: var(--cep-bg);
	border-radius: 8px;
	padding: 10px 12px;
}

.cep-facts dt {
	font-size: 12px;
	color: #475467;
}

.cep-facts dd {
	margin: 2px 0 0;
	font-weight: 600;
}

/* ---- Exam app ---- */
.cep-app {
	background: var(--cep-bg);
	border: 1px solid var(--cep-border);
	border-radius: 10px;
	overflow: hidden;
}

.cep-hdr {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 24px;
	align-items: center;
	justify-content: space-between;
	background: var(--cep-primary-dark);
	color: #fff;
	padding: 10px 16px;
}

.cep-hdr h2 {
	margin: 0;
	font-size: 18px;
	color: #fff;
}

.cep-student {
	font-size: 13px;
	opacity: 0.85;
}

.cep-hdr-stats {
	display: flex;
	gap: 16px;
	font-size: 14px;
	flex-wrap: wrap;
}

.cep-timer {
	text-align: right;
	background: rgba(255, 255, 255, 0.12);
	border-radius: 8px;
	padding: 4px 14px;
}

.cep-timer small {
	display: block;
	font-size: 11px;
	opacity: 0.85;
}

.cep-timer strong {
	font-size: 22px;
	font-variant-numeric: tabular-nums;
}

.cep-timer-low {
	background: #b42318;
}

.cep-banner {
	background: #fff7e0;
	border-bottom: 1px solid #f5d57a;
	padding: 8px 16px;
	font-weight: 600;
}

.cep-banner-warn {
	background: #fef3f2;
	border-color: #fecdca;
}

.cep-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 16px;
	padding: 16px;
}

.cep-main,
.cep-side {
	background: #fff;
	border: 1px solid var(--cep-border);
	border-radius: 8px;
	padding: 16px;
}

.cep-qhead {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	align-items: center;
	border-bottom: 1px solid var(--cep-border);
	padding-bottom: 10px;
	margin-bottom: 14px;
}

.cep-qnum {
	font-weight: 700;
	color: var(--cep-primary-dark);
}

.cep-section-tag {
	background: #eaf0ff;
	border-radius: 12px;
	padding: 1px 10px;
	font-size: 13px;
}

.cep-hint {
	color: #475467;
	font-size: 13px;
	margin: 0;
}

.cep-qbody {
	min-height: 220px;
	user-select: none;
}

.cep-qtext {
	font-size: 17px;
	margin-bottom: 14px;
}

.cep-qimg {
	max-width: 100%;
	height: auto;
	margin-bottom: 12px;
}

.cep-passage {
	background: var(--cep-bg);
	border-left: 4px solid var(--cep-primary);
	padding: 10px 14px;
	margin-bottom: 14px;
	max-height: 260px;
	overflow: auto;
}

.cep-rich img {
	max-width: 100%;
	height: auto;
}

.cep-options {
	display: grid;
	gap: 8px;
}

.cep-option {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	border: 1px solid var(--cep-border);
	border-radius: 8px;
	padding: 10px 12px;
	cursor: pointer;
}

.cep-option:hover {
	background: #f8faff;
}

.cep-option.cep-selected {
	border-color: var(--cep-primary);
	background: #eaf0ff;
}

.cep-option input {
	margin-top: 5px;
}

.cep-option-key {
	font-weight: 700;
	color: var(--cep-primary-dark);
	min-width: 1.2em;
}

.cep-match-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 10px;
	align-items: center;
	margin-bottom: 8px;
}

.cep-match select {
	width: 100%;
	padding: 8px;
	font: inherit;
}

.cep-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	border-top: 1px solid var(--cep-border);
	margin-top: 16px;
	padding-top: 14px;
}

.cep-submit {
	margin-left: auto;
}

/* ---- Palette ---- */
.cep-palette-toggle {
	display: none;
	width: 100%;
	margin-bottom: 10px;
}

.cep-palette-title {
	font-weight: 700;
	font-size: 13px;
	margin: 10px 0 6px;
	color: var(--cep-primary-dark);
}

.cep-palette {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(38px, 1fr));
	gap: 6px;
}

.cep-pq {
	width: 100%;
	min-height: 38px;
	border-radius: 6px;
	border: 1px solid #98a2b3;
	background: #fff;
	font: inherit;
	font-size: 14px;
	cursor: pointer;
	padding: 0;
}

.cep-pq:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.cep-pq.cep-current {
	box-shadow: 0 0 0 3px #f59e0b;
}

.cep-st-answered {
	background: #1a7f37;
	border-color: #1a7f37;
	color: #fff;
}

.cep-st-not_answered {
	background: #d92d20;
	border-color: #d92d20;
	color: #fff;
}

.cep-st-not_visited {
	background: #fff;
	color: var(--cep-text);
}

.cep-st-marked {
	background: #7e22ce;
	border-color: #7e22ce;
	color: #fff;
	border-radius: 50%;
}

.cep-st-answered_marked {
	background: #7e22ce;
	border-color: #1a7f37;
	border-width: 3px;
	color: #fff;
	border-radius: 50%;
}

.cep-legend {
	list-style: none;
	margin: 14px 0 0;
	padding: 0;
	font-size: 13px;
	display: grid;
	gap: 6px;
}

.cep-legend-dot {
	display: inline-block;
	width: 22px;
	min-height: 22px;
	height: 22px;
	vertical-align: middle;
	cursor: default;
}

/* ---- Modal / done ---- */
.cep-modal-back {
	position: fixed;
	inset: 0;
	background: rgba(16, 24, 40, 0.55);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 100000;
	padding: 16px;
}

.cep-modal {
	background: #fff;
	border-radius: 10px;
	padding: 20px 24px;
	max-width: 420px;
	width: 100%;
	font-family: inherit;
}

.cep-modal-actions {
	display: flex;
	gap: 8px;
	justify-content: flex-end;
}

.cep-summary {
	padding-left: 18px;
}

.cep-done {
	text-align: center;
	background: #fff;
	padding: 40px 20px;
}

.cep-loading {
	padding: 30px;
	text-align: center;
}

/* ---- Mobile ---- */
@media (max-width: 900px) {
	.cep-layout {
		grid-template-columns: 1fr;
	}

	.cep-palette-toggle {
		display: block;
	}

	.cep-palette-wrap {
		display: none;
	}

	.cep-palette-wrap.cep-open {
		display: block;
	}

	.cep-side {
		order: -1;
	}

	.cep-submit {
		margin-left: 0;
	}

	.cep-match-row {
		grid-template-columns: 1fr;
	}

	.cep-timer {
		text-align: left;
	}
}

/* ---- Results and review ---- */
.cep-result {
	max-width: 960px;
	margin: 0 auto;
}

.cep-muted {
	color: #475467;
	font-size: 14px;
}

.cep-verdict {
	display: inline-block;
	font-weight: 700;
	padding: 6px 16px;
	border-radius: 20px;
}

.cep-pass {
	background: #dcfce7;
	color: #166534;
}

.cep-fail {
	background: #fee4e2;
	color: #912018;
}

.cep-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 10px;
	margin: 14px 0;
}

.cep-rcard {
	background: #fff;
	border: 1px solid var(--cep-border);
	border-left: 4px solid var(--cep-primary);
	border-radius: 8px;
	padding: 10px 12px;
	display: flex;
	flex-direction: column;
}

.cep-rcard span {
	font-size: 12px;
	color: #475467;
}

.cep-rcard strong {
	font-size: 20px;
}

.cep-ranks {
	padding-left: 18px;
}

.cep-table {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
	font-size: 14px;
}

.cep-table th,
.cep-table td {
	border: 1px solid var(--cep-border);
	padding: 8px 10px;
	text-align: left;
}

.cep-table thead th {
	background: var(--cep-bg);
}

.cep-weak td:first-child {
	color: #912018;
}

.cep-tag {
	display: inline-block;
	font-size: 11px;
	border-radius: 10px;
	padding: 1px 8px;
	background: #eaf0ff;
}

.cep-tag-ok {
	background: #dcfce7;
	color: #166534;
}

.cep-tag-bad {
	background: #fee4e2;
	color: #912018;
}

.cep-tag-skip {
	background: #f2f4f7;
	color: #475467;
}

.cep-bar {
	display: inline-block;
	width: 70px;
	height: 8px;
	background: #e4e7ec;
	border-radius: 4px;
	vertical-align: middle;
	margin-right: 6px;
	overflow: hidden;
}

.cep-bar i {
	display: block;
	height: 100%;
	background: var(--cep-primary);
}

.cep-review {
	background: #fff;
	border: 1px solid var(--cep-border);
	border-left-width: 5px;
	border-radius: 8px;
	padding: 12px 16px;
	margin-bottom: 12px;
}

.cep-r-ok {
	border-left-color: #1a7f37;
}

.cep-r-bad {
	border-left-color: #d92d20;
}

.cep-r-skip {
	border-left-color: #98a2b3;
}

.cep-review-head {
	display: flex;
	gap: 12px;
	align-items: center;
	flex-wrap: wrap;
	margin-bottom: 6px;
}

.cep-review-options {
	list-style: none;
	padding: 0;
	margin: 8px 0;
}

.cep-review-options li {
	border: 1px solid var(--cep-border);
	border-radius: 6px;
	padding: 6px 10px;
	margin-bottom: 4px;
}

.cep-review-options .cep-r-correct {
	background: #dcfce7;
	border-color: #1a7f37;
}

.cep-review-options .cep-r-picked:not(.cep-r-correct),
.cep-review-options .cep-r-wrong {
	background: #fee4e2;
	border-color: #d92d20;
}

.cep-explain {
	background: var(--cep-bg);
	border-radius: 6px;
	padding: 8px 12px;
}

@media (max-width: 700px) {
	.cep-table {
		display: block;
		overflow-x: auto;
	}
}

/* ---- Student area: auth forms, dashboard, exam cards ---- */
.cep-auth {
	max-width: 460px;
	margin: 0 auto;
}

.cep-form label {
	display: block;
	font-weight: 600;
	margin-bottom: 4px;
}

.cep-form label.cep-inline {
	font-weight: 400;
}

.cep-form input[type="text"],
.cep-form input[type="email"],
.cep-form input[type="tel"],
.cep-form input[type="password"] {
	width: 100%;
	box-sizing: border-box;
	padding: 10px 12px;
	border: 1px solid var(--cep-border);
	border-radius: 6px;
	font: inherit;
}

.cep-form input:focus-visible {
	outline: 3px solid #f59e0b;
	outline-offset: 1px;
}

.cep-form fieldset {
	border: 1px solid var(--cep-border);
	border-radius: 8px;
	padding: 8px 14px;
	margin: 12px 0;
}

.cep-btn-primary {
	background: var(--cep-primary);
	color: #fff;
	border-color: var(--cep-primary);
}

.cep-btn-primary:hover:not(:disabled) {
	background: var(--cep-primary-dark);
	color: #fff;
}

.cep-auth-links {
	font-size: 14px;
}

.cep-dash-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

.cep-tabs {
	display: flex;
	gap: 4px;
	flex-wrap: wrap;
	border-bottom: 2px solid var(--cep-border);
	margin: 8px 0 16px;
}

.cep-tabs a {
	padding: 9px 14px;
	text-decoration: none;
	color: var(--cep-text);
	border-bottom: 3px solid transparent;
	margin-bottom: -2px;
}

.cep-tabs a.cep-tab-active {
	border-bottom-color: var(--cep-primary);
	color: var(--cep-primary-dark);
	font-weight: 600;
}

.cep-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 12px;
	margin-bottom: 16px;
}

.cep-stat {
	background: #fff;
	border: 1px solid var(--cep-border);
	border-left: 4px solid var(--cep-primary);
	border-radius: 8px;
	padding: 12px 14px;
	display: flex;
	flex-direction: column;
}

.cep-stat span {
	font-size: 13px;
	color: #475467;
}

.cep-stat strong {
	font-size: 24px;
}

.cep-examlist {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 14px;
}

.cep-excard {
	background: #fff;
	border: 1px solid var(--cep-border);
	border-radius: 10px;
	padding: 14px 16px;
}

.cep-excard h3 {
	margin: 0 0 6px;
	font-size: 17px;
}

.cep-meta {
	color: #475467;
	font-size: 14px;
	margin: 4px 0;
}

.cep-tag {
	display: inline-block;
	background: #fef3c7;
	color: #92400e;
	border-radius: 10px;
	padding: 0 8px;
	font-size: 12px;
	font-weight: 600;
	margin-left: 6px;
}

.cep-tag.cep-free {
	background: #dcfce7;
	color: #166534;
}

.cep-state {
	margin-right: 8px;
	font-weight: 600;
}

.cep-tablewrap {
	overflow-x: auto;
}

.cep-table {
	width: 100%;
	border-collapse: collapse;
}

.cep-table th,
.cep-table td {
	text-align: left;
	padding: 8px 10px;
	border-bottom: 1px solid #e4e9f4;
}