/*  _____________________________________________________________________________

 * |                                                                             |

 * |                    === WARNING: GLOBAL GADGET FILE ===                      |

 * |                  Changes to this page affect many users.                    |

 * | Please discuss changes on the talk page or on [[WT:Gadget]] before editing. |

 * |_____________________________________________________________________________|

 *

 */

/* v3.5.3 */



/* Stylings for missing description and links to wikidata */

.sdh-missing-description {

	color: DarkRed; /* Using DarkRed rather than previous Red to meet WCAG AA */

}



.sdh-wikidata-description a {

	color: MediumVioletRed; /* Using MediumVioletRed rather than previous HotPink to meet WCAG AA */

}



.sdh-ve-hidden {

	display: none;

}



/**

 * Interestingly, Vector's stylesheet makes <a> elements without href have a pointer automatically

 * This is for other skins.

*/

.sdh-clicky a {

	cursor: pointer;

}



.sdh-clicky-disabled a {

	pointer-events: none;

}



/* Brackets and seperators for clickies */

.sdh-clicky + .sdh-clicky::before {

	content: ' · ';

}



.sdh-clickies::before {

	content: ' (';

}



.sdh-clickies::after {

	content: ')';

}



/* Used to hide display of description when switching to editing box */

.sdh-showdescrip-hidden {

	display: none;

}



/* Styling for editing bar */

#sdh-editbox {

	padding: 0;

	margin: 0;

	display: flex;

	flex-direction: column;

}



/* Make things flex to allow description input box size to be set exactly, and everything else to look good. */

#sdh .oo-ui-fieldLayout-field {

	display: flex;

	align-items: center;

}



#sdh-descriptionbox {

	margin-right: 0;

}



/* Styling for processing animation */

@keyframes wave {

	0% { transform: translateY( 0 ); }

	20% { transform: translateY( -0.25em ); }

	40% { transform: translateY( 0 ); }

	100% { transform: translateY( 0 ); }

}



.sdh-processing {

	display: inline-block;

	margin-left: 0.5em;

}



.sdh-processing-dot {

	display: inline-block;

	animation: wave 1s ease-out infinite;

}



.sdh-processing-dot-1 {

	animation-delay: 200ms;

}



.sdh-processing-dot-2 {

	animation-delay: 400ms;

}



.sdh-processing-dot-3 {

	animation-delay: 600ms;

}



/* Styling for character counter based on length */

.sdh-too-long {

	color: #d43900;

}



.sdh-very-long {

	color: #e00000;

	font-weight: bold;

}