@import 'mediawiki.skin.variables.less';
@import 'mediawiki.mixins.less';

.mw-cite-backlink,
.cite-accessibility-label {
	.user-select( none );
}

.mw-references-columns {
	.column-width( 30em );
	margin-top: 0.3em;

	// T160497, T349793: Minerva is limited to 993.3px (approx. 62em), which makes 30em a fragile
	// breakpoint. Give more wiggle room to make sure we usually get two columns.
	// T334941: Vector 2022 at standard width caps at 59.25rem.
	// stylelint-disable-next-line selector-class-pattern
	.vector-feature-limited-width-clientpref-1 &,
	.skin-minerva & {
		.column-width( 27em );
	}

	/* Lines first column up nicely. */
	.mw-parser-output & .references {
		margin-top: 0;
	}

	/* Avoid elements from breaking between columns */
	li {
		.column-break-inside-avoid();
	}
}

ol.references {
	/**
	 * Resetting *any* counter on an <ol> element messes up the built-in numbering in Firefox.
	 * Explicitly resetting the built-in "list-item" counter fixes this.
	 *
	 * We have 2 counters for Parsoid HTML for different functionality.
	 * Make sure both are reset!
	 */
	counter-reset: mw-ref-details-parent mw-references list-item;

	> li {
		/**
		 * We have 2 counters for Parsoid HTML for different functionality.
		 * Make sure both are incremented!
		 */
		counter-increment: mw-ref-details-parent mw-references;
		counter-reset: mw-ref-details-child;
	}

	.mw-subreference-list {
		margin-top: 0;

		> li {
			counter-increment: mw-ref-details-child;

			&::marker {
				content: counter( mw-ref-details-parent, decimal ) '.' counter( mw-ref-details-child, decimal ) '. ';
			}
		}
	}
}

// T411472: Temporary workaround for Safari because of https://caniuse.com/css-marker-pseudo
// stylelint-disable-next-line selector-type-no-unknown
_::-webkit-full-page-media,
ol.references .mw-subreference-list > li::before {
	content: counter( mw-ref-details-parent, decimal ) '.' counter( mw-ref-details-child, decimal ) '.\00a0';
	display: inline-block;
	margin-left: -3.2em;
	min-width: 3.2em;
	text-align: right;
}

// stylelint-disable-next-line selector-type-no-unknown
_::-webkit-full-page-media,
ol.references .mw-subreference-list > li::marker {
	// Just in case some later Safari version suddenly renders both
	content: none;
}

// stylelint-disable-next-line selector-type-no-unknown
_::-webkit-full-page-media,
ol.references .mw-subreference-list {
	list-style-type: none;
}

sup.reference {
	/* Isolation to fix references in case of RTL words at the end of a reference */
	unicode-bidi: -moz-isolate;
	unicode-bidi: -webkit-isolate;
	unicode-bidi: isolate;

	/* Don't allow a reference that includes a group name
	to break in the end of the line */
	white-space: nowrap;

	/* Do not inherit bold or italic */
	font-weight: @font-weight-normal;
	font-style: normal;
}

/* Highlight clicked reference in blue to help navigation */
ol.references li:target,
sup.reference:target {
	background-color: @background-color-progressive-subtle;
}

/* Make cite errors "strong" */
.mw-ext-cite-error {
	font-weight: @font-weight-bold;
	/* For the case that the error is embedded in an element with a different direction */
	unicode-bidi: embed;

	code {
		/* As code is inheriting `#f8f9fa` as background color from `code`,
		   we need to increase contrast, by setting it to `transparent`. See T247903. */
		background-color: @background-color-transparent;
		color: inherit;
		/* Reduce inherited `padding` to make code fit in better in Resources list. */
		padding: 1px 2px;
	}
}

/* @noflip */
.mw-cite-dir-ltr .reference-text {
	direction: ltr;
	unicode-bidi: embed;
}

/* @noflip */
.mw-cite-dir-rtl .reference-text {
	direction: rtl;
	unicode-bidi: embed;
}