/**
 * Parishrama Daily Test - front-end styles.
 *
 * Everything is scoped under .pdt-app so no theme or Elementor rule
 * leaks in and nothing here leaks out.
 *
 * Breakpoints:  >1024 desktop (palette sidebar)
 *               768-1024 tablet (narrower sidebar)
 *               <768 mobile (palette becomes a bottom drawer)
 */

.pdt-app {
	--pdt-navy: #0f2340;
	--pdt-navy-2: #1b3a63;
	--pdt-accent: #1d6fd8;
	--pdt-ink: #172033;
	--pdt-muted: #5b6b82;
	--pdt-line: #dfe5ee;
	--pdt-bg: #f4f6fa;
	--pdt-card: #ffffff;
	--pdt-green: #1a8f4c;
	--pdt-green-bg: #e6f6ec;
	--pdt-red: #c62828;
	--pdt-red-bg: #fdecec;
	--pdt-purple: #6a3fb5;
	--pdt-purple-bg: #f0eafc;
	--pdt-amber: #b26a00;
	--pdt-radius: 10px;

	font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	color: var(--pdt-ink);
	font-size: 16px;
	line-height: 1.55;
	-webkit-text-size-adjust: 100%;
}

.pdt-app *,
.pdt-app *::before,
.pdt-app *::after {
	box-sizing: border-box;
}

/* ------------------------------------------------------------------ Shell */

.pdt-shell {
	max-width: 780px;
	margin: 0 auto;
	padding: 8px 0 40px;
}

.pdt-boot {
	padding: 48px 16px;
	text-align: center;
	color: var(--pdt-muted);
}

.pdt-title {
	font-size: 26px;
	line-height: 1.25;
	margin: 0 0 18px;
	color: var(--pdt-navy);
}

.pdt-subtitle {
	font-size: 18px;
	margin: 26px 0 12px;
	color: var(--pdt-navy);
}

.pdt-card {
	background: var(--pdt-card);
	border: 1px solid var(--pdt-line);
	border-radius: var(--pdt-radius);
	padding: 22px;
}

.pdt-center { text-align: center; }
.pdt-muted { color: var(--pdt-muted); }
.pdt-sm { font-size: 13px; }
.pdt-lg { font-size: 19px; }
.pdt-mb { margin-bottom: 16px; }
.pdt-mt { margin-top: 24px; }

.pdt-error {
	color: var(--pdt-red);
	font-size: 14px;
	margin: 8px 0;
}

.pdt-admin-notice {
	background: #fff8e5;
	border: 1px solid #f0d48a;
	padding: 12px 16px;
	border-radius: 8px;
	font-size: 14px;
}

/* ----------------------------------------------------------------- Buttons */

.pdt-app .pdt-btn {
	display: inline-block;
	font: inherit;
	font-size: 15px;
	line-height: 1.2;
	padding: 12px 20px;
	border-radius: 8px;
	border: 1px solid var(--pdt-line);
	background: #fff;
	color: var(--pdt-ink);
	cursor: pointer;
	transition: background .15s, border-color .15s, opacity .15s;
	text-align: center;
}

.pdt-app .pdt-btn:hover { background: #f2f5fa; }
.pdt-app .pdt-btn:disabled { opacity: .5; cursor: not-allowed; }

.pdt-app .pdt-btn-primary {
	background: var(--pdt-accent);
	border-color: var(--pdt-accent);
	color: #fff;
}
.pdt-app .pdt-btn-primary:hover { background: #1a5fbb; }

.pdt-app .pdt-btn-ghost { background: transparent; }

.pdt-app .pdt-btn-mark {
	background: var(--pdt-purple-bg);
	border-color: #d6c8f2;
	color: var(--pdt-purple);
}

.pdt-app .pdt-btn-submit {
	background: var(--pdt-green);
	border-color: var(--pdt-green);
	color: #fff;
	width: 100%;
	margin-top: 14px;
}
.pdt-app .pdt-btn-submit:hover { background: #157a40; }

.pdt-app .pdt-btn-lg {
	width: 100%;
	padding: 15px 20px;
	font-size: 17px;
	margin-top: 8px;
}

.pdt-app .pdt-btn-palette { display: none; }

/* ------------------------------------------------------------- Test list */

.pdt-testlist { display: grid; gap: 10px; }

.pdt-testrow {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	background: var(--pdt-card);
	border: 1px solid var(--pdt-line);
	border-radius: var(--pdt-radius);
	padding: 14px 18px;
}

.pdt-clickable { cursor: pointer; }
.pdt-clickable:hover { border-color: var(--pdt-accent); }

.pdt-testname { font-weight: 600; }

.pdt-badge {
	font-size: 12px;
	padding: 5px 11px;
	border-radius: 20px;
	background: var(--pdt-bg);
	color: var(--pdt-muted);
	white-space: nowrap;
}

.pdt-state-live .pdt-badge { background: var(--pdt-green-bg); color: var(--pdt-green); }
.pdt-state-upcoming .pdt-badge { background: #fff3e0; color: var(--pdt-amber); }
.pdt-state-closed { opacity: .65; }

/* ----------------------------------------------------------------- Entry */

.pdt-entry { max-width: 460px; margin: 0 auto; }

.pdt-label {
	display: block;
	font-size: 14px;
	font-weight: 600;
	margin: 14px 0 6px;
}

.pdt-app .pdt-input {
	width: 100%;
	font: inherit;
	font-size: 17px;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: 13px 15px;
	border: 1px solid var(--pdt-line);
	border-radius: 8px;
	background: #fff;
	color: var(--pdt-ink);
}

.pdt-app .pdt-input:focus {
	outline: none;
	border-color: var(--pdt-accent);
	box-shadow: 0 0 0 3px rgba(29, 111, 216, .15);
}

.pdt-entry .pdt-btn { width: 100%; margin-top: 14px; }

.pdt-who { font-size: 15px; margin-bottom: 6px; }

/* ---------------------------------------------------------- Instructions */

.pdt-instructions {
	background: var(--pdt-bg);
	border-radius: 8px;
	padding: 16px 20px;
	margin: 14px 0 18px;
	font-size: 15px;
}

.pdt-instructions h4 { margin: 0 0 10px; font-size: 16px; }
.pdt-rules { margin: 0; padding-left: 20px; }
.pdt-rules li { margin-bottom: 8px; }

.pdt-agree {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 15px;
	margin-bottom: 6px;
	cursor: pointer;
}

.pdt-agree input { margin-top: 5px; width: 18px; height: 18px; }

/* ------------------------------------------------------------ Exam stage */

.pdt-stage {
	display: flex;
	flex-direction: column;
	height: 100vh;
	height: 100dvh;
	background: var(--pdt-bg);
	overflow: hidden;
}

.pdt-app.pdt-pseudo-fs .pdt-stage {
	position: fixed;
	inset: 0;
	z-index: 99999;
}

.pdt-running {
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	-webkit-touch-callout: none;
}

.pdt-running .pdt-qtext,
.pdt-running .pdt-opttext { -webkit-user-select: none; user-select: none; }

/* Header */

.pdt-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	background: var(--pdt-navy);
	color: #fff;
	padding: 12px 20px;
	flex: 0 0 auto;
}

.pdt-head-title { font-weight: 600; font-size: 16px; }
.pdt-head-sub { font-size: 13px; opacity: .78; }
.pdt-head-r { text-align: right; }
.pdt-timer-label { display: block; font-size: 11px; opacity: .75; letter-spacing: .08em; text-transform: uppercase; }

.pdt-timer {
	font-size: 26px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	line-height: 1.1;
}

.pdt-timer.pdt-urgent { color: #ff8a80; }

/* Body */

.pdt-body {
	flex: 1 1 auto;
	display: flex;
	min-height: 0;
}

.pdt-qpane {
	flex: 1 1 auto;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: 22px 26px 30px;
	background: var(--pdt-card);
}

.pdt-qhead {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding-bottom: 10px;
	margin-bottom: 16px;
	border-bottom: 1px solid var(--pdt-line);
}

.pdt-qno { font-weight: 600; color: var(--pdt-navy); }
.pdt-marks { font-size: 13px; color: var(--pdt-muted); }

.pdt-qtext {
	font-size: 17px;
	line-height: 1.6;
	margin-bottom: 20px;
}

.pdt-options { display: grid; gap: 10px; }

.pdt-option {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 13px 16px;
	border: 1px solid var(--pdt-line);
	border-radius: 9px;
	cursor: pointer;
	background: #fff;
	transition: border-color .12s, background .12s;
}

.pdt-option:hover { border-color: #b9c7dc; background: #fafcff; }

.pdt-option.pdt-chosen {
	border-color: var(--pdt-accent);
	background: #eef5fe;
}

.pdt-option input { margin-top: 4px; width: 18px; height: 18px; flex: 0 0 auto; }

.pdt-optno {
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--pdt-bg);
	color: var(--pdt-muted);
	font-size: 13px;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.pdt-chosen .pdt-optno { background: var(--pdt-accent); color: #fff; }
.pdt-opttext { flex: 1 1 auto; }

/* Palette sidebar */

.pdt-side {
	flex: 0 0 300px;
	background: var(--pdt-card);
	border-left: 1px solid var(--pdt-line);
	padding: 16px 18px;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
}

.pdt-side-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 12px;
}

.pdt-side-close {
	display: none;
	background: none;
	border: 0;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	color: var(--pdt-muted);
}

.pdt-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 14px;
	font-size: 12px;
	color: var(--pdt-muted);
	margin-bottom: 14px;
}

.pdt-leg { display: inline-flex; align-items: center; gap: 6px; }

.pdt-dot {
	width: 11px;
	height: 11px;
	border-radius: 3px;
	display: inline-block;
}

.pdt-dot.pdt-answered { background: var(--pdt-green); }
.pdt-dot.pdt-notanswered { background: var(--pdt-red); }
.pdt-dot.pdt-marked { background: var(--pdt-purple); }
.pdt-dot.pdt-notvisited { background: #cfd8e5; }

.pdt-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(40px, 1fr));
	gap: 8px;
	align-content: start;
	flex: 1 1 auto;
}

.pdt-app .pdt-cell {
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	height: 40px;
	border-radius: 7px;
	border: 1px solid var(--pdt-line);
	background: #fff;
	color: var(--pdt-muted);
	cursor: pointer;
	padding: 0;
}

.pdt-app .pdt-cell.pdt-answered { background: var(--pdt-green); border-color: var(--pdt-green); color: #fff; }
.pdt-app .pdt-cell.pdt-notanswered { background: var(--pdt-red); border-color: var(--pdt-red); color: #fff; }
.pdt-app .pdt-cell.pdt-marked { background: var(--pdt-purple); border-color: var(--pdt-purple); color: #fff; }
.pdt-app .pdt-cell.pdt-notvisited { background: #fff; }
.pdt-app .pdt-cell.pdt-current { outline: 3px solid var(--pdt-navy); outline-offset: 1px; }

/* Footer */

.pdt-foot {
	flex: 0 0 auto;
	display: flex;
	gap: 10px;
	padding: 12px 20px;
	background: var(--pdt-card);
	border-top: 1px solid var(--pdt-line);
	flex-wrap: wrap;
}

.pdt-foot .pdt-btn { flex: 0 0 auto; }
.pdt-foot .pdt-btn-primary { margin-left: auto; }

/* ------------------------------------------------------- Modals / toasts */

.pdt-modal {
	position: absolute;
	inset: 0;
	background: rgba(15, 35, 64, .62);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	z-index: 40;
}

.pdt-modal-box {
	background: #fff;
	border-radius: 12px;
	padding: 26px;
	max-width: 420px;
	width: 100%;
	text-align: center;
}

.pdt-modal-box h4 { margin: 0 0 10px; font-size: 19px; color: var(--pdt-navy); }
.pdt-modal-box p { margin: 0 0 14px; }
.pdt-modal-box .pdt-btn { width: 100%; }

.pdt-modal-actions { display: flex; gap: 10px; margin-top: 6px; }
.pdt-modal-actions .pdt-btn { flex: 1 1 0; }

.pdt-toast {
	position: absolute;
	left: 50%;
	bottom: 90px;
	transform: translateX(-50%);
	background: var(--pdt-navy);
	color: #fff;
	padding: 12px 20px;
	border-radius: 8px;
	font-size: 14px;
	max-width: 90%;
	text-align: center;
	z-index: 45;
}

.pdt-offline {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	background: var(--pdt-amber);
	color: #fff;
	font-size: 13px;
	padding: 7px 14px;
	text-align: center;
	z-index: 35;
}

/* ---------------------------------------------------------------- Result */

.pdt-result { text-align: center; }

.pdt-score { margin: 6px 0 4px; }
.pdt-score-n { font-size: 52px; font-weight: 700; color: var(--pdt-navy); line-height: 1; }
.pdt-score-d { font-size: 22px; color: var(--pdt-muted); }

.pdt-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
	gap: 10px;
	margin-top: 20px;
}

.pdt-stat {
	background: var(--pdt-bg);
	border-radius: 8px;
	padding: 12px 8px;
}

.pdt-stat-v { font-size: 20px; font-weight: 700; }
.pdt-stat-v.pdt-ok { color: var(--pdt-green); }
.pdt-stat-v.pdt-bad { color: var(--pdt-red); }
.pdt-stat-l { font-size: 12px; color: var(--pdt-muted); }

.pdt-flagnote {
	background: var(--pdt-red-bg);
	color: var(--pdt-red);
	border-radius: 8px;
	padding: 10px 16px;
	font-size: 14px;
	margin-top: 14px;
}

.pdt-review { display: grid; gap: 12px; }

.pdt-review-card {
	background: var(--pdt-card);
	border: 1px solid var(--pdt-line);
	border-radius: var(--pdt-radius);
	padding: 18px 20px;
}

.pdt-review-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
}

.pdt-tag {
	font-size: 12px;
	padding: 4px 11px;
	border-radius: 20px;
}

.pdt-tag.pdt-ok { background: var(--pdt-green-bg); color: var(--pdt-green); }
.pdt-tag.pdt-bad { background: var(--pdt-red-bg); color: var(--pdt-red); }
.pdt-tag.pdt-skip { background: var(--pdt-bg); color: var(--pdt-muted); }

.pdt-review-card .pdt-qtext { font-size: 16px; margin-bottom: 12px; }

.pdt-review-opts { display: grid; gap: 6px; }

.pdt-ropt {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 9px 13px;
	border-radius: 7px;
	border: 1px solid var(--pdt-line);
	font-size: 15px;
}

.pdt-ropt.pdt-correct { background: var(--pdt-green-bg); border-color: #b7e3c6; }
.pdt-ropt.pdt-incorrect { background: var(--pdt-red-bg); border-color: #f2c3c3; }

.pdt-explain {
	margin-top: 12px;
	padding: 12px 14px;
	background: var(--pdt-bg);
	border-radius: 8px;
	font-size: 14px;
}

/* ================================================================ Tablet */

@media (max-width: 1024px) {
	.pdt-side { flex: 0 0 250px; }
	.pdt-qpane { padding: 20px; }
	.pdt-grid { grid-template-columns: repeat(auto-fill, minmax(36px, 1fr)); gap: 7px; }
	.pdt-app .pdt-cell { height: 36px; font-size: 12px; }
}

/* ================================================================ Mobile */

@media (max-width: 767px) {
	.pdt-app { font-size: 15px; }
	.pdt-title { font-size: 21px; }
	.pdt-card { padding: 18px; }

	.pdt-head { padding: 10px 14px; }
	.pdt-head-title { font-size: 14px; }
	.pdt-head-sub { font-size: 11px; }
	.pdt-timer { font-size: 21px; }

	.pdt-qpane { padding: 16px 15px 24px; }
	.pdt-qtext { font-size: 16px; }
	.pdt-option { padding: 12px 13px; }

	/* Palette becomes a bottom drawer */
	.pdt-side {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		top: auto;
		max-height: 72%;
		flex: none;
		border-left: 0;
		border-top: 1px solid var(--pdt-line);
		border-radius: 16px 16px 0 0;
		box-shadow: 0 -8px 28px rgba(15, 35, 64, .18);
		transform: translateY(102%);
		transition: transform .22s ease;
		z-index: 30;
	}

	.pdt-side.pdt-open { transform: translateY(0); }
	.pdt-side-close { display: block; }

	.pdt-grid { grid-template-columns: repeat(auto-fill, minmax(42px, 1fr)); }
	.pdt-app .pdt-cell { height: 42px; font-size: 13px; }

	/* Footer: two rows of thumb-reachable buttons */
	.pdt-foot {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 8px;
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
	}

	.pdt-foot .pdt-btn {
		width: 100%;
		padding: 13px 8px;
		font-size: 14px;
	}

	.pdt-foot .pdt-btn-mark {
		grid-column: 1 / -1;
		order: 3;
		font-size: 13px;
	}

	.pdt-foot .pdt-btn-primary { margin-left: 0; order: 2; }
	.pdt-app .pdt-btn-palette { display: block; grid-column: 1 / -1; order: 4; }

	.pdt-score-n { font-size: 42px; }
	.pdt-stats { grid-template-columns: repeat(3, 1fr); }
	.pdt-legend { font-size: 11px; gap: 8px 10px; }
}

/* Very small phones */
@media (max-width: 360px) {
	.pdt-grid { grid-template-columns: repeat(auto-fill, minmax(38px, 1fr)); gap: 6px; }
	.pdt-foot .pdt-btn { font-size: 13px; padding: 12px 4px; }
}

/* Landscape phone: keep the question area usable */
@media (max-height: 480px) and (orientation: landscape) {
	.pdt-head { padding: 6px 14px; }
	.pdt-timer { font-size: 18px; }
	.pdt-qpane { padding: 12px 16px; }
	.pdt-foot { padding: 8px 12px; }
}

@media print {
	.pdt-stage { display: none; }
}

/* -------------------------------------------------------- Countdown card */

.pdt-upcoming { padding: 28px 22px; }

.pdt-count-label {
	font-size: 12px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--pdt-muted);
	margin-top: 6px;
}

.pdt-countdown {
	font-size: 40px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	line-height: 1.15;
	color: var(--pdt-navy);
	margin: 2px 0 6px;
}

.pdt-countdown.pdt-urgent { color: var(--pdt-green); }

@media (max-width: 767px) {
	.pdt-countdown { font-size: 32px; }
}