/*
 * NFHB Umsjón 1.10.0: [nfhb_hopar], student Facebook groups on the homepage ("Samfélög nemenda").
 * Same colours, borders, radii and focus treatment as the homepage's "Fyrir þig í náminu" cards
 * (navy #084b7f, border #c9c9c9, 9px radius, 3px navy focus outline). The font is inherited.
 */

/* Nothing to show: the whole section (class nfhb-hopar-hluti), heading included, leaves no gap. */
:root .nfhb-hopar-hluti:has(.nfhb-hopar-tomt[hidden]),
:root .elementor-widget-shortcode:has(.nfhb-hopar-tomt[hidden]) {
	display: none;
}

.nfhb-hopar-tomt--ritill {
	display: block;
	padding: 12px 16px;
	border: 2px dashed #b22f31;
	border-radius: 6px;
	color: #b22f31;
	font-size: 13px;
	font-weight: 700;
}

.nfhb-hopar {
	--nfhb-h-navy: #084b7f;
	--nfhb-h-fb: #1877f2;
	box-sizing: border-box;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.nfhb-hopar *,
.nfhb-hopar *::before,
.nfhb-hopar *::after {
	box-sizing: border-box;
}

.nfhb-hopar__item {
	margin: 0;
	padding: 0;
	min-width: 0;
}

.nfhb-hopar__item::before,
.nfhb-hopar__item::marker {
	content: none;
}

/* :root .nfhb-hopar … outranks the site's own link colours (e.g. ".elementor a"). */
:root .nfhb-hopar .nfhb-hopar__tengill,
:root .nfhb-hopar .nfhb-hopar__tengill:visited {
	display: flex;
	align-items: center;
	gap: 14px;
	min-height: 76px;
	height: 100%;
	padding: 16px 18px;
	border: 1px solid #c9c9c9;
	border-radius: 9px;
	background: #fff;
	color: var(--nfhb-h-navy);
	text-decoration: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

:root .nfhb-hopar .nfhb-hopar__tengill:hover,
:root .nfhb-hopar .nfhb-hopar__tengill:focus-visible {
	border-color: var(--nfhb-h-navy);
	box-shadow: 0 11px 34px rgba(5, 50, 83, 0.1);
	color: var(--nfhb-h-navy);
	text-decoration: none;
}

:root .nfhb-hopar .nfhb-hopar__tengill:focus-visible {
	outline: 3px solid var(--nfhb-h-navy);
	outline-offset: 3px;
}

.nfhb-hopar__takn {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--nfhb-h-navy);
	border-radius: 50%;
	background: #fff;
	color: var(--nfhb-h-fb);
}

.nfhb-hopar__texti {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-width: 0;
}

.nfhb-hopar__heiti {
	font-size: 17px;
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: -0.01em;
	overflow-wrap: anywhere;
}

.nfhb-hopar__skyring {
	margin-top: 2px;
	font-size: 13px;
	font-weight: 300;
	line-height: 1.4;
}

.nfhb-hopar__sr {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.nfhb-hopar__ut {
	flex: 0 0 auto;
	color: #b22f31;
	transition: transform 0.15s ease;
}

.nfhb-hopar__tengill:hover .nfhb-hopar__ut,
.nfhb-hopar__tengill:focus-visible .nfhb-hopar__ut {
	transform: translate(2px, -2px);
}

/* Tablet: two columns. */
@media (max-width: 900px) {
	.nfhb-hopar {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Phone: one column, slightly tighter. */
@media (max-width: 600px) {
	.nfhb-hopar {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
	}
	:root .nfhb-hopar .nfhb-hopar__tengill {
		min-height: 68px;
		padding: 14px 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.nfhb-hopar__tengill,
	.nfhb-hopar__ut {
		transition: none;
	}
}

@media (forced-colors: active) {
	:root .nfhb-hopar .nfhb-hopar__tengill {
		border-color: LinkText;
	}
}