ultimate-jekyll-manager 1.0.6 → 1.0.8

package/CHANGELOG.md

@@ -15,6 +15,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 - `Security` in case of vulnerabilities.
 
 ---
+## [1.0.7] - 2026-03-20
+### Changed
+- Upgrade `web-manager` from ^4.1.29 to ^4.1.30
+
 ## [1.0.3] - 2026-03-16
 ### Added
 - Ensure consuming projects have `"private": true` in package.json during setup to prevent accidental npm publishes

package/dist/assets/css/bundles/umbra.scss

@@ -0,0 +1,5 @@
+// Import Ultimate Jekyll Manager
+@use 'ultimate-jekyll-manager' as *;
+
+// Custom styles
+// ...

package/dist/assets/js/libs/authorized-fetch.js

@@ -20,20 +20,19 @@ export async function authorizedFetch(url, options = {}) {
   const user = auth.currentUser;
 
   if (!user) {
-    console.warn('Did we fully wait for auth state to be determined?');
-    throw new Error('No authenticated user found');
+    console.warn('authorizedFetch: No authenticated user found. Did we fully wait for auth state to be determined?');
   }
 
-  // Get the ID token - let it throw if it fails
-  const idToken = await user.getIdToken(true);
-
   // Ensure headers object exists
   if (!requestOptions.headers) {
     requestOptions.headers = {};
   }
 
-  // Set the Authorization header with Bearer token
-  requestOptions.headers['Authorization'] = `Bearer ${idToken}`;
+  // Set the Authorization header with Bearer token if user is logged in
+  if (user) {
+    const idToken = await user.getIdToken(true);
+    requestOptions.headers['Authorization'] = `Bearer ${idToken}`;
+  }
 
   // Make the request using wonderful-fetch
   return fetch(url, requestOptions);

package/dist/assets/themes/{elegant → umbra}/README.md

@@ -1,22 +1,22 @@
-# elegant Theme Customization Guide
+# Umbra Theme Customization Guide
 
 ## How to Customize in Your Consuming Project
 
-The elegant theme is designed to be fully customizable. All theme variables use `!default` which means you can override them BEFORE importing the theme.
+The Umbra theme is designed to be fully customizable. All theme variables use `!default` which means you can override them BEFORE importing the theme.
 
 ### Example: Customizing Colors in Your Project
 
 In your consuming project's `src/assets/css/main.scss`:
 
 ```scss
-// 1. Override elegant theme variables BEFORE importing the theme
+// 1. Override Umbra theme variables BEFORE importing the theme
 $primary: #FF0000;  // Change primary color to red
-$elegant-bg-light: #F5F5F5;  // Change light mode background
-$elegant-bg-dark: #1A1A1A;  // Change dark mode background
+$umbra-bg-light: #F5F5F5;  // Change light mode background
+$umbra-bg-dark: #1A1A1A;  // Change dark mode background
 $font-family-sans-serif: 'Inter', sans-serif;  // Change font
 
-// 2. Now import the elegant theme - it will use YOUR values
-@import '~ultimate-jekyll-manager/src/assets/themes/elegant/theme';
+// 2. Now import the Umbra theme - it will use YOUR values
+@import '~ultimate-jekyll-manager/src/assets/themes/umbra/theme';
 
 // 3. Add your custom styles below
 .my-custom-class {
@@ -35,8 +35,8 @@ See `_config.scss` for the full list of variables you can override:
 - `$light`, `$dark` - Light and dark variants
 
 ### Background Colors
-- `$elegant-bg-light` - Light mode background
-- `$elegant-bg-dark` - Dark mode background
+- `$umbra-bg-light` - Light mode background
+- `$umbra-bg-dark` - Dark mode background
 
 ### Typography
 - `$font-family-sans-serif` - Main font family
@@ -47,12 +47,12 @@ See `_config.scss` for the full list of variables you can override:
 - `$border-radius-sm`, `$border-radius-lg` - Size variants
 
 ### Gradients
-- `$elegant-gradient-primary`, `$elegant-gradient-aurora`, etc.
+- `$umbra-gradient-primary`, `$umbra-gradient-aurora`, etc.
 
 ## File Structure
 
 ```
-elegant/
+umbra/
 ├── _config.scss       ← All customizable variables with !default
 ├── _theme.scss        ← Main entry point, imports config then Bootstrap
 ├── css/base/

package/dist/assets/themes/umbra/_config.scss

@@ -0,0 +1,187 @@
+// Umbra Theme Configuration
+// ALL customizable variables are defined here with !default
+// Consuming projects can override any of these using @use ... with ()
+
+// ============================================
+// Bootstrap Color Overrides
+// ============================================
+$primary: #E2725B !default;      // Terracotta
+$secondary: #8B7A75 !default;    // Warm Gray
+$success: #2A9D8F !default;
+$info: #E9C46A !default;         // Soft Gold
+$warning: #F4A261 !default;
+$danger: #E76F51 !default;
+$light: #FDFBF7 !default;        // Warm Cream
+$dark: #1E1A18 !default;         // Warm Charcoal
+
+// ============================================
+// Typography
+// ============================================
+$font-family-sans-serif: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !default;
+$headings-font-weight: 600 !default;
+$umbra-font-mono: monospace !default;
+$umbra-font-accent: 'Figtree', sans-serif !default;
+
+// ============================================
+// Border Radius
+// ============================================
+$border-radius: 0.5rem !default;
+$border-radius-sm: 0.375rem !default;
+$border-radius-lg: 0.75rem !default;
+$border-radius-xl: 1rem !default;
+$border-radius-2xl: 1.5rem !default;
+$border-radius-pill: 50rem !default;
+
+// Umbra-specific border radius aliases
+$umbra-radius-sm: $border-radius-sm !default;
+$umbra-radius-md: $border-radius !default;
+$umbra-radius-lg: $border-radius-lg !default;
+$umbra-radius-xl: $border-radius-xl !default;
+$umbra-radius-2xl: $border-radius-2xl !default;
+$umbra-radius-full: 9999px !default;
+
+// ============================================
+// Background Colors (Light Mode)
+// ============================================
+$umbra-bg-light: #FDFBF7 !default;              // Main body background (warm cream)
+$umbra-bg-light-secondary: #F5F2EC !default;    // Secondary backgrounds
+$umbra-bg-light-tertiary: #EBE5DB !default;     // Tertiary backgrounds
+
+// ============================================
+// Background Colors (Dark Mode)
+// ============================================
+$umbra-bg-dark: #1E1A18 !default;               // Main body background (warm charcoal)
+$umbra-bg-dark-secondary: #2A2421 !default;     // Secondary backgrounds
+$umbra-bg-dark-tertiary: #372F2B !default;      // Tertiary backgrounds
+
+// ============================================
+// Umbra-Specific Colors
+// ============================================
+$umbra-primary: $primary !default;
+$umbra-primary-dark: darken($primary, 10%) !default;
+$umbra-primary-light: lighten($primary, 10%) !default;
+$umbra-primary-soft: mix($primary, white, 10%) !default;
+
+$umbra-secondary: $secondary !default;
+$umbra-secondary-dark: darken($secondary, 5%) !default;
+$umbra-secondary-light: lighten($secondary, 5%) !default;
+
+$umbra-accent: $info !default;
+$umbra-accent-dark: darken($info, 10%) !default;
+$umbra-accent-light: lighten($info, 10%) !default;
+
+$umbra-dark: $dark !default;
+$umbra-dark-900: lighten($dark, 5%) !default;
+$umbra-dark-800: lighten($dark, 10%) !default;
+$umbra-dark-700: lighten($dark, 15%) !default;
+$umbra-dark-600: lighten($dark, 20%) !default;
+
+$umbra-gray: #6B7280 !default;
+$umbra-gray-light: #9CA3AF !default;
+$umbra-gray-lighter: #D1D5DB !default;
+$umbra-gray-lightest: #F3F4F6 !default;
+
+$umbra-white: #FFFFFF !default;
+$umbra-off-white: #FAFBFC !default;
+$umbra-cream: #FFF9F5 !default;
+
+// ============================================
+// Gradient Definitions
+// ============================================
+$umbra-gradient-primary: linear-gradient(135deg, $umbra-primary 0%, #D58C40 100%) !default;
+$umbra-gradient-dark: linear-gradient(135deg, $umbra-dark 0%, $umbra-dark-800 100%) !default;
+$umbra-gradient-light: linear-gradient(135deg, $umbra-white 0%, $umbra-off-white 100%) !default;
+$umbra-gradient-sunset: linear-gradient(135deg, #E2725B 0%, #F4A261 100%) !default;
+$umbra-gradient-aurora: linear-gradient(135deg, #E2725B 0%, #D58C40 50%, #2A9D8F 100%) !default;
+$umbra-gradient-rainbow: linear-gradient(60deg, #E2725B, #D58C40, #F4A261, #E9C46A, #2A9D8F, #8B7A75) !default;
+
+// ============================================
+// Typography Scale
+// ============================================
+$umbra-font-size-xs: 0.75rem !default;
+$umbra-font-size-sm: 0.875rem !default;
+$umbra-font-size-base: 1rem !default;
+$umbra-font-size-lg: 1.125rem !default;
+$umbra-font-size-xl: 1.25rem !default;
+$umbra-font-size-2xl: 1.5rem !default;
+$umbra-font-size-3xl: 1.875rem !default;
+$umbra-font-size-4xl: 2.25rem !default;
+$umbra-font-size-5xl: 3rem !default;
+$umbra-font-size-6xl: 3.75rem !default;
+
+// ============================================
+// Spacing Scale
+// ============================================
+$umbra-spacing-xs: 0.25rem !default;
+$umbra-spacing-sm: 0.5rem !default;
+$umbra-spacing-md: 1rem !default;
+$umbra-spacing-lg: 1.5rem !default;
+$umbra-spacing-xl: 2rem !default;
+$umbra-spacing-2xl: 3rem !default;
+$umbra-spacing-3xl: 4rem !default;
+$umbra-spacing-4xl: 6rem !default;
+
+// ============================================
+// Shadow System
+// ============================================
+$umbra-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !default;
+$umbra-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) !default;
+$umbra-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !default;
+$umbra-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !default;
+$umbra-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !default;
+$umbra-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !default;
+$umbra-shadow-glow: 0 0 40px rgba(91, 71, 251, 0.15) !default;
+
+// ============================================
+// Transition Timing
+// ============================================
+$umbra-transition-fast: all 0.15s cubic-bezier(.2,.3,0,1) !default;
+$umbra-transition-base: all 0.3s cubic-bezier(.2,.3,0,1) !default;
+$umbra-transition-slow: all 0.5s cubic-bezier(.2,.3,0,1) !default;
+$umbra-transition-bounce: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55) !default;
+
+// ============================================
+// Responsive Breakpoints
+// ============================================
+// Bootstrap-compatible breakpoint values
+$umbra-breakpoint-sm: 576px !default;
+$umbra-breakpoint-md: 768px !default;
+$umbra-breakpoint-lg: 992px !default;
+$umbra-breakpoint-xl: 1200px !default;
+$umbra-breakpoint-xxl: 1400px !default;
+
+// ============================================
+// Component Sizing
+// ============================================
+// Avatar sizes map
+$avatar-sizes: (
+  null: 3rem,    // default
+  2xs: 0.5rem,
+  xs: 1.5rem,
+  sm: 2rem,
+  md: 2.5rem,
+  lg: 3.5rem,
+  xl: 5rem,
+  2xl: 7.5rem,
+  3xl: 10rem,
+  4xl: 12.5rem,
+  5xl: 15rem
+) !default;
+
+// Forward Bootstrap with our configuration
+@forward '../bootstrap/scss/bootstrap.scss' with (
+  $primary: $primary,
+  $secondary: $secondary,
+  $success: $success,
+  $info: $info,
+  $warning: $warning,
+  $danger: $danger,
+  $light: $light,
+  $dark: $dark,
+  $font-family-sans-serif: $font-family-sans-serif,
+  $headings-font-weight: $headings-font-weight,
+  $border-radius: $border-radius,
+  $border-radius-sm: $border-radius-sm,
+  $border-radius-lg: $border-radius-lg,
+  $enable-negative-margins: true
+);

package/dist/assets/themes/{elegant → umbra}/_theme.js

@@ -9,7 +9,7 @@ window.bootstrap = bootstrap;
 // Log that we've MADE IT
 /* @dev-only:start */
 {
-  console.log('elegant theme loaded successfully (assets/themes/elegant/_theme.js)');
+  console.log('Umbra theme loaded successfully (assets/themes/umbra/_theme.js)');
 }
 /* @dev-only:end */
 
@@ -24,7 +24,7 @@ import initHeroDemoForm from './js/hero-demo-form.js';
 
 // Initialize theme components when DOM is ready
 domReady().then(() => {
-  // elegant Theme Initializations
+  // Umbra Theme Initializations
   setupNavbarScroll();
   setupInfiniteScroll();
 

package/dist/assets/themes/{elegant → umbra}/css/base/_animations.scss

@@ -1,4 +1,4 @@
-// elegant Animation Utilities
+// Umbra Animation Utilities
 // Keyframes and animation classes for dynamic effects
 
 // ============================================

package/dist/assets/themes/{elegant → umbra}/css/base/_backgrounds.scss

@@ -1,36 +1,36 @@
-// elegant Background Utilities
+// Umbra Background Utilities
 // Background gradients, patterns, and visual effects
 
 // ============================================
 // Gradient Backgrounds
 // ============================================
 .bg-gradient-primary {
-  background-image: $elegant-gradient-primary !important;
+  background-image: $umbra-gradient-primary !important;
   background-size: 300% 300% !important;
 }
 
 .bg-gradient-dark {
-  background-image: $elegant-gradient-dark !important;
+  background-image: $umbra-gradient-dark !important;
   background-size: 300% 300% !important;
 }
 
 .bg-gradient-light {
-  background-image: $elegant-gradient-light !important;
+  background-image: $umbra-gradient-light !important;
   background-size: 300% 300% !important;
 }
 
 .bg-gradient-sunset {
-  background-image: $elegant-gradient-sunset !important;
+  background-image: $umbra-gradient-sunset !important;
   background-size: 300% 300% !important;
 }
 
 .bg-gradient-aurora {
-  background-image: $elegant-gradient-aurora !important;
+  background-image: $umbra-gradient-aurora !important;
   background-size: 300% 300% !important;
 }
 
 .bg-gradient-rainbow {
-  background-image: $elegant-gradient-rainbow !important;
+  background-image: $umbra-gradient-rainbow !important;
   background-size: 300% 300% !important;
 }
 

package/dist/assets/themes/{elegant → umbra}/css/base/_borders.scss

@@ -1,15 +1,15 @@
-// elegant Border Utilities
+// Umbra Border Utilities
 // Border styles, gradients, and decorative dividers
 
 // ============================================
 // Border Radius
 // ============================================
-.rounded-sm { border-radius: $elegant-radius-sm !important; }
-.rounded-md { border-radius: $elegant-radius-md !important; }
-.rounded-lg { border-radius: $elegant-radius-lg !important; }
-.rounded-xl { border-radius: $elegant-radius-xl !important; }
-.rounded-2xl { border-radius: $elegant-radius-2xl !important; }
-.rounded-full { border-radius: $elegant-radius-full !important; }
+.rounded-sm { border-radius: $umbra-radius-sm !important; }
+.rounded-md { border-radius: $umbra-radius-md !important; }
+.rounded-lg { border-radius: $umbra-radius-lg !important; }
+.rounded-xl { border-radius: $umbra-radius-xl !important; }
+.rounded-2xl { border-radius: $umbra-radius-2xl !important; }
+.rounded-full { border-radius: $umbra-radius-full !important; }
 
 // ============================================
 // Gradient Borders
@@ -24,7 +24,7 @@
     position: absolute;
     inset: calc(var(--bs-border-width) * -1);
     border-radius: inherit;
-    background: $elegant-gradient-rainbow;
+    background: $umbra-gradient-rainbow;
     background-size: 300% 300%;
     z-index: -1;
   }
@@ -52,14 +52,14 @@
 // ============================================
 .divider {
   height: 1px;
-  background: $elegant-gray-lighter;
-  margin: $elegant-spacing-2xl 0;
+  background: $umbra-gray-lighter;
+  margin: $umbra-spacing-2xl 0;
 
   &.divider-gradient {
-    background: $elegant-gradient-primary;
+    background: $umbra-gradient-primary;
   }
 
   &.divider-fade {
-    background: linear-gradient(to right, transparent, $elegant-gray-lighter 20%, $elegant-gray-lighter 80%, transparent);
+    background: linear-gradient(to right, transparent, $umbra-gray-lighter 20%, $umbra-gray-lighter 80%, transparent);
   }
 }

package/dist/assets/themes/umbra/css/base/_root.scss

@@ -0,0 +1,68 @@
+// Umbra Theme CSS Custom Properties
+// Converts SCSS variables to CSS custom properties for runtime theming
+// These override Bootstrap's CSS variables and allow dynamic theme switching
+
+// ============================================
+// Light Mode (Default)
+// ============================================
+:root,
+[data-bs-theme="light"] {
+  // Background colors
+  --bs-body-bg: #{$umbra-bg-light};
+  --bs-body-bg-rgb: #{red($umbra-bg-light)}, #{green($umbra-bg-light)}, #{blue($umbra-bg-light)};
+
+  --bs-secondary-bg: #{$umbra-bg-light-secondary};
+  --bs-secondary-bg-rgb: #{red($umbra-bg-light-secondary)}, #{green($umbra-bg-light-secondary)}, #{blue($umbra-bg-light-secondary)};
+
+  --bs-tertiary-bg: #{$umbra-bg-light-tertiary};
+  --bs-tertiary-bg-rgb: #{red($umbra-bg-light-tertiary)}, #{green($umbra-bg-light-tertiary)}, #{blue($umbra-bg-light-tertiary)};
+
+  // Add subtle warmth to borders 
+  --bs-border-color: rgba(139, 122, 117, 0.15);
+  --bs-border-color-translucent: rgba(139, 122, 117, 0.1);
+
+
+  // Component backgrounds - use secondary bg for elevated surfaces
+  // --bs-card-bg: #{$umbra-bg-light-secondary};
+  // --bs-dropdown-bg: #{$umbra-bg-light-secondary};
+  // --bs-modal-bg: #{$umbra-bg-light-secondary};
+  // --bs-popover-bg: #{$umbra-bg-light-secondary};
+  // --bs-offcanvas-bg: #{$umbra-bg-light-secondary};
+  // --bs-accordion-bg: #{$umbra-bg-light-secondary};
+
+  // Add more Bootstrap overrides here as needed
+  // Examples:
+  // --bs-body-color: #212529;
+  // --bs-border-color: #dee2e6;
+  // --bs-link-color: #{$primary};
+}
+
+// ============================================
+// Dark Mode
+// ============================================
+[data-bs-theme="dark"] {
+  // Background colors
+  --bs-body-bg: #{$umbra-bg-dark};
+  --bs-body-bg-rgb: #{red($umbra-bg-dark)}, #{green($umbra-bg-dark)}, #{blue($umbra-bg-dark)};
+
+  --bs-secondary-bg: #{$umbra-bg-dark-secondary};
+  --bs-secondary-bg-rgb: #{red($umbra-bg-dark-secondary)}, #{green($umbra-bg-dark-secondary)}, #{blue($umbra-bg-dark-secondary)};
+
+  --bs-tertiary-bg: #{$umbra-bg-dark-tertiary};
+  --bs-tertiary-bg-rgb: #{red($umbra-bg-dark-tertiary)}, #{green($umbra-bg-dark-tertiary)}, #{blue($umbra-bg-dark-tertiary)};
+
+  // Add subtle warmth to borders for dark mode
+  --bs-border-color: rgba(226, 114, 91, 0.15); // Terracotta tint
+  --bs-border-color-translucent: rgba(226, 114, 91, 0.1);
+  
+
+  // Component backgrounds - use secondary bg for elevated surfaces
+  // --bs-card-bg: #{$umbra-bg-dark-secondary};
+  // --bs-dropdown-bg: #{$umbra-bg-dark-secondary};
+  // --bs-modal-bg: #{$umbra-bg-dark-secondary};
+  // --bs-popover-bg: #{$umbra-bg-dark-secondary};
+  // --bs-offcanvas-bg: #{$umbra-bg-dark-secondary};
+  // --bs-accordion-bg: #{$umbra-bg-dark-secondary};
+
+  // Add more Bootstrap overrides here as needed
+}

package/dist/assets/themes/{elegant → umbra}/css/base/_typography.scss

@@ -1,4 +1,4 @@
-// elegant Typography
+// Umbra Typography
 // Modern font system with responsive headings and utilities
 
 // ============================================
@@ -6,11 +6,11 @@
 // ============================================
 :root {
   --bs-font-sans-serif: #{$font-family-sans-serif};
-  --bs-font-monospace: #{$elegant-font-mono};
+  --bs-font-monospace: #{$umbra-font-mono};
 
   // Custom CSS variables for easy access
-  --elegant-font-primary: #{$font-family-sans-serif};
-  --elegant-font-mono: #{$elegant-font-mono};
+  --umbra-font-primary: #{$font-family-sans-serif};
+  --umbra-font-mono: #{$umbra-font-mono};
 }
 
 // ============================================
@@ -18,7 +18,7 @@
 // ============================================
 body {
   font-family: $font-family-sans-serif;
-  font-size: $elegant-font-size-base;
+  font-size: $umbra-font-size-base;
   font-weight: 400;
   line-height: 1.6;
   -webkit-font-smoothing: antialiased;
@@ -42,45 +42,45 @@ h6, .h6 {
 }
 
 h1, .h1 {
-  font-size: clamp(2.5rem, 5vw, $elegant-font-size-6xl);
+  font-size: clamp(2.5rem, 5vw, $umbra-font-size-6xl);
   font-weight: 800;
   letter-spacing: -0.03em;
 
-  @media (max-width: $elegant-breakpoint-md) {
-    font-size: $elegant-font-size-4xl;
+  @media (max-width: $umbra-breakpoint-md) {
+    font-size: $umbra-font-size-4xl;
   }
 }
 
 h2, .h2 {
-  font-size: clamp(2rem, 4vw, $elegant-font-size-5xl);
+  font-size: clamp(2rem, 4vw, $umbra-font-size-5xl);
   font-weight: 700;
 
-  @media (max-width: $elegant-breakpoint-md) {
-    font-size: $elegant-font-size-3xl;
+  @media (max-width: $umbra-breakpoint-md) {
+    font-size: $umbra-font-size-3xl;
   }
 }
 
 h3, .h3 {
-  font-size: clamp(1.5rem, 3vw, $elegant-font-size-4xl);
+  font-size: clamp(1.5rem, 3vw, $umbra-font-size-4xl);
   font-weight: 600;
 
-  @media (max-width: $elegant-breakpoint-md) {
-    font-size: $elegant-font-size-2xl;
+  @media (max-width: $umbra-breakpoint-md) {
+    font-size: $umbra-font-size-2xl;
   }
 }
 
 h4, .h4 {
-  font-size: $elegant-font-size-2xl;
+  font-size: $umbra-font-size-2xl;
   font-weight: 600;
 }
 
 h5, .h5 {
-  font-size: $elegant-font-size-xl;
+  font-size: $umbra-font-size-xl;
   font-weight: 500;
 }
 
 h6, .h6 {
-  font-size: $elegant-font-size-lg;
+  font-size: $umbra-font-size-lg;
   font-weight: 500;
 }
 
@@ -105,7 +105,7 @@ h6, .h6 {
 // Lead Text
 // ============================================
 .lead {
-  font-size: $elegant-font-size-xl;
+  font-size: $umbra-font-size-xl;
   font-weight: 400;
   line-height: 1.6;
 }
@@ -114,18 +114,18 @@ h6, .h6 {
 // Code Blocks
 // ============================================
 code, kbd, pre, samp {
-  font-family: $elegant-font-mono;
+  font-family: $umbra-font-mono;
 }
 
 code {
   padding: 0.125rem 0.375rem;
   font-size: 0.875em;
-  border-radius: $elegant-radius-sm;
+  border-radius: $umbra-radius-sm;
 }
 
 pre {
-  padding: $elegant-spacing-lg;
-  border-radius: $elegant-radius-lg;
+  padding: $umbra-spacing-lg;
+  border-radius: $umbra-radius-lg;
   overflow-x: auto;
 
   code {
@@ -139,17 +139,10 @@ pre {
 // Blockquotes
 // ============================================
 blockquote {
-  padding-left: $elegant-spacing-lg;
+  padding-left: $umbra-spacing-lg;
   border-left-width: 4px;
   border-left-style: solid;
-  font-size: $elegant-font-size-lg;
+  font-size: $umbra-font-size-lg;
   font-style: italic;
 }
 
-
-// Elegant Theme Heading Overrides
-h1, h2, h3, .h1, .h2, .h3 {
-  font-family: $elegant-font-accent !important;
-  font-weight: 500;
-  letter-spacing: -0.02em;
-}

package/dist/assets/themes/umbra/css/base/_utilities.scss

@@ -0,0 +1,15 @@
+// Umbra Utility Classes
+// Custom helper classes and theme-specific utilities
+
+// ============================================
+// Shadow Utilities (Umbra-specific)
+// ============================================
+.shadow-xs { box-shadow: $umbra-shadow-xs !important; }
+.shadow-sm { box-shadow: $umbra-shadow-sm !important; }
+.shadow-md { box-shadow: $umbra-shadow-md !important; }
+.shadow-lg { box-shadow: $umbra-shadow-lg !important; }
+.shadow-xl { box-shadow: $umbra-shadow-xl !important; }
+.shadow-2xl { box-shadow: $umbra-shadow-2xl !important; }
+.shadow-glow { box-shadow: $umbra-shadow-glow !important; }
+.shadow-none { box-shadow: none !important; }
+

package/dist/assets/themes/{elegant → umbra}/css/components/_accordion.scss

@@ -1,4 +1,4 @@
-// elegant Theme Accordion Component
+// Umbra Theme Accordion Component
 // SVG plus/minus icons using Bootstrap's official approach
 
 // ============================================

package/dist/assets/themes/{elegant → umbra}/css/components/_badges.scss

@@ -1,15 +1,15 @@
-// elegant Badge Components
+// Umbra Badge Components
 // Badges and labels that can extend outside their containers
 
 // ============================================
 // Badge Soft Colors & Gradient
 // ============================================
 .badge-gradient {
-  background: $elegant-gradient-primary;
+  background: $umbra-gradient-primary;
 }
 
 .badge-soft-primary {
-  background: $elegant-primary-soft;
+  background: $umbra-primary-soft;
 }
 
 // Global fix - any element containing a badge should not clip