/*
 * Please do not add any CSS rules here that impact the positioning of the element
 *  e.g. padding, margin, position or float.
 * These instead should live in jquery.makeCollapsible.styles
*/

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

/* See also jquery.makeCollapsible.js */
.mw-collapsible-toggle {
	float: right;
	.user-select( none );
}

.mw-collapsible-toggle-default {
	// This element is now a button, but it used to be a link, so keep link styles for now
	// (until someone dares to try to change the design).
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: none;
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;

	.mw-collapsible-text {
		.cdx-mixin-link-base();

		.mw-underline-always & {
			text-decoration: underline;
		}

		.mw-underline-never & {
			text-decoration: none;
		}
	}

	&::before {
		content: '[';
	}

	&::after {
		content: ']';
	}
}

.mw-customtoggle,
.mw-collapsible-toggle {
	cursor: pointer;
}

/* Collapse links in captions should be inline */
caption .mw-collapsible-toggle,
.mw-content-ltr caption .mw-collapsible-toggle,
.mw-content-rtl caption .mw-collapsible-toggle,
.mw-content-rtl .mw-content-ltr caption .mw-collapsible-toggle,
.mw-content-ltr .mw-content-rtl caption .mw-collapsible-toggle {
	float: none;
}

// On collapsible elements with custom togglers, the element itself can be hidden (T398754)
.mw-collapsible[ hidden='until-found' ],
.mw-collapsible [ hidden='until-found' ] {
	// Ensure table structure and inline content is hidden. content-visibility:hidden doesn't
	// work with display:table-* or display:inline.
	display: block;
	position: absolute;

	// Make hidden attribute behave more like display:none
	// Use !important as hidden elements should never have size, even if
	// these styles have defaults with higher specificity.
	/* stylelint-disable declaration-no-important */
	width: 0 !important;
	height: 0 !important;
	overflow: hidden !important;
	// Avoid extra borders etc. on un-rendered elements
	padding: 0 !important;
	margin: 0 !important;
	border: 0 !important;
	/* stylelint-enable declaration-no-important */
}

.wikitable.mw-collapsed {
	// Avoid extra borders on un-rendered rows. Table cells themselves
	// already render the required borders.
	border: 0;
}
