/*
 * gchreg.eng.cu.edu.eg — look only, to match www.eng.cu.edu.eg where these pages are shown in an iframe.
 * Linked once in each page's <head>. No ids, names, forms, postbacks or scripts are touched here:
 * removing this file brings back the old look and nothing else changes.
 */
@import url("https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800&display=swap");

:root {
	--cufe-navy: #0A1F44;
	--cufe-navy-deep: #061430;
	--cufe-gold: #C9A227;
	--cufe-gold-ink: #8A6A0E;
	--cufe-bg: #F5F7FB;
	--cufe-ink: #17223B;
	--cufe-muted: #5B6680;
	--cufe-line: #E3E8F1;
	--cufe-white: #fff;
	--cufe-radius: 14px;
	--cufe-shadow: 0 10px 28px -18px rgba(10, 31, 68, .45);
}

/* ---------- Base ---------- */
html, body {
	margin: 0;
	background: transparent !important;
	color: var(--cufe-ink);
	font-family: "Cairo", system-ui, "Segoe UI", Tahoma, sans-serif !important;
	font-size: 15px;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
}
body { padding: 8px 4px 24px; }
*, *::before, *::after { box-sizing: border-box; }
font { font-family: inherit !important; }
img { max-width: 100%; }
form { max-width: 1100px; margin: 0 auto; }
a { color: var(--cufe-navy); text-decoration: none; transition: color .2s, background-color .2s, border-color .2s, transform .2s; }
a:hover { color: var(--cufe-gold-ink); }
a:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid var(--cufe-gold); outline-offset: 2px; }

/* A gold-ruled heading, used for the page titles below. */
.cufe-heading, #ArabicDepartments td > b, #EnglishDepartments td > b,
[id$="P1"] td[colspan="3"] center, [id$="p3"] > p[align="center"], [id$="p2"] > p[align="center"] {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 4px 0 14px;
	color: var(--cufe-navy) !important;
	font-size: 1.375rem;
	font-weight: 800;
	text-decoration: none;
}
#ArabicDepartments td > b::before, #EnglishDepartments td > b::before,
[id$="P1"] td[colspan="3"] center::before, [id$="p3"] > p[align="center"]::before, [id$="p2"] > p[align="center"]::before {
	content: "";
	width: 36px;
	height: 3px;
	border-radius: 3px;
	background: var(--cufe-gold);
}
#ArabicDepartments td > b font, #EnglishDepartments td > b font,
[id$="P1"] td[colspan="3"] center font, [id$="P1"] td[colspan="3"] center span,
[id$="p3"] > p[align="center"] font, [id$="p3"] > p[align="center"] u,
[id$="p2"] > p[align="center"] font, [id$="p2"] > p[align="center"] u { color: inherit !important; font-size: inherit !important; text-decoration: none; }

/* ---------- Theses: list of departments (Thesis2/Departments.htm) ---------- */
#ArabicDepartments { direction: rtl; }
#ArabicDepartments, #EnglishDepartments { max-width: 1100px; margin: 0 auto; }
#ArabicDepartments > table, #EnglishDepartments > table { float: none; width: 100%; border-collapse: collapse; }
#ArabicDepartments td, #EnglishDepartments td { padding: 0; text-align: start; }
#ArabicDepartments tr:last-child td, #EnglishDepartments tr:last-child td {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 12px;
}
#ArabicDepartments tr:last-child td > br, #EnglishDepartments tr:last-child td > br { display: none; }
#ArabicDepartments tr:last-child td > a, #EnglishDepartments tr:last-child td > a {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 64px;
	padding: 14px 18px;
	background: var(--cufe-white);
	border: 1px solid var(--cufe-line);
	border-radius: var(--cufe-radius);
	box-shadow: var(--cufe-shadow);
	color: var(--cufe-navy);
	font-weight: 700;
	line-height: 1.5;
}
#ArabicDepartments tr:last-child td > a::before, #EnglishDepartments tr:last-child td > a::before {
	content: "";
	flex: none;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--cufe-gold);
	box-shadow: 0 0 0 4px rgba(201, 162, 39, .18);
}
#ArabicDepartments tr:last-child td > a:hover, #EnglishDepartments tr:last-child td > a:hover {
	border-color: var(--cufe-gold);
	background: var(--cufe-navy);
	color: var(--cufe-white);
	transform: translateY(-2px);
}
/* "Search theses" above the departments. */
#ArabicDepartments > a, #EnglishDepartments > a,
[id$="p1"] h4 a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 18px;
	padding: 10px 26px;
	border-radius: 999px;
	background: var(--cufe-gold);
	color: var(--cufe-navy-deep) !important;
	font-size: .95rem;
	font-weight: 800;
}
#ArabicDepartments > a:hover, #EnglishDepartments > a:hover,
[id$="p1"] h4 a:hover { background: var(--cufe-navy); color: var(--cufe-white) !important; }
[id$="p1"] h4 { margin: 0; }

/* ---------- Theses of a department, and search results (Thesis2/ and ThesisSearch/) ---------- */
blockquote { margin: 0 0 12px; }
blockquote > p {
	margin: 0;
	padding: 16px 20px;
	background: var(--cufe-white);
	border: 1px solid var(--cufe-line);
	border-inline-start: 4px solid var(--cufe-gold);
	border-radius: var(--cufe-radius);
	box-shadow: var(--cufe-shadow);
	color: var(--cufe-muted);
	font-size: .9rem;
	line-height: 1.8;
}
blockquote > p b { font-weight: 600; }
blockquote > p u { text-decoration: none; }
blockquote > p > font[color="red"] a, blockquote > p > font[color="red"] b a {
	color: var(--cufe-navy) !important;
	font-size: 1.05rem;
	font-weight: 800;
	line-height: 1.5;
}
blockquote > p > font[color="red"] a:hover { color: var(--cufe-gold-ink) !important; }
blockquote > p font[color="#3366CC"], blockquote > p font[color="#3366cc"] { color: var(--cufe-gold-ink) !important; font-weight: 700; }
blockquote > p font i { font-style: normal; }

/* ---------- Thesis search form (ThesisSearch/Default.aspx) ---------- */
[id$="P1"] > div > table:first-child {
	width: 100%;
	max-width: 760px;
	margin: 0 auto 24px;
	padding: 8px 12px;
	border-collapse: separate !important;
	border-spacing: 0 6px;
	background: var(--cufe-white);
	border: 1px solid var(--cufe-line);
	border-radius: var(--cufe-radius);
	box-shadow: var(--cufe-shadow);
}
[id$="P1"] > div > table:first-child td { padding: 6px 10px; vertical-align: middle; }
[id$="P1"] > div > table:first-child font[color="#006699"] { color: var(--cufe-navy) !important; font-size: .95rem; }
[id$="P1"] > div > table:first-child span[style*="FF0000"] { color: var(--cufe-muted) !important; font-size: .8rem; }
[id$="P1"] .style1 { width: auto !important; }

/* ---------- Journal search (thesis/Search.aspx) ---------- */
table.style1 {
	width: 100%;
	max-width: 760px;
	margin: 0 auto;
	border: 1px solid var(--cufe-line) !important;
	border-collapse: separate;
	border-spacing: 0;
	border-radius: var(--cufe-radius);
	overflow: hidden;
	background: var(--cufe-white);
	box-shadow: var(--cufe-shadow);
	font-weight: 600 !important;
}
table.style1 td { padding: 10px 14px; border-bottom: 1px solid var(--cufe-line); }
table.style1 tr:first-child { display: none; }
table.style1 tr:last-child td { border-bottom: 0; }
table.style1 .style4, table.style1 .style8, table.style1 .style9, table.style1 .style10, table.style1 .style11 { width: auto !important; background: transparent !important; }
table.style1 .style11, table.style1 .style4 { width: 160px !important; background: var(--cufe-bg) !important; color: var(--cufe-navy); }
hr { height: 1px; margin: 24px 0; border: 0; background: var(--cufe-line); }
.style5 { font-size: .9rem !important; }
.style6 { color: var(--cufe-gold-ink) !important; }
.style7 { color: var(--cufe-navy) !important; }
img[src*="Arrow.png"] { display: none; }
table[id$="DataList1"] { width: 100%; border-collapse: separate !important; border-spacing: 0 8px; }
table[id$="DataList1"] td { padding: 12px 16px !important; background: var(--cufe-white) !important; border: 1px solid var(--cufe-line) !important; border-radius: var(--cufe-radius); color: var(--cufe-ink) !important; }
table[id$="DataList1"] tr:first-child td { background: var(--cufe-navy) !important; border-color: var(--cufe-navy) !important; color: var(--cufe-white) !important; font-weight: 700; }
table[id$="DataList1"] a { color: var(--cufe-navy) !important; font-weight: 800; }

/* ---------- Details of one thesis or article (DetailsView) ---------- */
table[id$="DetailsView1"] {
	width: 100% !important;
	max-width: 1000px;
	height: auto !important;
	margin: 0 auto;
	border: 1px solid var(--cufe-line) !important;
	border-collapse: separate !important;
	border-spacing: 0;
	border-radius: var(--cufe-radius);
	overflow: hidden;
	background: var(--cufe-white);
	box-shadow: var(--cufe-shadow);
	color: var(--cufe-ink) !important;
	font-family: inherit !important;
	font-weight: 400 !important;
}
table[id$="DetailsView1"] tr { background: var(--cufe-white) !important; color: var(--cufe-ink) !important; }
table[id$="DetailsView1"] tr:nth-child(even) { background: var(--cufe-bg) !important; }
table[id$="DetailsView1"] td { padding: 12px 16px !important; border-bottom: 1px solid var(--cufe-line); vertical-align: top; line-height: 1.8; }
table[id$="DetailsView1"] tr:last-child td { border-bottom: 0; }
table[id$="DetailsView1"] td:first-child { width: 200px; background: transparent !important; color: var(--cufe-navy) !important; font-weight: 700 !important; white-space: nowrap; }

/* ---------- Form fields ---------- */
input[type="text"], select, textarea {
	width: 100% !important;
	max-width: 420px;
	min-height: 42px;
	padding: 8px 12px;
	border: 1px solid var(--cufe-line);
	border-radius: 10px;
	background: var(--cufe-white);
	color: var(--cufe-ink);
	font: inherit;
}
input[type="text"]:focus, select:focus, textarea:focus { border-color: var(--cufe-gold); outline: none; box-shadow: 0 0 0 3px rgba(201, 162, 39, .25); }
input[type="submit"], input[type="button"] {
	min-height: 44px;
	padding: 10px 36px;
	border: 0;
	border-radius: 999px;
	background: var(--cufe-navy);
	color: var(--cufe-white);
	font: inherit;
	font-weight: 700 !important;
	cursor: pointer;
	transition: background-color .2s, color .2s;
}
input[type="submit"]:hover, input[type="button"]:hover { background: var(--cufe-gold); color: var(--cufe-navy-deep); }

/* ---------- Phones ---------- */
@media (max-width: 600px) {
	body { font-size: 14px; }
	#ArabicDepartments tr:last-child td, #EnglishDepartments tr:last-child td { grid-template-columns: 1fr; }
	[id$="P1"] > div > table:first-child, [id$="P1"] > div > table:first-child tbody,
	[id$="P1"] > div > table:first-child tr, [id$="P1"] > div > table:first-child td,
	table.style1, table.style1 tbody, table.style1 tr, table.style1 td,
	table[id$="DetailsView1"], table[id$="DetailsView1"] tbody, table[id$="DetailsView1"] tr, table[id$="DetailsView1"] td { display: block; width: 100% !important; }
	table.style1 tr:first-child { display: none; }
	table[id$="DetailsView1"] td:first-child { padding-bottom: 0 !important; white-space: normal; }
	[id$="P1"] > div > table:first-child td { padding: 2px 6px; }
}