/* DEFAULT: SLEEK INDUSTRIAL (DARK) */
/*:root*/
[data-theme="light"] {
  /* LIGHT: Crisp & Clean */
 /* --bg: #ffffff;*/
  --text: #2d3436;
/*  --accent: #0984e3; /* Classic Blue */
  --card: #f8f9fa;
  --border: #dfe6e9;
  --radius: 8px; 
  
  --code-bg: #f1f2f6; --code-text: #2d3436; --code-keyword: #d63031; 
  --code-string: #00b894; --code-function: #0984e3; --code-comment: #636e72;

  --iFrameText: #000;

    /*Sub-Category List*/
	--list-bg: #ffffff;
    --list-bg-hover: #dae2e3;
	--item-border: #e5e7eb;
	--title-color: #111827;
	--desc-color: #6b7280;
	--accent-color: #3b82f6;
	--count-bg: #f3f4f6;
  /*Sub-Category List*/
  --bgmain: #ffffff;
  --header-bg: #0984e3;
    --bg: #f8f8f8;
    --panel: #e9edf5;
	--accent: #0984e3;
    /*--accent: #0d1117;  Your current blue */
    --border-style: 1px solid #dee2e6;
    --corner-display: none; /* Hide the "Hacker" corners */
    --font-main: 'Segoe UI', Tahoma, sans-serif;
	--content: #f8f8f8;
	--fontColor: #0d1117;
	--spacer-glow: rgba(0, 123, 255, 0.2);
/*	--BGOne: #f1f2f6;
	--BGTwo: #dfe6e9;
*/
    --BGOne: #c9e1f5;
	--BGTwo: #dae9f5;
    --header-bg: #ffffff;
    --nav-text: #1a1a1a;
	
/*====================Syntax Highlighter====================*/		
	/*window-bar*/
	--WBBG: #e9edf5;  /*--WBBG: #ced9eb;  Keep for another Theme. Nice Soft Color.*/
	
	/*status-pulse*/
	--SPBG: #9fc7ed;
	--SPBS: #2e92f0;
	
	 /* code-block-wrapper */
	--CBWBG: #f7f9fc; /*This needs to be the same color as the editor.*/
	--CBWBC: #333;
	
	
	/*code-block */
	--codeGB: #f7f9fc; /*This is the Editor*/
	--codeFC: #5f6163; 
	--codeFS: 14px;
	/*Line Numbers*/
	--LNBG: #dfe1e6;
	--LNC: #334882;
	--LNBC: #c7d8f2;
	--LNHover: #c5c9d4;
	
	
		/*CSS Syntax Highlighting*/
	--CSSColorNames: #f043ae;
	--CSSCurly: #FF637E;
	--SizeNames: #5CA5FF;
	--CSSNumeric: #ba79a1;
	--CSSComments: #99A1AF;
	--CSSQuery: rgb(255, 123, 114);
	--CSSPropertiesLayout : #02abd4;
	--CSSPropertiesColors : #FFF;
	--CSSPropertiesBackgrounds : #2C92B8;
	--CSSPropertiesVisual : #51A2FF;
    --CSSElementsW: 400;
	--CSSElementsC : #95F4E7;
	--CSSFontFamily : #FF692A;
	--CSStextalign : #FF6467;
	--CSSHash : #6792a3;
	
	
	
		/*JS Syntax Highlighting*/
--JSValueproperties: #C6D2FF;
--JSFundamentalobjects: #E1712B;
--JSInternalError: #FEE685;
--JSTextprocessing: #21BCFF;
--JSIndexedcollections: #8EC5FF;
--JSKeyedcollections: #B8DAFF;
--JSManagingmemory: #3BB8DB;
--JSControlabstractionobjects: #34A6F4;
--JSControlflow: #37738a;
--JSExpressionstatement: #36BBA7;
--JSPrimaryexpressions: #75CDE6;
--JSAlphaNumerical: #8EC5FF;
--JSConstEqual: #2E93FF;
--JSComments: #99A1AF;
--JSPeriodLeft: #0EA2C4;
--JSPeriodRight: #03708a;
--JSDoubleQuotes: #58accc;
--JSBloodhound: #CD040E;
--JSColonLeft: #14bafa;
--JSColonRight: #34c1f7;
--JSSQLine: #90A1B9;
--JSParentheses: #055a7a;
/*====================yntax Highlighter====================*/	
}

[data-theme="dark"] {
  /* DARK: High Contrast / Industrial */
 /* --bg: #1e272e;*/
  --text: #C9D1D9;
  --accent: #00d2d3; /* Cyber Teal */
  --card: #161B22;
  --border: #30363D;
  --radius: 8px;
  
  --iFrameText: #666;
  
  --code-bg: #101213; --code-text: #e8e6e3; --code-keyword: #ff79c6; 
  --code-string: #f1fa8c; --code-function: #8be9fd; --code-comment: #6272a4;
  
--BoxStyleTop: rgba(43, 3, 7) 0px 3px 6px;
--BoxStyleBot: rgba(36, 0, 4) 0px 3px 6px;
  
   /*Sub-Category List*/
    --list-bg: #0d0f14;
	--list-bg-hover: #13161c;
    --item-border: #30363D;
    --title-color: #f9fafb;
    --desc-color: #9ca3af;
    --accent-color: #60a5fa;
    --count-bg: #1f2937;
  /*Sub-Category List*/ 
  
  
--bgmain: #0D1117;
--header-bg: #131924;
/*--bgmain: #1a1a1a;*/
--bc: #C9D1D9; /*Font Color*/
/*--border: #21262d;*/
    --bg: #05070a;
    --panel: #0d1117;
	--accent: #00f2ff;
    --border-style: 1px solid #30363D;
    --corner-display: block; /* Show those cool corner brackets */
    --font-main: 'JetBrains Mono', monospace;
	--content: #05070a; /*#0d1117*/
	--fontColor: #505052;
	--spacer-glow: rgba(29, 185, 100, 0.4);
	/*Taglinks*/
	--BGOne: #0d0f14;
	--BGTwo: #0b0d12;
	--border-dotted: #0e6170; /*The Border around the TagLinks*/
	/*Taglinks*/
	--glass: #384861;
    
    --nav-text: #505052;
	--AllLinksC: #666;
	--ColumnBorder: #303030;

/*====================yntax Highlighter====================*/	
	/*window-bar*/
	--WBBG: #161b22;
	/*status-pulse*/
	--SPBG: #238636;
	--SPBS: #238636;
	/*EditorTitle*/
	--ETC: #696a6b;
	/*code-block */
	--codeGB: #1e1e1e; /*This is the Editor*/
	--codeFC: #d4d4d4; 
	--codeFS: 14px;
	 /* code-block-wrapper */
	--CBWBG: #1e1e1e; /*This needs to be the same color as the editor.*/
	--CBWBC: #333;
	/*Line Numbers*/
	--LNBG: #252525;
	--LNC: #858585;
	--LNBC: #444;
	--LNHover: #c5c9d4;
	
	/*CSS Syntax Highlighting*/
	--CSSColorNames: #53EAFD;
	--CSSCurly: #FF637E;
	--SizeNames: #5CA5FF;
	--CSSNumeric: #BEDBFF;
	--CSSComments: #99A1AF;
	--CSSQuery: rgb(255, 123, 114);
	--CSSPropertiesLayout : #18E7CB;
	--CSSPropertiesColors : #FFF;
	--CSSPropertiesBackgrounds : #2C92B8;
	--CSSPropertiesVisual : #51A2FF;
    --CSSElementsW: 400;
	--CSSElementsC : #95F4E7;
	--CSSFontFamily : #FF692A;
	--CSStextalign : #FF6467;
	--CSSHash : #53EAFD;
	
	/*JS Syntax Highlighting*/
--JSValueproperties: #C6D2FF;
--JSFundamentalobjects: #E1712B;
--JSInternalError: #FEE685;
--JSTextprocessing: #21BCFF;
--JSIndexedcollections: #8EC5FF;
--JSKeyedcollections: #B8DAFF;
--JSManagingmemory: #3BB8DB;
--JSControlabstractionobjects: #34A6F4;
--JSControlflow: #2C92B8;
--JSExpressionstatement: #36BBA7;
--JSPrimaryexpressions: #75CDE6;
--JSAlphaNumerical: #8EC5FF;
--JSConstEqual: #2E93FF;
--JSComments: #rgb(139, 148, 158);
--JSPeriodLeft: #0EA2C4;
--JSPeriodRight: #42D3F2;
--JSDoubleQuotes: #81DACD;
--JSBloodhound: #CD040E;
--JSColonLeft: #42D3F2;
--JSColonRight: #9AE630;
--JSSQLine: #90A1B9;
--JSParentheses: #B8DAFF;
	
/*====================yntax Highlighter====================*/	
}

[data-theme="spring"] {
  /* SOFT: Nordic Pastel / Inclusive */
	--bgmain: #f7eef3;
    --header-bg: #f9f3f7;
  --bg: #fff5f6;       /* Soft Shell Pink */
  --text: #5d4d50;     /* Deep Cocoa (Softer than Black) */
  --accent: #e5989b;    /* Dusty Rose */
  --card: #f9f3f7;     /* Pure White cards for contrast */
  --border: #f7d0d8;   /* Pale Flamingo */
  --radius: 20px;      /* Dramatically rounder for "Soft" feel */
  
--iFrameText: #000;
  
  --nav-text: #505052;

	
	/*Taglinks*/
	--BGOne: #fbf8fa; /* Second Stating line */
	--BGTwo: #f7e6f2; /* First Stating line */
	--border-dotted: #f7d0d8; /*The Border around the TagLinks*/
	/*Taglinks*/
  
   /*Sub-Category List*/
    --list-bg: #f9f3f7;
	--list-bg-hover: #fbf8fa;
    --item-border: #f7d0d8;
    --title-color: #470f1b;
    --desc-color: #470f1b;
    --accent-color: #60a5fa;
    --count-bg: #1f2937;
  /*Sub-Category List*/ 
  
 /*====================yntax Highlighter====================*/		
	/*window-bar*/
	--WBBG: #e9edf5;  /*--WBBG: #ced9eb;  Keep for another Theme. Nice Soft Color.*/
	
	/*status-pulse*/
	--SPBG: #9fc7ed;
	--SPBS: #2e92f0;
	
	 /* code-block-wrapper */
	--CBWBG: #f7f9fc; /*This needs to be the same color as the editor.*/
	--CBWBC: #333;
	

  /* Syntax Highlighting Colors for Soft Mode */
  --codeGB: #f7eef3;      /* Softest blush for the block */
  --codeFC: #5d4d50;    /* Warm cocoa for general text */
  --code-keyword: #b56576; /* Muted Rose (for 'if', 'function', 'const') */
  --code-string: #6d597a;  /* Vintage Lavender (for "Hello World") */
  --code-comment: #a89a9c; /* Dusty Taupe (for // comments) */
  --code-function: #8e9aaf;/* Soft Slate Blue (for myFunction()) */

--CSSColorNames: #53EAFD;
	
	/*code-block */

	--codeFS: 14px;
	/*Line Numbers*/
	--LNBG: #dfe1e6;
	--LNC: #334882;
	--LNBC: #c7d8f2;
	--LNHover: #c5c9d4;
	
		/*CSS Syntax Highlighting*/
	--CSSColorNames: #f043ae;
	--CSSCurly: #FF637E;
	--SizeNames: #5CA5FF;
	--CSSNumeric: #ba79a1;
	--CSSComments: #99A1AF;
	--CSSQuery: rgb(255, 123, 114);
	--CSSPropertiesLayout : #02abd4;
	--CSSPropertiesColors : #FFF;
	--CSSPropertiesBackgrounds : #2C92B8;
	--CSSPropertiesVisual : #51A2FF;
    --CSSElementsW: 400;
	--CSSElementsC : #95F4E7;
	--CSSFontFamily : #FF692A;
	--CSStextalign : #FF6467;
	--CSSHash : #6792a3;
	
	
	
		/*JS Syntax Highlighting*/
--JSValueproperties: #C6D2FF;
--JSFundamentalobjects: #E1712B;
--JSInternalError: #FEE685;
--JSTextprocessing: #21BCFF;
--JSIndexedcollections: #8EC5FF;
--JSKeyedcollections: #B8DAFF;
--JSManagingmemory: #3BB8DB;
--JSControlabstractionobjects: #34A6F4;
--JSControlflow: #37738a;
--JSExpressionstatement: #36BBA7;
--JSPrimaryexpressions: #75CDE6;
--JSAlphaNumerical: #8EC5FF;
--JSConstEqual: #2E93FF;
--JSComments: #99A1AF;
--JSPeriodLeft: #0EA2C4;
--JSPeriodRight: #03708a;
--JSDoubleQuotes: #58accc;
--JSBloodhound: #CD040E;
--JSColonLeft: #14bafa;
--JSColonRight: #34c1f7;
--JSSQLine: #90A1B9;
--JSParentheses: #055a7a;
/*====================yntax Highlighter====================*/	
	
	
	
/*====================yntax Highlighter====================*/	 
}