@solidxai/core-ui 0.1.8-beta.9 → 0.1.9-alpha.0

package/dist/resources/shadcn-base.css

@@ -846,13 +846,16 @@ body {
 
 .solid-toast-viewport {
   position: fixed;
-  top: 18px;
-  right: 18px;
+  top: 10px;
+  left: 50%;
+  transform: translateX(-50%);
   z-index: calc(var(--z-overlay) + 6);
   display: flex;
   flex-direction: column;
+  align-items: center;
   gap: 10px;
-  width: min(360px, calc(100vw - 24px));
+  width: calc(100vw - 24px);
+  max-width: 100%;
   pointer-events: none;
 }
 
@@ -860,7 +863,7 @@ body {
   display: flex;
   align-items: flex-start;
   gap: 10px;
-  width: 100%;
+  width: min(420px, 100%);
   padding: 12px;
   border-radius: 14px;
   border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
@@ -1351,6 +1354,7 @@ body {
 .solid-autocomplete {
   position: relative;
   width: 100%;
+  min-width: 0;
 }
 
 .solid-autocomplete-control {
@@ -1358,6 +1362,7 @@ body {
   display: flex;
   align-items: center;
   width: 100%;
+  min-width: 0;
 }
 
 .solid-autocomplete-chip-control {
@@ -1385,6 +1390,8 @@ body {
   min-height: 24px;
   height: 24px;
   flex: 1 1 110px;
+  min-width: 0;
+  max-width: 100%;
   padding: 0 4px;
 }
 
@@ -1458,6 +1465,8 @@ body {
   align-items: center;
   gap: 4px;
   min-height: 22px;
+  min-width: 0;
+  max-width: 100%;
   border-radius: 999px;
   border: 1px solid color-mix(in srgb, var(--primary) 24%, transparent);
   background: color-mix(in srgb, var(--primary) 10%, transparent);
@@ -1467,6 +1476,8 @@ body {
 }
 
 .solid-autocomplete-chip-label {
+  min-width: 0;
+  max-width: 100%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -1843,7 +1854,10 @@ body {
   gap: 8px;
   font-size: 13px;
   font-weight: 500;
-  transition: box-shadow 120ms ease, border-color 120ms ease, background 120ms ease;
+  transition:
+    box-shadow 120ms ease,
+    border-color 120ms ease,
+    background 120ms ease;
 }
 
 .google-auth-button:hover {
@@ -1857,15 +1871,20 @@ body {
 }
 
 .solid-auth-social-grid {
-  display: grid;
-  grid-template-columns: repeat(3, minmax(0, 1fr));
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  align-items: center;
   gap: 8px;
+  width: 100%;
+  margin-inline: auto;
 }
 
 .solid-auth-social-btn.solid-btn {
-  width: 100%;
+  width: 88px;
   height: 36px;
   min-height: 36px;
+  flex: 0 0 88px;
   border-radius: 8px;
   padding: 0;
   display: inline-flex;
@@ -1955,8 +1974,8 @@ body {
     padding: 14px;
   }
 
-  .solid-auth-theme-wrapper.left>.grid,
-  .solid-auth-theme-wrapper.right>.grid {
+  .solid-auth-theme-wrapper.left > .grid,
+  .solid-auth-theme-wrapper.right > .grid {
     grid-template-columns: 1fr;
     min-height: auto;
     border-radius: 14px;
@@ -2005,8 +2024,8 @@ body {
   margin: 0 auto;
 }
 
-.solid-auth-theme-wrapper.left>.grid,
-.solid-auth-theme-wrapper.right>.grid {
+.solid-auth-theme-wrapper.left > .grid,
+.solid-auth-theme-wrapper.right > .grid {
   width: 100%;
   min-height: 100vh;
   display: grid !important;
@@ -2042,8 +2061,8 @@ body {
   background: rgba(24, 24, 27, 0.62);
 }
 
-.solid-auth-theme-wrapper.left .solid-left-layout>*,
-.solid-auth-theme-wrapper.right .solid-right-layout>* {
+.solid-auth-theme-wrapper.left .solid-left-layout > *,
+.solid-auth-theme-wrapper.right .solid-right-layout > * {
   position: relative;
   z-index: 2;
 }
@@ -2133,19 +2152,19 @@ body {
 
 .auth-submit-button.solid-btn {
   min-height: 36px;
-  background: #f4f4f5;
-  border-color: #f4f4f5;
-  color: #09090b;
+  background: var(--primary);
+  border-color: var(--primary);
+  color: var(--primary-foreground);
 }
 
 .auth-submit-button.solid-btn .solid-btn-label {
-  color: #09090b;
+  color: var(--primary-foreground);
   font-weight: 600;
 }
 
 .auth-submit-button.solid-btn:not(:disabled):hover {
-  background: #e4e4e7;
-  border-color: #e4e4e7;
+  background: color-mix(in srgb, var(--primary) 90%, black);
+  border-color: color-mix(in srgb, var(--primary) 90%, black);
 }
 
 .auth-back-button.solid-btn.solid-btn--ghost {
@@ -2175,8 +2194,8 @@ body {
 .solid-auth-brand.is-center {
   align-self: center;
 }
-.solid-auth-brand-logo img{
-  width:100%;
+.solid-auth-brand-logo img {
+  width: 100%;
   max-width: 125px;
   align-items: center;
 }
@@ -2237,8 +2256,8 @@ body {
     padding: 16px;
   }
 
-  .solid-auth-theme-wrapper.left>.grid,
-  .solid-auth-theme-wrapper.right>.grid {
+  .solid-auth-theme-wrapper.left > .grid,
+  .solid-auth-theme-wrapper.right > .grid {
     grid-template-columns: 1fr;
   }
 
@@ -2823,7 +2842,7 @@ body {
   opacity: 0.34;
 }
 
-.solid-auth-theme-wrapper>* {
+.solid-auth-theme-wrapper > *:not(.solid-toast-viewport) {
   position: relative;
   z-index: 1;
 }
@@ -3070,14 +3089,25 @@ body {
 html.dark .solid-list-page-wrapper,
 [data-theme="dark"] .solid-list-page-wrapper {
   background:
-    radial-gradient(circle at top right, color-mix(in srgb, var(--primary) 10%, transparent), transparent 26%),
-    linear-gradient(180deg, color-mix(in srgb, var(--background) 98%, #020617 2%), color-mix(in srgb, var(--background) 94%, #020617 6%)) !important;
+    radial-gradient(
+      circle at top right,
+      color-mix(in srgb, var(--primary) 10%, transparent),
+      transparent 26%
+    ),
+    linear-gradient(
+      180deg,
+      color-mix(in srgb, var(--background) 98%, #020617 2%),
+      color-mix(in srgb, var(--background) 94%, #020617 6%)
+    ) !important;
 }
 
 html.dark .solid-list-surface,
 [data-theme="dark"] .solid-list-surface {
-  background:
-    linear-gradient(180deg, color-mix(in srgb, var(--card) 96%, #0b1220 4%), color-mix(in srgb, var(--card) 90%, #020617 10%));
+  background: linear-gradient(
+    180deg,
+    color-mix(in srgb, var(--card) 96%, #0b1220 4%),
+    color-mix(in srgb, var(--card) 90%, #020617 10%)
+  );
   border-color: color-mix(in srgb, var(--border) 72%, #334155 28%);
   box-shadow:
     0 18px 40px rgba(2, 6, 23, 0.42),
@@ -3086,8 +3116,11 @@ html.dark .solid-list-surface,
 
 html.dark .solid-list-toolbar,
 [data-theme="dark"] .solid-list-toolbar {
-  background:
-    linear-gradient(180deg, color-mix(in srgb, var(--card) 94%, #172554 6%), color-mix(in srgb, var(--card) 88%, #0b1220 12%));
+  background: linear-gradient(
+    180deg,
+    color-mix(in srgb, var(--card) 94%, #172554 6%),
+    color-mix(in srgb, var(--card) 88%, #0b1220 12%)
+  );
   border-bottom-color: color-mix(in srgb, var(--border) 72%, #334155 28%);
   box-shadow:
     inset 0 -1px 0 rgba(15, 23, 42, 0.55),
@@ -3111,8 +3144,14 @@ html.dark .solid-kanban-toolbar .solid-global-search-element,
 
 html.dark .solid-list-toolbar .solid-global-search-element input::placeholder,
 html.dark .solid-kanban-toolbar .solid-global-search-element input::placeholder,
-[data-theme="dark"] .solid-list-toolbar .solid-global-search-element input::placeholder,
-[data-theme="dark"] .solid-kanban-toolbar .solid-global-search-element input::placeholder {
+[data-theme="dark"]
+  .solid-list-toolbar
+  .solid-global-search-element
+  input::placeholder,
+[data-theme="dark"]
+  .solid-kanban-toolbar
+  .solid-global-search-element
+  input::placeholder {
   color: color-mix(in srgb, var(--muted-foreground) 64%, transparent);
 }
 
@@ -3174,7 +3213,9 @@ html.dark .solid-header-cog-trigger:hover,
   font-size: 13px;
   font-weight: 500;
   cursor: pointer;
-  transition: color 0.15s ease, border-color 0.15s ease;
+  transition:
+    color 0.15s ease,
+    border-color 0.15s ease;
   outline: none;
   white-space: nowrap;
   border-radius: 0;
@@ -3261,12 +3302,12 @@ html.dark .solid-header-cog-trigger:hover,
   min-width: 0;
 }
 
-.solid-list-table-area>.solid-data-table-root {
+.solid-list-table-area > .solid-data-table-root {
   flex: 1 1 auto;
   min-height: 0;
 }
 
-.solid-tree-table-area>.solid-tree-table-root {
+.solid-tree-table-area > .solid-tree-table-root {
   flex: 1 1 auto;
   min-height: 0;
 }
@@ -3442,7 +3483,10 @@ html.dark .solid-header-cog-trigger:hover,
   font-weight: 500;
   line-height: 1;
   padding: 0 0;
-  transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
+  transition:
+    background 120ms ease,
+    border-color 120ms ease,
+    color 120ms ease;
 }
 
 .solid-paginator-btn:hover:not(:disabled) {
@@ -3463,14 +3507,20 @@ html.dark .solid-list-table-area,
 html.dark .solid-data-table-viewport,
 [data-theme="dark"] .solid-data-table-viewport {
   border-radius: 0 0 12px 12px;
-  background:
-    linear-gradient(180deg, color-mix(in srgb, var(--card) 90%, #0b1220 10%), color-mix(in srgb, var(--card) 84%, #020617 16%));
+  background: linear-gradient(
+    180deg,
+    color-mix(in srgb, var(--card) 90%, #0b1220 10%),
+    color-mix(in srgb, var(--card) 84%, #020617 16%)
+  );
 }
 
 html.dark .solid-data-table-head,
 [data-theme="dark"] .solid-data-table-head {
-  background:
-    linear-gradient(180deg, color-mix(in srgb, var(--card) 96%, #172554 4%), color-mix(in srgb, var(--card) 88%, #0b1220 12%));
+  background: linear-gradient(
+    180deg,
+    color-mix(in srgb, var(--card) 96%, #172554 4%),
+    color-mix(in srgb, var(--card) 88%, #0b1220 12%)
+  );
   backdrop-filter: blur(10px);
   box-shadow:
     inset 0 -1px 0 color-mix(in srgb, var(--border) 70%, #334155 30%),
@@ -3519,15 +3569,29 @@ html.dark .solid-data-table-row:has(input[type="checkbox"]:checked),
   box-shadow: inset 2px 0 0 color-mix(in srgb, var(--primary) 86%, white 14%);
 }
 
-html.dark .solid-datatable-wrapper td a:not(.solid-inline-row-button):not(.solid-row-menu-trigger),
-[data-theme="dark"] .solid-datatable-wrapper td a:not(.solid-inline-row-button):not(.solid-row-menu-trigger) {
+html.dark
+  .solid-datatable-wrapper
+  td
+  a:not(.solid-inline-row-button):not(.solid-row-menu-trigger),
+[data-theme="dark"]
+  .solid-datatable-wrapper
+  td
+  a:not(.solid-inline-row-button):not(.solid-row-menu-trigger) {
   color: color-mix(in srgb, var(--primary) 68%, var(--foreground) 32%);
   text-decoration: none;
-  transition: color 120ms ease, opacity 120ms ease;
-}
-
-html.dark .solid-datatable-wrapper td a:not(.solid-inline-row-button):not(.solid-row-menu-trigger):hover,
-[data-theme="dark"] .solid-datatable-wrapper td a:not(.solid-inline-row-button):not(.solid-row-menu-trigger):hover {
+  transition:
+    color 120ms ease,
+    opacity 120ms ease;
+}
+
+html.dark
+  .solid-datatable-wrapper
+  td
+  a:not(.solid-inline-row-button):not(.solid-row-menu-trigger):hover,
+[data-theme="dark"]
+  .solid-datatable-wrapper
+  td
+  a:not(.solid-inline-row-button):not(.solid-row-menu-trigger):hover {
   color: color-mix(in srgb, var(--primary) 82%, white 18%);
 }
 
@@ -3541,7 +3605,11 @@ html.dark .solid-data-table-root input[type="checkbox"],
   place-items: center;
   margin: 0;
   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
-  transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
+  transition:
+    background 120ms ease,
+    border-color 120ms ease,
+    box-shadow 120ms ease,
+    transform 120ms ease;
 }
 
 html.dark .solid-data-table-root input[type="checkbox"]::before,
@@ -3561,7 +3629,9 @@ html.dark .solid-data-table-root input[type="checkbox"]:hover,
 }
 
 html.dark .solid-data-table-root input[type="checkbox"]:focus-visible,
-[data-theme="dark"] .solid-data-table-root input[type="checkbox"]:focus-visible {
+[data-theme="dark"]
+  .solid-data-table-root
+  input[type="checkbox"]:focus-visible {
   outline: none;
   border-color: var(--primary);
   box-shadow: none !important;
@@ -3577,14 +3647,19 @@ html.dark .solid-data-table-root input[type="checkbox"]:checked,
 }
 
 html.dark .solid-data-table-root input[type="checkbox"]:checked::before,
-[data-theme="dark"] .solid-data-table-root input[type="checkbox"]:checked::before {
+[data-theme="dark"]
+  .solid-data-table-root
+  input[type="checkbox"]:checked::before {
   transform: scale(1);
 }
 
 html.dark .solid-table-paginator,
 [data-theme="dark"] .solid-table-paginator {
-  background:
-    linear-gradient(180deg, color-mix(in srgb, var(--card) 90%, #0b1220 10%), color-mix(in srgb, var(--card) 84%, #020617 16%));
+  background: linear-gradient(
+    180deg,
+    color-mix(in srgb, var(--card) 90%, #0b1220 10%),
+    color-mix(in srgb, var(--card) 84%, #020617 16%)
+  );
   border-color: color-mix(in srgb, var(--border) 72%, #334155 28%) !important;
   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
 }
@@ -3639,7 +3714,7 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   overscroll-behavior: contain;
 }
 
-.solid-tree-table-root .solid-data-table-viewport>.relative {
+.solid-tree-table-root .solid-data-table-viewport > .relative {
   min-height: 100%;
   min-width: max-content;
 }
@@ -3671,7 +3746,10 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   justify-content: center;
   border-radius: 8px;
   color: color-mix(in srgb, var(--foreground) 84%, transparent);
-  transition: background-color 120ms ease, color 120ms ease, transform 120ms ease;
+  transition:
+    background-color 120ms ease,
+    color 120ms ease,
+    transform 120ms ease;
   cursor: pointer;
 }
 
@@ -3808,7 +3886,11 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   align-items: flex-start;
   justify-content: center;
   padding-top: 1rem;
-  background: linear-gradient(to bottom, color-mix(in srgb, var(--background) 84%, transparent), transparent 35%);
+  background: linear-gradient(
+    to bottom,
+    color-mix(in srgb, var(--background) 84%, transparent),
+    transparent 35%
+  );
   pointer-events: none;
 }
 
@@ -3915,7 +3997,10 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   border: 1px solid transparent;
   background: transparent;
   color: color-mix(in srgb, var(--foreground) 76%, transparent);
-  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
+  transition:
+    background-color 120ms ease,
+    border-color 120ms ease,
+    color 120ms ease;
 }
 
 .solid-tree-row-menu-trigger:hover {
@@ -3947,7 +4032,8 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
 
 .solid-data-table-viewport {
   scrollbar-width: thin;
-  scrollbar-color: color-mix(in srgb, var(--foreground) 26%, transparent) color-mix(in srgb, var(--background) 86%, transparent);
+  scrollbar-color: color-mix(in srgb, var(--foreground) 26%, transparent)
+    color-mix(in srgb, var(--background) 86%, transparent);
 }
 
 .solid-data-table-viewport::-webkit-scrollbar {
@@ -4022,7 +4108,9 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   align-items: center;
   justify-content: center;
   cursor: pointer;
-  transition: background 120ms ease, color 120ms ease;
+  transition:
+    background 120ms ease,
+    color 120ms ease;
 }
 
 .solid-row-menu-trigger.p-button:hover,
@@ -4263,7 +4351,7 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   text-align: left;
 }
 
-.solid-dropdown-menu-item>a {
+.solid-dropdown-menu-item > a {
   display: inline-flex;
   align-items: center;
   width: 100%;
@@ -4659,7 +4747,9 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   position: absolute;
   inset: 0;
   border-radius: inherit;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), inset 0 -1px 0 rgba(0, 0, 0, 0.4);
+  box-shadow:
+    inset 0 1px 0 rgba(255, 255, 255, 0.12),
+    inset 0 -1px 0 rgba(0, 0, 0, 0.4);
   pointer-events: none;
 }
 
@@ -4694,7 +4784,9 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   align-items: center;
   justify-content: center;
   cursor: pointer;
-  transition: background 0.15s ease, color 0.15s ease;
+  transition:
+    background 0.15s ease,
+    color 0.15s ease;
   padding: 0;
 }
 
@@ -4751,7 +4843,9 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   border-radius: 10px;
   cursor: pointer;
   font-size: 13px;
-  transition: background 0.15s ease, color 0.15s ease;
+  transition:
+    background 0.15s ease,
+    color 0.15s ease;
 }
 
 .solid-studio-island-dropdown-item svg {
@@ -4934,7 +5028,10 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   background: transparent;
   color: var(--muted-foreground);
   cursor: pointer;
-  transition: background 0.15s, color 0.15s, border-color 0.15s;
+  transition:
+    background 0.15s,
+    color 0.15s,
+    border-color 0.15s;
   font-family: inherit;
   padding: 0;
 }
@@ -5061,7 +5158,10 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   cursor: pointer;
   text-align: left;
   overflow: hidden;
-  transition: border-color 0.18s, box-shadow 0.18s, transform 0.18s;
+  transition:
+    border-color 0.18s,
+    box-shadow 0.18s,
+    transform 0.18s;
   font-family: inherit;
 }
 
@@ -5132,7 +5232,9 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   font-weight: 600;
   color: var(--primary);
   opacity: 0.7;
-  transition: opacity 0.15s, gap 0.15s;
+  transition:
+    opacity 0.15s,
+    gap 0.15s;
 }
 
 .solid-studio-home-card:hover .solid-studio-home-card-cta {
@@ -5294,7 +5396,9 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   border-radius: 12px;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
   overflow: hidden;
-  transition: transform 0.2s ease, box-shadow 0.2s ease;
+  transition:
+    transform 0.2s ease,
+    box-shadow 0.2s ease;
 }
 
 .solid-studio-card-header {
@@ -5394,7 +5498,9 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   align-items: center;
   gap: 0.55rem;
   cursor: pointer;
-  transition: transform 0.15s ease, box-shadow 0.15s ease;
+  transition:
+    transform 0.15s ease,
+    box-shadow 0.15s ease;
   box-shadow: 0 8px 15px rgba(17, 24, 39, 0.2);
 }
 
@@ -5429,7 +5535,7 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   border-radius: 8px;
   padding: 16px;
   margin: 12px 0;
-  font-family: 'JetBrains Mono', 'Fira Code', monospace;
+  font-family: "JetBrains Mono", "Fira Code", monospace;
   font-size: 12px;
   line-height: 1.6;
   color: #e2e8f0 !important;
@@ -5482,7 +5588,11 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   overflow: auto;
   border-radius: 18px;
   border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
-  background: linear-gradient(180deg, color-mix(in srgb, var(--card) 96%, white 4%), var(--card));
+  background: linear-gradient(
+    180deg,
+    color-mix(in srgb, var(--card) 96%, white 4%),
+    var(--card)
+  );
   color: var(--foreground);
   box-shadow: 0 28px 60px rgba(15, 23, 42, 0.24);
 }
@@ -5575,7 +5685,10 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   align-items: center;
   justify-content: center;
   cursor: pointer;
-  transition: background 120ms ease, color 120ms ease, box-shadow 120ms ease;
+  transition:
+    background 120ms ease,
+    color 120ms ease,
+    box-shadow 120ms ease;
 }
 
 .solid-radix-dialog-close:hover {
@@ -5602,12 +5715,22 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   padding: 6px 10px;
   border-radius: 8px;
   font-size: 13px;
-  transition: background-color 0.15s ease, border-color 0.15s ease;
+  transition:
+    background-color 0.15s ease,
+    border-color 0.15s ease;
 }
 
 .solid-select-button-item.is-active {
-  border-color: color-mix(in srgb, var(--primary-color, var(--primary)) 70%, var(--border));
-  background: color-mix(in srgb, var(--primary-color, var(--primary)) 12%, var(--background));
+  border-color: color-mix(
+    in srgb,
+    var(--primary-color, var(--primary)) 70%,
+    var(--border)
+  );
+  background: color-mix(
+    in srgb,
+    var(--primary-color, var(--primary)) 12%,
+    var(--background)
+  );
   color: var(--foreground);
 }
 
@@ -5653,19 +5776,22 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   align-items: center;
   justify-content: center;
   position: relative;
-  transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
+  transition:
+    border-color 0.15s ease,
+    background-color 0.15s ease,
+    box-shadow 0.15s ease;
 }
 
-.solid-checkbox-input:focus-visible+.solid-checkbox-box {
+.solid-checkbox-input:focus-visible + .solid-checkbox-box {
   box-shadow: 0 0 0 3px var(--ring);
 }
 
-.solid-checkbox-input:checked+.solid-checkbox-box {
+.solid-checkbox-input:checked + .solid-checkbox-box {
   background: var(--primary-color, var(--primary));
   border-color: var(--primary-color, var(--primary));
 }
 
-.solid-checkbox-input:checked+.solid-checkbox-box::after {
+.solid-checkbox-input:checked + .solid-checkbox-box::after {
   content: "";
   width: 8px;
   height: 4px;
@@ -5688,12 +5814,22 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   padding: 2px;
   display: inline-flex;
   align-items: center;
-  transition: background-color 0.15s ease, border-color 0.15s ease;
+  transition:
+    background-color 0.15s ease,
+    border-color 0.15s ease;
 }
 
 .solid-switch.is-on {
-  background: color-mix(in srgb, var(--primary-color, var(--primary)) 50%, var(--muted));
-  border-color: color-mix(in srgb, var(--primary-color, var(--primary)) 70%, var(--border));
+  background: color-mix(
+    in srgb,
+    var(--primary-color, var(--primary)) 50%,
+    var(--muted)
+  );
+  border-color: color-mix(
+    in srgb,
+    var(--primary-color, var(--primary)) 70%,
+    var(--border)
+  );
 }
 
 .solid-switch-thumb {
@@ -5790,7 +5926,10 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   font-size: 14px;
   line-height: 1.3;
   font-weight: 650;
-  color: var(--solid-form-title, color-mix(in srgb, var(--foreground) 88%, var(--muted-foreground) 12%));
+  color: var(
+    --solid-form-title,
+    color-mix(in srgb, var(--foreground) 88%, var(--muted-foreground) 12%)
+  );
   letter-spacing: -0.015em;
 }
 
@@ -5838,7 +5977,11 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   width: 40px;
   height: 40px;
   border-radius: 10px;
-  background: color-mix(in srgb, var(--primary-color, var(--primary)) 16%, transparent);
+  background: color-mix(
+    in srgb,
+    var(--primary-color, var(--primary)) 16%,
+    transparent
+  );
   color: var(--primary-color, var(--primary));
   display: inline-flex;
   align-items: center;
@@ -5903,7 +6046,10 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   background: var(--card);
   color: inherit;
   text-align: left;
-  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
+  transition:
+    border-color 0.15s ease,
+    box-shadow 0.15s ease,
+    transform 0.15s ease;
 }
 
 .solid-field-selector-card:hover {
@@ -5912,8 +6058,13 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
 }
 
 .solid-field-selector-card.is-active {
-  border-color: color-mix(in srgb, var(--primary-color, var(--primary)) 45%, var(--border));
-  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary-color, var(--primary)) 22%, transparent);
+  border-color: color-mix(
+    in srgb,
+    var(--primary-color, var(--primary)) 45%,
+    var(--border)
+  );
+  box-shadow: 0 0 0 2px
+    color-mix(in srgb, var(--primary-color, var(--primary)) 22%, transparent);
 }
 
 .solid-field-selector-card-inner {
@@ -5933,7 +6084,11 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
 }
 
 .solid-field-selector-icon-blue {
-  background: color-mix(in srgb, var(--primary-color, var(--primary)) 16%, transparent);
+  background: color-mix(
+    in srgb,
+    var(--primary-color, var(--primary)) 16%,
+    transparent
+  );
   color: color-mix(in srgb, var(--primary-color, var(--primary)) 68%, #0f172a);
 }
 
@@ -6012,8 +6167,16 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
 }
 
 .solid-tag-info {
-  background: color-mix(in srgb, var(--primary-color, var(--primary)) 12%, transparent);
-  border-color: color-mix(in srgb, var(--primary-color, var(--primary)) 36%, var(--border));
+  background: color-mix(
+    in srgb,
+    var(--primary-color, var(--primary)) 12%,
+    transparent
+  );
+  border-color: color-mix(
+    in srgb,
+    var(--primary-color, var(--primary)) 36%,
+    var(--border)
+  );
 }
 
 .solid-tag-warn {
@@ -6080,7 +6243,11 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
   font-size: var(--solid-segmented-item-font-size, 0.85rem);
   font-weight: 600;
   color: color-mix(in srgb, var(--card-foreground) 88%, #64748b);
-  transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
+  transition:
+    background 0.18s ease,
+    color 0.18s ease,
+    box-shadow 0.18s ease,
+    border-color 0.18s ease;
 }
 
 .solid-segmented-item.is-active {
@@ -6091,9 +6258,17 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
 }
 
 .solid-segmented-item:not(.is-active):hover {
-  background: color-mix(in srgb, var(--primary-color, #4f46e5) 12%, transparent);
+  background: color-mix(
+    in srgb,
+    var(--primary-color, #4f46e5) 12%,
+    transparent
+  );
   color: var(--primary-color, #4f46e5);
-  border-color: color-mix(in srgb, var(--primary-color, #4f46e5) 35%, transparent);
+  border-color: color-mix(
+    in srgb,
+    var(--primary-color, #4f46e5) 35%,
+    transparent
+  );
 }
 
 .solid-segmented-item:focus-visible {
@@ -6109,4 +6284,6 @@ html.dark .solid-paginator-btn:hover:not(:disabled),
 
 .solid-list-toolbar-row{
   padding: 5px 15px 0 10px;
+  padding-left: 2.4rem;
+
 }