/* =========================================================
   INESC Awards — year-specific styling
   The section heading + list wrapper and the card layout (circular
   photo, name, role, grid, hover) live in the shared "inesc-people"
   component (assets/shared/people.css); this file only adds what is specific
   to the awards list (winner email, collapsible nominees, "Load more").
   Handle `inesc-awards` (depends on `inesc-people`); markup from
   modules/awards/frontend.php.
========================================================= */

.inesc-awards {
	/* Awards-only darker green. Not read by any rule at present (the
	   "Load more" hover uses --dark-blue). */
	--ia-green-dark: #84b62f;
	margin: 0 auto;
}

/* ----- No card hover (awards only) -----
   The shared inesc-people component zooms/lifts the card on hover; the
   awards list keeps its cards static. Scoped to .inesc-awards so the
   Team listing (same component) is unaffected. */
.inesc-awards .inesc-people__card:hover,
.inesc-awards .inesc-people__card:focus-within {
	transform: none;
}

.inesc-awards .inesc-people__card:hover .inesc-people__name,
.inesc-awards .inesc-people__card:focus-within .inesc-people__name,
.inesc-awards .inesc-people__name:hover,
.inesc-awards .inesc-people__name:focus {
	/* Same values as .inesc-person-name in the site's general CSS, so the
	   name looks the same with or without hover. */
	color: var(--blue) !important;
	font-weight: var(--semi-bold) !important;
}

/* ----- Consistent card alignment (awards only) -----
   Reserve two lines of height for the name so a long (wrapped) name does
   not push the role + nominees down out of line with the sibling cards.
   Names sit at the bottom of the reserved space so the name → award
   distance stays the same for single-line names. Line-height 1.2 in the
   shared component → 2 lines = 2.4em. The name's font, weight and color
   come from the site's general CSS (.inesc-person-name, see people.css). */
.inesc-awards .inesc-people__name {
	min-height: 2.4em;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}

/* ----- Winner email ----- */
.inesc-awards__email {
	font-size: var(--text-16);
	font-weight: var(--semi-bold);
	margin: 0.3rem 0 0;
	word-break: break-all;
}

.inesc-awards__email a {
	color: var(--ip-dark-blue);
	text-decoration: none;
}

.inesc-awards__email a:hover,
.inesc-awards__email a:focus {
	color: var(--green);
	text-decoration: underline;
}

/* ----- Collapsible nominees ----- */
.inesc-awards__nominees {
	width: 100%;
	margin-top: 0.8rem;
	border-top: 1px solid var(--green);
}

.inesc-awards__nominees-toggle {
	list-style: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	padding: 0.5rem 0;
	font-size: var(--text-16);
	font-weight: var(--bold);
	color: var(--blue);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	user-select: none;
	list-style: none; /* hide the <details> disclosure triangle in Firefox */
}

/* Hide the native disclosure triangle in WebKit/Blink; the CSS chevron
   below replaces it. */
.inesc-awards__nominees-toggle::-webkit-details-marker { display: none; }
.inesc-awards__nominees-toggle::marker { content: ''; }

/* Chevron drawn with two borders of a rotated square: points down when
   closed, up when the <details> is [open]. */
.inesc-awards__nominees-chevron {
	width: 0.55rem;
	height: 0.55rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.2s ease;
	margin-bottom: 3px;
}

.inesc-awards__nominees[open] .inesc-awards__nominees-chevron {
	transform: rotate(-135deg);
	margin-bottom: -3px;
}

/* Reduced motion: the chevron still flips, but without animating. */
@media (prefers-reduced-motion: reduce) {
	.inesc-awards__nominees-chevron {
		transition: none;
	}
}

.inesc-awards__nominees-list {
	list-style: none;
	margin: 0.2rem 0 0.6rem;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	font-size: var(--text-16);
	color: var(--blue);
}

.inesc-awards__nominees-list li {
	padding: 0;
}

/* ----- Load more ----- */
.inesc-awards__more-wrap {
	display: flex;
	justify-content: center;
	margin-top: 2.5rem;
}

.inesc-awards__more {
	background: var(--green);
	color: #fff;
	border: 0;
	padding: 0.7rem 1.8rem;
	font-size: var(--text-16);
	font-weight: var(--semi-bold);
	letter-spacing: 0.05em;
	text-transform: uppercase;
	cursor: pointer;
	line-height: 1;
	transition: background 0.15s ease;
}

.inesc-awards__more:hover:not(:disabled),
.inesc-awards__more:focus:not(:disabled) {
	background: var(--dark-blue);
}

/* frontend.js disables the button while a batch is loading. */
.inesc-awards__more:disabled {
	opacity: 0.6;
	cursor: progress;
}
