/*
 * Citizen
 *
 * SkinStyles for Extension:Scribunto
 * Module: ext.scribunto.edit
 * Version: REL1_39 ebb91f2
 *
 * Date: 2023-05-29
 */

.mw-scribunto-console-fieldset {
	font-size: 0.875rem;
	color: var( --color-base );

	input[ type='button' ] {
		width: 100%;
		padding: var( --space-xs ) var( --space-sm );
		font-weight: var( --font-weight-semibold );
		cursor: pointer;
		border-top: 0;
		border-bottom-right-radius: var( --border-radius--small );
		border-bottom-left-radius: var( --border-radius--small );

		&:hover {
			background: var( --color-surface-2--hover );
		}

		&:active {
			background: var( --color-surface-2--active );
		}
	}
}

.mw-scribunto-console-fieldset,
.mw-scribunto-input,
.mw-scribunto-normalOutput,
.mw-scribunto-print,
.mw-scribunto-message,
.mw-scribunto-error,
.mw-scribunto-propList,
.mw-scribunto-tabcomplete,
.mw-scribunto-clear {
	background-color: transparent;
}

.mw-scribunto-message {
	color: var( --color-base--subtle );
}

.mw-scribunto-message + div {
	padding-top: var( --space-sm );
	border-top: 1px solid var( --border-color-base );
}

#mw-scribunto-input {
	color: var( --color-base--emphasized );
	background-color: transparent;
	border: 1px solid var( --border-color-base );
	border-top-left-radius: var( --border-radius--small );
	border-top-right-radius: var( --border-radius--small );

	&:hover {
		border-color: var( --color-primary--hover );
	}

	&:focus {
		border-color: var( --color-primary );
		outline: 1px solid transparent;
		box-shadow: inset 0 0 0 1px var( --color-primary );
	}
}

.mw-scribunto-input {
	display: block;
	margin-top: var( --space-md );
	font-weight: normal;
	color: var( --color-base--emphasized );

	// Fake terminal input indicator
	&:not( #mw-scribunto-input )::before {
		color: var( --color-base--subtle );
		content: '> ';
	}
}

#mw-scribunto-output p {
	margin: 0;
}

.mw-scribunto-normalOutput {
	color: var( --color-base );
}

.mw-scribunto-print {
	color: var( --color-syntax-brown );
}

.mw-scribunto-error {
	color: var( --color-text-error );
}

.mw-scribunto-clear {
	color: var( --color-syntax-red );
}

.mw-scribunto-propList {
	color: var( --color-syntax-green );
}

.mw-scribunto-tabcomplete {
	color: var( --color-syntax-violet );
}