/**
 * DBIM v3 layer for the SLIET network (parent theme "sliet", inherited by "department").
 *
 * Loaded after the legacy stylesheets. Holds:
 *  1. Fonts (Noto Sans, self hosted)        - DBIM 4.1
 *  2. Colour tokens (Blue colour group)      - DBIM 2.1 / 2.2
 *  3. Base typography and type scale         - DBIM 4.3
 *  4. Accessibility: focus, skip link, text size, high contrast - DBIM 4.5, 7.5
 *  5. Header 3, global navigation, footer    - DBIM 5.4.3, 5.6
 *  6. Responsive layout for the legacy fixed-width templates
 */

/* 1. Fonts ------------------------------------------------------------------ */
@font-face { font-family: "Noto Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url(../assets/fonts/noto-sans-latin-400.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Noto Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url(../assets/fonts/noto-sans-latin-500.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Noto Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url(../assets/fonts/noto-sans-latin-600.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Noto Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url(../assets/fonts/noto-sans-latin-700.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Noto Sans Devanagari"; font-style: normal; font-weight: 400; font-display: swap; src: url(../assets/fonts/noto-sans-devanagari-400.woff2) format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Noto Sans Devanagari"; font-style: normal; font-weight: 500; font-display: swap; src: url(../assets/fonts/noto-sans-devanagari-500.woff2) format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Noto Sans Devanagari"; font-style: normal; font-weight: 600; font-display: swap; src: url(../assets/fonts/noto-sans-devanagari-600.woff2) format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Noto Sans Devanagari"; font-style: normal; font-weight: 700; font-display: swap; src: url(../assets/fonts/noto-sans-devanagari-700.woff2) format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }

/* 2. Tokens ----------------------------------------------------------------- */
:root {
	/* Primary palette: "Blue" colour group (DBIM Figure 1), closest to the existing SLIET navy. */
	--dbim-key-dark: #162F6A;   /* darkest shade: footer, navigation bar */
	--dbim-key: #214AAB;        /* key colour: links, buttons, headings accents */
	--dbim-key-mid: #5279D7;
	--dbim-key-light: #A3BBF3;
	--dbim-key-tint: #D2DFFF;

	/* Functional palette (DBIM Table 1). */
	--dbim-white: #FFFFFF;
	--dbim-text: #150202;       /* Deep Earthy Brown: body text on light backgrounds */
	--dbim-linen: #EBEAEA;      /* highlight / quote / outline background */
	--dbim-link: var(--dbim-key);
	--dbim-success: #198754;
	--dbim-warning: #FFC107;
	--dbim-error: #DC3545;
	--dbim-grey-1: #C6C6C6;
	--dbim-grey-2: #8E8E8E;
	--dbim-grey-3: #606060;     /* lightest grey with 4.5:1 on white: use for secondary text */

	--dbim-focus: var(--dbim-key-dark);
	--dbim-focus-on-dark: var(--dbim-warning);
	--dbim-font: "Noto Sans", "Noto Sans Devanagari", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
	--dbim-radius: 4px;
	--dbim-gutter: 16px;
}

/* 3. Base typography -------------------------------------------------------- */
html {
	font-size: 100%;
}

html.dbim-fs-sm {
	font-size: 87.5%;
}

html.dbim-fs-lg {
	font-size: 112.5%;
}

body {
	min-width: 0;
	background: var(--dbim-white);
	color: var(--dbim-text);
	font-family: var(--dbim-font);
	font-size: 1rem; /* 16px desktop */
	line-height: 1.5;
}

input,
button,
select,
textarea {
	font-family: inherit;
	font-size: inherit;
}

a {
	color: var(--dbim-link);
}

a:hover {
	text-decoration: underline;
}

/* Links inside running text must not rely on colour alone (WCAG 1.4.1). */
#main-content p a,
#main-content .entry li a,
.ptfpl-post-content a,
.sliet-sitemap a {
	text-decoration: underline;
}

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

/* Type scale inside the content area. */
#main-content h1,
#main-content .page-header h1,
#main-content h1.title {
	font-size: 2.25rem;  /* 36px */
	font-weight: 600;
	line-height: 1.25;
	color: var(--dbim-text);
	margin: 0 0 .5em;
}

#main-content h2,
#main-content .post-content .posttitle,
#main-content .post-content .posttitle a {
	font-size: 1.5rem;   /* 24px */
	font-weight: 600;
	line-height: 1.3;
}

#main-content h3,
#main-content .post-content .entry h3 {
	font-size: 1.25rem;  /* 20px */
	font-weight: 600;
	line-height: 1.4;
}

#main-content h4 {
	font-size: 1rem;
	font-weight: 600;
}

#main-content .post-content .posttitle a {
	color: var(--dbim-key-dark);
}

#main-content .post-content .entry,
#main-content .post-content .entry p,
.posts-excerpt p {
	font-family: var(--dbim-font);
	font-size: 1rem;
	line-height: 1.5;
	color: var(--dbim-text);
	text-align: left;
}

#main-content small,
.post-date,
.date-box,
#nav-single span,
#nav-single span a,
.nav-single span,
.nav-single span a {
	font-size: .875rem; /* 14px */
	color: var(--dbim-grey-3);
}

.page-header h1 span {
	color: var(--dbim-key);
}

blockquote {
	background: var(--dbim-linen);
	border-left: 4px solid var(--dbim-key);
	padding: .75em 1em;
	margin: 1em 0;
}

/* Tables: text left, column headers centred, numbers right (DBIM 4.3). */
#main-content table {
	border-collapse: collapse;
	max-width: 100%;
}

#main-content th {
	text-align: center;
	font-weight: 600;
}

#main-content td {
	text-align: left;
	vertical-align: top;
}

#main-content td.num,
#main-content th.num {
	text-align: right;
}

/* Status colours. */
.dbim-success { color: var(--dbim-success); }
.dbim-error { color: var(--dbim-error); }

/* Static "New" badge, replaces the animated new.gif (DBIM 3.7). */
.badge-new {
	display: inline-block;
	margin-left: .4em;
	padding: 0 .4em;
	border-radius: var(--dbim-radius);
	background: var(--dbim-key);
	color: var(--dbim-white);
	font-size: .75rem;
	font-weight: 600;
	line-height: 1.5;
	vertical-align: middle;
	text-decoration: none;
}

a .badge-new {
	text-decoration: none;
}

/* 4. Accessibility ---------------------------------------------------------- */
.screen-reader-text {
	display: block;
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.skip-link {
	position: absolute;
	top: -100px;
	left: var(--dbim-gutter);
	z-index: 100000;
	padding: .75em 1em;
	background: var(--dbim-key-dark);
	color: var(--dbim-white);
	font-weight: 600;
	border-radius: 0 0 var(--dbim-radius) var(--dbim-radius);
}

.skip-link:focus {
	top: 0;
	color: var(--dbim-white);
}

#main-content:focus {
	outline: none;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible {
	outline: 3px solid var(--dbim-focus);
	outline-offset: 2px;
}

.site-topbar :focus-visible,
#top-main-nav :focus-visible,
.site-footer :focus-visible,
.skip-link:focus-visible {
	outline-color: var(--dbim-focus-on-dark);
}

abbr[title] {
	border-bottom: 0;
	text-decoration: underline dotted;
	cursor: help;
}

#top-main-nav abbr[title],
.site-topbar abbr[title],
.site-footer abbr[title] {
	text-decoration: none;
	border-bottom: 0;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}

/* High contrast mode (header toggle). */
html.dbim-contrast body,
html.dbim-contrast #page,
html.dbim-contrast #page *:not(img):not(svg):not(svg *):not(#slideshow *),
html.dbim-contrast .sliet-consent,
html.dbim-contrast .sliet-consent *:not(svg):not(svg *) {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	border-color: #fff !important;
	text-shadow: none !important;
	box-shadow: none !important;
}

html.dbim-contrast #page a,
html.dbim-contrast #page a *,
html.dbim-contrast .sliet-consent a {
	color: #ff0 !important;
	text-decoration: underline;
}

html.dbim-contrast .footer-logo img {
	filter: none;
}

html.dbim-contrast :focus-visible {
	outline-color: #ff0 !important;
}

/* 5a. Top bar --------------------------------------------------------------- */
.site-topbar {
	background: var(--dbim-key-dark);
	color: var(--dbim-white);
}

.topbar-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 4px 16px;
}

.quicklinks-top ul {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
}

.quicklinks-top li {
	list-style: none;
}

.quicklinks-top a,
.quicklinks-top li:first-child a {
	display: inline-block;
	padding: 6px 10px;
	border: 0;
	color: var(--dbim-white);
	font-size: .8125rem;
}

.quicklinks-top a:hover {
	background: var(--dbim-key);
	text-decoration: underline;
}

.user-controls {
	display: flex;
	align-items: center;
	gap: 12px;
}

.lang-switch {
	display: flex;
	align-items: center;
	margin: 0;
	padding: 0;
}

.lang-switch li {
	list-style: none;
	display: flex;
	align-items: center;
}

.lang-switch a {
	display: inline-block;
	min-width: 28px;
	padding: 4px 6px;
	color: var(--dbim-white);
	font-weight: 600;
	text-align: center;
}

.lang-switch a[aria-current="true"] {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.lang-sep {
	color: var(--dbim-key-light);
}

.a11y-controls {
	display: flex;
	gap: 4px;
}

.a11y-btn {
	min-width: 32px;
	min-height: 28px;
	padding: 2px 6px;
	border: 1px solid var(--dbim-key-light);
	border-radius: var(--dbim-radius);
	background: transparent;
	color: var(--dbim-white);
	font-size: .8125rem;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.a11y-btn:hover,
.a11y-btn[aria-pressed="true"] {
	background: var(--dbim-white);
	color: var(--dbim-key-dark);
}

/* 5b. Header (DBIM Header 3) ------------------------------------------------ */
header#top-header {
	height: auto;
	padding: 12px 0;
	background: var(--dbim-white);
	border-bottom: 1px solid var(--dbim-linen);
}

.header-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 24px;
}

.lockup {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.lockup-link {
	display: flex;
	align-items: center;
	gap: 14px;
	color: var(--dbim-text);
	text-decoration: none;
}

.lockup-link:hover {
	text-decoration: none;
}

.lockup-link:hover .lockup-name {
	text-decoration: underline;
}

.lockup-logo {
	flex: 0 0 auto;
	width: 80px;
	height: 80px;
}

.lockup-text {
	display: flex;
	flex-direction: column;
}

.lockup-name {
	color: var(--dbim-key-dark);
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 1.25;
}

.lockup-tagline {
	color: var(--dbim-grey-3);
	font-size: .875rem;
	line-height: 1.4;
}

.lockup-dept {
	margin: 6px 0 0 94px;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.3;
}

.lockup-dept a {
	color: var(--dbim-key);
}

.header-tools {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 10px 16px;
}

.header-links {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 16px;
	margin: 0;
	padding: 0;
	font-size: .875rem;
	font-weight: 600;
}

.header-links li {
	list-style: none;
}

.header-links a {
	color: var(--dbim-key-dark);
}

/* Highlighted search bar. */
#search-form.search-form {
	display: flex;
	float: none;
	width: 280px;
	max-width: 100%;
	margin: 0;
	background: var(--dbim-white);
	border: 2px solid var(--dbim-key);
	border-radius: var(--dbim-radius);
	overflow: hidden;
}

#search-form input.search-field {
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	padding: 8px 10px;
	border: 0;
	color: var(--dbim-text);
	font-size: .9375rem;
	font-family: var(--dbim-font);
	background: transparent;
}

#search-form input.search-field::placeholder {
	color: var(--dbim-grey-3);
}

#search-form input.search-field:focus-visible {
	outline: none;
}

#search-form:focus-within {
	outline: 3px solid var(--dbim-focus);
	outline-offset: 2px;
}

#search-form .search-submit {
	flex: 0 0 auto;
	width: 44px;
	border: 0;
	background: var(--dbim-key);
	color: var(--dbim-white);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

#search-form .search-submit:hover {
	background: var(--dbim-key-dark);
}

.profile-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 2px solid var(--dbim-key);
	border-radius: 50%;
	color: var(--dbim-key);
}

.profile-link:hover {
	background: var(--dbim-key);
	color: var(--dbim-white);
}

.header-cobrand img {
	max-height: 56px;
	width: auto;
}

/* 5c. Global navigation (hardcoded megamenu in menu.php) -------------------- */
div#top-main-nav {
	position: sticky;
	top: 0;
	z-index: 1000;
	background: var(--dbim-key-dark);
	border-bottom: 4px solid var(--dbim-key);
}

.wrapper_menu {
	width: auto;
	max-width: 1170px;
}

/* Contain the floated items so a wrapped menu (larger text) grows instead of overlapping content. */
.wrapper_menu .menu {
	display: flow-root;
	height: auto;
	min-height: 35px;
}

.menu-toggle,
.submenu-toggle {
	display: none;
}

.menu li a {
	text-shadow: none;
	font-size: .9375rem;
}

#top-main-nav .menu li > a:hover,
#top-main-nav .menu li > [role="button"]:hover {
	text-decoration: underline;
}

/* Dropdowns use the colour group instead of the legacy black theme. */
.menu_dark_theme ul li:hover,
.menu_dark_theme ul li.nodrop:hover,
.menu_dark_theme ul li.is-open {
	background: var(--dbim-key);
	border-color: var(--dbim-key);
}

.menu_dark_theme ul li:hover a,
.menu_dark_theme ul li.is-open a {
	border-bottom-color: var(--dbim-key);
}

.menu_dark_theme ul .dropdown_1column,
.menu_dark_theme ul .dropdown_2columns,
.menu_dark_theme ul .dropdown_3columns,
.menu_dark_theme ul .dropdown_4columns,
.menu_dark_theme ul .dropdown_5columns,
.menu_dark_theme ul .dropdown_fullwidth,
.menu_dark_theme ul .levels li ul {
	background: var(--dbim-key-dark);
	border-color: var(--dbim-key);
}

.menu_dark_theme .menu_blue li:hover div a,
.menu_dark_theme .menu_blue li.is-open div a {
	color: var(--dbim-white);
}

.menu_dark_theme .menu_blue li:hover div a:hover,
.menu_dark_theme .menu_blue li.is-open div a:hover,
.menu_dark_theme .menu_blue li ul li a:hover {
	color: var(--dbim-white);
	text-decoration: underline;
}

.menu_dark_theme ul li .greybox li:hover {
	background: var(--dbim-key);
}

.menu_dark_theme ul h2,
.menu_dark_theme ul h3 {
	color: var(--dbim-key-tint);
	border-bottom-color: var(--dbim-key);
}

/* Closed dropdowns must not be reachable with Tab. */
.menu li > div[class*="dropdown_"] {
	visibility: hidden;
}

.menu li:hover > div[class*="dropdown_"],
.menu li.is-open > div[class*="dropdown_"] {
	visibility: visible;
}

/* Open by keyboard / click: same position as on hover. */
.menu li.is-open .dropdown_1column,
.menu li.is-open .dropdown_2columns,
.menu li.is-open .dropdown_3columns,
.menu li.is-open .dropdown_4columns,
.menu li.is-open .dropdown_5columns {
	left: -1px;
	top: 25px;
}

.menu li.is-open .dropdown_fullwidth {
	left: 21px;
	top: 28px;
	display: block;
}

.menu li [role="button"] {
	cursor: pointer;
}

/* Desktop: the extra submenu toggle is only shown when focused (keyboard users). */
@media screen and (min-width: 961px) {
	.submenu-toggle {
		display: inline-block;
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		border: 0;
		padding: 0;
	}

	.submenu-toggle:focus {
		position: relative;
		width: 24px;
		height: 24px;
		clip: auto;
		margin-top: 4px;
		background: var(--dbim-white);
		color: var(--dbim-key-dark);
		border-radius: var(--dbim-radius);
	}

	.submenu-toggle:focus::after {
		content: "";
		display: block;
		width: 8px;
		height: 8px;
		margin: 4px auto 0;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: rotate(45deg);
	}

	.menu li > a.drop + .submenu-toggle {
		float: left;
	}
}

/* 5d. Footer (DBIM 5.6) ----------------------------------------------------- */
.featured_head_bar {
	display: none;
}

footer#featured.site-footer {
	padding: 32px 0 16px;
	background: var(--dbim-key-dark);
	color: var(--dbim-white);
}

.footer-columns {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 24px;
}

.site-footer .column,
.site-footer .column-first {
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
}

.site-footer .footer-logo {
	display: inline-block;
	margin-bottom: 12px;
}

.site-name-footer {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-style: normal;
	font-size: .875rem;
	line-height: 1.5;
}

.site-name-footer strong {
	font-size: 1rem;
	font-weight: 600;
}

.site-footer .footer-heading {
	margin: 0 0 8px;
	padding: 0 0 6px;
	border-bottom: 1px solid var(--dbim-key-mid);
	color: var(--dbim-white);
	font-size: .875rem;
	font-weight: 600;
	letter-spacing: .02em;
	text-transform: uppercase;
}

.site-footer ul {
	margin: 0;
	padding: 0;
}

footer#featured.site-footer ul li {
	margin: 0;
	padding: 3px 0;
	background: none;
	list-style: none;
	font-size: .875rem;
	line-height: 1.5;
}

footer#featured.site-footer a,
footer#featured.site-footer ul li a {
	color: var(--dbim-white);
	font-size: .875rem;
}

footer#featured.site-footer a:hover {
	text-decoration: underline;
}

.site-footer .social-links {
	display: flex;
	gap: 10px;
	margin: 12px 0 0;
}

.site-footer .social-links a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	margin: 0;
	border: 1px solid var(--dbim-key-light);
	border-radius: 50%;
}

.site-footer .social-links a:hover {
	background: var(--dbim-white);
	color: var(--dbim-key-dark) !important;
}

.site-footer .social-links svg {
	width: 18px;
	height: 18px;
}

.footer-bottom {
	margin-top: 24px;
	padding-top: 16px;
	border-top: 1px solid var(--dbim-key);
	font-size: .875rem;
}

.footer-policies ul {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 20px;
}

.footer-policies a {
	font-weight: 600;
}

.site-footer .last-updated,
.site-footer .lineage {
	margin: 12px 0 0;
}

.site-footer p.copyrt {
	width: auto;
	margin: 12px 0 0;
	color: var(--dbim-key-tint);
	font-size: .8125rem;
}

.site-footer p.copyrt span {
	float: none;
	display: block;
}

/* 5e. Home page widgets: colour group instead of legacy reds/blues ---------- */
.home-sidebar .widgettitle,
.home-top-row .pt-flexible-posts-list .widgettitle {
	background: var(--dbim-key-dark);
	border-bottom: 0;
	color: var(--dbim-white);
	font-size: 1.125rem;
	font-weight: 600;
}

.home-sidebar .widget-content a,
.home-top-row .pt-flexible-posts-list a,
body .pt-flexible-posts-list .pt-flexible-posts-read-more a,
.more-news-links ul li a {
	color: var(--dbim-key);
	font-size: .875rem;
}

.home-top-row .pt-flexible-posts-list a {
	color: var(--dbim-text);
}

.home-top-row .pt-flexible-posts-list a:hover {
	color: var(--dbim-key);
}

.ptfpl-items-text-only .ptfpl-list-item {
	font-size: .875rem;
}

.home-col .ptfpl-post-content {
	color: var(--dbim-grey-3);
	font-size: .875rem;
}

h3.cat-title,
.home-col h3.widgettitle {
	color: var(--dbim-key);
}

/* Latest News: static list (the scrolling ticker was not pausable). */
#latest-updates .latest-updates-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 12px;
	padding: 8px 12px;
	background: var(--dbim-linen);
	border-left: 4px solid var(--dbim-key);
}

#main-content .latest-updates-title {
	margin: 0;
	font-size: .875rem;
	font-weight: 700;
	color: var(--dbim-key-dark);
	text-transform: uppercase;
}

.latest-updates-list {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 20px;
	margin: 0;
	padding: 0;
}

.latest-updates-list li {
	list-style: none;
	font-size: .875rem;
}

/* Slider controls are keyboard operable via js/dbim.js. */
.unoslider_navigation[role="button"],
.unoslider_indicator a[role="button"] {
	cursor: pointer;
}

/* Tables used in content. */
.sl-coloured-table thead tr,
.sl-coloured-table thead {
	background-color: var(--dbim-key-dark);
	color: var(--dbim-white);
}

.notice-menu {
	border-top-color: var(--dbim-key-dark);
}

#top-main-nav .current-menu-item a {
	background: var(--dbim-key);
}

/* 6. Responsive layout ------------------------------------------------------ */
div.inner {
	box-sizing: border-box;
	width: auto;
	max-width: 1170px;
	padding-left: var(--dbim-gutter);
	padding-right: var(--dbim-gutter);
}

/* Legacy media queries fixed widths at 980px / 1170px. */
@media screen and (max-width: 1199.98px), screen and (min-width: 1200px) {
	div.inner {
		width: auto;
	}

	p.copyrt {
		width: auto;
	}

	#container #contents,
	#container .home-page-contents,
	#latest-updates {
		width: auto;
	}

	.latest-updates-inner {
		max-width: none;
	}

	#container .home-sidebar {
		width: auto;
	}
}

#container {
	display: flex;
	gap: 20px;
	align-items: flex-start;
}

#container .home-page-contents {
	flex: 1 1 auto;
	min-width: 0;
	float: none;
}

#container .home-sidebar {
	flex: 0 0 300px;
	float: none;
	padding: 0;
}

#container #contents {
	float: none;
}

#slideshow {
	padding: 10px 0;
}

@media screen and (max-width: 960px) {
	/* Header */
	.header-inner {
		flex-direction: column;
		align-items: flex-start;
	}

	.header-tools {
		justify-content: flex-start;
		width: 100%;
	}

	#search-form.search-form {
		flex: 1 1 220px;
	}

	.lockup-dept {
		margin-left: 0;
	}

	/* Navigation becomes a toggled accordion */
	div#top-main-nav {
		position: static;
	}

	.wrapper_menu {
		padding: 0 var(--dbim-gutter);
	}

	.menu-toggle {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		margin: 6px 0;
		padding: 8px 12px;
		border: 1px solid var(--dbim-key-light);
		border-radius: var(--dbim-radius);
		background: transparent;
		color: var(--dbim-white);
		font-weight: 600;
		cursor: pointer;
	}

	.menu-toggle-icon,
	.menu-toggle-icon::before,
	.menu-toggle-icon::after {
		display: block;
		width: 18px;
		height: 2px;
		background: currentColor;
		content: "";
		position: relative;
	}

	.menu-toggle-icon::before {
		position: absolute;
		top: -6px;
	}

	.menu-toggle-icon::after {
		position: absolute;
		top: 6px;
	}

	.wrapper_menu .menu {
		display: none;
		height: auto;
		padding: 0 0 8px;
		border-radius: 0;
	}

	.wrapper_menu.is-open .menu {
		display: block;
	}

	.menu li,
	.menu li:hover {
		float: none;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		margin: 0;
		text-align: left;
		position: relative;
		border: 0;
		border-bottom: 1px solid var(--dbim-key);
		border-radius: 0;
	}

	.menu > li > a,
	.menu li:hover > a {
		flex: 1 1 auto;
		padding: 10px 4px;
	}

	.menu li .drop,
	.menu li:hover .drop {
		padding-right: 4px;
		background-image: none;
	}

	.submenu-toggle,
	.menu > li > [role="button"]::after {
		display: inline-block;
	}

	.submenu-toggle {
		width: 44px;
		height: 40px;
		border: 0;
		background: transparent;
		color: var(--dbim-white);
		cursor: pointer;
	}

	.submenu-toggle::after,
	.menu > li > [role="button"]::after {
		content: "";
		display: inline-block;
		width: 8px;
		height: 8px;
		margin-left: 10px;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: rotate(45deg);
		vertical-align: 3px;
	}

	.menu li.is-open > .submenu-toggle::after,
	.menu li.is-open > [role="button"]::after {
		transform: rotate(-135deg);
		vertical-align: -1px;
	}

	/* Dropdowns flow inline and open only when toggled. */
	.menu li > div[class*="dropdown_"],
	.menu li:hover > div[class*="dropdown_"] {
		display: none;
		position: static;
		left: auto;
		top: auto;
		width: 100%;
		margin: 0 0 8px;
		padding: 8px 12px;
		box-sizing: border-box;
		visibility: visible;
		border-radius: var(--dbim-radius);
	}

	.menu li.is-open > div[class*="dropdown_"] {
		display: block;
	}

	.menu .col_1,
	.menu .col_2,
	.menu .col_3,
	.menu .col_4,
	.menu .col_5,
	.menu .col_6 {
		float: none;
		width: auto;
		margin: 0 0 8px;
	}

	#top-main-nav .menu .dropdown_main_department,
	#top-main-nav .menu .dropdown_main_department .greybox li {
		width: auto;
	}

	.menu li ul li,
	.menu li .greybox li {
		display: block;
		border: 0;
	}

	.menu li:hover div a {
		display: block;
	}

	/* Content: stack the columns */
	#container {
		flex-direction: column;
		align-items: stretch;
	}

	#container .home-page-contents {
		width: 100%;
	}

	#container .home-sidebar {
		flex: 1 1 auto;
		width: 100%;
	}

	.home-col,
	.home-col-1,
	.home-col-2,
	.home-col-3 {
		float: none;
		width: 100%;
		margin-right: 0;
	}

	.home-inner,
	.home-row {
		padding: 1px 0;
	}

	#contents div.fieldset {
		float: none;
		width: auto;
		margin: 12px 0;
	}

	.w50 {
		width: 100%;
	}

	.post-content .entry {
		padding: 0 0 20px;
	}

	#main-content table {
		display: block;
		overflow-x: auto;
	}
}

/* Mobile type scale (DBIM Table 4). */
@media screen and (max-width: 600px) {
	body {
		font-size: .875rem; /* 14px */
	}

	#main-content h1,
	#main-content .page-header h1,
	#main-content h1.title {
		font-size: 1.5rem;  /* 24px */
	}

	#main-content h2,
	#main-content .post-content .posttitle,
	#main-content .post-content .posttitle a {
		font-size: 1.25rem; /* 20px */
	}

	#main-content h3,
	#main-content .post-content .entry h3 {
		font-size: 1rem;    /* 16px */
	}

	#main-content .post-content .entry,
	#main-content .post-content .entry p,
	.posts-excerpt p {
		font-size: .875rem; /* 14px */
	}

	#main-content small,
	.post-date {
		font-size: .75rem;  /* 12px */
	}

	.lockup-logo {
		width: 56px;
		height: 56px;
	}

	.lockup-name {
		font-size: 1.0625rem;
	}

	.lockup-tagline {
		font-size: .75rem;
	}

	.quicklinks-top a {
		padding: 6px 8px;
	}
}

/* Slider play/pause: keep it in a corner instead of over the middle of the photo. */
#slideshow .unoslider_pause,
#slideshow .unoslider_play {
	top: auto;
	left: auto;
	right: 14px;
	bottom: 14px;
	margin: 0;
	background-color: rgba(22, 47, 106, .85);
	border-radius: var(--dbim-radius);
}

/* Items marked "drop" in menu.php without a dropdown should not show an arrow. */
#top-main-nav .menu > li:not(:has(> div)) > .drop,
#top-main-nav .menu > li:not(:has(> div)):hover > .drop {
	padding-right: 10px;
	background-image: none;
}

/* Legacy _inc/social.css styles every button (and button:hover) with a white gradient. */
#top-main-nav .menu-toggle,
#top-main-nav .menu-toggle:hover,
#top-main-nav .submenu-toggle,
#top-main-nav .submenu-toggle:hover {
	background: transparent;
	color: var(--dbim-white);
}

#top-main-nav .menu-toggle:hover {
	background: var(--dbim-key);
}

.site-topbar .a11y-btn {
	font-family: var(--dbim-font);
	line-height: 1;
}

/* Search block/widget buttons (department sidebars). */
.wp-block-search__button,
.widget_search input[type="submit"] {
	background: var(--dbim-key);
	border: 1px solid var(--dbim-key);
	color: var(--dbim-white);
	font: 600 .875rem/1.5 var(--dbim-font);
}

.wp-block-search__button:hover,
.widget_search input[type="submit"]:hover {
	background: var(--dbim-key-dark);
	color: var(--dbim-white);
}

/* Body text must be left aligned (DBIM 4.3); content saved with inline "justify". */
#main-content [style*="text-align: justify"],
#main-content [style*="text-align:justify"] {
	text-align: left !important;
}

@media screen and (max-width: 960px) {
	/* Legacy megamenu arrow images (higher specificity in megamenu.css). */
	#top-main-nav .menu_dark_theme ul li .drop,
	#top-main-nav .menu_dark_theme ul li:hover .drop {
		background-image: none;
		padding-right: 4px;
	}

	/* Multi-column dropdowns become a single column. */
	#top-main-nav .menu li > div[class*="dropdown_"] ul,
	#top-main-nav .menu li > div[class*="dropdown_"] li,
	#top-main-nav .menu li > div[class*="dropdown_"] div,
	#top-main-nav .menu li > div[class*="dropdown_"] h3 {
		float: none !important;
		width: auto !important;
	}

	#top-main-nav .menu li > div[class*="dropdown_"] li {
		padding: 6px 0;
	}

	#top-main-nav .menu li > div[class*="dropdown_"] h3 {
		margin: 12px 0 4px;
		text-shadow: none;
	}
}

/* Reserve the slider box before UnoSlider initialises (it sets inline sizes afterwards). Avoids layout shift. */
#unoslider {
	aspect-ratio: 778 / 360;
	overflow: hidden;
	margin: 0;
	padding: 0;
}
