:root {
--bg: #0f172a;                 /* deep navy */

--text: #161616;               /* soft white */
--title: #ce3434;
--subtitle: #e1dcb5;
--muted: #707070;              /* desaturated seafoam */

--primary:	#f5d4ff00;
--secondary: #ff7337;          /* ocean blue */
--accent: #ff974d;             /* coral highlight */
--accent: #843672;             /* coral highlight */

--border-color: rgba(255, 36, 36, 0.4); /* gentle outline */
--border: 0.25px solid var(--border-color);
--shadow-color: rgba(120, 114, 31, 0.08);
--shadow: 16px 48px var(--shadow-color);

/* --surface: 	linear-gradient(140deg, #ff385c, #d70466); */
--surface: 	linear-gradient(140deg, #523e4c, #826793);            /* slate blue */
--surface-secondary: linear-gradient(140deg, #1f0617, #230237);
--surface-2: linear-gradient(130deg, #1b0619, #0a0010);
--surface-3: rgba(0, 0, 0, 0.05);

--sidebar: var(--primary);             /* coral highlight */
--corner: 10px;

--header-color: #25003a;

--link-bg: linear-gradient(140deg, #ffbc6f, #d70404);
--link-color: var(--text);
--link-bg-hover: linear-gradient(140deg, #88ff38, #c204d7);
--link-color-hover: var(--text);

--chart-1: #0d0018;
--chart-2: #27140b;

--avatar-gradient: linear-gradient(135deg, #f0efff, #5e5e5e);
--gradient: radial-gradient(
	circle at 50% 105%,
	#fff455 5%,
	#ffca9e 10%,
	#ffaed6 30%,
	#ffaef3 40%,
	#4270c5 60%
);
}

[data-theme="dark"] {
--bg: #0f172a;                 /* deep navy */

--text: #e2e8f0;               /* soft white */
--title: #fff;
--subtitle: #c2bd99;
--muted: #94a3b8;              /* desaturated seafoam */

--primary:	#0d0018;
--secondary: #0ea5e9;          /* ocean blue */
--accent: #ff974d;             /* coral highlight */
--accent: #843672;             /* coral highlight */

--border-color: rgba(255, 103, 247, 0.4); /* gentle outline */
--border: 0.25px solid var(--border-color);

--shadow-color: rgba(120, 114, 31, 0.08);
--shadow-color-hover: rgba(0, 0, 0, 0.12);
--shadow: 16px 48px var(--shadow-color);
--shadow-hover: 10px 25px var(--shadow-color-hover);

/* --surface: 	linear-gradient(140deg, #ff385c, #d70466); */
--surface: 	linear-gradient(140deg, #13040e, #1c012d);            /* slate blue */
--surface-secondary: linear-gradient(140deg, #1f0617, #230237);
--surface-2: linear-gradient(130deg, #1b0619, #0a0010);
--surface-3: rgba(0, 0, 0, 0.05);

--sidebar: var(--primary);             /* coral highlight */
--corner: 10px;

--header-color: #ffebef;

--link-bg: linear-gradient(140deg, #ff385c, #d70466);
--link-color: var(--text);
--link-bg-hover: linear-gradient(140deg, #ffc338, #d76e04);
--link-color-hover: var(--text);

--avatar-gradient: linear-gradient(135deg, #c33949, #d6ad64);
--gradient: radial-gradient(
	circle at 50% 105%,
	#fff455 5%,
	#773500 10%,
	#59002d 30%,
	#330017 40%,
	#0a0014 60%
);

/* These do not override with javascript computeProperties,
may need a more robust wa of using javascript to get the theme */
--chart-1: #764040;
--chart-2: #444;

--conic-gradient: conic-gradient(
    from 180deg,
    rgba(247,202,79,.85),
    rgba(231,149,94,.75),
    rgba(170,36,56,.75),
    rgba(194,19,139,.75),
    rgba(247,202,79,.85)
  );

}

[data-theme="admin"] {
--bg: #0f172a;                 /* deep navy */

--text: #161616;               /* soft white */
--title: #ce3434;
--subtitle: #e1dcb5;
--muted: #707070;              /* desaturated seafoam */

--primary:	#f5d4ff00;
--secondary: #ff7337;          /* ocean blue */
--accent: #ff974d;             /* coral highlight */
--accent: #843672;             /* coral highlight */

--border-color: rgba(255, 36, 36, 0.4); /* gentle outline */
--border: 0.25px solid var(--border-color);
--shadow-color: rgba(120, 114, 31, 0.08);
--shadow-color-hover: rgba(0, 0, 0, 0.12);
--shadow: 16px 48px var(--shadow-color);
--shadow-hover: 10px 25px var(--shadow-color-hover);

/* --surface: 	linear-gradient(140deg, #ff385c, #d70466); */
--surface: 	linear-gradient(140deg, #523e4c, #826793);            /* slate blue */
--surface-secondary: linear-gradient(140deg, #1f0617, #230237);
--surface-2: linear-gradient(130deg, #1b0619, #0a0010);
--surface-3: rgba(0, 0, 0, 0.05);

--sidebar: var(--primary);             /* coral highlight */
--corner: 10px;

--header-color: #ffffff;

--link-bg: linear-gradient(140deg, #ffbc6f, #d70404);
--link-color: var(--text);
--link-bg-hover: linear-gradient(140deg, #88ff38, #c204d7);
--link-color-hover: var(--text);

--avatar-gradient: linear-gradient(135deg, #f0efff, #5e5e5e);
--gradient: radial-gradient(
	circle at 50% 105%,
	#fff455 5%,
	#ffca9e 10%,
	#ffaed6 30%,
	#ffaef3 40%,
	#47a2e7 60%
);
}

[data-theme="paviml"] {
--header-height: 1rem;

--bg: #004261;                 /* deep navy */

--text: #b5f0ff;               /* soft white */
--color: var(--text);
--title: #6af3ff;
--subtitle: #c2bd99;
--muted: #94a3b8;              /* desaturated seafoam */
--muted-blue: #124062;

--primary:	#011829;
--primary-2: #00101c;
--primary-frost: #0879b23f;
--inspector: var(--primary);
--secondary: #0e69e9;          /* ocean blue */
--accent: #ff974d;             /* coral highlight */
--accent: #843672;             /* coral highlight */

--highlight: var(--secondary);
--hover: var(--highlight);
--focus: var(--muted-blue);

--border-color: rgba(103, 220, 255, 0.4); /* gentle outline */
--border: 0.25px solid var(--border-color);

--shadow-color: rgba(120, 114, 31, 0.08);
--shadow-color-hover: rgba(0, 0, 0, 0.12);
--shadow: 16px 48px var(--shadow-color);
--shadow-hover: 10px 25px var(--shadow-color-hover);

/* --surface: 	linear-gradient(140deg, #ff385c, #d70466); */
--surface: 	linear-gradient(140deg, #13040e, #1c012d);            /* slate blue */
--surface-secondary: linear-gradient(140deg, #1f0617, #230237);
--surface-2: linear-gradient(130deg, #1b0619, #0a0010);
--surface-3: rgba(0, 0, 0, 0.05);

--sidebar: var(--primary);             /* coral highlight */
--corner: 10px;

--header-color: #ffebef;

--link-bg: linear-gradient(140deg, #ff385c, #d70466);
--link-color: var(--text);
--link-bg-hover: linear-gradient(140deg, #ffc338, #d76e04);
--link-color-hover: var(--text);

--avatar-gradient: linear-gradient(135deg, #c33949, #d6ad64);
--gradient: radial-gradient(
	circle at 50% 105%,
	#55f9ff 5%,
	#006b77 10%,
	#003759 30%,
	#001d33 40%,
	#000514 60%
);

--conic-gradient: conic-gradient(
    from 180deg,
	#55f9ff 5%,
	#006b77 10%,
	#003759 30%,
	#001d33 40%,
	#000514 60%
  );

/* These do not override with javascript computeProperties,
may need a more robust wa of using javascript to get the theme */
--chart-1: #764040;
--chart-2: #444;

}


/** Other Gradients */

/** 

--gradient: linear-gradient(
	180deg,
	#020a14, 
	#07182d,
	/* #23345d,
	/* #829040, 
	#280b37, 
	#280b37,  
	#280b37,  

	#420a1f,   
	#564a16   
);
--gradient: radial-gradient(
	circle at 50% 150%,
	rgba(255, 120, 60, 0.8) 0%,
	rgba(255, 80, 120, 0.6) 20%,
	rgba(100, 50, 150, 0.6) 50%,
	rgba(30, 30, 70, 0.9) 60%,
	rgba(10, 10, 30, 1) 100%
);
--gradient: radial-gradient(
	circle at 50% 150%,
	rgba(255, 113, 91, 0.8) 0%,
	rgba(46, 196, 182, 0.3) 50%,
	rgba(16, 37, 66, 1) 100%
);
--gradient: radial-gradient(
	circle at 50% 150%,
	#4F4D9D,
	#5C5BA5,
	#917ADB,
	#AB85DC,
	#DF8ADD
);
--gradient: radial-gradient(
	circle at 50% 90%,
	#FFD500 0%,
	#FF7300 15%,
	#FF003C 30%,
	#9E0047 60%,
	#4D0099 100%
);

*/