prompthero.com - Dark Mode by Nick2bad4u

/* ==UserStyle==
@name           prompthero.com - Dark Mode
@namespace      typpi.online
@version        1.1.1
@description    Dark theme for Prompt Hero
@author         Nick2bad4u
@license        UnLicense
@homepageURL    https://github.com/Nick2bad4u/UserStyles
@supportURL     https://github.com/Nick2bad4u/UserStyles/issues
@downloadURL    https://raw.githubusercontent.com/Nick2bad4u/UserStyles/refs/heads/main/PromptHero-Dark.user.css

@var color      primary-color    "Primary Color" #4505bc
@var color      secondary-color  "Secondary Color" #bc0573
@var color      background-color "Background Color" #000000
@var color      card-background-color "Card Background Color" #050505
@var color      text-color       "Text Color" #ffffff
@var color      navbar-shadow-color "Navbar Shadow Color" #4505bc
==/UserStyle== */
@-moz-document domain("prompthero.com") {
	:root {
			--primary-color: var(primary-color);
			--secondary-color: var(secondary-color);
			--background-color: var(background-color);
			--card-background-color: var(card-background-color);
			--text-color: var(text-color);
			--navbar-shadow-color: var(navbar-shadow-color);
	}

	/* Invert colors except images and videos */
	body,
	.navbar-container,
	.p-3,
	.text-center,
	footer,
	footer ul a,
	.card,
	.devise-wrapper form:not(.button_to) {
			background: var(--background-color) !important;
			background-color: var(--background-color) !important;
			color: var(--text-color) !important;
	}

	#top-prompthero-navbar > a > span > img {
			border-radius: 20px;
			background: #56074300;
			padding-top: 1px;
			padding-right: 10px;
			padding-left: 10px;
	}

	.navbar-shadow {
			box-shadow:
					var(--navbar-shadow-color) 0 8px 8px -8px,
					inset -30px 0 30px -30px #00000033;
	}

	#top-prompthero-navbar > a > span > img,
	.navbar-light .navbar-toggler-icon,
	#top-prompthero-navbar-main-area {
			filter: invert(1) hue-rotate(180deg);
	}

	.category-carousel-item {
			color: var(--secondary-color);
	}

	.category-carousel-item:hover,
	footer ul a:hover {
			color: var(--primary-color) !important;
	}

	.prompt-area,
	.p-3,
	.card {
			border: 1px solid var(--primary-color);
			border-radius: 12px;
			background-color: var(--card-background-color);
			padding: 1.5em 2em;
			overflow-wrap: break-word;
	}

	.prompt-area span {
			color: var(--secondary-color);
	}

	.prompt-buttons a:hover span,
	#copyButton:hover span,
	.footer-section-title {
			color: var(--primary-color);
	}
}