:root {
	/* --- LIGHT THEME (Default) --- */
	--primary-default: var(--transgid-500);
	--primary-hover: var(--transgid-600);
	--primary-active: var(--transgid-700);
	--primary-disabled: var(--transgid-200);

	--secondary-default: var(--transgid-150);
	--secondary-hover: var(--transgid-200);
	--secondary-active: var(--transgid-300);
	--secondary-disabled: var(--transgid-50);

	--tertiary-default: var(--neutral-100);
	--tertiary-hover: var(--neutral-900);
	--tertiary-active: var(--neutral-800);
	--tertiary-disabled: var(--neutral-50);

	--text-primary-default: var(--transgid-800);
	--text-primary-hover: var(--transgid-900);
	--text-primary-active: var(--transgid-950);
	--text-primary-disabled: var(--transgid-700);

	--text-secondary-default: var(--transgid-200);
	--text-secondary-hover: var(--transgid-300);
	--text-secondary-active: var(--transgid-400);

	--text-link-default: var(--transgid-500);
	--text-link-hover: var(--transgid-600);
	--text-link-active: var(--transgid-650);

	--text-body-white: var(--white);
	--text-body-005: var(--neutral-50);
	--text-body-01: var(--neutral-100);
	--text-body-02: var(--neutral-200);
	--text-body-03: var(--neutral-300);
	--text-body-05: var(--neutral-500);
	--text-body-06: var(--neutral-600);
	--text-body-07: var(--neutral-700);
	--text-body-08: var(--neutral-800);
	--text-body-09: var(--neutral-900);
	--text-body-095: var(--neutral-950);

	--dark-default: var(--neutral-900);
	--dark-hover: var(--neutral-850);
	--dark-active: var(--neutral-800);

	--success-text: var(--green-700);
	--success-bg: var(--green-500);
	--success-ghost-bg: var(--green-50);

	--warning-text: var(--warning-800);
	--warning-bg: var(--warning-500);
	--warning-ghost-bg: var(--warning-50);

	--error-text: var(--red-600);
	--error-bg: var(--red-500);
	--error-ghost-bg: var(--red-50);

	--text-light-success: var(--green-400);
	--text-light-warning: var(--yellow-400);
	--text-light-error: var(--red-400);
	--text-success: var(--green-700);
	--text-warning: var(--yellow-700);
	--text-error: var(--red-700);

	--border-extra-light: var(--neutral-50);
	--border-light: var(--neutral-300);
	--border-dark: var(--neutral-900);

	--bg-surface-white: var(--white);
	--bg-surface-black: var(--black);

	--bg-primary: var(--blue-50);
	--bg-surface-005: var(--marine-50);
	--bg-surface-01: var(--marine-100);
	--bg-surface-02: var(--marine-200);
	--bg-surface-03: var(--marine-300);
	--bg-surface-04: var(--marine-400);
	--bg-surface-07: var(--marine-700);
	--bg-surface-08: var(--marine-800);
	--bg-surface-09: var(--marine-900);

	/* --- Surfaces (aliases) --- */
	--surface-0: var(--bg-primary);
	--surface-1: var(--bg-surface-white);
	--surface-2: var(--bg-surface-005);
	--surface-inset: var(--bg-surface-01);

	--bg-success: var(--green-700);
	--bg-success-ghost: var(--green-50);
	--bg-warning: var(--yellow-700);
	--bg-warning-ghost: var(--yellow-50);
	--bg-error: var(--red-700);
	--bg-error-ghost: var(--red-50);

	/* --- Borders (aliases) --- */
	--border-subtle: var(--border-extra-light);
	--border-default: var(--border-light);
	--border-strong: var(--border-dark);

	/* --- Brand accents --- */
	--accent-marker: var(--primary-default);

	--shadow-card: 0 4px 20px rgba(0, 0, 0, .04);
	--shadow-hover: 0 12px 32px rgba(0, 0, 0, .08);
	--shadow-header: 0 4px 20px rgba(0, 0, 0, .07);

	--bg-header-glass: rgba(255, 255, 255, .75);
	
	--scrollbar-track: var(--bg-surface-03);
	--scrollbar-thumb: var(--bg-surface-06);

    --icon-filter: none;

    /* Semantic Gradients */
    --gradient-heading-start: var(--text-primary-default);
    --gradient-heading-end: #01c09e;
}

/* --- DARK THEME OVERRIDES --- */
:root[data-theme="dark"] {
	--primary-default: var(--transgid-400);
	--primary-hover: var(--transgid-500);
	--primary-active: var(--transgid-600);
    
	--secondary-default: var(--transgid-800);
	--secondary-hover: var(--transgid-700);

    --tertiary-default: var(--bg-surface-04);
	--tertiary-hover: var(--neutral-200);
	--tertiary-active: var(--neutral-300);
	--tertiary-disabled: var(--bg-surface-01);
	
	--text-body-01: var(--neutral-900);
	--text-body-02: var(--neutral-800);
	--text-body-03: var(--neutral-600);
	--text-body-05: var(--neutral-500);
	--text-body-06: var(--neutral-400);
	--text-body-07: var(--neutral-300);
	--text-body-08: var(--neutral-200);
	--text-body-09: var(--neutral-100);
	--text-body-095: var(--neutral-50);

	--dark-default: var(--neutral-100); 
	--dark-hover: var(--neutral-200);
	--dark-active: var(--neutral-300);

	--border-extra-light: var(--marine-850);
	--border-light: var(--marine-700);
	--border-dark: var(--marine-500);

    --bg-primary: var(--marine-950);
	--bg-surface-white: var(--marine-900);
	--bg-surface-black: var(--white);

	--bg-surface-005: var(--marine-900);
	--bg-surface-01: var(--marine-850);
	--bg-surface-02: var(--marine-800);
	--bg-surface-03: var(--marine-700);
	--bg-surface-04: var(--marine-600);

	/* --- Surfaces (aliases) --- */
	--surface-0: var(--bg-primary);
	--surface-1: var(--bg-surface-white);
	--surface-2: var(--bg-surface-01);
	--surface-inset: var(--bg-surface-02);

	--shadow-card: 0 4px 20px rgba(0, 0, 0, .5);
	--shadow-hover: 0 12px 32px rgba(0, 0, 0, .7);
	--shadow-header: 0 4px 20px rgba(0, 0, 0, .5);

	/* --- Borders (aliases) --- */
	--border-subtle: var(--border-extra-light);
	--border-default: var(--border-light);
	--border-strong: var(--border-dark);

	/* --- Brand accents --- */
	--accent-marker: var(--primary-default);

	--bg-header-glass: rgba(14, 20, 25, .85);
    
    --scrollbar-track: var(--marine-900);
    --scrollbar-thumb: var(--marine-600);

    --icon-filter: invert(1) hue-rotate(180deg);

    /* Semantic Gradients Overrides */
    --gradient-heading-start: var(--transgid-300);
}