/**
 * Front-end styles.
 *
 * The theme owns the page: its typeface, its colours, its width. What is set
 * here is the shape of a journal — the contents of an issue, the head of an
 * article, the blocks that fold away — and it is drawn in the theme's own
 * colour, tinted where a line or a background is needed. Nothing here names a
 * colour outright, so the plugin looks at home on a light theme and a dark one
 * alike.
 */

.nlj-issue,
.nlj-article {
	--nlj-hair: color-mix(in srgb, currentColor 14%, transparent);
	--nlj-tint: color-mix(in srgb, currentColor 4%, transparent);
	/* Приглушённое, но читаемое: имена авторов и подписи набраны им. */
	--nlj-muted: color-mix(in srgb, currentColor 80%, transparent);
	/* Единственный цвет, заданный прямо, — и тот едва заметный. Им
	   подсвечивается то, на что читатель наводит курсор. Чтобы сменить
	   оттенок на фирменный, довольно переопределить эту переменную. */
	--nlj-accent: 41, 118, 199;
}

/* The head of an issue ---------------------------------------------------- */

.nlj-issue__head {
	display: flex;
	flex-wrap: wrap;
	gap: 1.75rem;
	align-items: flex-start;
	margin-bottom: 2.5rem;
}

.nlj-issue__cover {
	flex: 0 0 220px;
	max-width: 100%;
}

/* Обложка — сама себе оформление: у неё есть поля, тень и рамка, нарисованные
   в макете. Всё, что плагин добавил бы от себя — рамка, скругление, тень, —
   легло бы поверх и читалось бы как вторая, лишняя. */
.nlj-issue__cover img {
	display: block;
	width: 100%;
	height: auto;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.nlj-issue__meta {
	flex: 1 1 320px;
	min-width: 0;
}

.nlj-issue__number {
	margin: 0 0 0.75rem;
	font-size: 1.2em;
	font-weight: 700;
	line-height: 1.3;
}

.nlj-issue__description {
	margin: 0;
	color: var(--nlj-muted);
	line-height: 1.6;
}

/* Contents ---------------------------------------------------------------- */

.nlj-toc__title {
	margin: 2.5rem 0 1.25rem;
	padding-bottom: 0.5rem;
	border-bottom: 2px solid var(--nlj-hair);
}

.nlj-toc__rubric {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	margin: 2.5rem 0 1rem;
	font-size: 1.15em;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	line-height: 1.25;
	/* Цвет журнала: скрипт берёт его с меню сайта, а без скрипта остаётся
	   приглушённый тон темы. */
	color: var(--nlj-rubric, var(--nlj-muted));
}

.nlj-toc__rubric::after {
	content: "";
	flex: 1 1 auto;
	height: 2px;
	background: currentColor;
	opacity: 0.25;
}

.nlj-toc__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.nlj-toc__item {
	padding: 1rem 0;
	border-bottom: 1px solid var(--nlj-hair);
}

.nlj-toc__item:last-child {
	border-bottom: 0;
}

.nlj-toc__link {
	display: block;
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
}

.nlj-toc__link:hover,
.nlj-toc__link:focus {
	text-decoration: underline;
}

.nlj-toc__authors,
.nlj-toc__pages {
	display: inline-block;
	margin-top: 0.35rem;
	font-size: 0.92em;
	color: var(--nlj-muted);
}

.nlj-toc__authors {
	font-style: italic;
	color: color-mix(in srgb, currentColor 88%, transparent);
}

.nlj-toc__authors + .nlj-toc__pages::before {
	content: "·";
	margin: 0 0.5rem;
	opacity: 0.5;
}

/* The formats an article is published in ---------------------------------- */

.nlj-formats {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem;
	margin-top: 0.6rem;
	font-size: 0.78em;
	letter-spacing: 0.06em;
}

.nlj-formats__link {
	padding: 0.2rem 0.55rem;
	border: 1px solid var(--nlj-hair);
	border-radius: 2px;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 600;
}

.nlj-formats__link:hover,
.nlj-formats__link:focus {
	background: rgba(var(--nlj-accent), 0.09);
	border-color: rgba(var(--nlj-accent), 0.35);
	text-decoration: none;
}

.nlj-formats__sep {
	display: none;
}

/* The head of an article -------------------------------------------------- */

.nlj-article__title {
	margin: 0 0 0.5rem;
	line-height: 1.25;
}

.nlj-article__byline {
	margin: 0 0 1.25rem;
	font-size: 1.05em;
	font-style: italic;
	font-weight: 500;
}

.nlj-article__dates {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.35rem 1rem;
	margin: 1.5rem 0;
	padding: 1rem 1.25rem;
	background: var(--nlj-tint);
	border-radius: 3px;
	font-size: 0.92em;
}

.nlj-article__dates dt {
	color: var(--nlj-muted);
}

.nlj-article__dates dd {
	margin: 0;
	font-weight: 600;
}

.nlj-article__footer {
	margin-top: 2rem;
	padding-top: 1rem;
	border-top: 1px solid var(--nlj-hair);
	font-size: 0.9em;
	color: var(--nlj-muted);
}

/* Blocks that fold away ---------------------------------------------------- */

.nlj-details {
	margin: 1rem 0;
	border: 1px solid var(--nlj-hair);
	border-radius: 3px;
}

.nlj-details > summary {
	padding: 0.75rem 1.25rem;
	font-weight: 600;
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: center;
	gap: 0.6rem;
}

.nlj-details > summary::-webkit-details-marker {
	display: none;
}

.nlj-details > summary::before {
	content: "";
	flex: 0 0 auto;
	width: 0.42em;
	height: 0.42em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(-45deg);
	transition: transform 0.15s ease;
	opacity: 0.6;
}

.nlj-details[open] > summary::before {
	transform: rotate(45deg);
}

.nlj-details > summary:hover,
.nlj-details > summary:focus-visible {
	background: rgba(var(--nlj-accent), 0.07);
}

.nlj-details[open] > summary {
	border-bottom: 1px solid var(--nlj-hair);
}

.nlj-details__body {
	padding: 0.25rem 1.25rem 1.25rem;
	line-height: 1.65;
}

.nlj-details__body > p:first-child {
	margin-top: 0;
}

/* The English half -------------------------------------------------------- */

.nlj-details--en {
	border-left: 3px solid var(--nlj-hair);
}

.nlj-details--en .nlj-article__title-en {
	margin: 0.5rem 0 0.75rem;
	font-size: 1.15em;
	line-height: 1.3;
}

/* People ------------------------------------------------------------------ */

.nlj-people {
	margin: 0;
	padding: 0;
	list-style: none;
}

.nlj-people__item {
	padding: 0.6rem 0;
	border-bottom: 1px solid var(--nlj-hair);
}

.nlj-people__item:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

.nlj-people__name {
	display: block;
	font-weight: 600;
}

.nlj-people__info {
	display: block;
	margin-top: 0.15rem;
	font-size: 0.94em;
	color: var(--nlj-muted);
}

.nlj-people__email {
	display: inline-block;
	margin-top: 0.15rem;
	font-size: 0.92em;
}

/* Key words and sources --------------------------------------------------- */

.nlj-keywords {
	margin-top: 1rem;
	padding-top: 0.75rem;
	border-top: 1px solid var(--nlj-hair);
	font-size: 0.94em;
}

.nlj-references__title {
	margin: 1.75rem 0 0.75rem;
	font-size: 1em;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--nlj-muted);
}

.nlj-references {
	padding-left: 1.5rem;
	font-size: 0.92em;
	line-height: 1.55;
}

.nlj-references li {
	margin-bottom: 0.5rem;
}

/* A list that came already numbered — «[1] Манапова А.Ф. …» — is printed as it
   is, without a second set of numbers beside the first. */
.nlj-references--own {
	list-style: none;
	padding-left: 0;
}

.nlj-references--own li {
	padding-left: 2.2rem;
	text-indent: -2.2rem;
}

/* Buttons ----------------------------------------------------------------- */

.nlj-button {
	display: inline-block;
	padding: 0.6rem 1.4rem;
	border: 1px solid currentColor;
	border-radius: 3px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
}

.nlj-button:hover,
.nlj-button:focus {
	background: rgba(var(--nlj-accent), 0.09);
	text-decoration: none;
}

.nlj-button--small {
	padding: 0.35rem 0.9rem;
	font-size: 0.9em;
}

.nlj-article__download {
	margin: 1.25rem 0;
}

.nlj-article__download--small {
	margin: 1.5rem 0 0;
}

/* Narrow screens ---------------------------------------------------------- */

@media (max-width: 600px) {
	.nlj-issue__head {
		gap: 1rem;
	}

	.nlj-issue__cover {
		flex-basis: 140px;
	}

	.nlj-article__dates {
		grid-template-columns: 1fr;
		gap: 0.15rem;
	}

	.nlj-article__dates dd {
		margin-bottom: 0.5rem;
	}
}

/* On paper everything is open and nothing is a link -------------------------- */

@media print {
	.nlj-details__body {
		display: block !important;
	}

	.nlj-formats,
	.nlj-article__download {
		display: none;
	}
}

.nlj-abstract__label {
	margin-right: 0.15em;
}

/* The text of an article, set the way the journal sets it: paragraphs marked
   by an indent rather than by a gap, and justified with hyphenation. */
.nlj-body p {
	margin: 0;
	text-indent: 1.6em;
	text-align: justify;
	hyphens: auto;
}


/* Аннотация и источники — тем же строем, что и текст статьи. */
.nlj-abstract p,
.nlj-keywords,
.nlj-references li {
	text-align: justify;
	hyphens: auto;
}

/* The licence of the journal, under the last line of an article. */
.nlj-licence {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.5rem;
	margin-top: 1.25rem;
	font-size: 0.88em;
	color: var(--nlj-muted);
}

.nlj-licence__banner {
	display: block;
	height: auto;
	max-height: 31px;
	width: auto;
}

.nlj-licence__text {
	max-width: 100%;
}
