From f1351a7577b6ab2a3f605e58835e7d296ef40f52 Mon Sep 17 00:00:00 2001
From: "Jens L." <jens@goauthentik.io>
Date: Sat, 10 May 2025 18:15:47 +0200
Subject: [PATCH] website/docs: update outdated custom CSS docs (#14441)

Signed-off-by: Jens Langhammer <jens@goauthentik.io>
---
 .../flows-stages/flow/index.md                |  2 +-
 .../interfaces/_global/customcss.mdx          | 57 -------------------
 .../customize/interfaces/_global/global.mdx   |  6 +-
 website/docs/sys-mgmt/brands.md               | 11 ++--
 4 files changed, 10 insertions(+), 66 deletions(-)
 delete mode 100644 website/docs/customize/interfaces/_global/customcss.mdx

diff --git a/website/docs/add-secure-apps/flows-stages/flow/index.md b/website/docs/add-secure-apps/flows-stages/flow/index.md
index bf39074382..82070cb499 100644
--- a/website/docs/add-secure-apps/flows-stages/flow/index.md
+++ b/website/docs/add-secure-apps/flows-stages/flow/index.md
@@ -88,4 +88,4 @@ import Defaultflowlist from "../flow/flow_list/\_defaultflowlist.mdx";
 
 - **Layout**: select how the UI displays the flow when it is executed; with stacked elements, content left or right, and sidebar left or right.
 
-- **Background**: optionally, select a background image for the UI presentation of the flow.
+- **Background**: optionally, select a background image for the UI presentation of the flow. This overrides any default background image configured in the [Branding settings](../../../sys-mgmt/brands.md#branding-settings).
diff --git a/website/docs/customize/interfaces/_global/customcss.mdx b/website/docs/customize/interfaces/_global/customcss.mdx
deleted file mode 100644
index 020a14dca9..0000000000
--- a/website/docs/customize/interfaces/_global/customcss.mdx
+++ /dev/null
@@ -1,57 +0,0 @@
-### Custom CSS
-
-To further modify the look of authentik, a custom CSS file can be created. Creating such a file is outside the scope of this document.
-
-import TabItem from "@theme/TabItem";
-import Tabs from "@theme/Tabs";
-
-<Tabs
-  defaultValue="docker-compose"
-  values={[
-    {label: 'docker-compose', value: 'docker-compose'},
-    {label: 'Kubernetes', value: 'kubernetes'},
-  ]}>
-  <TabItem value="docker-compose">
-Create a `docker-compose.override.yml` file and add this block to mount the custom CSS file:
-
-```yaml
-services:
-    server:
-        volumes:
-            - ./my-css-file.css:/web/dist/custom.css
-```
-
-Afterwards, run the upgrade commands from the latest release notes.
-
-  </TabItem>
-  <TabItem value="kubernetes">
-Create a ConfigMap with your css file:
-
-```yaml
-apiVersion: v1
-kind: ConfigMap
-metadata:
-    name: authentik-custom-css
-    namespace: authentik
-data:
-    custom.css: |
-        ...
-```
-
-Then, in the helm chart add this to your `values.yaml` file:
-
-```yaml
-volumes:
-    - name: custom-css
-      configMap:
-          name: authentik-custom-css
-volumeMounts:
-    - name: custom-css
-      mountPath: /web/dist/custom.css
-      subPath: custom.css
-```
-
-Afterwards, run the upgrade commands from the latest release notes.
-
-  </TabItem>
-</Tabs>
diff --git a/website/docs/customize/interfaces/_global/global.mdx b/website/docs/customize/interfaces/_global/global.mdx
index ba0839951e..580ddf5cd8 100644
--- a/website/docs/customize/interfaces/_global/global.mdx
+++ b/website/docs/customize/interfaces/_global/global.mdx
@@ -1,5 +1,3 @@
-## Global customization
+### Global customization
 
-import CustomCSS from "./customcss.mdx";
-
-<CustomCSS />
+See [Brand Settings](../../../sys-mgmt/brands.md#branding-settings)
diff --git a/website/docs/sys-mgmt/brands.md b/website/docs/sys-mgmt/brands.md
index ddc3ecc92d..ac20dd3078 100644
--- a/website/docs/sys-mgmt/brands.md
+++ b/website/docs/sys-mgmt/brands.md
@@ -23,11 +23,14 @@ The brand settings define the visual identity of the brand, including:
 
 - **Branding title**: Displayed in the browser tab (document title) and throughout the UI;
 - **Logo**: Appears in the sidebar/header;
-- **Favicon**: Shown on the browser tab.
 
-:::info
-Starting with authentik 2024.6.2, the placeholder `%(theme)s` can be used in the logo configuration option, which will be replaced with the active theme.
-:::
+    :::info
+    Starting with authentik 2024.6.2, the placeholder `%(theme)s` can be used in the logo configuration option, which will be replaced with the active theme.
+    :::
+
+- **Favicon**: Shown on the browser tab.
+- **Default flow background** :ak-version[2025.4]: Default background image for the flow executor, can be overridden per flow, see [Flow configuration options](../add-secure-apps/flows-stages/flow/index.md#flow-configuration-options).
+- **Custom CSS** :ak-version[2025.4]: Add custom CSS to further customize the look of authentik. Creating such a file is outside the scope of this document.
 
 ### External user settings