@media (prefers-color-scheme: dark) {
	body {
		background-color: #0f0f0f!important;
	}
	#modal-header {
		backdrop-filter: blur(2px);
		background-color: rgba(63, 63, 63, 0.5) !important;
	}

	.description {
		color: #fff !important;
	}

	#settingsModal {
		background-color: rgba(40, 40, 40, 0.4);
		color: #fff;
	}

	.modal-content {
		background-color: #282828;
		color: #fff;
	}

	#citationsModal {
		background-color: rgba(40, 40, 40, 0.4);
		color: #fff;
	}

	body {
		color: #fff;
		background-color: #575757;
	}

	.close:hover,
	.close:focus {
		color: #fff;
		text-decoration: none;
		cursor: pointer;
	}

	.navbar,
	.footer {
		background-color: #333333;
		color: #fff;
	}

	.container {
		background-color: #0f0f0f;
	}

	#result {
		color: #8b8b8b;
	}

	textarea {
		background-color: #333333;
		color: #fff;
	}

	.counters>.counter {
		background-color: #333333;
		color: #fff;
	}

	#notification {
		background-color: rgba(255, 255, 255, 0.1);
		color: #fff;
	}

	#notification:hover {
		background-color: rgba(255, 255, 255, 0.15);
		transform: translateX(-50%) translateY(-2px);
		box-shadow: 0 6px 35px rgba(0, 0, 0, 0.4);
	}

	#progress-bar {
		background-color: rgb(255, 255, 255, 0.7)!important;
	}

	.option {
		background-color: #4a4a4a;
		color: #fff;
	}

	.option:hover {
		background-color: #282828;
	}

	.option.active {
		background-color: #1a1a1a !important;
		cursor: pointer;
	}

	.option.active:hover {
		background-color: #0a0a0a !important;
	}

	#links {
		text-decoration: none;
		opacity: 80%;
		color: #fff;
	}

	#progress-bar {
		background-color: #141414;
		opacity: 100% !important;
	}

	.counters>.counter:hover {
		background-color: #626262;
	}

	.logo {
		filter: invert(1);
	}

	.scdescription {
		color: #fff;
	}

	table {
		width: 100%;
		border-collapse: collapse;
	}

	th,
	td {
		padding: 8px;
		text-align: left;
	}

	th {
		background-color: #1e1e1e;
		position: sticky;
		top: 0;
		z-index: 10;
	}

	tfoot {
		position: sticky;
		bottom: 0;
		background-color: #1e1e1e;
		z-index: 10;
	}

	tr:hover {
		background-color: #555;
	}

	#blog {
		color: #fff !important;
	}

	.note {
		color: #fff;
		border-left: 5px solid #fff !important;
		background-color: #575757 !important;
	}
	.dialog {
		color:#0a0a0a;
		background-color: rgba(0, 0, 0, 0.5); 
		justify-content: center;
		align-items: center;
	}
	
}