/* ---------- Base / school-brandable palette -----------
   --eka-primary / --eka-secondary are set inline in <head> from the
   School Settings colors (see eka_print_color_overrides()). The hex
   values below are just fallbacks used if no custom colors are saved. */
:root {
	--eka-primary: #4a6b3d;
	--eka-secondary: #a97c50;
}

.eka-box {
	max-width: 700px;
	margin: 30px auto;
	background: #fffdf8;
	border: 1px solid #e8dfcd;
	border-radius: 10px;
	padding: 28px;
	box-shadow: 0 4px 14px rgba(60, 40, 10, 0.06);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
.eka-box.eka-box-wide { max-width: 1100px; }
.eka-box h2 { color: var(--eka-primary); margin-top: 0; font-weight: 700; }
.eka-box input[type="text"],
.eka-box input[type="password"],
.eka-box input[type="number"],
.eka-box select {
	width: 100%;
	padding: 11px;
	border: 1px solid #d8cfba;
	border-radius: 6px;
	box-sizing: border-box;
	background: #fff;
	font-size: 15px;
}
.eka-box label { display: block; margin: 14px 0 5px; font-weight: 600; color: #4a4a3f; }
.eka-box input:focus, .eka-box select:focus {
	outline: none;
	border-color: var(--eka-primary);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--eka-primary) 20%, transparent);
}

.eka-btn {
	margin-top: 18px;
	background: var(--eka-primary);
	color: #fff;
	border: none;
	padding: 12px 22px;
	border-radius: 6px;
	cursor: pointer;
	font-weight: 600;
	font-size: 15px;
}
.eka-btn:hover { filter: brightness(0.9); }
.eka-btn-secondary { background: var(--eka-secondary); margin-left: 10px; }
.eka-btn-secondary:hover { filter: brightness(0.9); }
.eka-btn-danger { background: #a13a30; margin-left: 10px; }
.eka-btn-danger:hover { filter: brightness(0.9); }
.eka-btn-link { background: none; border: none; color: var(--eka-primary); text-decoration: underline; cursor: pointer; font-weight: 600; }
.eka-btn-sm { padding: 6px 12px; font-size: 13px; margin-top: 0; }

.eka-msg { min-height: 20px; margin: 10px 0; font-weight: 600; }
.eka-msg.eka-error { color: #b3261e; }
.eka-msg.eka-success { color: #2e7d32; }
.eka-note { font-size: 13px; color: #6b6350; font-style: italic; margin-top: 14px; }

.eka-teacher-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; padding-bottom: 12px; border-bottom: 1px solid #e8dfcd; flex-wrap: wrap; gap: 8px; }

/* ---------- Admin dashboard tabs ---------- */
.eka-admin-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 20px; border-bottom: 2px solid #e8dfcd; padding-bottom: 10px; }
.eka-tab-btn {
	background: #f2ede0;
	border: 1px solid #e0d9c8;
	color: #4a4a3f;
	padding: 8px 14px;
	border-radius: 6px;
	cursor: pointer;
	font-weight: 600;
	font-size: 13px;
}
.eka-tab-btn.eka-tab-active { background: var(--eka-primary); color: #fff; border-color: var(--eka-primary); }
.eka-tab-panel { display: none; }
.eka-tab-panel.eka-tab-panel-active { display: block; }
.eka-inline-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 18px; }
.eka-inline-form input, .eka-inline-form select { width: auto; flex: 1 1 160px; }
.eka-section-title { color: var(--eka-primary); font-size: 16px; font-weight: 700; margin: 22px 0 10px; }

/* ---------- Tables (score entry + rankings) ---------- */
.eka-score-table { width: 100%; border-collapse: collapse; margin-top: 16px; background: #fff; }
.eka-score-table th, .eka-score-table td { border: 1px solid #e0d9c8; padding: 9px; text-align: center; font-size: 14px; }
.eka-score-table th { background: color-mix(in srgb, var(--eka-primary) 12%, #fff); color: var(--eka-primary); font-weight: 700; }
.eka-score-table input[type="number"], .eka-score-table input[type="text"] { width: 90%; padding: 5px; border: 1px solid #d8cfba; border-radius: 4px; }

/* ---------- Result sheet (printed/viewed report card) ---------- */
.eka-result-card .eka-score-table { table-layout: auto; margin-top: 10px; border: 2px solid #000; }
.eka-result-card .eka-score-table th,
.eka-result-card .eka-score-table td { padding: 6px 8px; font-size: 12px; line-height: 1.3; white-space: nowrap; border: 1px solid #000; color: #000; background: #fff; font-weight: 600; }
.eka-result-card .eka-score-table th { background: var(--eka-primary); color: #fff; font-weight: 800; font-size: 11px; text-transform: uppercase; letter-spacing: 0.3px; border: 1px solid #000; border-bottom-width: 2px; }
.eka-result-card .eka-score-table td:first-child, .eka-result-card .eka-score-table th:first-child { text-align: left; white-space: nowrap; }
.eka-result-card .eka-score-table td:first-child { font-weight: 800; }
.eka-table-scroll { width: 100%; overflow-x: auto; }

/* ---------- Academic-session banner shown above score-entry sheets ---------- */
.eka-session-banner { margin: 10px 0; padding: 6px 10px; border-left: 4px solid var(--eka-primary); background: #f7f3e8; font-size: 13px; font-weight: 600; color: #000; }

/* ---------- Teacher portal: student-first score sheet ---------- */
.eka-remove-subject { font-size: 12px; text-decoration: none; }
.eka-remove-subject:hover { text-decoration: underline; }
#eka-student-sheet-wrap textarea.eka-student-remark { font-family: inherit; }
.eka-live-positions { margin-top: 16px; }

/* ---------- Social Behaviour (score-entry rating grid) ---------- */
.eka-sb-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px 14px; margin-top: 8px; }
.eka-sb-field { display: flex; justify-content: space-between; align-items: center; gap: 8px; background: #f7f3e8; padding: 6px 10px; border-radius: 6px; }
.eka-sb-field span { font-size: 13px; color: #4a4a3f; font-weight: 600; }
.eka-sb-field select { width: auto; padding: 4px 6px; font-size: 13px; }

/* ---------- Result preview modal (teacher/admin score entry) ---------- */
.eka-preview-overlay {
	position: fixed; inset: 0; background: rgba(20, 15, 5, 0.55);
	display: flex; align-items: flex-start; justify-content: center;
	overflow-y: auto; z-index: 100000; padding: 30px 16px;
}
.eka-preview-panel { background: #fff; border-radius: 10px; max-width: 640px; width: 100%; padding: 20px; position: relative; }
.eka-preview-close {
	position: absolute; top: 10px; right: 14px; background: none; border: none;
	font-size: 22px; line-height: 1; cursor: pointer; color: #6b6350;
}
.eka-preview-note { background: #fff7e6; border: 1px solid #eadfc0; color: #6b5b2a; padding: 8px 12px; border-radius: 6px; font-size: 13px; margin-bottom: 14px; }

/* ---------- Report card (official result-sheet look) ----------
   Only --eka-primary / --eka-secondary are used for colour. Everything
   else is pure #000 / #fff so the sheet prints crisply on any printer.
   No gradients, shadows or transparency. */
.eka-result-card {
	border: 3px solid #000;
	border-radius: 4px;
	padding: 18px 20px;
	margin-top: 20px;
	background: #fff;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	-webkit-print-color-adjust: exact;
	print-color-adjust: exact;
	color-adjust: exact;
}
.eka-result-card h2, .eka-result-card h3, .eka-result-card h4, .eka-result-card p { font-family: inherit; }

.eka-letterhead { position: relative; text-align: center; border-bottom: 4px solid var(--eka-primary); padding-bottom: 12px; margin-bottom: 14px; }
.eka-letterhead::after { content: ""; position: absolute; left: 0; right: 0; bottom: -9px; height: 3px; background: var(--eka-secondary); }
.eka-logo { display: block; margin: 0 auto 6px; max-width: 76px; max-height: 76px; object-fit: contain; }
.eka-letterhead h2 { margin: 0; color: var(--eka-primary); font-family: 'Montserrat', Arial, sans-serif; font-weight: 800; font-size: 24px; line-height: 1.2; letter-spacing: 0.6px; text-transform: uppercase; }
.eka-letterhead .eka-address { margin: 4px 0 0; font-size: 12.5px; color: #000; font-weight: 600; }
.eka-letterhead .eka-motto { margin: 4px 0 0; font-size: 12px; font-style: italic; color: #000; font-weight: 700; }

/* Heading blocks: solid colour fill + white text. */
.eka-sheet-title { text-align: center; background: var(--eka-primary); color: #fff; padding: 9px 10px; border: 2px solid #000; border-radius: 3px; margin: 0 0 12px; font-size: 15px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.8px; }

.eka-student-meta { display: flex; flex-wrap: wrap; margin-bottom: 12px; font-size: 13px; font-weight: 600; color: #000; background: #fff; border: 2px solid #000; border-radius: 3px; }
.eka-student-meta span { flex: 1 1 auto; padding: 7px 12px; text-align: center; border-left: 1px solid #000; color: #000; }
.eka-student-meta span:first-child { border-left: none; flex-grow: 2; text-align: left; }
.eka-student-meta strong { font-weight: 800; text-transform: uppercase; font-size: 11.5px; letter-spacing: 0.3px; }

.eka-summary-row { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 40px; margin-top: 10px; font-size: 14px; font-weight: 800; background: var(--eka-secondary); color: #fff; padding: 8px 12px; border: 2px solid #000; border-radius: 3px; }

/* ---------- Social Behaviour (compact block on the result sheet) ---------- */
.eka-sb-title { text-align: center; background: var(--eka-primary); color: #fff; font-size: 13.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.8px; margin: 14px 0 0; padding: 7px; border: 2px solid #000; border-bottom: none; border-radius: 3px 3px 0 0; }
.eka-sb-table { width: 100%; border-collapse: collapse; border: 2px solid #000; }
.eka-sb-table td { border: 1px solid #000; padding: 5px 7px; font-size: 11.5px; font-weight: 700; text-align: center; color: #000; background: #fff; }
.eka-sb-table td.eka-sb-label { text-align: left; font-weight: 800; color: #fff; background: var(--eka-primary); white-space: nowrap; }

.eka-remarks-section { display: flex; gap: 12px; margin-top: 14px; flex-wrap: wrap; }
.eka-remark-box { flex: 1; min-width: 220px; border: 2px solid #000; border-radius: 3px; padding: 0; background: #fff; overflow: hidden; }
.eka-remark-box h4 { display: block; margin: 0; background: var(--eka-primary); color: #fff; font-size: 12.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.6px; padding: 6px 10px; border-bottom: 2px solid #000; border-radius: 0; }
.eka-remark-box p { min-height: 36px; margin: 0; padding: 8px 10px; font-size: 12.5px; color: #000; font-weight: 600; }
.eka-signline { border-top: 1px solid #000; margin: 14px 10px 0; padding: 3px 0 6px; font-size: 11px; font-weight: 700; color: #000; text-align: right; }

.eka-next-term { text-align: center; margin-top: 12px; font-size: 13px; font-weight: 700; color: #000; background: #fff; border: 2px solid #000; border-left: 10px solid var(--eka-secondary); padding: 7px 12px; border-radius: 3px; }

/* Phones: stack the student details, keep the score table scrollable. */
@media screen and (max-width: 600px) {
	.eka-result-card { padding: 12px; }
	.eka-letterhead h2 { font-size: 18px; }
	.eka-sheet-title { font-size: 13px; }
	.eka-student-meta span, .eka-student-meta span:first-child { flex: 1 1 100%; text-align: left; border-left: none; border-top: 1px solid #000; }
	.eka-student-meta span:first-child { border-top: none; }
	.eka-remark-box { min-width: 100%; }
	.eka-sb-table td { font-size: 10.5px; padding: 4px; }
}

.eka-search-input { max-width: 320px; }

.eka-result-actions { margin-top: 22px; text-align: center; }

/* ---------- Print isolation ----------
   The report card is cloned into #eka-print-root (appended directly to
   <body>, outside any theme wrapper) right before printing, and every
   other direct child of <body> is hidden.

   DESIGN RULE: the print sheet uses the very same component classes and
   the very same two theme colours (--eka-primary / --eka-secondary) as the
   on-screen sheet. The block below does not define a second design - it
   (a) scales spacing for A4 and (b) "locks" every coloured element with
   !important + an #id selector. The lock is needed because many themes ship
   print rules such as "* { background: transparent !important; color: #000
   !important }", which otherwise strip the filled heading bars, the white
   heading text and the letterhead rule from the printout. */
#eka-print-root { display: none; }
@page { size: A4; margin: 10mm; }
@media print {
	html, body { background: #fff !important; }
	body > *:not(#eka-print-root) { display: none !important; }
	#eka-print-root {
		display: block !important;
		position: static !important;
		margin: 0 auto;
	}

	/* Force backgrounds/colours to print (also for ::before/::after). */
	#eka-print-root,
	#eka-print-root *,
	#eka-print-root *::before,
	#eka-print-root *::after {
		-webkit-print-color-adjust: exact !important;
		print-color-adjust: exact !important;
		color-adjust: exact !important;
		box-shadow: none !important;
		text-shadow: none !important;
		filter: none !important;
	}

	/* ----- Frame (same 3px black frame as on screen) ----- */
	#eka-print-root .eka-result-card {
		border: 3px solid #000 !important;
		border-radius: 4px;
		background: #fff !important;
		color: #000 !important;
		padding: 5mm;
		margin: 0;
		width: auto;
	}
	#eka-print-root .eka-table-scroll { overflow: visible; }

	/* ----- COLOUR LOCK: primary-filled headings, white text ----- */
	#eka-print-root .eka-sheet-title,
	#eka-print-root .eka-sb-title,
	#eka-print-root .eka-remark-box h4,
	#eka-print-root .eka-score-table th,
	#eka-print-root .eka-sb-table td.eka-sb-label {
		background: var(--eka-primary) !important;
		background-color: var(--eka-primary) !important;
		color: #fff !important;
	}
	/* ----- COLOUR LOCK: secondary-filled summary bar, white text ----- */
	#eka-print-root .eka-summary-row,
	#eka-print-root .eka-summary-row span,
	#eka-print-root .eka-summary-row strong {
		color: #fff !important;
	}
	#eka-print-root .eka-summary-row {
		background: var(--eka-secondary) !important;
		background-color: var(--eka-secondary) !important;
	}
	/* ----- COLOUR LOCK: letterhead (school name + double rule) ----- */
	#eka-print-root .eka-letterhead h2 { color: var(--eka-primary) !important; }
	#eka-print-root .eka-letterhead { border-bottom: 4px solid var(--eka-primary) !important; }
	#eka-print-root .eka-letterhead::after { background: var(--eka-secondary) !important; background-color: var(--eka-secondary) !important; }
	/* ----- COLOUR LOCK: Next-Term accent bar ----- */
	#eka-print-root .eka-next-term { border: 2px solid #000 !important; border-left: 10px solid var(--eka-secondary) !important; background: #fff !important; }

	/* ----- Pure-black text on white cells ----- */
	#eka-print-root .eka-letterhead .eka-address,
	#eka-print-root .eka-letterhead .eka-motto,
	#eka-print-root .eka-student-meta,
	#eka-print-root .eka-student-meta span,
	#eka-print-root .eka-student-meta strong,
	#eka-print-root .eka-score-table td,
	#eka-print-root .eka-sb-table td:not(.eka-sb-label),
	#eka-print-root .eka-remark-box p,
	#eka-print-root .eka-signline,
	#eka-print-root .eka-next-term,
	#eka-print-root .eka-next-term strong { color: #000 !important; }
	#eka-print-root .eka-student-meta,
	#eka-print-root .eka-score-table td,
	#eka-print-root .eka-sb-table td:not(.eka-sb-label),
	#eka-print-root .eka-remark-box { background: #fff !important; }

	/* ----- Black borders (same weights as on screen) ----- */
	#eka-print-root .eka-sheet-title { border: 2px solid #000 !important; }
	#eka-print-root .eka-sb-title { border: 2px solid #000 !important; border-bottom: none !important; }
	#eka-print-root .eka-summary-row { border: 2px solid #000 !important; }
	#eka-print-root .eka-student-meta { border: 2px solid #000 !important; }
	#eka-print-root .eka-student-meta span { border-left: 1px solid #000 !important; }
	#eka-print-root .eka-student-meta span:first-child { border-left: none !important; }
	#eka-print-root .eka-remark-box { border: 2px solid #000 !important; }
	#eka-print-root .eka-remark-box h4 { border-bottom: 2px solid #000 !important; }
	#eka-print-root .eka-signline { border-top: 1px solid #000 !important; }
	#eka-print-root .eka-score-table { width: 100%; border: 2px solid #000 !important; }
	#eka-print-root .eka-sb-table { border: 2px solid #000 !important; }
	#eka-print-root .eka-score-table th,
	#eka-print-root .eka-score-table td,
	#eka-print-root .eka-sb-table td { border: 1px solid #000 !important; }
	#eka-print-root .eka-score-table th { border-bottom-width: 2px !important; }

	/* ----- A4 sizing only (hierarchy identical to screen) ----- */
	#eka-print-root .eka-letterhead h2 { font-size: 23px; }
	#eka-print-root .eka-letterhead .eka-address { font-size: 12px; }
	#eka-print-root .eka-letterhead .eka-motto { font-size: 11.5px; }
	#eka-print-root .eka-sheet-title { font-size: 14px; padding: 8px 10px; }
	#eka-print-root .eka-student-meta span { font-size: 12px; padding: 6px 10px; }
	#eka-print-root .eka-score-table th { font-size: 10px; padding: 5px 5px; white-space: normal; }
	#eka-print-root .eka-score-table td { font-size: 11px; padding: 5px 6px; }
	#eka-print-root .eka-summary-row { font-size: 13.5px; padding: 7px 12px; }
	#eka-print-root .eka-sb-title { font-size: 13px; padding: 6px; }
	#eka-print-root .eka-sb-table td { font-size: 11px; padding: 4px 6px; }
	#eka-print-root .eka-remarks-section { flex-wrap: nowrap; }
	#eka-print-root .eka-remark-box { min-width: 0; }
	#eka-print-root .eka-remark-box h4 { font-size: 12px; }
	#eka-print-root .eka-remark-box p { font-size: 12px; min-height: 30px; }
	#eka-print-root .eka-next-term { font-size: 12.5px; }

	/* ----- Never split a block; keep headings with their content ----- */
	#eka-print-root .eka-letterhead,
	#eka-print-root .eka-sheet-title,
	#eka-print-root .eka-student-meta,
	#eka-print-root .eka-summary-row,
	#eka-print-root .eka-sb-title,
	#eka-print-root .eka-sb-table,
	#eka-print-root .eka-remarks-section,
	#eka-print-root .eka-remark-box,
	#eka-print-root .eka-next-term,
	#eka-print-root .eka-score-table tr { break-inside: avoid; page-break-inside: avoid; }
	#eka-print-root .eka-sheet-title,
	#eka-print-root .eka-sb-title { break-after: avoid; page-break-after: avoid; }
	#eka-print-root .eka-score-table thead { display: table-header-group; }
}