/*
 Theme Name:	PEC DNA Theme (Dark Mode)
 Theme URI:		https://understrap.com
 Description:	PEC Konfigurator
 Author:		Stephan Riedl <stephan.riedl@outlook.com>
 Author URI:    https://motioncode.dev/
 Template:		understrap
 Version:		1.2.6
 License:		GNU General Public License v2 or later
 License URI:	http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:	dna-child
 Tags:			one-column, custom-menu, featured-images, theme-options, translation-ready
*/

/* ==================== CI TOKENS ==================== */

html.dark {
	color-scheme:dark;

	--pec-black:      #131313;
	--pec-black-alt:  #232323;
	--pec-grey-1:     #3f4040;
	--pec-grey-2:     #6a6969;
	--pec-grey-3:     #908f8f;
	--pec-grey-4:     #bbbbba;
	--pec-orange:     #f28a48;
	--pec-gradient:   linear-gradient(35deg, #e94f40 0%, #f28a48 100%);

	--pec-text:       #d4d4d3;
	--pec-text-bright:#e2e2e1;
}

/* ==================== GLOBAL TEXT COLOR FIX ==================== */

.dark,
.dark body {
	color:var(--pec-text);
}
.dark header,
.dark footer,
.dark aside,
.dark main,
.dark section,
.dark nav {
	color:var(--pec-text);
}

/* ==================== HTML / BODY BACKGROUND FIX ==================== */

html.dark,
html.dark body {
	background-color:var(--pec-black) !important;
}

/* ==================== BACKGROUNDS ==================== */

/*
 * Grundflaechen
 */
.dark .bg-\[\#f6f2f0\] {
	background-color:var(--pec-black) !important;
}
.dark .bg-\[\#e0e0e0\] {
	background-color:var(--pec-black) !important;
}
.dark .bg-\[\#f5f5f5\] {
	background-color:var(--pec-black) !important;
}
.dark .bg-\[\#ffffff\] {
	background-color:var(--pec-black) !important;
}

/*
 * Cards / Surfaces
 */
.dark .bg-white {
	background-color:var(--pec-black-alt) !important;
}
.dark .bg-white\/90 {
	background-color:rgba(25, 25, 25, 0.98) !important;
}
.dark .bg-white\/50 {
	background-color:rgba(35, 35, 35, 0.55) !important;
}
.dark .bg-white\/30 {
	background-color:rgba(255, 255, 255, 0.06) !important;
}
.dark .bg-gray-50 {
	background-color:var(--pec-black-alt) !important;
}
.dark .bg-gray-100 {
	background-color:var(--pec-black-alt) !important;
}
.dark .bg-gray-100\/70 {
	background-color:rgba(35, 35, 35, 0.7) !important;
}

/*
 * Elevated / Section Headers
 */
.dark .bg-gray-200 {
	background-color:var(--pec-grey-1) !important;
}
.dark .bg-gray-300 {
	background-color:var(--pec-grey-1) !important;
}
.dark .bg-\[\#f7f4f2\] {
	background-color:var(--pec-black-alt) !important;
}

/*
 * Mobile Footer
 */
.dark .bg-\[\#f4f5f6\] {
	background-color:var(--pec-black-alt) !important;
}

/*
 * Warm Beige Opacity Variants
 */
.dark .bg-\[\#f6f2f0\]\/20 {
	background-color:rgba(19, 19, 19, 0.4) !important;
}
.dark .bg-\[\#f6f2f0\]\/50 {
	background-color:rgba(19, 19, 19, 0.55) !important;
}
.dark .bg-\[\#f6f2f0\]\/60 {
	background-color:rgba(19, 19, 19, 0.65) !important;
}
.dark .bg-\[\#f2e9d1\] {
	background-color:var(--pec-black-alt) !important;
}

/*
 * Dark Accent Surfaces
 */
.dark .bg-\[\#131313\] {
	background-color:var(--pec-grey-1) !important;
}
.dark .bg-\[\#232323\] {
	background-color:var(--pec-grey-1) !important;
}

/*
 * Stage Overlay
 */
.dark .bg-blend-overlay {
	background-color:rgba(10, 10, 10, 0.5) !important;
}

/*
 * Cockpit Cards (Deine Kosten + Sparpotential)
 */
.dark #tour-step-2 .bg-white\/50 {
	background-color:rgba(35, 35, 35, 0.95) !important;
}
.dark #tour-step-2 .bg-white {
	background-color:var(--pec-black) !important;
}

/*
 * Responsive
 */
@media (min-width:640px) {
	.dark .sm\:\!bg-\[\#f6f2f0\]\/95 {
		background-color:rgba(19, 19, 19, 0.95) !important;
	}
}

/* ==================== TEXT COLORS ==================== */

/*
 * Primary Text
 */
.dark .text-black {
	color:var(--pec-text) !important;
}
.dark .text-gray-900 {
	color:var(--pec-text-bright) !important;
}
.dark .text-gray-800 {
	color:var(--pec-text) !important;
}
.dark .text-\[\#131313\] {
	color:var(--pec-text) !important;
}
.dark .text-\[\#232323\] {
	color:var(--pec-text) !important;
}

/*
 * Secondary Text
 */
.dark .text-gray-700 {
	color:var(--pec-grey-4) !important;
}
.dark .text-gray-600 {
	color:var(--pec-grey-4) !important;
}
.dark .text-gray-600\/80 {
	background:var(--pec-gradient) !important;
	-webkit-background-clip:text !important;
	-webkit-text-fill-color:transparent !important;
	background-clip:text !important;
	color:transparent !important;
}
.dark .text-\[\#343434\] {
	color:var(--pec-grey-4) !important;
}
.dark .text-\[\#444444\] {
	color:var(--pec-grey-4) !important;
}

/*
 * Muted Text
 */
.dark .text-gray-500 {
	color:var(--pec-grey-3) !important;
}
.dark .text-gray-400 {
	color:var(--pec-grey-2) !important;
}
.dark .text-gray-300 {
	color:var(--pec-grey-1) !important;
}
.dark .text-\[\#666666\] {
	color:var(--pec-grey-3) !important;
}
.dark .text-\[\#8c8c8c\] {
	color:var(--pec-grey-3) !important;
}
.dark .text-\[\#968d85\] {
	color:var(--pec-grey-2) !important;
}
.dark .text-\[\#9c9694\] {
	color:var(--pec-grey-3) !important;
}

/*
 * SVG currentColor Fix
 */
.dark svg[stroke="currentColor"] {
	stroke:var(--pec-grey-4);
}

/* ==================== BORDER COLORS ==================== */

/*
 * Subtle (Card-Internal)
 */
.dark .border-gray-100 {
	border-color:var(--pec-black-alt) !important;
}
.dark .border-gray-100\/50 {
	border-color:rgba(35, 35, 35, 0.5) !important;
}
.dark .divide-gray-100 > :not([hidden]) ~ :not([hidden]) {
	border-color:var(--pec-black-alt) !important;
}

/*
 * Standard
 */
.dark .border-gray-200 {
	border-color:var(--pec-grey-1) !important;
}
.dark .border-gray-300 {
	border-color:var(--pec-grey-1) !important;
}
.dark .border-gray-300\/80 {
	border-color:rgba(63, 64, 64, 0.7) !important;
}
.dark .border-\[\#cdcdcd\] {
	border-color:var(--pec-grey-1) !important;
}
.dark .border-\[\#e3dedc\] {
	border-color:var(--pec-grey-1) !important;
}

/*
 * Prominent
 */
.dark .border-gray-500 {
	border-color:var(--pec-grey-2) !important;
}
.dark .border-gray-900 {
	border-color:var(--pec-grey-3) !important;
}
.dark .border-\[\#ababab\] {
	border-color:var(--pec-grey-2) !important;
}
.dark .border-\[\#131313\] {
	border-color:var(--pec-grey-1) !important;
}

/*
 * Opacity Borders (Black -> White Inverted)
 */
.dark .border-black\/5 {
	border-color:rgba(187, 187, 186, 0.04) !important;
}
.dark .border-black\/10 {
	border-color:rgba(187, 187, 186, 0.07) !important;
}
.dark .border-black\/15 {
	border-color:rgba(187, 187, 186, 0.1) !important;
}

/*
 * Responsive
 */
@media (min-width:1920px) {
	.dark .\34xl\:border-gray-200 {
		border-color:var(--pec-grey-1) !important;
	}
}

/* ==================== SHADOWS ==================== */

.dark .shadow {
	box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.7), 0 1px 2px -1px rgba(0, 0, 0, 0.7) !important;
}
.dark .shadow-sm {
	box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.6) !important;
}
.dark .shadow-md {
	box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.7), 0 2px 4px -2px rgba(0, 0, 0, 0.7) !important;
}
.dark .shadow-lg {
	box-shadow:0 10px 15px -3px rgba(0, 0, 0, 0.7), 0 4px 6px -4px rgba(0, 0, 0, 0.7) !important;
}
.dark .shadow-2xl {
	box-shadow:0 25px 50px -12px rgba(0, 0, 0, 0.9) !important;
}
.dark .shadow-inner {
	box-shadow:inset 0 2px 4px 0 rgba(0, 0, 0, 0.6) !important;
}
.dark .shadow-\[0_10px_30px_-15px_rgba\(0\,0\,0\,0\.05\)\] {
	box-shadow:0 10px 30px -15px rgba(0, 0, 0, 0.7) !important;
}
.dark .shadow-\[0_-5px_15px_-5px_rgba\(0\,0\,0\,0\.05\)\] {
	box-shadow:0 -5px 15px -5px rgba(0, 0, 0, 0.5) !important;
}

/* ==================== RING / FOCUS ==================== */

.dark .ring-1.ring-black\/40 {
	box-shadow:0 0 0 1px rgba(63, 64, 64, 0.5) !important;
}
.dark .ring-1.ring-black {
	box-shadow:0 0 0 1px rgba(63, 64, 64, 0.5) !important;
}

/* ==================== FORM ELEMENTS ==================== */

/*
 * Checkbox / Radio
 */
.dark input.appearance-none[type="checkbox"],
.dark input.appearance-none[type="radio"] {
	border-color:var(--pec-grey-2) !important;
	background-color:transparent !important;
}

/*
 * Checked State
 */
.dark input.appearance-none:checked {
	background-color:var(--pec-grey-4) !important;
	border-color:var(--pec-grey-4) !important;
}

/*
 * Checkmark SVG
 */
.dark .peer:checked ~ svg,
.dark input:checked ~ svg {
	color:var(--pec-black) !important;
	stroke:var(--pec-black) !important;
}

/*
 * Toggle Switch
 */
.dark .peer:checked ~ .peer-checked\:bg-black {
	background:var(--pec-gradient) !important;
}

/*
 * Text Inputs
 */
.dark input[type="number"],
.dark input[type="text"],
.dark input[type="email"],
.dark input[type="tel"],
.dark textarea,
.dark select {
	background-color:var(--pec-black) !important;
	color:var(--pec-text) !important;
	border-color:var(--pec-grey-1) !important;
}
.dark input::placeholder,
.dark textarea::placeholder {
	color:var(--pec-grey-2) !important;
}

/*
 * Inline Edit (Border-Bottom)
 */
.dark input.border-b.border-black {
	border-bottom-color:var(--pec-grey-3) !important;
	color:var(--pec-text-bright) !important;
}

/*
 * Expert Panel Inputs
 */
.dark .rounded-md.border.border-gray-300 {
	background-color:var(--pec-black) !important;
	color:var(--pec-text) !important;
}

/* ==================== SVG CHART (DNA RADAR) ==================== */

.dark svg g[stroke="#CDCDCD"] polygon {
	stroke:var(--pec-grey-1) !important;
}
.dark svg g[stroke="#999999"] line {
	stroke:var(--pec-grey-2) !important;
}
.dark svg g[stroke="#999999"] circle {
	fill:var(--pec-grey-2) !important;
}
.dark svg g.font-haas text,
.dark svg .font-haas text {
	fill:var(--pec-grey-4) !important;
}
.dark svg path[stroke="#efefef"] {
	stroke:var(--pec-grey-1) !important;
}

/* ==================== SCROLLBAR ==================== */

.dark * {
	scrollbar-color:var(--pec-grey-1) transparent !important;
}
.dark *::-webkit-scrollbar-thumb {
	background-color:var(--pec-grey-1) !important;
}
.dark *::-webkit-scrollbar-thumb:hover {
	background-color:var(--pec-grey-2) !important;
}
.dark *::-webkit-scrollbar-track {
	background-color:transparent !important;
}

/* ==================== HOVER STATES ==================== */

.dark .hover\:\!bg-\[\#232323\]:hover {
	background-color:var(--pec-grey-1) !important;
}
.dark .hover\:bg-\[\#232323\]:hover {
	background-color:var(--pec-grey-1) !important;
}
.dark .hover\:\!bg-pec-red\/90:hover {
	background:var(--pec-gradient) !important;
}
.dark .hover\:text-black:hover {
	color:var(--pec-text-bright) !important;
}
.dark .hover\:text-dark:hover {
	color:var(--pec-text-bright) !important;
}
.dark .hover\:text-\[\#968d85\]:hover {
	color:var(--pec-grey-3) !important;
}
.dark .hover\:text-\[\#343434\]:hover {
	color:var(--pec-text) !important;
}
.dark .hover\:border-gray-300:hover {
	border-color:var(--pec-grey-2) !important;
}
.dark .hover\:bg-gray-50:hover {
	background-color:var(--pec-grey-1) !important;
}

/*
 * Active Toggle State
 */
.dark .\!bg-\[\#232323\] {
	background-color:var(--pec-grey-1) !important;
}

/* ==================== MODAL ==================== */

.dark .prose {
	color:var(--pec-text) !important;
}
.dark .prose h1,
.dark .prose h2,
.dark .prose h3,
.dark .prose h4 {
	color:var(--pec-text-bright) !important;
}
.dark .prose a {
	color:var(--pec-orange) !important;
}
.dark .prose strong {
	color:var(--pec-text) !important;
}
.dark .prose td,
.dark .prose th {
	border-color:var(--pec-grey-1) !important;
}

.dark .modal-body input[type="text"],
.dark .modal-body input[type="email"],
.dark .modal-body input[type="tel"],
.dark .modal-body textarea {
	background-color:var(--pec-black) !important;
	color:var(--pec-text) !important;
	border-color:var(--pec-grey-1) !important;
}

/* ==================== COCKPIT GRAPHS ==================== */

/*
 * Sparpotential Arc
 */
.dark svg path[stroke="#82c493"] {
	stroke:var(--pec-orange) !important;
}

/*
 * Sparpotential / Price Value
 */
.dark .text-pec-green {
	background:var(--pec-gradient) !important;
	-webkit-background-clip:text !important;
	-webkit-text-fill-color:transparent !important;
	background-clip:text !important;
	color:transparent !important;
}
.dark .text-pec-red {
	background:var(--pec-gradient) !important;
	-webkit-background-clip:text !important;
	-webkit-text-fill-color:transparent !important;
	background-clip:text !important;
	color:transparent !important;
}
.dark .text-pec-green\/70 {
	color:rgba(242, 138, 72, 0.7) !important;
}

/* ==================== STAGE / HOUSE ==================== */

.dark img[alt="House HQ"],
.dark img[alt="House Mobile"] {
	filter:brightness(0.85) saturate(0.9);
}
.dark .opacity-30.grayscale {
	opacity:0.12 !important;
}

/* ==================== LOGO SWAP ==================== */

.dark img[alt="Logo PEC"] {
	content:url('/wp-content/uploads/2023/11/PEC-Logo-small-invert-v2-1.webp');
}

/* ==================== MOBILE DIVIDERS ==================== */

.dark .bg-gray-300\/80 {
	background-color:rgba(63, 64, 64, 0.4) !important;
}

/* ==================== DISABLED STATES ==================== */

.dark .opacity-50.pointer-events-none {
	opacity:0.2 !important;
}

/* ==================== COMPONENT OVERRIDES ==================== */

/*
 * PEC Yellow Info Boxes
 */
.dark .bg-pec-yellow\/30 {
	background-color:rgba(242, 188, 71, 0.08) !important;
}
.dark .border-pec-yellow\/50 {
	border-color:rgba(242, 188, 71, 0.2) !important;
}

/*
 * Green Highlights (Price Table)
 */
.dark .bg-pec-green\/5 {
	background-color:rgba(130, 196, 147, 0.04) !important;
}
.dark .bg-pec-green\/10 {
	background-color:rgba(130, 196, 147, 0.06) !important;
}

/*
 * AI 360 Badge
 */
.dark span.bg-\[\#131313\].text-white {
	background-color:var(--pec-black) !important;
	border:1px solid var(--pec-grey-1);
}

/*
 * Copyright Links
 */
.dark a.hover\:text-\[\#968d85\] {
	color:var(--pec-grey-2) !important;
}

/* ==================== PEC GRADIENT ACCENTS ==================== */

/*
 * Badges
 */
.dark span.border.text-\[\#666666\] {
	border-color:var(--pec-grey-2) !important;
	color:var(--pec-grey-3) !important;
}

/*
 * Sidebar Section Icons
 */
.dark summary i.hgi {
	background:var(--pec-gradient);
	-webkit-background-clip:text;
	-webkit-text-fill-color:transparent;
	background-clip:text;
}

/*
 * Header Stat Icons
 */
.dark header i.hgi {
	color:var(--pec-grey-3) !important;
}

/*
 * Header CTA Button Icons (keep white)
 */
.dark header a i.hgi {
	color:#ffffff !important;
}

/*
 * Expert Panel Header Icon
 */
.dark .bg-white\/90 i.hgi {
	background:var(--pec-gradient);
	-webkit-background-clip:text;
	-webkit-text-fill-color:transparent;
	background-clip:text;
}

/*
 * Sidebar Cost Table Icons
 */
.dark i.hgi.text-\[\#8c8c8c\] {
	color:var(--pec-grey-3) !important;
}

/*
 * Footer Action Button Icons (keep solid)
 */
.dark footer a i.hgi {
	background:none;
	-webkit-background-clip:unset;
	-webkit-text-fill-color:currentColor;
	background-clip:unset;
}

/*
 * DNA URL Copy Button
 */
.dark button.bg-\[\#131313\] {
	background:var(--pec-gradient) !important;
	color:#ffffff !important;
}
.dark button.bg-\[\#131313\]:hover {
	background:linear-gradient(35deg, #d4443a 0%, #e07a3c 100%) !important;
}

/*
 * DNA URL Input Field
 */
.dark footer input[type="text"][readonly] {
	background-color:var(--pec-black) !important;
	color:var(--pec-grey-3) !important;
	border-color:var(--pec-grey-1) !important;
}

/* ==================== DEBUG TOGGLE ==================== */

#dna-dark-toggle {
	position:fixed;
	top:12px;
	right:12px;
	z-index:99999;
	width:36px;
	height:36px;
	border-radius:8px;
	border:1.5px solid var(--pec-grey-4, #bbbbba);
	background:#ffffff;
	color:#131313;
	font-size:18px;
	line-height:1;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 2px 8px rgba(0, 0, 0, 0.12);
	transition:all 0.2s ease;
	opacity:0.7;
}
#dna-dark-toggle:hover {
	opacity:1;
	transform:scale(1.08);
}
.dark #dna-dark-toggle {
	background:var(--pec-black-alt);
	border-color:var(--pec-grey-1);
	color:var(--pec-grey-4);
	box-shadow:0 2px 8px rgba(0, 0, 0, 0.6);
}

/* ==================== THEME SWITCH LOCK ==================== */

.theme-switching,
.theme-switching *,
.theme-switching *::before,
.theme-switching *::after {
	transition-duration:0s !important;
	animation-duration:0s !important;
}

/* ==================== VIEW TRANSITION ==================== */

::view-transition-old(root),
::view-transition-new(root) {
	animation-duration:0.35s;
	animation-timing-function:ease-in-out;
}
::view-transition-old(root) {
	animation-name:dna-fade-out;
}
::view-transition-new(root) {
	animation-name:dna-fade-in;
}

@keyframes dna-fade-out {
	0%   { opacity:1; filter:brightness(1); }
	100% { opacity:0; filter:brightness(0.3); }
}
@keyframes dna-fade-in {
	0%   { opacity:0; filter:brightness(0.3); }
	100% { opacity:1; filter:brightness(1); }
}

@media (max-width:1024px), (pointer:coarse) {
	.dark a:focus, 
	.dark button:focus, 
	.dark [role="button"]:focus {
		--tw-ring-color:transparent !important;
		--tw-ring-shadow:none !important;
		--tw-ring-offset-shadow:none !important;
		outline:none !important;
	}

	.dark header a.flex-1 {
		box-shadow:0 3px 8px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.2) !important;
		border:1px solid rgba(0, 0, 0, 0.2) !important;
	}

	.dark button:not([disabled]):not([\@click^="closeModal"]):not([\@click*="expertBarOpen"]):not([\@click*="openVideo"]):not([\@click*="openModal"]):not([\@click\.stop*="openVideo"]):not([\@click\.stop*="openModal"]):not([class*="driver-"]):not([type="submit"]), 
	.dark .btn, 
	.dark header a.border {
		background:linear-gradient(180deg, var(--pec-black-alt) 0%, var(--pec-black) 100%) !important;
		box-shadow:0 1px 2px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
		border:1px solid rgba(255, 255, 255, 0.08) !important;
	}

	.dark button:not([disabled]):not([\@click^="closeModal"]):not([\@click*="expertBarOpen"]):not([\@click*="openVideo"]):not([\@click*="openModal"]):not([\@click\.stop*="openVideo"]):not([\@click\.stop*="openModal"]):not([class*="driver-"]):not([type="submit"]):active, 
	.dark .btn:active, 
	.dark header a.border:active {
		filter:brightness(0.8) contrast(1.1) !important;
	}

	.dark .snap-start {
		background:var(--pec-black-alt) !important;
		box-shadow:0 4px 12px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
		border:1px solid rgba(255, 255, 255, 0.06) !important;
		transform-origin:left center !important;
	}

	.dark .snap-start:active {
		box-shadow:inset 0 3px 8px rgba(0, 0, 0, 0.4) !important;
		filter:brightness(0.85) !important;
	}
}

/* Clear all borders, shadows, backgrounds, scale, and active effects from close buttons globally */
button[\@click^="closeModal"],
button[\@click*="expertBarOpen"] {
	background:transparent !important;
	background-image:none !important;
	border:none !important;
	border-color:transparent !important;
	box-shadow:none !important;
	transform:none !important;
	filter:none !important;
}

button[\@click^="closeModal"]:active,
button[\@click*="expertBarOpen"]:active {
	background:transparent !important;
	background-image:none !important;
	border:none !important;
	border-color:transparent !important;
	box-shadow:none !important;
	transform:none !important;
	filter:none !important;
}

button[type="submit"] {
	background:linear-gradient(180deg, #f28a48 0%, #e94f40 100%) !important;
	color:#ffffff !important;
	border:1px solid rgba(233, 79, 64, 0.4) !important;
	border-bottom:2px solid rgba(180, 40, 30, 0.5) !important;
	box-shadow:0 2px 4px rgba(0, 0, 0, 0.08), 
	            0 8px 20px rgba(233, 79, 64, 0.15), 
	            inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
	text-shadow:0 1px 1px rgba(0, 0, 0, 0.15) !important;
	transition:transform 0.05s cubic-bezier(0.25, 0.46, 0.45, 0.94), filter 0.05s ease !important;
}

button[type="submit"]:active {
	transform:scale(0.95) !important;
	filter:brightness(0.9) contrast(1.1) !important;
	box-shadow:0 1px 2px rgba(0, 0, 0, 0.15), 
	            inset 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}

.dark button[type="submit"] {
	background:linear-gradient(180deg, #f28a48 0%, #e94f40 100%) !important;
	color:#ffffff !important;
	border:1px solid rgba(233, 79, 64, 0.5) !important;
	border-bottom:2px solid rgba(140, 20, 10, 0.6) !important;
	box-shadow:0 2px 4px rgba(0, 0, 0, 0.3), 
	            0 8px 25px rgba(233, 79, 64, 0.25), 
	            inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
	text-shadow:0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

.dark button[type="submit"]:active {
	transform:scale(0.95) !important;
	filter:brightness(0.85) contrast(1.15) !important;
}

/* Dark Mode Modals Button Overrides (Specificity based - no IDs required) */
.dark #page .modal-body button.text-white {
	background: linear-gradient(35deg, #e94f40 0%, #f28a48 100%) !important;
	color: #ffffff !important;
	border: none !important;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2) !important;
	transition: transform 0.05s ease, filter 0.05s ease !important;
}
.dark #page .modal-body button.text-white:active {
	transform: scale(0.96) !important;
	filter: brightness(0.9) contrast(1.1) !important;
}
.dark #page .modal-body button:not(.text-white):not([class*="absolute"]) {
	background: var(--pec-black-alt) !important;
	color: var(--pec-text) !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: none !important;
	transition: transform 0.05s ease, background-color 0.05s ease !important;
}
.dark #page .modal-body button:not(.text-white):not([class*="absolute"]):active {
	transform: scale(0.96) !important;
	background: var(--pec-black) !important;
}