/* CathInfo branding block (ported from DeepBlue footer) */

/* Live DeepBlue-style top brand bar: graphic left, blurb far right */
#cathinfo_site_header {
	background: linear-gradient(to bottom, #4b698b 0%, #354a62 100%);
	color: #fff;
	border-top: 3px solid #03a9f4;
	border-bottom: 3px solid #03a9f4;
	box-shadow: 0 12px 18px -8px rgba(0, 0, 0, 0.65);
	padding: 8px 18px;
	box-sizing: border-box;
	width: 100%;
	clear: both;
	position: relative;
	z-index: 1040;
}
#cathinfo_top_section {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 1.25rem;
	min-height: 60px;
	overflow: hidden;
}
h1.cathinfo_forumtitle {
	margin: 0;
	padding: 0;
	float: none;
	line-height: 1;
	flex: 0 0 auto;
	font-size: 1em;
}
h1.cathinfo_forumtitle a {
	display: inline-block;
	line-height: 0;
}
h1.cathinfo_forumtitle img {
	display: block;
	max-width: 100%;
	height: auto;
	background: #fff;
	border: 0;
}
#cathinfo_siteslogan {
	margin: 0;
	padding: 0;
	float: none;
	text-align: right;
	line-height: 1.3em;
	color: #fff;
	flex: 1 1 auto;
	max-width: min(560px, 58%);
}
#cathinfo_siteslogan a {
	color: #d7edfc;
}
.cathinfo_rss {
	float: right;
	margin: 0 0 0 12px;
}
.cathinfo_rss img {
	display: block;
	border: 0;
	vertical-align: top;
}
.cathinfo_slogan_title {
	margin: 0 0 2px;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.15;
	color: #fff;
}
.cathinfo_slogan_blurb {
	margin: 0;
	padding: 0;
	font-size: 0.95rem;
	line-height: 1.35;
	color: #fff;
}
.cathinfo_since {
	margin-top: 2px;
	text-align: right;
	font-weight: 700;
	font-style: italic;
	font-size: 0.95rem;
	color: #fff;
}

/* Wide/AdminLTE: brand bar sits above main-header; sidebar is position:absolute
   with padding-top sized only for the thin header (~63px). Add brand-bar height
   so menu items are not hidden underneath the logo/blurb strip. */
body.skin-blue:has(#cathinfo_site_header) {
	--cathinfo-brand-h: 88px; /* ~60px logo + padding + cyan borders */
}
body.skin-blue:has(#cathinfo_site_header) .main-sidebar,
body.skin-blue:has(#cathinfo_site_header) .left-side {
	padding-top: calc(63px + var(--cathinfo-brand-h)) !important;
}
/* Keep the graduation-cap label out of the way; brand bar is the real logo. */
body.skin-blue:has(#cathinfo_site_header) .main-header > h1.logo {
	visibility: hidden;
	pointer-events: none;
}
body.skin-blue:has(#cathinfo_site_header) .main-header > h1.logo a {
	visibility: hidden;
}

@media (max-width: 820px) {
	body.skin-blue:has(#cathinfo_site_header) {
		--cathinfo-brand-h: 160px; /* stacked logo + blurb */
	}
	#cathinfo_top_section {
		flex-direction: column;
		align-items: stretch;
		gap: 0.65rem;
	}
	#cathinfo_siteslogan {
		max-width: 100%;
		text-align: left;
	}
	.cathinfo_rss {
		float: right;
	}
	.cathinfo_since {
		text-align: left;
	}
}

/* Below-menu news / Amazon wishlist (DeepBlue .news placement) */
.cathinfo_header_news {
	margin: 0 0 0.85rem;
	padding: 0.75rem 1rem;
	background: #eef3f8;
	border: 1px solid #c5d0dc;
	border-radius: 4px;
	text-align: center;
	font-size: 1.05rem;
	line-height: 1.45;
	color: #222;
}
.cathinfo_header_news_inner {
	max-width: 920px;
	margin: 0 auto;
}
.cathinfo_header_news a {
	color: #1a4a7a;
	font-weight: 600;
	word-break: break-all;
}
.content-wrapper .cathinfo_header_news {
	margin: 0.5rem 0 1rem;
}

/* Live-style unread shortcuts — own block above Recent Topics */
.cathinfo_user_links {
	margin: 0 0 0.75rem;
	padding: 0.75rem 1rem;
	background: #eef3f8;
	border: 1px solid #c5d0dc;
	border-radius: 4px;
	color: #222;
	line-height: 1.45;
	box-sizing: border-box;
	width: 100%;
}
.recenttopics_table > .cathinfo_user_links {
	order: -1;
}
.cathinfo_user_greeting {
	font-size: 1.15rem;
	font-weight: 700;
	margin: 0 0 0.35rem;
}
.cathinfo_user_unread {
	list-style: none;
	margin: 0;
	padding: 0;
}
.cathinfo_user_unread li {
	margin: 0.15rem 0;
}
.cathinfo_user_unread a {
	color: #1a4a7a;
	font-weight: 600;
	text-decoration: none;
}
.cathinfo_user_unread a:hover {
	text-decoration: underline;
}
.cathinfo_user_time {
	margin-top: 0.4rem;
	font-size: 0.95rem;
	color: #444;
}

/* Recent Topics: circular avatars (tall/wide images crop to fit); +25% vs prior 44px */
#recentforumtopics .rtbi_avatar {
	flex: 0 0 55px;
	width: 55px;
	height: 55px;
	align-self: center;
	margin: 6px 10px 6px 8px;
	padding: 0;
	box-sizing: border-box;
	overflow: hidden;
	border: 1px solid #8aa4bc;
	border-radius: 50% !important;
	background: #e8eef4;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.65) inset;
}
#recentforumtopics .rtbi_avatar.header_avatar {
	height: 0;
	min-height: 0;
	margin: 0 10px 0 8px;
	border: none;
	border-radius: 0 !important;
	background: transparent;
	box-shadow: none;
	overflow: visible;
}
#recentforumtopics .rtbi_avatar img.avatar,
#recentforumtopics .rtbi_avatar img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	min-width: 100% !important;
	min-height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	object-fit: cover !important;
	object-position: center center !important;
}
#topic_header .rtbi_avatar.header_avatar {
	flex: 0 0 55px;
	width: 55px;
}
/* Subject-only row: drop starter/board line; double subject size */
#recentforumtopics .recent_title {
	font-size: 200%;
	line-height: 1.25;
}
#recentforumtopics .recent_title .preview,
#recentforumtopics .recent_title a {
	font-size: inherit;
}
/* Recent Topics pager: Go Up / Pages 1 2 3… — 100% larger */
#recenttopics .pagesection .pagelinks {
	font-size: 200%;
	line-height: 1.3;
}
#recenttopics .pagesection .pagelinks .button,
#recenttopics .pagesection .pagelinks .pages,
#recenttopics .pagesection .pagelinks .current_page,
#recenttopics .pagesection .pagelinks .nav_page,
#recenttopics .pagesection .pagelinks a {
	font-size: inherit !important;
}

/*
 * Board index two-column layout (align=right):
 * left = shoutbox + boards + info center; right = Recent Topics.
 * #rtbi_right uses display:contents so its children participate in the section grid.
 * IMPORTANT: do not use grid-row span N — empty tracks + row-gap create a huge white gap.
 */
section.content:has(#rtbi_right) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
	grid-template-areas:
		"news news"
		"shout recent"
		"boards recent"
		"mark recent"
		"info recent";
	column-gap: 14px;
	row-gap: 12px;
	align-items: start;
}

section.content:has(#rtbi_right):not(:has(#shoutbox_widget)) {
	grid-template-areas:
		"news news"
		"boards recent"
		"mark recent"
		"info recent";
}

section.content:has(#rtbi_left) {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	grid-template-areas:
		"news news"
		"recent shout"
		"recent boards"
		"recent mark"
		"recent info";
	column-gap: 14px;
	row-gap: 12px;
	align-items: start;
}

section.content:has(#rtbi_left):not(:has(#shoutbox_widget)) {
	grid-template-areas:
		"news news"
		"recent boards"
		"recent mark"
		"recent info";
}

section.content:has(#rtbi_right) #cathinfo_header_news,
section.content:has(#rtbi_left) #cathinfo_header_news {
	grid-area: news;
}

section.content:has(#rtbi_right) #shoutbox_widget,
section.content:has(#rtbi_left) #shoutbox_widget {
	grid-area: shout;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	margin-bottom: 0;
}

section.content:has(#rtbi_right) #rtbi_right,
section.content:has(#rtbi_left) #rtbi_left {
	display: contents;
}

section.content:has(#rtbi_right) .recenttopics_table,
section.content:has(#rtbi_left) .recenttopics_table {
	grid-area: recent;
	align-self: start;
	width: 100% !important;
	float: none !important;
	padding: 0 !important;
}

section.content:has(#rtbi_right) #boardindex_table,
section.content:has(#rtbi_left) #boardindex_table {
	grid-area: boards;
	width: 100%;
}

section.content:has(#rtbi_right) .mark_read,
section.content:has(#rtbi_left) .mark_read {
	grid-area: mark;
}

section.content:has(#rtbi_right) #info_center,
section.content:has(#rtbi_left) #info_center {
	grid-area: info;
	width: 100%;
}

@media (max-width: 900px) {
	section.content:has(#rtbi_right),
	section.content:has(#rtbi_left) {
		display: block;
	}
	section.content:has(#rtbi_right) .recenttopics_table,
	section.content:has(#rtbi_left) .recenttopics_table {
		width: 100% !important;
		float: none !important;
		padding: 0 !important;
		margin-bottom: 1rem;
	}
	section.content:has(#rtbi_right) #shoutbox_widget,
	section.content:has(#rtbi_left) #shoutbox_widget {
		margin-bottom: 1rem;
	}
}

/* Board descriptions on the index (live CathInfo shows these under each board name).
   RTBI sides layout previously omitted them; keep readable in the left column. */
#boardindex_table .board_description {
	display: block;
	margin: 0.2em 0 0.35em;
	padding: 0;
	font-size: 0.95rem;
	line-height: 1.35;
	color: #222;
	overflow-wrap: break-word;
}
#rtbi_left #boardindex_table .info,
#rtbi_right #boardindex_table .info {
	align-self: flex-start;
}

/* Outer / first-layer page chrome: slate blue (live CathInfo), not white.
   Header brand bar + footer stay blue; the main forum column is white. */
html,
body.skin-blue,
body.action_home {
	background: #3e5a78 !important;
}
body.skin-blue #footerfix {
	background: #3e5a78;
}
body.skin-blue .content-wrapper,
body.skin-blue .content-header,
body.skin-blue section.content {
	background: #fff !important;
}

/* Full-bleed blue footer band (matches top brand bar / live #footer_section) */
.cathinfo_branding {
	margin: 0;
	padding: 1.25rem 1.25rem 0.75rem;
	max-width: none;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	color: #fff;
	background: #476383;
	border-radius: 0;
}
/* Theme sets strong { color: #444 } — unreadable on this blue background */
.cathinfo_branding,
.cathinfo_branding p,
.cathinfo_branding span,
.cathinfo_branding strong,
.cathinfo_branding em,
.cathinfo_branding .strong,
.cathinfo_branding .em {
	color: #fff !important;
}
/* Slim #footer: no credits, continuous blue with the about block */
#cathinfo_branding + #footer,
#footer.cathinfo_footer {
	margin: 0 !important;
	padding: 0.35rem 1rem 1rem !important;
	background: #476383 !important;
	border: 0 !important;
	border-top: 0 !important;
	color: #fff !important;
	text-align: center;
	width: 100%;
	box-sizing: border-box;
}
#footer.cathinfo_footer .inner_wrap {
	max-width: none;
	padding: 0;
}
#footer.cathinfo_footer ul,
#footer.cathinfo_footer .copyright {
	display: none !important;
}
#footer.cathinfo_footer p,
#footer.cathinfo_footer .smalltext {
	margin: 0;
	padding: 0.25rem 0 0;
	color: #e8eef4 !important;
	font-size: 0.9rem;
}
/* Bottom ad sits just above the blurb; don't add extra air */
.content-wrapper > ins.adsbygoogle,
section.content > ins.adsbygoogle {
	margin-top: 0.35rem;
	margin-bottom: 0.25rem;
}
.cathinfo_branding a {
	color: #fdffbd !important;
}
.cathinfo_branding_tagline,
.cathinfo_branding_contact {
	margin: 0 0 0.65rem;
	line-height: 1.45;
}
.cathinfo_donate {
	width: min(75%, 820px);
	margin: 1rem auto;
	border: 3px dashed #fff;
	padding: 1.05rem 1.1rem;
	text-align: center;
	color: #fff;
}
.cathinfo_donate,
.cathinfo_donate strong,
.cathinfo_donate em,
.cathinfo_donate_title,
.cathinfo_donate_body {
	color: #fff !important;
}
.cathinfo_donate_title {
	font-weight: 700;
	margin-bottom: 0.55rem;
	font-size: 1.45rem;
	line-height: 1.25;
}
.cathinfo_donate_body {
	font-size: 1.15rem;
	line-height: 1.4;
}
.cathinfo_donate_link {
	color: #fdffbd !important;
	word-break: break-all;
}
.cathinfo_about {
	background: #b0c4de;
	color: #111;
	padding: 1rem 1.15rem;
	text-align: left;
	border-radius: 8px;
	margin: 1rem 12%;
	font-size: 1.05rem;
	line-height: 1.45;
}
.cathinfo_about,
.cathinfo_about p,
.cathinfo_about span,
.cathinfo_about strong,
.cathinfo_about em {
	color: #111 !important;
}
.cathinfo_about p {
	margin: 0 0 0.85rem;
}
.cathinfo_about p:last-child {
	margin-bottom: 0;
}
.cathinfo_sspx {
	margin: 1rem auto 0.75rem;
	max-width: 900px;
	line-height: 1.4;
}
.cathinfo_disclaimer {
	margin: 0.75rem auto;
	max-width: 900px;
	font-size: 0.95rem;
	line-height: 1.4;
}
.cathinfo_privacy {
	margin: 0 0 0.75rem;
}
.cathinfo_privacy a {
	color: #fff !important;
	text-decoration: underline;
}

/* Stronger brand signal in Curve2 header */
#header .forumtitle a {
	font-weight: 700;
	letter-spacing: 0.01em;
}
#siteslogan {
	font-size: 0.95rem;
	opacity: 0.95;
}

@media (max-width: 720px) {
	.cathinfo_header_news {
		font-size: 0.98rem;
		padding: 0.65rem 0.75rem;
	}
	.cathinfo_about {
		margin: 1rem 0.5rem;
		font-size: 0.98rem;
	}
	.cathinfo_donate {
		width: auto;
		margin: 1rem 0.5rem;
	}
	.cathinfo_donate_title {
		font-size: 1.2rem;
	}
	.cathinfo_donate_body {
		font-size: 1rem;
	}
}

/* Supporter badge under the poster name (members.show_ads = 0) */
li.cathinfo_supporter {
	font-weight: bold;
	list-style: none;
}
li.cathinfo_supporter img {
	vertical-align: middle;
	margin-right: 4px;
}

/* Login/register overlays sit under the brand bar (z-index 1040) and
   AdminLTE .main-header (1030). Fields were unclickable on phones. */
body > .popup_container,
.popup_container {
	z-index: 2000 !important;
}

/* Mobile Menu: AdminLTE .main-sidebar is z-index 810, but .content-wrapper
   is 820 and the shoutbox/ads sit around 1000. The sidebar background is also
   transparent, so the page shows through. Cover the page like the login
   overlay: opaque panel + dim scrim. Stay below .main-header (1030) so the
   hamburger still closes it, and below login (2000). */
@media (max-width: 767px) {
	/* Recent Topics: 55px avatars + 200% titles crowd a phone-width column. */
	#recentforumtopics .rtbi_avatar {
		flex: 0 0 32px;
		width: 32px;
		height: 32px;
		margin: 4px 6px 4px 4px;
	}
	#recentforumtopics .rtbi_avatar.header_avatar,
	#topic_header .rtbi_avatar.header_avatar {
		flex: 0 0 32px;
		width: 32px;
		margin: 0 6px 0 4px;
	}
	#recentforumtopics .recent_title {
		font-size: 115%;
		line-height: 1.3;
	}
	#recenttopics .pagesection .pagelinks {
		font-size: 115%;
	}
	#recentforumtopics .lastpost,
	#recentforumtopics .board_stats {
		font-size: 90%;
	}

	body.skin-blue.sidebar-open::before {
		content: "";
		position: fixed;
		inset: 0;
		background: rgba(0, 0, 0, 0.8);
		z-index: 1020;
	}
	body.skin-blue.sidebar-open .main-sidebar,
	body.skin-blue.sidebar-open .left-side {
		z-index: 1025 !important;
		position: fixed;
		top: 0;
		left: 0 !important;
		bottom: 0;
		width: 100% !important;
		max-width: none !important;
		height: 100%;
		overflow-y: auto;
		background-color: #222d32 !important;
		transform: none !important;
	}
	body.skin-blue.sidebar-open .main-sidebar .sidebar {
		background-color: #222d32 !important;
	}
	body.skin-blue.sidebar-open .content-wrapper,
	body.skin-blue.sidebar-open .right-side,
	body.skin-blue.sidebar-open .main-footer {
		z-index: 800 !important;
		transform: none !important;
	}
	body.skin-blue.sidebar-open #shoutbox_widget,
	body.skin-blue.sidebar-open ins.adsbygoogle {
		z-index: 800 !important;
		visibility: hidden !important;
	}
}

@media (max-width: 720px) {
	.popup_window {
		top: 6% !important;
		width: calc(100vw - 1.25rem) !important;
		max-width: 480px;
		max-height: 88vh;
		overflow: auto;
		box-sizing: border-box;
	}
	.popup_content .login,
	form.login {
		width: 100% !important;
		max-width: 100%;
	}
	.login dt,
	.login dd {
		float: none !important;
		width: 100% !important;
		text-align: left !important;
		clear: both;
	}
	.login input[type="text"],
	.login input[type="password"],
	.login select {
		width: 100% !important;
		max-width: 100%;
		box-sizing: border-box;
	}
	.login input[type="submit"] {
		margin-left: 0;
	}
}

/* Gender symbol immediately after the username (classic Male.gif / Female.gif). */
.poster h4 .custom.cathinfo_gender {
	display: inline;
	margin: 0;
	padding: 0;
	white-space: nowrap;
}
.poster h4 .cathinfo_gender_icon {
	margin-left: 0.4em;
	vertical-align: middle;
	width: 14px;
	height: 14px;
}

/* Post body: 5 points larger than the theme's inherited size. */
.postarea .inner,
#forumposts .inner,
#pmFolder .inner {
	font-size: calc(1em + 5pt);
}

/* Quotes used a fixed 0.85rem, so they did not pick up the post-body bump. */
#forumposts blockquote,
.postarea blockquote,
#pmFolder blockquote {
	font-size: calc(0.85rem + 5pt);
}

/* BBC source mode and quick-edit (WYSIWYG iframe uses jquery.sceditor.default.css). */
.sceditor-container textarea,
.sceditor-container textarea:focus,
#quick_edit_body_container textarea {
	font-size: calc(1em + 5pt);
}