:root {
		--bg-color: #ffffff;
		--text-color: #333333;
		--accent-color: #0066cc;
	}
	
	[data-theme="dark"] {
		--bg-color: #1a1a1a;
		--text-color: #e0e0e0;
		--accent-color: #dddddd;
		
		.widget-content, .tbl-account, .widget-ref-option, .tbl-content, .ad-content, .ticket-user, .ticket-user legend, .ticket-admin, .ticket-admin legend {
			background: #333333;
			color: #e0e0e0;
		} 

		.widget-tbl tr td, .widget-tbl tr td > a {
			background: #333333;
			color: #e0e0e0;
		}

		.widget-tbl tr.titles td a{
			color: #e0e0e0;
		}

		.widget-tbl tr:hover td{
			background: #444444;
			color: #f0f0f0;
		}

		.tbl-content tr:hover td{
			background: #aaaaaa;
			color: #f1f1f1;
		}		

		.tbl-account tr:hover td{
			background: #aaaaaa;
			color: #f1f1f1;
		}
		
		.answer, .fcontent, .fcontent ul li, .fcontent ul li a, .shopcart, #specialdescription {
			background: #555555;
			color: #e0e0e0;
		}
		
		#tabs, #tabs ul, #tabs ul li, #tabs ul li a, #tabs div {
			background: #333333;
			color: #e0e0e0;
		}
		
		.member_sidebar li ul a{
			background: #333333;
			color: #e0e0e0;
		}
		
		.member_sidebar li ul li a:hover{
			background:#999999;
			color: #f1f1f1;
		}
		
		.generator { 
			background-color: #bbbbbb; 
			color: green;
		} 		
	}
		   
	body {
		background-color: var(--bg-color);
		color: var(--text-color);
		font-family: Arial, sans-serif;
		padding: 20px;
		transition: background-color 0.3s, color 0.3s;
	}
	
	.theme-toggle {
		width: 80px;
		padding: 10px 2px;
		background-color: var(--text-color);
		color: var(--bg-color);
		border: none;
		border-radius: 5px;
		cursor: pointer;
		font-weight: bold;
	}