@limpiolux/ui-styles 1.0.7 → 1.0.9

package/components.css

@@ -95,7 +95,11 @@
     overflow: hidden;
   }
 
-  .glass-panel {
+  .glass-panel,
+  .auth-hero-panel,
+  .portal-panel,
+  .portal-header-panel,
+  .portal-card {
     @apply rounded-[28px] border border-white/10 bg-white/[0.045] shadow-2xl shadow-black/30 backdrop-blur-xl;
     transition:
       background-color 420ms ease,
@@ -112,8 +116,28 @@
     @apply inline-flex h-14 items-center justify-center rounded-[20px] border border-white/10 bg-white/5 px-4;
   }
 
+  .portal-shell {
+    @apply min-h-screen px-4 py-6 md:px-8 md:py-8;
+    background-image:
+      radial-gradient(circle at top left, rgba(59, 130, 246, 0.22), transparent 28%),
+      radial-gradient(circle at top right, rgba(16, 185, 129, 0.16), transparent 24%),
+      linear-gradient(180deg, rgba(9, 9, 11, 0.95), rgba(9, 9, 11, 1));
+    transition:
+      background-color 420ms ease,
+      color 420ms ease,
+      background-image 420ms ease;
+  }
+
+  .portal-grid {
+    @apply grid gap-4 md:grid-cols-2 xl:grid-cols-3;
+  }
+
+  .portal-app-card {
+    @apply rounded-[28px] border border-white/10 bg-white/[0.045] shadow-2xl shadow-black/30 backdrop-blur-xl relative overflow-hidden p-5 transition duration-300;
+  }
+
   .auth-hero-panel {
-    @apply glass-panel relative overflow-hidden p-8 md:p-10;
+    @apply relative overflow-hidden p-8 md:p-10;
   }
 
   .auth-hero-backdrop {
@@ -439,11 +463,11 @@
   /* ── Portal surfaces ── */
 
   .portal-panel {
-    @apply glass-panel p-5;
+    @apply p-5;
   }
 
   .portal-header-panel {
-    @apply glass-panel flex flex-col gap-4 p-6 md:flex-row md:items-end md:justify-between;
+    @apply flex flex-col gap-4 p-6 md:flex-row md:items-end md:justify-between;
   }
 
   .portal-stat-card {
@@ -453,7 +477,7 @@
   }
 
   .portal-card {
-    @apply glass-panel relative overflow-hidden p-5 transition duration-300;
+    @apply relative overflow-hidden p-5 transition duration-300;
   }
 
   .portal-card:hover {

package/light.css

@@ -35,6 +35,13 @@
   box-shadow: 0 20px 36px -30px rgba(15, 23, 42, 0.18);
 }
 
+.light .portal-shell {
+  background-image:
+    radial-gradient(circle at top left, rgba(59, 130, 246, 0.14), transparent 28%),
+    radial-gradient(circle at top right, rgba(16, 185, 129, 0.12), transparent 24%),
+    linear-gradient(180deg, rgba(250, 250, 250, 0.96), rgba(244, 244, 245, 1));
+}
+
 .light .auth-hero-backdrop {
   background: radial-gradient(circle at top left, rgba(255, 255, 255, 0.82), transparent 36%);
 }
@@ -109,6 +116,13 @@
   color: #18181b;
 }
 
+.light .btn-primary,
+.light .btn-primary:hover,
+.light .brand-fab,
+.light .brand-fab:hover {
+  color: #ffffff;
+}
+
 .light .accent-amber-text {
   color: #a16207;
 }
@@ -245,6 +259,10 @@
   color: #ffffff;
 }
 
+.light .soft-tab-active .soft-tab-label {
+  color: #ffffff;
+}
+
 .light .soft-tab-track {
   border-color: rgba(212, 212, 216, 0.95);
   background:
@@ -691,6 +709,10 @@
   color: rgb(var(--color-zinc-300)) !important;
 }
 
+.light {
+  --legacy-white-foreground: rgb(var(--color-zinc-200));
+}
+
 .light .text-muted {
   color: rgb(var(--color-zinc-500)) !important;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@limpiolux/ui-styles",
-  "version": "1.0.7",
+  "version": "1.0.9",
   "description": "Shared design system — Limpiolux liquid glass theme with auth, portal and dark/light mode support",
   "type": "module",
   "exports": {

package/utilities.css

@@ -45,7 +45,7 @@
 }
 
 .text-white {
-  color: #fff !important;
+  color: var(--legacy-white-foreground, #fff) !important;
 }
 
 .text-muted {