/*
 * PSOGI Content blocks and event pages.
 * Values copied from the site's existing widgets so the automatic blocks look the same:
 *  - What's New bar: Home page HTML widget 67738b5 (classes renamed to psogi-*).
 *  - World News list: Home page wpr-page-list 7edadde7 (21px, weight 500,
 *    global colour c239e5d "White" #E3DCDC).
 *  - Newsletter buttons and the button colour used everywhere: Newsletter page wpr-button
 *    3ec26cbe (#FF224D, hover #E9123B, Poppins 15px/400, 14px on tablet and mobile,
 *    padding 11px 10px 12px, width 365px, margin 5px).
 * The Elementor kit's "primary" colour is Elementor's untouched default (#6EC1E4) and is not
 * part of the site's design, so buttons use the Newsletter page's red instead.
 */
:root {
	--psogi-accent: #FF224D;
	--psogi-accent-hover: #E9123B;
	--psogi-muted: var(--e-global-color-text, #7A7A7A);
}

/* What's New */
.psogi-news-bar {
	display: flex;
	align-items: center;
	overflow: hidden;
	background: #fff;
	padding: 8px 12px;
	border: 1px solid #ccc;
	border-radius: 8px;
}
.psogi-whats-new-blink {
	flex-shrink: 0;
	font-size: 20px;
	font-weight: bold;
	color: red;
	margin-right: 15px;
	animation: psogi-blink 1s infinite;
	white-space: nowrap;
}
@keyframes psogi-blink {
	0%, 100% { opacity: 1; }
	50% { opacity: 0; }
}
.psogi-marquee-wrapper {
	overflow: hidden;
	flex-grow: 1;
	position: relative;
}
.psogi-marquee {
	display: inline-block;
	white-space: nowrap;
	animation: psogi-scroll-left 15s linear infinite;
	font-size: 16px;
	color: #333;
}
.psogi-marquee a {
	text-decoration: none;
	color: #1a73e8;
	font-weight: 600;
}
.psogi-marquee-wrapper:hover .psogi-marquee {
	animation-play-state: paused;
}
@keyframes psogi-scroll-left {
	0% { transform: translateX(100%); }
	100% { transform: translateX(-100%); }
}
@media only screen and (max-width: 768px) {
	.psogi-whats-new-blink { font-size: 16px; margin-right: 10px; }
	.psogi-marquee { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
	.psogi-whats-new-blink, .psogi-marquee { animation: none; }
	.psogi-marquee { white-space: normal; }
}

/* Buttons */
.psogi-btn {
	display: inline-block;
	background: var(--psogi-accent);
	color: #fff;
	padding: 10px 18px;
	border-radius: 4px;
	text-decoration: none;
	line-height: 1.3;
	transition: background-color .2s, color .2s;
}
.psogi-btn:hover, .psogi-btn:focus {
	background: var(--psogi-accent-hover);
	color: #fff;
}
.psogi-btn--outline {
	background: transparent;
	color: var(--psogi-accent);
	border: 1px solid var(--psogi-accent);
}
.psogi-btn--outline:hover, .psogi-btn--outline:focus {
	background: var(--psogi-accent);
	color: #fff;
}

/* World News: link list (Home) */
.psogi-newsletters--list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.psogi-newsletters--list li {
	margin: 0 0 10px;
}
.psogi-newsletters--list a {
	font-size: 21px;
	font-weight: 500;
	color: var(--e-global-color-c239e5d, #E3DCDC);
	text-decoration: none;
}
.psogi-newsletters--list a:hover, .psogi-newsletters--list a:focus {
	text-decoration: underline;
}

/* World News: buttons (Newsletter page) */
.psogi-newsletters--buttons {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.psogi-newsletters--buttons .psogi-btn {
	width: 365px;
	max-width: 100%;
	margin: 5px;
	padding: 11px 10px 12px;
	border-radius: 0;
	font-family: Poppins, sans-serif;
	font-size: 15px;
	font-weight: 400;
	text-align: center;
}
@media (max-width: 1024px) {
	.psogi-newsletters--buttons .psogi-btn { font-size: 14px; }
}

/* Events */
.psogi-events {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 24px;
}
.psogi-event-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e6e6e6;
	border-radius: 12px;
	overflow: hidden;
}
.psogi-event-image {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
.psogi-event-body {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	gap: 6px;
	padding: 16px 18px 20px;
}
.psogi-event-date {
	margin: 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--psogi-accent);
	text-transform: uppercase;
	letter-spacing: .02em;
}
.psogi-event-title {
	margin: 0;
	font-size: 20px;
	line-height: 1.3;
}
.psogi-event-venue {
	margin: 0;
	color: var(--psogi-muted);
}
.psogi-event-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: auto;
	padding-top: 10px;
}

/* Research papers */
.psogi-papers {
	display: grid;
	gap: 16px;
}
.psogi-paper-card {
	display: flex;
	align-items: center;
	gap: 16px;
	background: #fff;
	border: 1px solid #e6e6e6;
	border-radius: 12px;
	padding: 14px 16px;
}
.psogi-paper-image {
	flex-shrink: 0;
	width: 72px;
	height: 96px;
	object-fit: cover;
	border-radius: 6px;
}
.psogi-paper-body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
}
.psogi-paper-title {
	margin: 0;
	font-size: 18px;
}
.psogi-paper-meta {
	margin: 0;
	font-size: 14px;
	color: var(--psogi-muted);
}

/* Videos */
.psogi-videos {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 20px;
}
.psogi-video-card {
	display: flex;
	flex-direction: column;
	gap: 8px;
	color: inherit;
	text-decoration: none;
}
.psogi-video-thumb {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border-radius: 12px;
	background: #111;
}
.psogi-video-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.psogi-video-play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 40px;
	text-shadow: 0 2px 8px rgba(0, 0, 0, .5);
}
.psogi-video-duration {
	position: absolute;
	right: 8px;
	bottom: 8px;
	padding: 2px 6px;
	border-radius: 4px;
	background: rgba(0, 0, 0, .75);
	color: #fff;
	font-size: 12px;
}
.psogi-video-title {
	font-weight: 600;
}

/* Empty lists */
.psogi-empty {
	color: var(--psogi-muted);
	font-style: italic;
}

/* Event page */
.psogi-event-page {
	max-width: 960px;
	margin: 40px auto;
	padding: 0 16px;
}
.psogi-event-header {
	margin-bottom: 24px;
}
.psogi-event-hero {
	display: block;
	width: 100%;
	max-height: 420px;
	object-fit: cover;
	border-radius: 12px;
	margin-bottom: 20px;
}
.psogi-event-heading {
	margin: 0 0 8px;
}
.psogi-event-header .psogi-event-actions {
	margin-top: 16px;
}
.psogi-event-content {
	line-height: 1.7;
}
