/*
 * ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 * File: style.css
 * File Created: Monday, 12th February 2024 5:04:56 pm
 * Author: Nebula Studios (https://discord.gg/CsphJ7Wetz)
 *             ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 * The modification of this file is prohibited without explicit permission from Nebula Studios.
 * Any unauthorized modification of this file will result in support being revoked.
 *             ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 * Last Modified: Thursday, 29th February 2024 10:16:23 pm
 * Modified By: MS Studios
 *             ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 * License: Creative Commons Attribution Non-commercial No-derivatives 4.0 International
 * License Abbreviation: CC BY-NC-ND 4.0
 * License URL: https://creativecommons.org/licenses/by-nc-nd/4.0/
 * Copyright 2023 - 2024, Nebula Studios
 * ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 */

/* Custom CSS */

.form-group {
	margin-bottom: 1rem;
	display: flex;
}

#output {
	font-family: 'Courier New', Courier, monospace;
	border-radius: 5px;
	border: 1px solid var(--border);
	max-height: 500px;
	max-width: 800px;
	filter: var(--drop-shadow);
}

#codeContainer {
	position: absolute;
	top: 50%;
	right: 0;
}

:not(pre) > code[class*="language-"], pre[class*="language-"] {
	background: var(--background-darker);
	border-radius: 5px;
	padding: 5px;
}

#copyButton {
	position: absolute;
	top: 0;
	right: 0;
	background: var(--border-subtle);
	border: 1px solid var(--border);
	border-radius: 5px;
	padding: 5px;
	transition: var(--ease);
	z-index: 1;
	filter: var(--drop-shadow);
}

#copyButton:hover {
	background: var(--border);
	cursor: pointer;
}