/* ==========================================================================
   Widget — News Strip
   Figma node 179:526 (Latest News). The layout and the card are the shared
   .o-strip in assets/css/strip.css; this file adds only what news has and
   events do not. Same treatments as the News & Articles list, so a story
   looks the same in both places.
   ========================================================================== */

/* The image helper draws a <div> wrapper; lay it out like the events' <span>. */
.o-strip--news .o-strip__media {
	display: flex;
	align-items: center;
	justify-content: center;
}

/*
 * Screenshots the press CMS marks "not cover", and outlet logos standing in
 * for a missing screenshot, are shown whole rather than cropped. Logos sit on
 * white because they are drawn for white.
 */
.o-strip__media--contain {
	background-color: var(--o-ice);
}

.o-strip__media--contain .o-strip__img,
.o-strip__media--logo .o-strip__img {
	width: 70%;
	height: 70%;
	object-fit: contain;
}

.o-strip__media--logo {
	border-bottom: 1.5px solid var(--o-rule-cool);
	background-color: var(--o-white);
}

.o-strip__link:hover .o-strip__media--contain .o-strip__img,
.o-strip__link:hover .o-strip__media--logo .o-strip__img,
.o-strip__link:focus-visible .o-strip__media--contain .o-strip__img,
.o-strip__link:focus-visible .o-strip__media--logo .o-strip__img {
	transform: none;
}

/* No image at all: the Ovation mark on navy, so the row stays even. */
.o-strip__media--placeholder {
	background-color: var(--o-navy);
	color: var(--o-white);
}

.o-strip__media-logo {
	width: 50%;
	height: auto;
}

/* Coverage on another site: a small arrow, pointing up and out. */
.o-strip__external {
	display: inline-block;
	width: 0.7em;
	height: 0.7em;
	margin-inline-start: 0.4em;
	vertical-align: 0.05em;
	color: var(--o-orange);
	transform: rotate(-45deg);
}