diff --git a/resources/css/app.css b/resources/css/app.css
index d87b65d946..46439f4631 100644
--- a/resources/css/app.css
+++ b/resources/css/app.css
@@ -415,11 +415,12 @@ select,
         position: absolute;
         inset: 0;
         border-radius: inherit;
+        --coolbox-loading-color: var(--color-coollabs);
         background:
-            linear-gradient(var(--color-warning), var(--color-warning)),
-            linear-gradient(var(--color-warning), var(--color-warning)),
-            linear-gradient(var(--color-warning), var(--color-warning)),
-            linear-gradient(var(--color-warning), var(--color-warning));
+            linear-gradient(var(--coolbox-loading-color), var(--coolbox-loading-color)),
+            linear-gradient(var(--coolbox-loading-color), var(--coolbox-loading-color)),
+            linear-gradient(var(--coolbox-loading-color), var(--coolbox-loading-color)),
+            linear-gradient(var(--coolbox-loading-color), var(--coolbox-loading-color));
         background-repeat: no-repeat;
         animation: coolbox-border-track 2400ms linear infinite;
         pointer-events: none;
@@ -436,6 +437,10 @@ select,
         z-index: 1;
     }
 
+    .dark .coolbox-loading::before {
+        --coolbox-loading-color: var(--color-brand-light);
+    }
+
     .dark .coolbox-loading::after {
         background: var(--color-coolgray-100);
     }
@@ -523,7 +528,7 @@ a {
 
 button:focus-visible,
 a:focus-visible {
-    @apply outline-none ring-2 ring-coollabs dark:ring-1 dark:ring-warning ring-offset-2 dark:ring-offset-coolgray-100;
+    @apply outline-none ring-2 ring-coollabs dark:ring-1 dark:ring-brand-light ring-offset-2 dark:ring-offset-coolgray-100;
 }
 
 label {
@@ -587,24 +592,24 @@ tr td:first-child {
     animation: lds-heart 1.2s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
 }
 
-/* Loading feedback uses the higher-contrast warning accent in dark mode. */
+/* Loading feedback uses the brand-light accent in dark mode. */
 .dark .animate-spin {
-    color: var(--color-warning) !important;
+    color: var(--color-brand-light) !important;
 }
 
 .dark #nprogress .bar {
-    background: var(--color-warning) !important;
+    background: var(--color-brand-light) !important;
 }
 
 .dark #nprogress .peg {
     box-shadow:
-        0 0 10px var(--color-warning),
-        0 0 5px var(--color-warning) !important;
+        0 0 10px var(--color-brand-light),
+        0 0 5px var(--color-brand-light) !important;
 }
 
 .dark #nprogress .spinner-icon {
-    border-top-color: var(--color-warning) !important;
-    border-left-color: var(--color-warning) !important;
+    border-top-color: var(--color-brand-light) !important;
+    border-left-color: var(--color-brand-light) !important;
 }
 
 html[data-theme="custom"] .loading-indicator,
@@ -1377,6 +1382,11 @@ html[data-theme="custom"] {
     --color-coollabs-300: color-mix(in oklab, var(--theme-bright-color) 72%, oklch(0% 0 0));
     /* Legacy dark-theme accent utilities use warning as the brand color. */
     --color-warning: var(--theme-bright-color);
+    /* Accent text, icons, and rings (brand-light) follow the picked color in the
+       readable foreground band. --color-brand stays purple here because the
+       brand button gradient (hover/press/depth) is not themed; brand fills and
+       tints are remapped per element below. */
+    --color-brand-light: var(--theme-fg-on-surface);
     --color-accent-foreground: var(--theme-accent-foreground);
     --color-app: color-mix(in oklab, var(--theme-base-color) 12%, oklch(14.03% 0.0022 286.11));
     --color-panel: color-mix(in oklab, var(--theme-base-color) 14%, oklch(15.48% 0.0021 286.15));
@@ -1519,14 +1529,31 @@ html[data-theme="custom"] :is(
     [class~="text-warning"],
     [class~="text-accent"],
     [class~="dark:text-coollabs"],
-    [class~="dark:text-warning"]
+    [class~="dark:text-warning"],
+    [class~="dark:text-brand-light"]
 ) {
     color: var(--theme-fg-on-surface) !important;
 }
 
+/* Brand fills and tints (chips, selected rows, checked boxes, active app tabs)
+   take the picked color. Scoped to the elements that use them so the purple
+   brand buttons keep their matching hover/press/depth tokens. */
+html[data-theme="custom"] :is(
+    [class*=":bg-brand"],
+    [class*=":border-brand"],
+    .application-heading-actions .app-tab
+) {
+    --color-brand: var(--theme-bright-color);
+}
+
+html.dark[data-theme="custom"] [class~="dark:bg-brand"] {
+    color: var(--theme-accent-foreground) !important;
+}
+
 html[data-theme="custom"] [class~="hover:text-coollabs"]:hover,
 html[data-theme="custom"] [class~="hover:text-warning"]:hover,
 html[data-theme="custom"] [class~="dark:hover:text-warning"]:hover,
+html[data-theme="custom"] [class~="dark:hover:text-brand-light"]:hover,
 html[data-theme="custom"] [class~="dark:hover:text-coollabs"]:hover {
     color: var(--theme-fg-on-surface) !important;
 }
@@ -1722,7 +1749,7 @@ html[data-theme="custom"] textarea:disabled {
 }
 
 .dark .error-code {
-    color: var(--color-warning);
+    color: var(--color-brand-light);
 }
 
 .error-code-danger {
@@ -2433,7 +2460,7 @@ html[data-theme="custom"]:not(.dark) :is(.application-settings-section, .applica
 /*
  * Active primary tab styles.
  * The base rules above set background/color/box-shadow with higher specificity
- * than Tailwind utilities (bg-warning/15, text-warning, ring-*), so active
+ * than Tailwind utilities (bg-brand/15, text-brand-light, ring-*), so active
  * tabs need an explicit override or they look identical to inactive ones.
  */
 .application-heading-actions .app-tab[aria-current='page'],
@@ -2451,15 +2478,15 @@ html[data-theme="custom"]:not(.dark) :is(.application-settings-section, .applica
 
 .dark .application-heading-actions .app-tab[aria-current='page'],
 .dark .application-heading-actions .app-tab.app-tab-active {
-    background: color-mix(in srgb, var(--color-warning) 15%, transparent);
-    color: var(--color-warning);
-    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-warning) 25%, transparent);
+    background: color-mix(in srgb, var(--color-brand) 15%, transparent);
+    color: var(--color-brand-light);
+    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-brand-light) 25%, transparent);
 }
 
 .dark .application-heading-actions .app-tab[aria-current='page']:hover,
 .dark .application-heading-actions .app-tab.app-tab-active:hover {
-    background: color-mix(in srgb, var(--color-warning) 20%, transparent);
-    color: var(--color-warning);
+    background: color-mix(in srgb, var(--color-brand) 20%, transparent);
+    color: var(--color-brand-light);
 }
 
 .application-heading-actions .relative > button[x-ref='trigger'] {
@@ -5620,6 +5647,20 @@ html:where(:not([data-nav-items="flat"])) :is(.menu-item-active, .menu-subitem-a
     --button-depth-color: color-mix(in oklab, var(--color-error) 40%, transparent) !important;
 }
 
+/* In dark mode the Danger Zone tile is red-tinted, not the white or purple tile of other items. */
+html.dark:where(:not([data-nav-items="flat"])) :is(.menu-item, .menu-subitem):not(.sidebar-toggle) .menu-item-icon.text-error {
+    color: var(--color-error) !important;
+    border-color: color-mix(in oklab, var(--color-error) 25%, transparent) !important;
+    background: color-mix(in oklab, var(--color-error) 8%, transparent) !important;
+    --button-depth-color: color-mix(in oklab, var(--color-error) 20%, transparent) !important;
+}
+
+html.dark:where(:not([data-nav-items="flat"])) :is(.menu-item, .menu-subitem):not(.sidebar-toggle):is(:hover, .menu-item-active, .menu-subitem-active) .menu-item-icon.text-error {
+    border-color: color-mix(in oklab, var(--color-error) 45%, transparent) !important;
+    background: color-mix(in oklab, var(--color-error) 15%, transparent) !important;
+    --button-depth-color: color-mix(in oklab, var(--color-error) 35%, transparent) !important;
+}
+
 html:where(:not([data-nav-items="flat"])) :is(.menu-item, .menu-subitem):not(.sidebar-toggle):focus-visible {
     outline: none;
 }
@@ -6197,6 +6238,16 @@ html.dark .command-palette {
     box-shadow: 0 0 0 1px rgb(163 145 255 / 0.22), var(--shadow-dropdown);
 }
 
+/* Sidebar account menu: the purple tint of the sidebar it opens from. */
+html.dark .listbox-panel.top-user-menu-panel-sidebar {
+    background: color-mix(in oklab, #6b16ed 10%, var(--coollabs-elevated));
+    border-color: rgb(163 145 255 / 0.22);
+}
+
+html.dark .top-user-menu-panel-sidebar .listbox-option:hover {
+    background: rgb(163 145 255 / 0.10);
+}
+
 html.dark .command-palette-header {
     background: transparent;
 }
diff --git a/resources/css/utilities.css b/resources/css/utilities.css
index 9f6d6eb582..466499903f 100644
--- a/resources/css/utilities.css
+++ b/resources/css/utilities.css
@@ -49,12 +49,12 @@
 }
 
 @utility input-sticky-active {
-    @apply text-black border-2 border-coollabs dark:border-warning dark:text-white focus:bg-neutral-200 dark:focus:bg-coolgray-400 focus:border-coollabs dark:focus:border-warning;
+    @apply text-black border-2 border-coollabs dark:border-brand-light dark:text-white focus:bg-neutral-200 dark:focus:bg-coolgray-400 focus:border-coollabs dark:focus:border-brand-light;
 }
 
 /* Focus */
 @utility input-focus {
-    @apply focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-coollabs dark:focus-visible:ring-warning focus-visible:ring-offset-2 dark:focus-visible:ring-offset-base;
+    @apply focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-coollabs dark:focus-visible:ring-brand-light focus-visible:ring-offset-2 dark:focus-visible:ring-offset-base;
 }
 
 /*  input, select before */
@@ -295,7 +295,7 @@
 }
 
 @utility loading {
-    @apply w-4 dark:text-warning text-coollabs;
+    @apply w-4 dark:text-brand-light text-coollabs;
 }
 
 @utility kbd-custom {
@@ -343,7 +343,7 @@
 }
 
 @utility text-helper {
-    @apply inline-block font-semibold text-coollabs dark:text-warning;
+    @apply inline-block font-semibold text-coollabs dark:text-brand-light;
 }
 
 @utility info-helper {
diff --git a/resources/views/components/applications/links.blade.php b/resources/views/components/applications/links.blade.php
index 94f7c56efa..8e27fe0b6a 100644
--- a/resources/views/components/applications/links.blade.php
+++ b/resources/views/components/applications/links.blade.php
@@ -84,7 +84,7 @@
                                     <a class="{{ $linkItemClasses }}" target="_blank"
                                         href="{{ getFqdnWithoutPort($domain) }}">
                                         <span
-                                            class="shrink-0 rounded-md bg-coollabs/10 px-1.5 py-0.5 text-[10px] font-semibold text-coollabs ring-1 ring-coollabs/20 dark:bg-warning/10 dark:text-warning dark:ring-warning/20">
+                                            class="shrink-0 rounded-md bg-coollabs/10 px-1.5 py-0.5 text-[10px] font-semibold text-coollabs ring-1 ring-coollabs/20 dark:bg-brand/15 dark:text-brand-light dark:ring-brand-light/25">
                                             PR #{{ data_get($preview, 'pull_request_id') }}
                                         </span>
                                         <span class="min-w-0 truncate">{{ getFqdnWithoutPort($domain) }}</span>
@@ -99,7 +99,7 @@
                             <a class="{{ $linkItemClasses }}" target="_blank"
                                 href="{{ getFqdnWithoutPort(data_get($preview, 'fqdn')) }}">
                                 <span
-                                    class="shrink-0 rounded-md bg-coollabs/10 px-1.5 py-0.5 text-[10px] font-semibold text-coollabs ring-1 ring-coollabs/20 dark:bg-warning/10 dark:text-warning dark:ring-warning/20">
+                                    class="shrink-0 rounded-md bg-coollabs/10 px-1.5 py-0.5 text-[10px] font-semibold text-coollabs ring-1 ring-coollabs/20 dark:bg-brand/15 dark:text-brand-light dark:ring-brand-light/25">
                                     PR #{{ data_get($preview, 'pull_request_id') }}
                                 </span>
                                 <span class="min-w-0 truncate">{{ getFqdnWithoutPort(data_get($preview, 'fqdn')) }}</span>
diff --git a/resources/views/components/beta-badge.blade.php b/resources/views/components/beta-badge.blade.php
index 66581433e4..04633ff3e6 100644
--- a/resources/views/components/beta-badge.blade.php
+++ b/resources/views/components/beta-badge.blade.php
@@ -1,6 +1,6 @@
 <span {{ $attributes->merge(['class' => 'inline-flex items-center']) }}>
     <span role="img" aria-label="Beta" data-tooltip="Beta"
-        class="inline-flex items-center justify-center p-0.5 rounded-full cursor-help text-coollabs dark:text-warning">
+        class="inline-flex items-center justify-center p-0.5 rounded-full cursor-help text-coollabs dark:text-brand-light">
         <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
             class="size-4" aria-hidden="true">
             <path stroke-linecap="round" stroke-linejoin="round"
diff --git a/resources/views/components/boarding-progress.blade.php b/resources/views/components/boarding-progress.blade.php
index b342d2de22..8fbfe5fb57 100644
--- a/resources/views/components/boarding-progress.blade.php
+++ b/resources/views/components/boarding-progress.blade.php
@@ -6,12 +6,12 @@
         @for ($i = 1; $i <= $totalSteps; $i++)
             <div @class([
                 'flex min-h-10 items-center justify-center gap-2 border-r border-neutral-200 px-3 text-[11px] font-medium last:border-r-0 dark:border-white/[0.08]',
-                'bg-coollabs/[0.07] text-coollabs dark:bg-warning/[0.09] dark:text-warning' => $i === $currentStep,
+                'bg-coollabs/[0.07] text-coollabs dark:bg-brand/10 dark:text-brand-light' => $i === $currentStep,
                 'text-neutral-500 dark:text-fg-dim' => $i !== $currentStep,
             ])>
                 <span @class([
                     'flex size-5 items-center justify-center rounded-full border text-[10px] font-semibold',
-                    'border-coollabs/25 bg-coollabs/10 dark:border-warning/25 dark:bg-warning/15' => $i === $currentStep,
+                    'border-coollabs/25 bg-coollabs/10 dark:border-brand-light/25 dark:bg-brand/15' => $i === $currentStep,
                     'border-emerald-500/25 bg-emerald-500/10 text-emerald-600 dark:text-emerald-400' => $i < $currentStep,
                     'border-neutral-200 dark:border-white/[0.1]' => $i > $currentStep,
                 ])>
diff --git a/resources/views/components/callout.blade.php b/resources/views/components/callout.blade.php
index bfc1a9ff22..c6d0d3de8c 100644
--- a/resources/views/components/callout.blade.php
+++ b/resources/views/components/callout.blade.php
@@ -24,9 +24,9 @@
         ],
         'info' => [
             'icon' => 'info-circle',
-            'shell' => 'border-coollabs/20 bg-coollabs/[0.055] dark:border-warning/15 dark:bg-warning/[0.045]',
-            'iconClass' => 'text-coollabs dark:text-warning',
-            'titleClass' => 'text-coollabs dark:text-warning',
+            'shell' => 'border-coollabs/20 bg-coollabs/[0.055] dark:border-brand-light/15 dark:bg-brand/[0.06]',
+            'iconClass' => 'text-coollabs dark:text-brand-light',
+            'titleClass' => 'text-coollabs dark:text-brand-light',
             'textClass' => 'text-neutral-600 dark:text-fg-dim',
         ],
         'success' => [
diff --git a/resources/views/components/checkpoint-item.blade.php b/resources/views/components/checkpoint-item.blade.php
index 5280be8084..7f8cf8dca1 100644
--- a/resources/views/components/checkpoint-item.blade.php
+++ b/resources/views/components/checkpoint-item.blade.php
@@ -9,7 +9,7 @@
     $statusClasses = match ($status) {
         'success' => 'border-emerald-500/25 bg-emerald-500/10 text-emerald-600 dark:text-emerald-400',
         'error' => 'border-red-500/25 bg-red-500/10 text-red-600 dark:text-red-400',
-        'running' => 'border-coollabs/25 bg-coollabs/10 text-coollabs dark:border-warning/25 dark:bg-warning/15 dark:text-warning',
+        'running' => 'border-coollabs/25 bg-coollabs/10 text-coollabs dark:border-brand-light/25 dark:bg-brand/15 dark:text-brand-light',
         'pending' => 'border-neutral-200 text-neutral-400 dark:border-white/[0.1] dark:text-fg-faint',
         default => 'border-neutral-200 bg-neutral-50 text-neutral-500 dark:border-white/[0.08] dark:bg-white/[0.035] dark:text-fg-dim',
     };
diff --git a/resources/views/components/configuration-warning.blade.php b/resources/views/components/configuration-warning.blade.php
index 50a84d2cb2..831bf09f01 100644
--- a/resources/views/components/configuration-warning.blade.php
+++ b/resources/views/components/configuration-warning.blade.php
@@ -25,7 +25,7 @@
                         {{ data_get($diff, 'count') === 1 ? 'change' : 'changes' }} unapplied.
                         {{ data_get($diff, 'requires_build') ? 'Rebuild required.' : 'Redeploy to apply.' }}
                         <button type="button"
-                            class="ml-0.5 inline-flex items-center gap-0.5 font-semibold text-coollabs transition-colors hover:text-coollabs-100 dark:text-warning dark:hover:text-warning/80"
+                            class="ml-0.5 inline-flex items-center gap-0.5 font-semibold text-coollabs transition-colors hover:text-coollabs-100 dark:text-brand-light dark:hover:text-brand-light/80"
                             @click="open = false; $dispatch('open-configuration-diff')">
                             View changes
                             <x-reicon name="arrow-right" class="size-2.5" />
diff --git a/resources/views/components/forms/checkbox.blade.php b/resources/views/components/forms/checkbox.blade.php
index 5a04b99986..8f4933200a 100644
--- a/resources/views/components/forms/checkbox.blade.php
+++ b/resources/views/components/forms/checkbox.blade.php
@@ -49,8 +49,8 @@
             @endif
 
             <span
-                class="pointer-events-none absolute inset-0 rounded-[5px] border border-neutral-300 bg-white shadow-[inset_0_1px_1px_rgb(0_0_0/0.04)] transition-[color,background-color,border-color,box-shadow] duration-150 ease-out group-hover:border-neutral-400 peer-checked:border-coollabs peer-checked:bg-coollabs peer-focus-visible:ring-2 peer-focus-visible:ring-coollabs/25 peer-focus-visible:ring-offset-2 peer-disabled:opacity-50 dark:border-white/[0.14] dark:bg-white/[0.045] dark:shadow-none dark:group-hover:border-white/[0.22] dark:peer-checked:border-warning dark:peer-checked:bg-warning dark:peer-focus-visible:ring-warning/30 dark:peer-focus-visible:ring-offset-base"></span>
-            <svg class="pointer-events-none absolute inset-0 m-auto size-3 scale-75 text-white opacity-0 transition-[opacity,transform] peer-checked:scale-100 peer-checked:opacity-100 dark:text-black"
+                class="pointer-events-none absolute inset-0 rounded-[5px] border border-neutral-300 bg-white shadow-[inset_0_1px_1px_rgb(0_0_0/0.04)] transition-[color,background-color,border-color,box-shadow] duration-150 ease-out group-hover:border-neutral-400 peer-checked:border-coollabs peer-checked:bg-coollabs peer-focus-visible:ring-2 peer-focus-visible:ring-coollabs/25 peer-focus-visible:ring-offset-2 peer-disabled:opacity-50 dark:border-white/[0.14] dark:bg-white/[0.045] dark:shadow-none dark:group-hover:border-white/[0.22] dark:peer-checked:border-brand dark:peer-checked:bg-brand dark:peer-focus-visible:ring-brand-light/30 dark:peer-focus-visible:ring-offset-base"></span>
+            <svg class="pointer-events-none absolute inset-0 m-auto size-3 scale-75 text-white opacity-0 transition-[opacity,transform] peer-checked:scale-100 peer-checked:opacity-100"
                 viewBox="0 0 12 12" fill="none" aria-hidden="true">
                 <path d="m2.25 6.15 2.35 2.3 5.15-5" stroke="currentColor" stroke-width="1.8"
                     stroke-linecap="round" stroke-linejoin="round" />
diff --git a/resources/views/components/forms/env-var-input.blade.php b/resources/views/components/forms/env-var-input.blade.php
index 41a29fbbdb..e6c51e1169 100644
--- a/resources/views/components/forms/env-var-input.blade.php
+++ b/resources/views/components/forms/env-var-input.blade.php
@@ -276,7 +276,7 @@
                 <div class="px-2 py-2 text-sm text-neutral-500 dark:text-fg-dim">
                     <div>No shared variables found in <span class="font-semibold" x-text="currentScope"></span> scope.</div>
                     <a :href="getScopeUrl(currentScope)"
-                       class="mt-1 inline-block text-xs text-coollabs hover:underline dark:text-warning"
+                       class="mt-1 inline-block text-xs text-coollabs hover:underline dark:text-brand-light"
                        target="_blank">
                         Add <span x-text="currentScope"></span> variables →
                     </a>
diff --git a/resources/views/components/forms/repository-paths.blade.php b/resources/views/components/forms/repository-paths.blade.php
index 1b5c6f94f9..36bd6da4fd 100644
--- a/resources/views/components/forms/repository-paths.blade.php
+++ b/resources/views/components/forms/repository-paths.blade.php
@@ -34,7 +34,7 @@
             x-model="file" x-bind:disabled="{{ $disabled }}" @blur="file = location" />
         <p class="col-span-full text-xs text-neutral-500 dark:text-fg-dim">
             Resolved file:
-            <code class="font-mono text-coollabs dark:text-warning" x-text="directory + location"></code>
+            <code class="font-mono text-coollabs dark:text-brand-light" x-text="directory + location"></code>
         </p>
         <x-callout class="col-span-full" x-cloak x-show="repeatsBase" title="Base directory is repeated">
             {{ $fileLabel }} is relative to the base directory, so it should not start with
diff --git a/resources/views/components/notification/event-multiselect.blade.php b/resources/views/components/notification/event-multiselect.blade.php
index 986fcabecb..56c57005fc 100644
--- a/resources/views/components/notification/event-multiselect.blade.php
+++ b/resources/views/components/notification/event-multiselect.blade.php
@@ -49,7 +49,7 @@
                     <span class="truncate">{{ $event['label'] }}</span>
                     <span @class([
                         'flex size-4 shrink-0 items-center justify-center rounded-[5px] border',
-                        'border-coollabs bg-coollabs text-white dark:border-warning dark:bg-warning dark:text-black' => $event['enabled'],
+                        'border-coollabs bg-coollabs text-white dark:border-brand dark:bg-brand dark:text-white' => $event['enabled'],
                         'border-neutral-300 bg-white dark:border-white/[0.14] dark:bg-white/[0.045]' => ! $event['enabled'],
                     ])>
                         @if ($event['enabled'])
diff --git a/resources/views/components/proxy-configuration-warning.blade.php b/resources/views/components/proxy-configuration-warning.blade.php
index 9014f18b6b..7c40c2f7f0 100644
--- a/resources/views/components/proxy-configuration-warning.blade.php
+++ b/resources/views/components/proxy-configuration-warning.blade.php
@@ -21,7 +21,7 @@
                 </p>
                 @if ($canRestart)
                     <button type="button"
-                        class="mt-0.5 inline-flex items-center gap-0.5 text-[11px] leading-4 font-semibold text-coollabs transition-colors hover:text-coollabs-100 dark:text-warning dark:hover:text-warning/80"
+                        class="mt-0.5 inline-flex items-center gap-0.5 text-[11px] leading-4 font-semibold text-coollabs transition-colors hover:text-coollabs-100 dark:text-brand-light dark:hover:text-brand-light/80"
                         @click="open = false; document.getElementById('server-mobile-restart-proxy-trigger')?.click()">
                         Restart proxy
                         <x-reicon name="arrow-right" class="size-2.5" />
diff --git a/resources/views/components/status/running.blade.php b/resources/views/components/status/running.blade.php
index cc098bedba..fcbb2b5dbf 100644
--- a/resources/views/components/status/running.blade.php
+++ b/resources/views/components/status/running.blade.php
@@ -31,7 +31,7 @@
     @if ($showUnknownHelper)
         <div>
             <x-helper
-                helper="No health check configured. <span class='dark:text-warning text-coollabs'>The resource may be functioning normally.</span><br><br>Traefik and Caddy will route traffic to this container even without a health check. However, configuring a health check is recommended to ensure the resource is ready before receiving traffic.<br><br>More details in the <a href='https://coolify.io/docs/knowledge-base/proxy/traefik/healthchecks' class='underline dark:text-warning text-coollabs' target='_blank'>documentation</a>.">
+                helper="No health check configured. <span class='dark:text-brand-light text-coollabs'>The resource may be functioning normally.</span><br><br>Traefik and Caddy will route traffic to this container even without a health check. However, configuring a health check is recommended to ensure the resource is ready before receiving traffic.<br><br>More details in the <a href='https://coolify.io/docs/knowledge-base/proxy/traefik/healthchecks' class='underline dark:text-brand-light text-coollabs' target='_blank'>documentation</a>.">
                 <x-slot:icon>
                     <x-status-badge status="No healthcheck" type="warning" class="cursor-help" />
                 </x-slot:icon>
diff --git a/resources/views/components/theme-controls.blade.php b/resources/views/components/theme-controls.blade.php
index f69e0bbc8f..e60d065e73 100644
--- a/resources/views/components/theme-controls.blade.php
+++ b/resources/views/components/theme-controls.blade.php
@@ -124,7 +124,7 @@
                                 aria-haspopup="dialog" :aria-expanded="pickerOpen"
                                 class="group block w-full overflow-hidden rounded-[10px] border border-neutral-200 bg-white text-left transition-[border-color,box-shadow] hover:border-neutral-300 hover:shadow-sm dark:border-white/[0.07] dark:bg-white/[0.05] dark:hover:border-white/[0.12]"
                                 :class="theme === 'custom'
-                                    ? 'ring-1 ring-coollabs/30 border-coollabs/40 dark:ring-warning/30 dark:border-warning/40'
+                                    ? 'ring-1 ring-coollabs/30 border-coollabs/40 dark:ring-brand-light/30 dark:border-brand-light/40'
                                     : ''">
                                 <div class="h-20 border-b border-neutral-200 dark:border-white/[0.07]"
                                     :style="`background: color-mix(in oklab, ${themeColor} 28%, ${customMode === 'light' ? 'oklch(97% 0 0)' : 'oklch(17.35% 0.0020 286.18)'})`">
@@ -153,7 +153,7 @@
                             @keydown.enter.prevent="setTheme('{{ $option['value'] }}')"
                             class="group relative overflow-hidden rounded-[10px] border border-neutral-200 bg-white text-left transition-[border-color,box-shadow] hover:border-neutral-300 hover:shadow-sm dark:border-white/[0.07] dark:bg-white/[0.05] dark:hover:border-white/[0.12]"
                             :class="theme === '{{ $option['value'] }}'
-                                ? 'ring-1 ring-coollabs/30 border-coollabs/40 dark:ring-warning/30 dark:border-warning/40'
+                                ? 'ring-1 ring-coollabs/30 border-coollabs/40 dark:ring-brand-light/30 dark:border-brand-light/40'
                                 : ''">
                             <div class="h-20 {{ $option['preview'] }} border-b border-neutral-200 dark:border-white/[0.07]">
                                 <div class="flex h-full items-center justify-center">
@@ -195,7 +195,7 @@
                     <button type="button" @click="setWidth('{{ $option['value'] }}')"
                         class="group overflow-hidden rounded-[10px] border border-neutral-200 bg-white text-left transition-[border-color,box-shadow] hover:border-neutral-300 hover:shadow-sm dark:border-white/[0.07] dark:bg-white/[0.05] dark:hover:border-white/[0.12]"
                         :class="pageWidth === '{{ $option['value'] }}'
-                            ? 'ring-1 ring-coollabs/30 border-coollabs/40 dark:ring-warning/30 dark:border-warning/40'
+                            ? 'ring-1 ring-coollabs/30 border-coollabs/40 dark:ring-brand-light/30 dark:border-brand-light/40'
                             : ''">
                         <div class="flex h-20 items-center border-b border-neutral-200 bg-neutral-50 px-4 dark:border-white/[0.07] dark:bg-black/15">
                             <div class="flex h-11 w-full gap-1.5 rounded-md border border-neutral-300 bg-white p-1.5 dark:border-white/15 dark:bg-[#181818]">
@@ -235,7 +235,7 @@
                     <button type="button" @click="setNavStyle('{{ $option['value'] }}')"
                         class="group overflow-hidden rounded-[10px] border border-neutral-200 bg-white text-left transition-[border-color,box-shadow] hover:border-neutral-300 hover:shadow-sm dark:border-white/[0.07] dark:bg-white/[0.05] dark:hover:border-white/[0.12]"
                         :class="navStyle === '{{ $option['value'] }}'
-                            ? 'ring-1 ring-coollabs/30 border-coollabs/40 dark:ring-warning/30 dark:border-warning/40'
+                            ? 'ring-1 ring-coollabs/30 border-coollabs/40 dark:ring-brand-light/30 dark:border-brand-light/40'
                             : ''">
                         @php($floating = $option['value'] === 'floating')
                         <div @class([
@@ -287,7 +287,7 @@
                     <button type="button" @click="setNavItems('{{ $option['value'] }}')"
                         class="group overflow-hidden rounded-[10px] border border-neutral-200 bg-white text-left transition-[border-color,box-shadow] hover:border-neutral-300 hover:shadow-sm dark:border-white/[0.07] dark:bg-white/[0.05] dark:hover:border-white/[0.12]"
                         :class="navItems === '{{ $option['value'] }}'
-                            ? 'ring-1 ring-coollabs/30 border-coollabs/40 dark:ring-warning/30 dark:border-warning/40'
+                            ? 'ring-1 ring-coollabs/30 border-coollabs/40 dark:ring-brand-light/30 dark:border-brand-light/40'
                             : ''">
                         @php($tiles = $option['value'] === '3d')
                         <div class="flex h-20 flex-col justify-center gap-1.5 border-b border-neutral-200 bg-neutral-50 px-4 dark:border-white/[0.07] dark:bg-black/15">
diff --git a/resources/views/components/toast.blade.php b/resources/views/components/toast.blade.php
index 8e96413b35..faaf849a93 100644
--- a/resources/views/components/toast.blade.php
+++ b/resources/views/components/toast.blade.php
@@ -110,7 +110,7 @@
                             <div class="toast-icon flex size-8 shrink-0 items-center justify-center rounded-lg"
                                 :class="{
                                     'bg-emerald-100 text-emerald-700 dark:bg-emerald-500/10 dark:text-emerald-400': toast.type === 'success',
-                                    'bg-coollabs/10 text-coollabs dark:bg-warning/10 dark:text-warning': toast.type === 'info',
+                                    'bg-coollabs/10 text-coollabs dark:bg-brand/15 dark:text-brand-light': toast.type === 'info',
                                     'bg-amber-100 text-amber-700 dark:bg-warning/10 dark:text-warning': toast.type === 'warning',
                                     'bg-red-100 text-red-700 dark:bg-red-500/10 dark:text-red-400': toast.type === 'danger',
                                     'bg-neutral-100 text-neutral-600 dark:bg-white/[0.06] dark:text-fg-dim': toast.type === 'default',
diff --git a/resources/views/components/top-user-menu.blade.php b/resources/views/components/top-user-menu.blade.php
index 49f79e7b6a..9973b4a1aa 100644
--- a/resources/views/components/top-user-menu.blade.php
+++ b/resources/views/components/top-user-menu.blade.php
@@ -54,7 +54,7 @@
         @class([
             'top-user-menu-panel listbox-panel z-[90]! max-h-none! w-52! min-w-0! overflow-visible!',
             'right-0! left-auto!' => ! $sidebar,
-            'origin-bottom-left' => $sidebar,
+            'top-user-menu-panel-sidebar origin-bottom-left' => $sidebar,
             'origin-top-right' => ! $sidebar,
         ])>
         <div class="min-w-0 px-2 py-1.5">
diff --git a/resources/views/livewire/boarding/index.blade.php b/resources/views/livewire/boarding/index.blade.php
index 71c065dac3..4cbb67b2c3 100644
--- a/resources/views/livewire/boarding/index.blade.php
+++ b/resources/views/livewire/boarding/index.blade.php
@@ -42,14 +42,14 @@
                         <div
                             class="inline-flex flex-wrap items-center justify-center gap-0.5 rounded-lg border border-neutral-200 bg-neutral-50 p-0.5 dark:border-white/[0.08] dark:bg-white/[0.05]">
                             <button type="button" wire:click="skipBoarding"
-                                class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-warning">
+                                class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-brand-light">
                                 <x-reicon name="arrow-right" class="size-3.5 shrink-0" />
                                 Skip setup
                             </button>
                             <x-modal-input title="Need Help?">
                                 <x-slot:content>
                                     <button type="button"
-                                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-warning">
+                                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-brand-light">
                                         <x-reicon name="feedback" class="size-3.5 shrink-0" />
                                         Contact support
                                     </button>
@@ -106,7 +106,7 @@
                                 <span role="button" tabindex="0" aria-label="About this machine"
                                     data-tooltip="The machine running Coolify. Not recommended for production workloads due to resource contention."
                                     @click.stop @keydown.enter.stop @keydown.space.prevent.stop
-                                    class="absolute top-3 right-3 flex size-6 items-center justify-center rounded-full border border-neutral-200 text-[11px] font-semibold text-neutral-500 hover:border-coollabs/35 hover:text-coollabs dark:border-white/[0.1] dark:text-fg-dim dark:hover:border-warning/30 dark:hover:text-warning">i</span>
+                                    class="absolute top-3 right-3 flex size-6 items-center justify-center rounded-full border border-neutral-200 text-[11px] font-semibold text-neutral-500 hover:border-coollabs/35 hover:text-coollabs dark:border-white/[0.1] dark:text-fg-dim dark:hover:border-brand-light/30 dark:hover:text-brand-light">i</span>
                                 <div class="flex flex-col gap-4 text-left">
                                     <svg class="size-10" xmlns="http://www.w3.org/2000/svg" fill="none"
                                         viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
@@ -130,7 +130,7 @@
                                 <span role="button" tabindex="0" aria-label="About remote servers"
                                     data-tooltip="Any SSH-accessible server, including cloud VPS, bare metal, and self-hosted infrastructure."
                                     @click.stop @keydown.enter.stop @keydown.space.prevent.stop
-                                    class="absolute top-3 right-3 flex size-6 items-center justify-center rounded-full border border-neutral-200 text-[11px] font-semibold text-neutral-500 hover:border-coollabs/35 hover:text-coollabs dark:border-white/[0.1] dark:text-fg-dim dark:hover:border-warning/30 dark:hover:text-warning">i</span>
+                                    class="absolute top-3 right-3 flex size-6 items-center justify-center rounded-full border border-neutral-200 text-[11px] font-semibold text-neutral-500 hover:border-coollabs/35 hover:text-coollabs dark:border-white/[0.1] dark:text-fg-dim dark:hover:border-brand-light/30 dark:hover:text-brand-light">i</span>
                                 <div class="flex flex-col gap-4 text-left">
                                     <svg class="size-10" xmlns="http://www.w3.org/2000/svg" fill="none"
                                         viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
@@ -616,14 +616,14 @@
                         <div
                             class="inline-flex flex-wrap items-center justify-center gap-0.5 rounded-lg border border-neutral-200 bg-neutral-50 p-0.5 dark:border-white/[0.08] dark:bg-white/[0.05]">
                             <button type="button" wire:click="skipBoarding"
-                                class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-warning">
+                                class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-brand-light">
                                 <x-reicon name="arrow-right" class="size-3.5 shrink-0" />
                                 Go to dashboard
                             </button>
                             <x-modal-input title="Need Help?">
                                 <x-slot:content>
                                     <button type="button"
-                                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-warning">
+                                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-brand-light">
                                         <x-reicon name="feedback" class="size-3.5 shrink-0" />
                                         Contact support
                                     </button>
@@ -641,19 +641,19 @@
                 <div
                     class="inline-flex flex-wrap items-center justify-center gap-0.5 rounded-lg border border-neutral-200 bg-neutral-50 p-0.5 dark:border-white/[0.08] dark:bg-white/[0.05]">
                     <button type="button" wire:click="skipBoarding"
-                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-warning">
+                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-brand-light">
                         <x-reicon name="arrow-right" class="size-3.5 shrink-0" />
                         Skip setup
                     </button>
                     <button type="button" wire:click="restartBoarding"
-                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-warning">
+                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-brand-light">
                         <x-reicon name="restart" class="size-3.5 shrink-0" />
                         Restart
                     </button>
                     <x-modal-input title="Need Help?">
                         <x-slot:content>
                             <button type="button"
-                                class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-warning">
+                                class="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-[12px] font-medium text-neutral-500 transition-colors hover:bg-white hover:text-coollabs dark:text-fg-dim dark:hover:bg-white/[0.06] dark:hover:text-brand-light">
                                 <x-reicon name="feedback" class="size-3.5 shrink-0" />
                                 Contact support
                             </button>
diff --git a/resources/views/livewire/dashboard/active-deployments.blade.php b/resources/views/livewire/dashboard/active-deployments.blade.php
index ff7897b42a..1f2e001a77 100644
--- a/resources/views/livewire/dashboard/active-deployments.blade.php
+++ b/resources/views/livewire/dashboard/active-deployments.blade.php
@@ -62,7 +62,7 @@
 
                             <a wire:key="dashboard-active-deployment-{{ $deployment->deployment_uuid }}"
                                 href="{{ $deployment->deployment_url }}" {{ wireNavigate() }}
-                                class="dashboard-deployment-table-grid group block border-b border-neutral-200 px-4 py-3 transition-colors last:border-b-0 hover:bg-neutral-50 focus-visible:z-10 focus-visible:bg-warning/10 focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-warning focus-visible:ring-offset-0 @2xl:grid @2xl:items-center @2xl:gap-4 dark:border-white/[0.08] dark:hover:bg-white/[0.025] dark:focus-visible:bg-warning/10">
+                                class="dashboard-deployment-table-grid group block border-b border-neutral-200 px-4 py-3 transition-colors last:border-b-0 hover:bg-neutral-50 focus-visible:z-10 focus-visible:bg-coollabs/10 focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-coollabs focus-visible:ring-offset-0 @2xl:grid @2xl:items-center @2xl:gap-4 dark:border-white/[0.08] dark:hover:bg-white/[0.025] dark:focus-visible:bg-brand/10 dark:focus-visible:ring-brand-light">
                                 <div class="min-w-0">
                                     <p class="truncate text-[13px] font-semibold text-black dark:text-fg">
                                         {{ $deployment->application_name }}
@@ -128,7 +128,7 @@
 
                             <a wire:key="dashboard-recent-deployment-{{ $deployment->deployment_uuid }}"
                                 href="{{ $deployment->deployment_url }}" {{ wireNavigate() }}
-                                class="dashboard-deployment-table-grid group block border-b border-neutral-200 px-4 py-3 transition-colors last:border-b-0 hover:bg-neutral-50 focus-visible:z-10 focus-visible:bg-warning/10 focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-warning focus-visible:ring-offset-0 @2xl:grid @2xl:items-center @2xl:gap-4 dark:border-white/[0.08] dark:hover:bg-white/[0.025] dark:focus-visible:bg-warning/10">
+                                class="dashboard-deployment-table-grid group block border-b border-neutral-200 px-4 py-3 transition-colors last:border-b-0 hover:bg-neutral-50 focus-visible:z-10 focus-visible:bg-coollabs/10 focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-coollabs focus-visible:ring-offset-0 @2xl:grid @2xl:items-center @2xl:gap-4 dark:border-white/[0.08] dark:hover:bg-white/[0.025] dark:focus-visible:bg-brand/10 dark:focus-visible:ring-brand-light">
                                 <div class="min-w-0">
                                     <p class="truncate text-[13px] font-semibold text-black dark:text-fg">
                                         {{ $deployment->application_name }}
diff --git a/resources/views/livewire/deployments-indicator.blade.php b/resources/views/livewire/deployments-indicator.blade.php
index ff1927e6aa..7d745f7066 100644
--- a/resources/views/livewire/deployments-indicator.blade.php
+++ b/resources/views/livewire/deployments-indicator.blade.php
@@ -28,7 +28,7 @@
                         href="{{ $deployment->deployment_url }}" {{ wireNavigate() }}
                         class="flex items-start gap-3 rounded-lg border border-transparent p-3 transition-colors hover:border-neutral-200 hover:bg-neutral-50 hover:no-underline dark:border-coolgray-300 dark:hover:border-coolgray-400 dark:hover:bg-raised">
                         <div
-                            class="mt-0.5 flex size-8 shrink-0 items-center justify-center rounded-lg border border-neutral-200 bg-neutral-50 text-coollabs dark:border-coolgray-300 dark:bg-raised dark:text-warning">
+                            class="mt-0.5 flex size-8 shrink-0 items-center justify-center rounded-lg border border-neutral-200 bg-neutral-50 text-coollabs dark:border-coolgray-300 dark:bg-raised dark:text-brand-light">
                             @if ($deployment->status === 'in_progress')
                                 <svg class="size-3.5 animate-spin" xmlns="http://www.w3.org/2000/svg" fill="none"
                                     viewBox="0 0 24 24" aria-hidden="true">
@@ -73,7 +73,7 @@
         <button type="button" x-on:click="expanded = !expanded" title="{{ $deploymentLabel }}"
             aria-label="Active deployments" :aria-expanded="expanded.toString()"
             :class="expanded && 'bg-neutral-100 dark:bg-white/[0.06]'"
-            class="flex h-9 items-center gap-1.5 rounded-md px-2 text-[13px] font-medium text-coollabs transition-colors hover:bg-neutral-100 dark:text-warning dark:hover:bg-white/[0.06]">
+            class="flex h-9 items-center gap-1.5 rounded-md px-2 text-[13px] font-medium text-coollabs transition-colors hover:bg-neutral-100 dark:text-brand-light dark:hover:bg-white/[0.06]">
             <svg class="size-3.5 shrink-0 animate-spin" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
                 aria-hidden="true">
                 <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
diff --git a/resources/views/livewire/layout-popups.blade.php b/resources/views/livewire/layout-popups.blade.php
index 938b08f4cc..3306025eab 100644
--- a/resources/views/livewire/layout-popups.blade.php
+++ b/resources/views/livewire/layout-popups.blade.php
@@ -111,11 +111,11 @@
                                     </h2>
                                     <p class="mt-1 text-[12px] leading-5 text-neutral-500 dark:text-fg-dim">
                                         This will cause unusual problems on the UI. Open the
-                                        <a class="font-medium text-coollabs underline decoration-coollabs/30 underline-offset-2 transition-colors hover:text-coollabs-100 dark:text-warning dark:decoration-warning/30 dark:hover:text-warning/90"
+                                        <a class="font-medium text-coollabs underline decoration-coollabs/30 underline-offset-2 transition-colors hover:text-coollabs-100 dark:text-brand-light dark:decoration-brand-light/30 dark:hover:text-brand-light/90"
                                             href="https://coolify.io/docs/knowledge-base/server/firewall"
                                             target="_blank" rel="noopener noreferrer">required ports</a>
                                         or get help on
-                                        <a class="font-medium text-coollabs underline decoration-coollabs/30 underline-offset-2 transition-colors hover:text-coollabs-100 dark:text-warning dark:decoration-warning/30 dark:hover:text-warning/90"
+                                        <a class="font-medium text-coollabs underline decoration-coollabs/30 underline-offset-2 transition-colors hover:text-coollabs-100 dark:text-brand-light dark:decoration-brand-light/30 dark:hover:text-brand-light/90"
                                             href="https://coollabs.io/discord" target="_blank"
                                             rel="noopener noreferrer">Discord</a>.
                                     </p>
@@ -165,7 +165,7 @@
                                 <p x-show="!reminders.sponsorship.compact" x-transition.opacity
                                     class="mt-1 text-[12px] leading-5 text-neutral-500 dark:text-fg-dim">
                                     Coolify is profitable thanks to <span
-                                        class="font-semibold text-coollabs dark:text-warning">you</span>. Your support
+                                        class="font-semibold text-coollabs dark:text-brand-light">you</span>. Your support
                                     helps us build more features and keep improving the project.
                                 </p>
                             </div>
@@ -266,7 +266,7 @@
                                     Enable at least one notification channel so you receive important alerts.
                                     Visit
                                     <a href="{{ route('notifications.email') }}" {{ wireNavigate() }}
-                                        class="font-medium text-coollabs underline decoration-coollabs/30 underline-offset-2 transition-colors hover:text-coollabs-100 dark:text-warning dark:decoration-warning/30 dark:hover:text-warning/90">notifications</a>
+                                        class="font-medium text-coollabs underline decoration-coollabs/30 underline-offset-2 transition-colors hover:text-coollabs-100 dark:text-brand-light dark:decoration-brand-light/30 dark:hover:text-brand-light/90">notifications</a>
                                     to get started.
                                 </p>
                             </div>
diff --git a/resources/views/livewire/project/application/deployment/index.blade.php b/resources/views/livewire/project/application/deployment/index.blade.php
index 049bc21cb6..8b0c7e56e9 100644
--- a/resources/views/livewire/project/application/deployment/index.blade.php
+++ b/resources/views/livewire/project/application/deployment/index.blade.php
@@ -51,7 +51,7 @@
                                         @endphp
                                         <span @class([
                                             'flex size-4 shrink-0 items-center justify-center rounded-[5px] border',
-                                            'border-coollabs bg-coollabs text-white dark:border-warning dark:bg-warning dark:text-black' => $selected,
+                                            'border-coollabs bg-coollabs text-white dark:border-brand dark:bg-brand dark:text-white' => $selected,
                                             'border-neutral-300 bg-white dark:border-white/[0.14] dark:bg-white/[0.045]' => ! $selected,
                                         ])>
                                             @if ($selected)
@@ -78,7 +78,7 @@
                                         @endphp
                                         <span @class([
                                             'flex size-4 shrink-0 items-center justify-center rounded-[5px] border',
-                                            'border-coollabs bg-coollabs text-white dark:border-warning dark:bg-warning dark:text-black' => $selected,
+                                            'border-coollabs bg-coollabs text-white dark:border-brand dark:bg-brand dark:text-white' => $selected,
                                             'border-neutral-300 bg-white dark:border-white/[0.14] dark:bg-white/[0.045]' => ! $selected,
                                         ])>
                                             @if ($selected)
@@ -105,7 +105,7 @@
                                         @endphp
                                         <span @class([
                                             'flex size-4 shrink-0 items-center justify-center rounded-[5px] border',
-                                            'border-coollabs bg-coollabs text-white dark:border-warning dark:bg-warning dark:text-black' => $selected,
+                                            'border-coollabs bg-coollabs text-white dark:border-brand dark:bg-brand dark:text-white' => $selected,
                                             'border-neutral-300 bg-white dark:border-white/[0.14] dark:bg-white/[0.045]' => ! $selected,
                                         ])>
                                             @if ($selected)
diff --git a/resources/views/livewire/project/application/general.blade.php b/resources/views/livewire/project/application/general.blade.php
index 8d6c6e22ef..fd1dbe96fc 100644
--- a/resources/views/livewire/project/application/general.blade.php
+++ b/resources/views/livewire/project/application/general.blade.php
@@ -64,7 +64,7 @@
                     'application_uuid' => $application->uuid,
                 ]);
             @endphp
-            <div class="group relative flex items-center gap-3 rounded-lg border border-neutral-200 bg-neutral-50/60 px-4 py-3 transition-colors hover:bg-neutral-100 focus-within:ring-2 focus-within:ring-coollabs/40 dark:border-white/[0.07] dark:bg-white/[0.05] dark:hover:bg-white/[0.08] dark:focus-within:ring-warning/40">
+            <div class="group relative flex items-center gap-3 rounded-lg border border-neutral-200 bg-neutral-50/60 px-4 py-3 transition-colors hover:bg-neutral-100 focus-within:ring-2 focus-within:ring-coollabs/40 dark:border-white/[0.07] dark:bg-white/[0.05] dark:hover:bg-white/[0.08] dark:focus-within:ring-brand-light/40">
                 <a class="flex min-w-0 flex-1 items-center gap-3 after:absolute after:inset-0 after:content-[''] focus-visible:outline-none"
                     aria-label="{{ $domainCount > 0 ? 'Manage application domains' : 'Add an application domain' }}"
                     href="{{ $applicationDomainsUrl }}" {{ wireNavigate() }}>
@@ -160,11 +160,11 @@
                                         <div class="grid gap-4 lg:grid-cols-2">
                                             <x-forms.input x-bind:disabled="shouldDisable()"
                                                 placeholder="docker compose build" id="dockerComposeCustomBuildCommand"
-                                                helper="The compose file path (<span class='dark:text-warning'>-f</span> flag) and environment variables (<span class='dark:text-warning'>--env-file</span> flag) are automatically injected based on your Base Directory and Docker Compose Location settings. You can override by providing your own <span class='dark:text-warning'>-f</span> or <span class='dark:text-warning'>--env-file</span> flags.<br><br>If you use this, you need to specify paths relatively and should use the same compose file in the custom command, otherwise the automatically configured labels / etc won't work.<br><br>Example usage: <span class='dark:text-warning'>docker compose build</span>"
+                                                helper="The compose file path (<span class='dark:text-brand-light'>-f</span> flag) and environment variables (<span class='dark:text-brand-light'>--env-file</span> flag) are automatically injected based on your Base Directory and Docker Compose Location settings. You can override by providing your own <span class='dark:text-brand-light'>-f</span> or <span class='dark:text-brand-light'>--env-file</span> flags.<br><br>If you use this, you need to specify paths relatively and should use the same compose file in the custom command, otherwise the automatically configured labels / etc won't work.<br><br>Example usage: <span class='dark:text-brand-light'>docker compose build</span>"
                                                 label="Custom build command" />
                                             <x-forms.input x-bind:disabled="shouldDisable()"
                                                 placeholder="docker compose up -d" id="dockerComposeCustomStartCommand"
-                                                helper="The compose file path (<span class='dark:text-warning'>-f</span> flag) and environment variables (<span class='dark:text-warning'>--env-file</span> flag) are automatically injected based on your Base Directory and Docker Compose Location settings. You can override by providing your own <span class='dark:text-warning'>-f</span> or <span class='dark:text-warning'>--env-file</span> flags.<br><br>If you use this, you need to specify paths relatively and should use the same compose file in the custom command, otherwise the automatically configured labels / etc won't work.<br><br>Example usage: <span class='dark:text-warning'>docker compose up -d</span>"
+                                                helper="The compose file path (<span class='dark:text-brand-light'>-f</span> flag) and environment variables (<span class='dark:text-brand-light'>--env-file</span> flag) are automatically injected based on your Base Directory and Docker Compose Location settings. You can override by providing your own <span class='dark:text-brand-light'>-f</span> or <span class='dark:text-brand-light'>--env-file</span> flags.<br><br>If you use this, you need to specify paths relatively and should use the same compose file in the custom command, otherwise the automatically configured labels / etc won't work.<br><br>Example usage: <span class='dark:text-brand-light'>docker compose up -d</span>"
                                                 label="Custom start command" />
                                         </div>
                                         @if ($this->dockerComposeCustomBuildCommand)
@@ -478,12 +478,12 @@
                     </div>
                     @if (!$application->destination->server->isSwarm())
                         <x-forms.input placeholder="3000:3000" id="portsMappings" label="Port mappings"
-                            helper="A comma separated list of ports you would like to map to the host system. Useful when you do not want to use domains.<br><br><span class='inline-block font-bold dark:text-warning'>Format:</span> host:container<br><br><span class='inline-block font-bold dark:text-warning'>Example:</span> 3000:3000,3002:3002<br><br>Rolling update is not supported if you have a port mapped to the host."
+                            helper="A comma separated list of ports you would like to map to the host system. Useful when you do not want to use domains.<br><br><span class='inline-block font-bold dark:text-brand-light'>Format:</span> host:container<br><br><span class='inline-block font-bold dark:text-brand-light'>Example:</span> 3000:3000,3002:3002<br><br>Rolling update is not supported if you have a port mapped to the host."
                             x-bind:disabled="!canUpdate" />
                     @endif
                     @if (!$application->destination->server->isSwarm())
                         <x-forms.input id="customNetworkAliases" label="Network aliases"
-                            helper="A comma separated list of custom network aliases you would like to add for container in Docker network.<br><br><span class='inline-block font-bold dark:text-warning'>Example:</span><br>api.internal,api.local"
+                            helper="A comma separated list of custom network aliases you would like to add for container in Docker network.<br><br><span class='inline-block font-bold dark:text-brand-light'>Example:</span><br>api.internal,api.local"
                             wire:model="customNetworkAliases" x-bind:disabled="!canUpdate" />
                     @endif
                 </div>
diff --git a/resources/views/livewire/project/application/partials/domain-row.blade.php b/resources/views/livewire/project/application/partials/domain-row.blade.php
index 60f0eb38f8..b186992c8f 100644
--- a/resources/views/livewire/project/application/partials/domain-row.blade.php
+++ b/resources/views/livewire/project/application/partials/domain-row.blade.php
@@ -57,7 +57,7 @@
                         </span>
                     @endif
                     <a href="{{ $publicUrl }}" target="_blank" rel="noopener noreferrer"
-                        class="min-w-0 flex-1 truncate text-[13px] text-black underline decoration-neutral-300 underline-offset-2 hover:decoration-coollabs dark:text-fg dark:decoration-white/20 dark:hover:decoration-warning"
+                        class="min-w-0 flex-1 truncate text-[13px] text-black underline decoration-neutral-300 underline-offset-2 hover:decoration-coollabs dark:text-fg dark:decoration-white/20 dark:hover:decoration-brand-light"
                         title="{{ $publicUrl }}">
                         {{ $publicUrl }}
                     </a>
diff --git a/resources/views/livewire/project/application/preview-domains.blade.php b/resources/views/livewire/project/application/preview-domains.blade.php
index 8e8ce18b62..c84480eb9a 100644
--- a/resources/views/livewire/project/application/preview-domains.blade.php
+++ b/resources/views/livewire/project/application/preview-domains.blade.php
@@ -121,7 +121,7 @@
                                 <div class="flex min-w-0 items-center gap-2">
                                     <x-reicon name="globe" class="size-4 shrink-0 text-neutral-400 dark:text-fg-faint" />
                                     <a href="{{ getFqdnWithoutPort($row['url']) }}" target="_blank" rel="noopener noreferrer"
-                                        class="min-w-0 flex-1 truncate text-[13px] text-black underline decoration-neutral-300 underline-offset-2 hover:decoration-coollabs sm:truncate dark:text-fg dark:decoration-white/20 dark:hover:decoration-warning"
+                                        class="min-w-0 flex-1 truncate text-[13px] text-black underline decoration-neutral-300 underline-offset-2 hover:decoration-coollabs sm:truncate dark:text-fg dark:decoration-white/20 dark:hover:decoration-brand-light"
                                         title="{{ getFqdnWithoutPort($row['url']) }}">{{ getFqdnWithoutPort($row['url']) }}</a>
                                 </div>
                             </div>
diff --git a/resources/views/livewire/project/application/previews.blade.php b/resources/views/livewire/project/application/previews.blade.php
index 4abe3b4ca8..2bc373e459 100644
--- a/resources/views/livewire/project/application/previews.blade.php
+++ b/resources/views/livewire/project/application/previews.blade.php
@@ -44,7 +44,7 @@
                                                 {{ data_get($pull_request, 'title') }}
                                             </h4>
                                             <a target="_blank"
-                                                class="mt-1 inline-flex items-center gap-1 text-xs text-neutral-500 hover:text-coollabs dark:text-fg-dim dark:hover:text-warning"
+                                                class="mt-1 inline-flex items-center gap-1 text-xs text-neutral-500 hover:text-coollabs dark:text-fg-dim dark:hover:text-brand-light"
                                                 href="{{ data_get($pull_request, 'html_url') }}">
                                                 Open on GitHub
                                                 <x-external-link />
diff --git a/resources/views/livewire/project/clone-me.blade.php b/resources/views/livewire/project/clone-me.blade.php
index 184b3729c3..9e2b941e31 100644
--- a/resources/views/livewire/project/clone-me.blade.php
+++ b/resources/views/livewire/project/clone-me.blade.php
@@ -48,11 +48,11 @@
                                 wire:click="selectServer('{{ $server->id }}', '{{ $destination->uuid }}')"
                                 @class([
                                     'data-table-row clone-destinations-table-grid w-full border-b border-neutral-200 text-left last:border-b-0 dark:border-white/[0.06]',
-                                    'bg-coollabs/5 dark:bg-warning/[0.06]' => $selectedDestination === $destination->uuid,
+                                    'bg-coollabs/5 dark:bg-brand/[0.08]' => $selectedDestination === $destination->uuid,
                                 ])>
                                 <span @class([
                                     'flex size-4 items-center justify-center rounded-full border',
-                                    'border-coollabs bg-coollabs text-white dark:border-warning dark:bg-warning dark:text-black' => $selectedDestination === $destination->uuid,
+                                    'border-coollabs bg-coollabs text-white dark:border-brand dark:bg-brand dark:text-white' => $selectedDestination === $destination->uuid,
                                     'border-neutral-300 dark:border-white/[0.15]' => $selectedDestination !== $destination->uuid,
                                 ])>
                                     @if ($selectedDestination === $destination->uuid)
diff --git a/resources/views/livewire/project/database/import-form.blade.php b/resources/views/livewire/project/database/import-form.blade.php
index bc1f86c451..acc0fef8e8 100644
--- a/resources/views/livewire/project/database/import-form.blade.php
+++ b/resources/views/livewire/project/database/import-form.blade.php
@@ -125,7 +125,7 @@
                     <button type="button" @click="restoreType = 'file'"
                         class="flex min-h-20 items-center gap-3 rounded-[10px] border p-3 text-left transition-colors"
                         :class="restoreType === 'file'
-                            ? 'border-coollabs/35 bg-coollabs/[0.06] text-coollabs dark:border-warning/30 dark:bg-warning/[0.08] dark:text-warning'
+                            ? 'border-coollabs/35 bg-coollabs/[0.06] text-coollabs dark:border-brand-light/30 dark:bg-brand/[0.08] dark:text-brand-light'
                             : 'border-neutral-200 bg-white hover:border-neutral-300 dark:border-white/[0.08] dark:bg-white/[0.05] dark:hover:border-white/[0.14]'">
                         <span
                             class="flex size-9 shrink-0 items-center justify-center rounded-lg bg-neutral-100 dark:bg-white/[0.06]">
@@ -142,7 +142,7 @@
                         <button type="button" @click="restoreType = 's3'"
                             class="flex min-h-20 items-center gap-3 rounded-[10px] border p-3 text-left transition-colors"
                             :class="restoreType === 's3'
-                                ? 'border-coollabs/35 bg-coollabs/[0.06] text-coollabs dark:border-warning/30 dark:bg-warning/[0.08] dark:text-warning'
+                                ? 'border-coollabs/35 bg-coollabs/[0.06] text-coollabs dark:border-brand-light/30 dark:bg-brand/[0.08] dark:text-brand-light'
                                 : 'border-neutral-200 bg-white hover:border-neutral-300 dark:border-white/[0.08] dark:bg-white/[0.05] dark:hover:border-white/[0.14]'">
                             <span
                                 class="flex size-9 shrink-0 items-center justify-center rounded-lg bg-neutral-100 dark:bg-white/[0.06]">
@@ -184,7 +184,7 @@
                         @csrf
                     </form>
                     <div x-show="isUploading" class="mt-3 h-1.5 overflow-hidden rounded-full bg-neutral-200 dark:bg-white/[0.08]">
-                        <div class="h-full rounded-full bg-coollabs dark:bg-warning"
+                        <div class="h-full rounded-full bg-coollabs dark:bg-brand"
                             :style="`width: ${progress}%`"></div>
                     </div>
 
diff --git a/resources/views/livewire/project/index.blade.php b/resources/views/livewire/project/index.blade.php
index e1fb41db15..12c67db194 100644
--- a/resources/views/livewire/project/index.blade.php
+++ b/resources/views/livewire/project/index.blade.php
@@ -27,7 +27,7 @@
                 description="Create a project to organize your environments and resources."
                 icon-name="projects">
                 <x-slot:contents>
-                    <a class="text-[12px] font-medium text-coollabs hover:underline dark:text-warning"
+                    <a class="text-[12px] font-medium text-coollabs hover:underline dark:text-brand-light"
                         href="{{ route('onboarding') }}" {{ wireNavigate() }}>
                         Open onboarding
                     </a>
diff --git a/resources/views/livewire/project/new/public-git-repository.blade.php b/resources/views/livewire/project/new/public-git-repository.blade.php
index 8825ea3ee5..663e267272 100644
--- a/resources/views/livewire/project/new/public-git-repository.blade.php
+++ b/resources/views/livewire/project/new/public-git-repository.blade.php
@@ -29,7 +29,7 @@
                 </div>
                 <p class="mt-2 text-xs text-neutral-500 dark:text-fg-dim">
                     Need a sample? Browse
-                    <a class="font-medium text-coollabs hover:underline dark:text-warning"
+                    <a class="font-medium text-coollabs hover:underline dark:text-brand-light"
                         href="https://github.com/coollabsio/coolify-examples/" target="_blank">
                         Coolify Examples
                     </a>.
diff --git a/resources/views/livewire/project/new/select.blade.php b/resources/views/livewire/project/new/select.blade.php
index 2c20adb3a5..fad1b1727e 100644
--- a/resources/views/livewire/project/new/select.blade.php
+++ b/resources/views/livewire/project/new/select.blade.php
@@ -754,7 +754,7 @@
                     :disabled="selecting">
                     <div class="flex flex-col">
                         <div class="text-[13px] font-semibold text-black dark:text-fg">PostgreSQL 18 <span
-                                class="ml-1 rounded-full bg-coollabs/10 px-2 py-0.5 text-[10px] font-medium text-coollabs dark:bg-warning/15 dark:text-warning">Default</span>
+                                class="ml-1 rounded-full bg-coollabs/10 px-2 py-0.5 text-[10px] font-medium text-coollabs dark:bg-brand/15 dark:text-brand-light">Default</span>
                         </div>
                         <div class="mt-1 pr-8 text-[11px] leading-4 text-neutral-500 dark:text-fg-faint">
                             PostgreSQL is a powerful, open-source object-relational database system (no extensions).
diff --git a/resources/views/livewire/project/resource/index.blade.php b/resources/views/livewire/project/resource/index.blade.php
index 57dcd456d6..cf7248a905 100644
--- a/resources/views/livewire/project/resource/index.blade.php
+++ b/resources/views/livewire/project/resource/index.blade.php
@@ -111,7 +111,7 @@
                                                 <span
                                                     class="flex size-4 shrink-0 items-center justify-center rounded-[5px] border"
                                                     :class="isFilterSelected(group.key, option.value)
-                                                        ? 'border-coollabs bg-coollabs text-white dark:border-warning dark:bg-warning dark:text-black'
+                                                        ? 'border-coollabs bg-coollabs text-white dark:border-brand dark:bg-brand dark:text-white'
                                                         : 'border-neutral-300 bg-white dark:border-white/[0.14] dark:bg-white/[0.045]'">
                                                     <svg x-show="isFilterSelected(group.key, option.value)" class="size-3"
                                                         viewBox="0 0 12 12" fill="none" aria-hidden="true">
diff --git a/resources/views/livewire/project/service/partials/domain-table.blade.php b/resources/views/livewire/project/service/partials/domain-table.blade.php
index af5d672525..448bc02a3b 100644
--- a/resources/views/livewire/project/service/partials/domain-table.blade.php
+++ b/resources/views/livewire/project/service/partials/domain-table.blade.php
@@ -89,7 +89,7 @@
                                 </span>
                             @endif
                             <a href="{{ $publicUrl }}" target="_blank" rel="noopener noreferrer"
-                                class="min-w-0 flex-1 truncate text-[13px] text-black underline decoration-neutral-300 underline-offset-2 hover:decoration-coollabs [overflow-wrap:anywhere] dark:text-fg dark:decoration-white/20 dark:hover:decoration-warning"
+                                class="min-w-0 flex-1 truncate text-[13px] text-black underline decoration-neutral-300 underline-offset-2 hover:decoration-coollabs [overflow-wrap:anywhere] dark:text-fg dark:decoration-white/20 dark:hover:decoration-brand-light"
                                 title="{{ $publicUrl }}">
                                 {{ $publicUrl }}
                             </a>
diff --git a/resources/views/livewire/project/shared/configuration-checker.blade.php b/resources/views/livewire/project/shared/configuration-checker.blade.php
index 17bedcb8f5..da4d259dc4 100644
--- a/resources/views/livewire/project/shared/configuration-checker.blade.php
+++ b/resources/views/livewire/project/shared/configuration-checker.blade.php
@@ -18,7 +18,7 @@
                 <span>
                     {{ implode(', ', $missingRequiredEnvironmentVariableNames) }} must be set before this service can be deployed.
                     <a href="{{ $environmentVariablesUrl }}" {{ wireNavigate() }}
-                        class="ml-0.5 inline-flex items-center gap-0.5 font-semibold text-coollabs transition-colors hover:text-coollabs-100 dark:text-warning dark:hover:text-warning/80">
+                        class="ml-0.5 inline-flex items-center gap-0.5 font-semibold text-coollabs transition-colors hover:text-coollabs-100 dark:text-brand-light dark:hover:text-brand-light/80">
                         Open environment variables
                         <x-reicon name="arrow-right" class="size-2.5" />
                     </a>
diff --git a/resources/views/livewire/project/shared/destination.blade.php b/resources/views/livewire/project/shared/destination.blade.php
index 70a5bf5bb1..10c10e55ad 100644
--- a/resources/views/livewire/project/shared/destination.blade.php
+++ b/resources/views/livewire/project/shared/destination.blade.php
@@ -20,7 +20,7 @@
                                     {{ data_get($resource, 'destination.server.name') }}
                                 </h4>
                                 <span
-                                    class="rounded-sm bg-coollabs/10 px-1.5 py-0.5 text-[11px] font-medium text-coollabs dark:bg-warning/10 dark:text-warning">
+                                    class="rounded-sm bg-coollabs/10 px-1.5 py-0.5 text-[11px] font-medium text-coollabs dark:bg-brand/15 dark:text-brand-light">
                                     Primary
                                 </span>
                                 <x-status-summary :status="$resource->status" />
@@ -243,7 +243,7 @@
                                     {{ data_get($resource, 'destination.server.name') }}
                                 </h4>
                                 <span
-                                    class="rounded-sm bg-coollabs/10 px-1.5 py-0.5 text-[11px] font-medium text-coollabs dark:bg-warning/10 dark:text-warning">
+                                    class="rounded-sm bg-coollabs/10 px-1.5 py-0.5 text-[11px] font-medium text-coollabs dark:bg-brand/15 dark:text-brand-light">
                                     Primary
                                 </span>
                             </div>
diff --git a/resources/views/livewire/project/shared/environment-variable/add.blade.php b/resources/views/livewire/project/shared/environment-variable/add.blade.php
index 1d10980bd5..064798d570 100644
--- a/resources/views/livewire/project/shared/environment-variable/add.blade.php
+++ b/resources/views/livewire/project/shared/environment-variable/add.blade.php
@@ -25,7 +25,7 @@
         @if (!$shared)
             <div x-cloak x-show="!isMultiline" wire:key="env-value-tip"
                 class="mt-1.5 text-xs text-neutral-500 dark:text-fg-faint">
-                Tip: Type <span class="font-mono text-coollabs dark:text-warning">{{ '{{' }}</span> to reference a
+                Tip: Type <span class="font-mono text-coollabs dark:text-brand-light">{{ '{{' }}</span> to reference a
                 shared environment variable
             </div>
         @endif
diff --git a/resources/views/livewire/project/shared/environment-variable/all.blade.php b/resources/views/livewire/project/shared/environment-variable/all.blade.php
index 6c4dd401dd..4be445caba 100644
--- a/resources/views/livewire/project/shared/environment-variable/all.blade.php
+++ b/resources/views/livewire/project/shared/environment-variable/all.blade.php
@@ -114,7 +114,7 @@
                                 @endphp
                                 <span @class([
                                     'flex size-4 shrink-0 items-center justify-center rounded-[5px] border',
-                                    'border-coollabs bg-coollabs text-white dark:border-warning dark:bg-warning dark:text-black' => $selected,
+                                    'border-coollabs bg-coollabs text-white dark:border-brand dark:bg-brand dark:text-white' => $selected,
                                     'border-neutral-300 bg-white dark:border-white/[0.14] dark:bg-white/[0.045]' => ! $selected,
                                 ])>
                                     @if ($selected)
@@ -132,7 +132,7 @@
                                     <span>{{ $label }}</span>
                                     <span @class([
                                         'flex size-4 shrink-0 items-center justify-center rounded-[5px] border',
-                                        'border-coollabs bg-coollabs text-white dark:border-warning dark:bg-warning dark:text-black' => $environmentFilter === $value,
+                                        'border-coollabs bg-coollabs text-white dark:border-brand dark:bg-brand dark:text-white' => $environmentFilter === $value,
                                         'border-neutral-300 bg-white dark:border-white/[0.14] dark:bg-white/[0.045]' => $environmentFilter !== $value,
                                     ])>
                                         @if ($environmentFilter === $value)
@@ -155,7 +155,7 @@
                                     @endphp
                                     <span @class([
                                         'flex size-4 shrink-0 items-center justify-center rounded-[5px] border',
-                                        'border-coollabs bg-coollabs text-white dark:border-warning dark:bg-warning dark:text-black' => $serviceSelected,
+                                        'border-coollabs bg-coollabs text-white dark:border-brand dark:bg-brand dark:text-white' => $serviceSelected,
                                         'border-neutral-300 bg-white dark:border-white/[0.14] dark:bg-white/[0.045]' => ! $serviceSelected,
                                     ])>
                                         @if ($serviceSelected)
diff --git a/resources/views/livewire/project/shared/environment-variable/show.blade.php b/resources/views/livewire/project/shared/environment-variable/show.blade.php
index dc4436267e..5b77e024cb 100644
--- a/resources/views/livewire/project/shared/environment-variable/show.blade.php
+++ b/resources/views/livewire/project/shared/environment-variable/show.blade.php
@@ -184,7 +184,7 @@
                             <div x-cloak x-show="!isMultiline" wire:key="env-show-value-tip-{{ $env->id }}"
                                 class="mt-1.5 text-xs text-neutral-500 dark:text-fg-faint">
                                 Tip: Type <span
-                                    class="font-mono text-coollabs dark:text-warning">{{ '{{' }}</span> to reference
+                                    class="font-mono text-coollabs dark:text-brand-light">{{ '{{' }}</span> to reference
                                 a shared environment variable
                             </div>
                         @endif
diff --git a/resources/views/livewire/project/shared/tags.blade.php b/resources/views/livewire/project/shared/tags.blade.php
index 1debd351b1..efe29bf2cf 100644
--- a/resources/views/livewire/project/shared/tags.blade.php
+++ b/resources/views/livewire/project/shared/tags.blade.php
@@ -53,7 +53,7 @@
                     @foreach ($filteredTags as $tag)
                         <x-forms.button wire:key="available-tag-{{ $tag->id }}"
                             wire:click="addTag('{{ $tag->id }}')">
-                            <x-reicon name="plus" class="size-3.5 text-coollabs dark:text-warning" />
+                            <x-reicon name="plus" class="size-3.5 text-coollabs dark:text-brand-light" />
                             {{ $tag->name }}
                         </x-forms.button>
                     @endforeach
diff --git a/resources/views/livewire/security/api-tokens.blade.php b/resources/views/livewire/security/api-tokens.blade.php
index 96120b855f..d91072e77b 100644
--- a/resources/views/livewire/security/api-tokens.blade.php
+++ b/resources/views/livewire/security/api-tokens.blade.php
@@ -190,7 +190,7 @@
                                                 'inline-flex min-h-5 items-center rounded-md border px-2 py-0.5 text-[10px] font-medium',
                                                 'border-error/20 bg-error/10 text-error' => $ability === 'root',
                                                 'border-warning/20 bg-warning/10 text-warning' => in_array($ability, ['write', 'write:sensitive']),
-                                                'border-coollabs/20 bg-coollabs/10 text-coollabs dark:border-warning/20 dark:bg-warning/10 dark:text-warning' => $ability === 'deploy',
+                                                'border-coollabs/20 bg-coollabs/10 text-coollabs dark:border-brand-light/20 dark:bg-brand/15 dark:text-brand-light' => $ability === 'deploy',
                                                 'border-neutral-200 bg-neutral-100 text-neutral-600 dark:border-white/[0.08] dark:bg-white/[0.06] dark:text-fg-dim' => in_array($ability, ['read', 'read:sensitive']),
                                             ])>{{ $ability }}</span>
                                         @endforeach
diff --git a/resources/views/livewire/security/cloud-provider-token-form.blade.php b/resources/views/livewire/security/cloud-provider-token-form.blade.php
index d6f14e188d..0b065d589c 100644
--- a/resources/views/livewire/security/cloud-provider-token-form.blade.php
+++ b/resources/views/livewire/security/cloud-provider-token-form.blade.php
@@ -29,7 +29,7 @@
             class="rounded-lg border border-neutral-200 bg-neutral-50 p-3 text-[11px] leading-5 text-neutral-500 dark:border-white/[0.08] dark:bg-white/[0.05] dark:text-fg-dim">
             Create the token in the
             <a :href="providerConsoleUrl"
-                target="_blank" class="font-medium text-coollabs hover:underline dark:text-warning">
+                target="_blank" class="font-medium text-coollabs hover:underline dark:text-brand-light">
                 <span x-text="providerName + ' console'"></span>
             </a>.
         </div>
diff --git a/resources/views/livewire/security/integration-token-editor.blade.php b/resources/views/livewire/security/integration-token-editor.blade.php
index 310d32de76..a5934acc00 100644
--- a/resources/views/livewire/security/integration-token-editor.blade.php
+++ b/resources/views/livewire/security/integration-token-editor.blade.php
@@ -86,7 +86,7 @@
                 </ul>
                 <a href="{{ \App\Models\IntegrationToken::cloudflareTokenTemplateUrl($capabilities) }}"
                     target="_blank" rel="noopener noreferrer"
-                    class="font-medium text-coollabs hover:underline dark:text-warning">
+                    class="font-medium text-coollabs hover:underline dark:text-brand-light">
                     Create a replacement token in Cloudflare
                 </a>
             </div>
diff --git a/resources/views/livewire/security/private-key/show.blade.php b/resources/views/livewire/security/private-key/show.blade.php
index da9373f0f1..104a7d377f 100644
--- a/resources/views/livewire/security/private-key/show.blade.php
+++ b/resources/views/livewire/security/private-key/show.blade.php
@@ -13,7 +13,7 @@
                 <div class="lg:col-span-2">
                     <div class="mb-1.5 flex items-center justify-between gap-3">
                         <label class="text-[13px] font-medium">Private key <span class="text-helper">*</span></label>
-                        <button type="button" class="text-[11px] font-medium text-coollabs hover:underline dark:text-warning"
+                        <button type="button" class="text-[11px] font-medium text-coollabs hover:underline dark:text-brand-light"
                             x-on:click="showPrivateKey = !showPrivateKey" x-text="showPrivateKey ? 'Hide editor' : 'Edit key'"></button>
                     </div>
                     <div x-show="!showPrivateKey">
@@ -84,7 +84,7 @@
                     <div class="mb-1.5 flex items-center justify-between gap-3">
                         <label class="text-[13px] font-medium">Private key <span class="text-helper">*</span></label>
                         <button type="button"
-                            class="text-[11px] font-medium text-coollabs hover:underline dark:text-warning"
+                            class="text-[11px] font-medium text-coollabs hover:underline dark:text-brand-light"
                             x-on:click="showPrivateKey = !showPrivateKey"
                             x-text="showPrivateKey ? 'Hide editor' : 'Edit key'"></button>
                     </div>
diff --git a/resources/views/livewire/server/new/by-digital-ocean.blade.php b/resources/views/livewire/server/new/by-digital-ocean.blade.php
index 53325cfc73..17f2fad13d 100644
--- a/resources/views/livewire/server/new/by-digital-ocean.blade.php
+++ b/resources/views/livewire/server/new/by-digital-ocean.blade.php
@@ -8,7 +8,7 @@
             <p class="text-[11px] text-neutral-500 dark:text-fg-faint">
                 New to DigitalOcean?
                 <a href="https://coolify.io/digitalocean" target="_blank"
-                    class="font-medium text-coollabs hover:underline dark:text-warning">Create an account</a>
+                    class="font-medium text-coollabs hover:underline dark:text-brand-light">Create an account</a>
                 through Coolify's referral link.
             </p>
         </div>
diff --git a/resources/views/livewire/server/new/by-hetzner.blade.php b/resources/views/livewire/server/new/by-hetzner.blade.php
index 9d8ef36ee8..70b4502e1f 100644
--- a/resources/views/livewire/server/new/by-hetzner.blade.php
+++ b/resources/views/livewire/server/new/by-hetzner.blade.php
@@ -8,7 +8,7 @@
             <p class="text-[11px] text-neutral-500 dark:text-fg-faint">
                 New to Hetzner?
                 <a href="https://coolify.io/hetzner" target="_blank"
-                    class="font-medium text-coollabs hover:underline dark:text-warning">Create an account</a>
+                    class="font-medium text-coollabs hover:underline dark:text-brand-light">Create an account</a>
                 through Coolify's affiliate link.
             </p>
         </div>
diff --git a/resources/views/livewire/server/new/by-hostinger.blade.php b/resources/views/livewire/server/new/by-hostinger.blade.php
index d33e2e4cb4..ab006781c0 100644
--- a/resources/views/livewire/server/new/by-hostinger.blade.php
+++ b/resources/views/livewire/server/new/by-hostinger.blade.php
@@ -9,7 +9,7 @@
                 New to Hostinger?
                 <a href="https://www.hostinger.com/vps/coolify-hosting?ref=coolify.io" target="_blank"
                     rel="noopener noreferrer"
-                    class="font-medium text-coollabs hover:underline dark:text-warning">Create an account</a>
+                    class="font-medium text-coollabs hover:underline dark:text-brand-light">Create an account</a>
                 through Coolify's affiliate link.
             </p>
         </div>
diff --git a/resources/views/livewire/server/new/by-vultr.blade.php b/resources/views/livewire/server/new/by-vultr.blade.php
index e720065de5..e41bd8d5ca 100644
--- a/resources/views/livewire/server/new/by-vultr.blade.php
+++ b/resources/views/livewire/server/new/by-vultr.blade.php
@@ -8,7 +8,7 @@
             <p class="text-[11px] text-neutral-500 dark:text-fg-faint">
                 New to Vultr?
                 <a href="https://coolify.io/vultr" target="_blank"
-                    class="font-medium text-coollabs hover:underline dark:text-warning">Create an account</a>
+                    class="font-medium text-coollabs hover:underline dark:text-brand-light">Create an account</a>
                 through Coolify's affiliate link.
             </p>
         </div>
diff --git a/resources/views/livewire/server/resources.blade.php b/resources/views/livewire/server/resources.blade.php
index 59c57f3d2b..f0409cc498 100644
--- a/resources/views/livewire/server/resources.blade.php
+++ b/resources/views/livewire/server/resources.blade.php
@@ -14,12 +14,12 @@
             <x-slot:actions>
                 <div class="inline-flex w-fit rounded-[10px] bg-neutral-100 p-1 dark:bg-white/[0.05]">
                     <button type="button" wire:click="loadManagedContainers" wire:loading.attr="disabled" wire:target="loadManagedContainers,loadUnmanagedContainers"
-                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1 text-xs font-medium transition-colors disabled:cursor-wait {{ $activeTab === 'managed' ? 'bg-white text-neutral-950 shadow-sm dark:bg-warning/15 dark:text-warning' : 'text-neutral-500 hover:text-neutral-900 dark:text-fg-dim dark:hover:text-fg' }}">
+                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1 text-xs font-medium transition-colors disabled:cursor-wait {{ $activeTab === 'managed' ? 'bg-white text-neutral-950 shadow-sm dark:bg-brand/15 dark:text-brand-light' : 'text-neutral-500 hover:text-neutral-900 dark:text-fg-dim dark:hover:text-fg' }}">
                         <x-loading-on-button wire:loading wire:target="loadManagedContainers" />
                         Managed
                     </button>
                     <button type="button" wire:click="loadUnmanagedContainers" wire:loading.attr="disabled" wire:target="loadManagedContainers,loadUnmanagedContainers"
-                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1 text-xs font-medium transition-colors disabled:cursor-wait {{ $activeTab === 'unmanaged' ? 'bg-white text-neutral-950 shadow-sm dark:bg-warning/15 dark:text-warning' : 'text-neutral-500 hover:text-neutral-900 dark:text-fg-dim dark:hover:text-fg' }}">
+                        class="inline-flex items-center gap-1.5 rounded-md px-3 py-1 text-xs font-medium transition-colors disabled:cursor-wait {{ $activeTab === 'unmanaged' ? 'bg-white text-neutral-950 shadow-sm dark:bg-brand/15 dark:text-brand-light' : 'text-neutral-500 hover:text-neutral-900 dark:text-fg-dim dark:hover:text-fg' }}">
                         <x-loading-on-button wire:loading wire:target="loadUnmanagedContainers" />
                         Unmanaged
                     </button>
diff --git a/resources/views/livewire/settings/index.blade.php b/resources/views/livewire/settings/index.blade.php
index 963c8d1070..56a3bb59f6 100644
--- a/resources/views/livewire/settings/index.blade.php
+++ b/resources/views/livewire/settings/index.blade.php
@@ -15,7 +15,7 @@
                         'lg:col-span-2' => !str_starts_with(strtolower($fqdn ?? ''), 'https://'),
                     ])>
                         <x-forms.input canGate="update" :canResource="$settings" id="fqdn" label="URL"
-                            helper="Enter the full URL of the instance (for example, https://dashboard.example.com).<br><br><span class='text-coollabs dark:text-warning'>Important:</span> Include <b>https://</b> to secure the dashboard with HTTPS.<br><br>Passkeys are tied to this domain. If you change it, users must add their passkeys again."
+                            helper="Enter the full URL of the instance (for example, https://dashboard.example.com).<br><br><span class='text-coollabs dark:text-brand-light'>Important:</span> Include <b>https://</b> to secure the dashboard with HTTPS.<br><br>Passkeys are tied to this domain. If you change it, users must add their passkeys again."
                             placeholder="https://coolify.yourdomain.com" />
                     </div>
 
diff --git a/resources/views/livewire/storage/create.blade.php b/resources/views/livewire/storage/create.blade.php
index c0d6a6e273..d583fcd268 100644
--- a/resources/views/livewire/storage/create.blade.php
+++ b/resources/views/livewire/storage/create.blade.php
@@ -1,6 +1,6 @@
 @can('create', App\Models\S3Storage::class)
     <div class="w-full">
-        <div class="mb-4">For more details, please visit the <a class="underline dark:text-warning"
+        <div class="mb-4">For more details, please visit the <a class="underline dark:text-brand-light"
                 href="https://coolify.io/docs/knowledge-base/s3/introduction" target="_blank">Coolify Docs</a>.</div>
         <form class="flex flex-col gap-2" wire:submit='submit'>
             <div class="flex gap-2">
diff --git a/resources/views/livewire/team/danger-zone.blade.php b/resources/views/livewire/team/danger-zone.blade.php
index 10b302027b..0154d9da67 100644
--- a/resources/views/livewire/team/danger-zone.blade.php
+++ b/resources/views/livewire/team/danger-zone.blade.php
@@ -30,7 +30,7 @@
                                 </p>
                             @elseif(currentTeam()->subscription)
                                 <p>
-                                    Cancel your <a class="font-medium text-coollabs hover:underline dark:text-warning"
+                                    Cancel your <a class="font-medium text-coollabs hover:underline dark:text-brand-light"
                                         {{ wireNavigate() }} href="{{ route('subscription.show') }}">subscription</a>
                                     before deleting this team.
                                 </p>
@@ -50,7 +50,7 @@
                                 <ul class="space-y-1">
                                     @foreach ($deletionBlockers as $type => $count)
                                         <li>
-                                            <a class="font-medium text-coollabs hover:underline dark:text-warning"
+                                            <a class="font-medium text-coollabs hover:underline dark:text-brand-light"
                                                 {{ wireNavigate() }} href="{{ route($blockerDetails[$type]['route']) }}">
                                                 {{ $count }} {{ str($blockerDetails[$type]['label'])->plural($count) }}
                                             </a>
diff --git a/resources/views/livewire/team/member.blade.php b/resources/views/livewire/team/member.blade.php
index 4b1261a07a..dd8d92573a 100644
--- a/resources/views/livewire/team/member.blade.php
+++ b/resources/views/livewire/team/member.blade.php
@@ -19,7 +19,7 @@
             <span class="truncate text-[13px] font-medium text-black dark:text-fg">{{ $member->name }}</span>
             @if ($member->id === Auth::id())
                 <span
-                    class="rounded-full bg-coollabs/10 px-1.5 py-0.5 text-[10px] font-medium text-coollabs dark:bg-warning/15 dark:text-warning">
+                    class="rounded-full bg-coollabs/10 px-1.5 py-0.5 text-[10px] font-medium text-coollabs dark:bg-brand/15 dark:text-brand-light">
                     You
                 </span>
             @endif
diff --git a/resources/views/livewire/upgrade.blade.php b/resources/views/livewire/upgrade.blade.php
index 2af8873207..868f5d60b7 100644
--- a/resources/views/livewire/upgrade.blade.php
+++ b/resources/views/livewire/upgrade.blade.php
@@ -107,7 +107,7 @@
                                             <p class="text-[12px]" style="color: var(--coollabs-subtle)">
                                                 Reloading in
                                                 <span x-text="successCountdown"
-                                                    class="font-semibold text-coollabs dark:text-warning"></span>
+                                                    class="font-semibold text-coollabs dark:text-brand-light"></span>
                                                 seconds…
                                             </p>
                                             <p class="text-center text-[11px] leading-4"
@@ -146,7 +146,7 @@
 
                                     <p class="text-[12px] leading-5" style="color: var(--coollabs-subtle)">
                                         If something goes wrong, check the
-                                        <a class="font-medium text-coollabs underline decoration-coollabs/30 underline-offset-2 hover:decoration-coollabs dark:text-warning dark:decoration-warning/30 dark:hover:decoration-warning"
+                                        <a class="font-medium text-coollabs underline decoration-coollabs/30 underline-offset-2 hover:decoration-coollabs dark:text-brand-light dark:decoration-brand-light/30 dark:hover:decoration-brand-light"
                                             href="https://coolify.io/docs/upgrade" target="_blank"
                                             rel="noopener noreferrer">upgrade guide</a>
                                         or the logs on the server at