/*
 * ARN Newspaper parts: the reading time and share bar, the social counter, the
 * recent comments, and the news parts printed in the Vendix theme (breaking
 * news band, share buttons, post and list templates). Colors come from the
 * Vendix design system tokens; logical properties keep RTL working.
 */

/* Text for screen readers only ------------------------------------------------ */

.arnvx-news-share--icons .arnvx-news-share__name,
.arnvx-news-share__status,
.arnvx-news-social-look-filled .arnvx-news-social__item--counted .arnvx-news-social__name,
.arnvx-news-social-look-outline .arnvx-news-social__item--counted .arnvx-news-social__name {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	border: 0;
	white-space: nowrap;
}

/* Reading time and share bar ---------------------------------------------------- */

.arnvx-news-share {
	--arnvx-news-share-size-ui: var(--arnvx-news-share-size, 36px);
	--arnvx-news-share-gap-ui: var(--arnvx-news-share-gap, 8px);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: var(--arnvx-news-share-align, flex-start);
	gap: 10px 16px;
	color: var(--arnvx-news-share-muted, var(--vendix-color-muted, #6b7280));
	font-size: .875rem;
	line-height: 1.4;
}

.arnvx-news-share__reading {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
}

.arnvx-news-share__group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--arnvx-news-share-gap-ui);
	min-width: 0;
}

.arnvx-news-share__label {
	font-weight: 600;
}

.arnvx-news-share__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--arnvx-news-share-gap-ui);
	margin: 0;
	padding: 0;
	list-style: none;
}

.arnvx-news-share__item {
	margin: 0;
}

.arnvx-news-share__item[hidden] {
	display: none;
}

/* Two classes keep theme link and button styles off the buttons. */
.arnvx-news-share .arnvx-news-share__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-width: var(--arnvx-news-share-size-ui);
	min-height: var(--arnvx-news-share-size-ui);
	margin: 0;
	padding: 0 12px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: var(--arnvx-news-share-bg, var(--vendix-color-secondary, #111827));
	color: var(--arnvx-news-share-color, var(--vendix-color-bg-light, #f7f8fa));
	font: inherit;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.arnvx-news-share .arnvx-news-share__button:hover,
.arnvx-news-share .arnvx-news-share__button:focus-visible {
	background: var(--arnvx-news-share-hover-bg, var(--vendix-color-primary, var(--vt-accent, #d71920)));
	color: var(--arnvx-news-share-hover-color, var(--vendix-color-bg-light, #f7f8fa));
}

.arnvx-news-share .arnvx-news-share__button:focus-visible {
	outline: 2px solid var(--vendix-color-primary, var(--vt-accent, #d71920));
	outline-offset: 2px;
}

.arnvx-news-share .arnvx-news-share__button .arnvx-news-icon {
	width: 1.125em;
	height: 1.125em;
}

.arnvx-news-share--icons .arnvx-news-share__button {
	padding: 0;
}

.arnvx-news-share-shape-square .arnvx-news-share .arnvx-news-share__button {
	border-radius: 0;
}

.arnvx-news-share-shape-round .arnvx-news-share .arnvx-news-share__button {
	border-radius: 999px;
}

.arnvx-news-share-look-outline .arnvx-news-share .arnvx-news-share__button,
.arnvx-news-share--theme .arnvx-news-share__button {
	border-color: var(--arnvx-news-share-bg, var(--vendix-color-border, #d9dde5));
	background: transparent;
	color: var(--arnvx-news-share-color, var(--vendix-color-heading, #111827));
}

.arnvx-news-share-look-plain .arnvx-news-share .arnvx-news-share__button {
	background: transparent;
	color: var(--arnvx-news-share-color, var(--vendix-color-heading, #111827));
}

.arnvx-news-share-look-outline .arnvx-news-share .arnvx-news-share__button:hover,
.arnvx-news-share-look-outline .arnvx-news-share .arnvx-news-share__button:focus-visible,
.arnvx-news-share--theme .arnvx-news-share__button:hover,
.arnvx-news-share--theme .arnvx-news-share__button:focus-visible {
	border-color: var(--arnvx-news-share-hover-bg, var(--vendix-color-primary, var(--vt-accent, #d71920)));
	background: transparent;
	color: var(--arnvx-news-share-hover-color, var(--vendix-color-primary, var(--vt-accent, #d71920)));
}

.arnvx-news-share-look-plain .arnvx-news-share .arnvx-news-share__button:hover,
.arnvx-news-share-look-plain .arnvx-news-share .arnvx-news-share__button:focus-visible {
	background: transparent;
	color: var(--arnvx-news-share-hover-color, var(--vendix-color-primary, var(--vt-accent, #d71920)));
}

/* Stacked for a sidebar: one button per line with its name, the reading time above. */
.arnvx-news-share--stack {
	flex-direction: column;
	align-items: stretch;
}

.arnvx-news-share--stack:not(.arnvx-news-share--icons) .arnvx-news-share__group,
.arnvx-news-share--stack:not(.arnvx-news-share--icons) .arnvx-news-share__list {
	flex-direction: column;
	align-items: stretch;
}

.arnvx-news-share--stack:not(.arnvx-news-share--icons) .arnvx-news-share__button {
	justify-content: flex-start;
	width: 100%;
}

/* In the Vendix theme, between the post head or text and the next part. */
.arnvx-news-share--theme {
	margin-block: 1.5rem;
}

/* Social counter -------------------------------------------------------------------- */

.arnvx-news-social__list {
	display: grid;
	grid-template-columns: repeat(var(--arnvx-news-columns, 3), minmax(0, 1fr));
	gap: var(--arnvx-news-gap-ui, 10px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.arnvx-news-social__list > li {
	margin: 0;
	min-width: 0;
}

/* Two classes keep theme link styles off the tiles. */
.arnvx-news-social .arnvx-news-social__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	height: 100%;
	min-height: 88px;
	padding: 12px 8px;
	border: 1px solid transparent;
	border-radius: var(--arnvx-news-radius, 6px);
	background: var(--arnvx-news-social-bg, var(--vendix-color-secondary, #111827));
	color: var(--arnvx-news-social-color, var(--vendix-color-bg-light, #f7f8fa));
	text-align: center;
	text-decoration: none;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.arnvx-news-social a.arnvx-news-social__item:hover,
.arnvx-news-social a.arnvx-news-social__item:focus-visible {
	background: var(--arnvx-news-social-hover-bg, var(--vendix-color-primary, var(--vt-accent, #d71920)));
	color: var(--arnvx-news-social-hover-color, var(--vendix-color-bg-light, #f7f8fa));
}

.arnvx-news-social a.arnvx-news-social__item:focus-visible {
	outline: 2px solid var(--vendix-color-primary, var(--vt-accent, #d71920));
	outline-offset: 2px;
}

.arnvx-news-social .arnvx-news-social__item .arnvx-news-icon {
	width: 22px;
	height: 22px;
}

.arnvx-news-social__text {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 0;
	line-height: 1.2;
	overflow-wrap: break-word;
}

.arnvx-news-social__name {
	font-size: .8125rem;
	font-weight: 600;
}

.arnvx-news-social__count {
	font-size: 1.125rem;
	font-weight: 800;
	white-space: nowrap;
}

.arnvx-news-social__label {
	font-size: .75rem;
}

.arnvx-news-social-look-outline .arnvx-news-social .arnvx-news-social__item {
	border-color: var(--arnvx-news-social-bg, var(--vendix-color-border, #d9dde5));
	background: transparent;
	color: var(--arnvx-news-social-color, var(--vendix-color-heading, #111827));
}

.arnvx-news-social-look-outline .arnvx-news-social a.arnvx-news-social__item:hover,
.arnvx-news-social-look-outline .arnvx-news-social a.arnvx-news-social__item:focus-visible {
	border-color: var(--arnvx-news-social-hover-bg, var(--vendix-color-primary, var(--vt-accent, #d71920)));
	background: transparent;
	color: var(--arnvx-news-social-hover-color, var(--vendix-color-primary, var(--vt-accent, #d71920)));
}

/* List rows: icon and name, the number at the end of the line. */
.arnvx-news-social-look-list .arnvx-news-social__list {
	grid-template-columns: minmax(0, 1fr);
	gap: 6px;
}

.arnvx-news-social-look-list .arnvx-news-social .arnvx-news-social__item {
	flex-direction: row;
	justify-content: flex-start;
	gap: 10px;
	min-height: 44px;
	padding: 8px 12px;
	text-align: start;
}

.arnvx-news-social-look-list .arnvx-news-social__text {
	flex: 1 1 auto;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 8px;
}

.arnvx-news-social-look-list .arnvx-news-social__count {
	margin-inline-start: auto;
	font-size: 1rem;
}

/* Recent comments ------------------------------------------------------------------- */

.arnvx-news-comments__list {
	display: grid;
	gap: var(--arnvx-news-gap-ui, 16px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.arnvx-news-comment {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	padding-block-end: var(--arnvx-news-gap-ui, 16px);
	border-block-end: 1px solid var(--arnvx-news-border-ui, var(--vendix-color-border, #d9dde5));
}

.arnvx-news-comment:last-child {
	padding-block-end: 0;
	border-block-end: 0;
}

/* Two classes keep the round photo above ".elementor img" rules. */
.arnvx-news-comment__photo .avatar {
	display: block;
	max-width: none;
	border-radius: 50%;
}

.arnvx-news-comment__body {
	display: grid;
	gap: 4px;
	min-width: 0;
}

.arnvx-news-comment__head,
.arnvx-news-comment__text {
	margin: 0;
	font-size: .875rem;
	line-height: 1.45;
	overflow-wrap: anywhere;
}

.arnvx-news-comment__head {
	color: var(--arnvx-news-meta, var(--vendix-color-muted, #6b7280));
}

.arnvx-news-comment__author {
	color: var(--arnvx-news-title, var(--vendix-color-heading, #111827));
	font-weight: 700;
}

.arnvx-news-comment__post,
.arnvx-news-comment__text a {
	color: var(--arnvx-news-title, var(--vendix-color-heading, #111827));
	font-weight: 600;
	text-decoration: none;
}

.arnvx-news-comment__post:hover,
.arnvx-news-comment__text a:hover {
	color: var(--arnvx-news-title-hover, var(--vendix-color-primary, var(--vt-accent, #d71920)));
}

.arnvx-news-comment__text {
	color: var(--arnvx-news-text, var(--vendix-color-text, #374151));
}

.arnvx-news-comment__date {
	color: var(--arnvx-news-meta, var(--vendix-color-muted, #6b7280));
	font-size: .75rem;
}

/* Vendix theme: breaking news band ----------------------------------------------------- */

/* In the top bar the band sits between the date and the menu. */
.vt-news-top-bar-inner:has(> .arnvx-news-theme-band) > .vt-news-top-menu {
	order: 1;
}

.arnvx-news-ticker.arnvx-news-theme-band--top-bar {
	--arnvx-news-ticker-h: 30px;
	flex: 1 1 16rem;
	min-width: 0;
	border: 0;
	background: transparent;
}

.arnvx-news-theme-band--top-bar .arnvx-news-ticker__label {
	padding-inline: 10px;
	font-size: .6875rem;
}

.arnvx-news-theme-band--top-bar .arnvx-news-ticker__item {
	font-size: .8125rem;
	font-weight: 500;
}

.arnvx-news-theme-band--top-bar .arnvx-news-ticker__controls {
	border-inline-start: 0;
}

/* Phones: the band has a row of its own in the top bar; the pause button stays, the arrows give the headline room. */
@media (max-width: 767px) {
	.arnvx-news-ticker.arnvx-news-theme-band--top-bar {
		flex-basis: 100%;
	}

	.arnvx-news-theme-band--top-bar .arnvx-news-ticker__button[data-arnvx-news-prev],
	.arnvx-news-theme-band--top-bar .arnvx-news-ticker__button[data-arnvx-news-next] {
		display: none;
	}
}

.arnvx-news-ticker.arnvx-news-theme-band--header {
	margin-block: 12px;
}

/* Vendix theme and other themes: post and list templates ------------------------------- */

/* A list template is one full row when the post list is a grid. */
.arnvx-news-template--archive {
	grid-column: 1 / -1;
	min-width: 0;
}

@media (prefers-reduced-motion: reduce) {
	.arnvx-news-share .arnvx-news-share__button,
	.arnvx-news-social .arnvx-news-social__item {
		transition: none;
	}
}
