/*
 * LEAD.MARK-Farben für SFTPGo, über extra_css nach dem Standardthema geladen.
 *
 * Abgelesen am 18.09.2026 von leadmark.de (Squarespace-Palette):
 *   Gold       #c99618   accent
 *   Hellgold   #d5a940   lightAccent
 *   Anthrazit  #373636   black, auch die Schrift im Logo
 * Vorläufig, bis Alexanders offizielles CI vorliegt. Die Schrift der Seite ist
 * Aktiv Grotesk von Adobe Fonts. Sie ist lizenziert und wird hier nicht
 * eingebunden, es bleibt bei der Schrift des Themas.
 *
 * Gold ist als Fläche gesetzt und nicht als Schrift auf Weiß. Weiß auf Gold
 * erreicht 2,67:1, WCAG AA verlangt für Text 4,5:1. Deshalb steht auf goldenen
 * Knöpfen dunkle Schrift (#1e1e1e, 6,24:1). Goldene Schrift nimmt ein
 * dunkleres Gold, #85630f: 5,01:1 auf dem hellen Gold der Nebenknöpfe und
 * Brotkrumen, mehr auf Weiß. Gerechnet, nicht geschätzt.
 */

/*
 * Nicht ":root, [data-bs-theme=light]" wie im Thema. Diese Datei lädt nach dem
 * Thema, und bei gleicher Spezifität gewinnt sie auch gegen dessen Dunkelblock.
 * Am 18.09.2026 standen so die hellen Grautöne im Dunkelmodus, und Dateinamen
 * waren dunkel auf dunkel. Das :not() schließt den Dunkelmodus aus.
 */
:root:not([data-bs-theme=dark]) {
	--bs-primary: #c99618;
	--bs-primary-rgb: 201, 150, 24;
	--bs-primary-active: #b48716;
	--bs-primary-light: #faf3e1;
	--bs-primary-inverse: #1e1e1e;
	--bs-primary-clarity: rgba(201, 150, 24, 0.2);
	--bs-primary-text-emphasis: #6b500d;
	--bs-primary-bg-subtle: #f4e9cc;
	--bs-primary-border-subtle: #e6cf95;
	--bs-text-primary: #85630f;
	--bs-component-active-bg: #c99618;
	--bs-component-active-color: #1e1e1e;
	--bs-link-color: #85630f;
	--bs-link-color-rgb: 133, 99, 15;
	--bs-link-hover-color: #6b500d;
	--bs-link-hover-color-rgb: 107, 80, 13;

	/*
	 * Neutrale Grautöne statt der blaustichigen des Themas, damit Schrift und
	 * Linien zum Anthrazit des Logos passen. 800 ist genau das Anthrazit.
	 * 500 und 600 tragen Beschriftungen und bleiben über 4,5:1 auf Weiß.
	 */
	--bs-gray-200: #f2f1f1;
	--bs-gray-300: #dedddd;
	--bs-gray-400: #c7c6c6;
	--bs-gray-500: #706f6f;
	--bs-gray-600: #767575;
	--bs-gray-700: #565555;
	--bs-gray-800: #373636;
	--bs-gray-900: #242323;
	--bs-text-gray-500: #706f6f;
	--bs-text-gray-600: #767575;
	--bs-text-gray-700: #565555;
	--bs-text-gray-800: #373636;
	--bs-text-gray-900: #242323;
	--bs-body-color: #242323;
	--bs-heading-color: #242323;
	--bs-secondary-color: rgba(36, 35, 35, 0.75);
	--bs-tertiary-color: rgba(36, 35, 35, 0.5);

	/* Seitenleiste in Anthrazit statt Fast-Schwarz, wie die Schrift im Logo. */
	--bs-app-sidebar-base-bg-color: #373636;
	--bs-app-sidebar-base-border-end: 1px solid #2b2a2a;
}

[data-bs-theme=dark] {
	--bs-primary: #d5a940;
	--bs-primary-rgb: 213, 169, 64;
	--bs-primary-active: #e0bb62;
	--bs-primary-light: #2a2415;
	--bs-primary-inverse: #1e1e1e;
	--bs-primary-clarity: rgba(213, 169, 64, 0.2);
	--bs-primary-text-emphasis: #e6c57a;
	--bs-primary-bg-subtle: #2a2415;
	--bs-primary-border-subtle: #6b500d;
	--bs-text-primary: #d5a940;
	--bs-component-active-bg: #d5a940;
	--bs-component-active-color: #1e1e1e;
	--bs-link-color: #d5a940;
	--bs-link-color-rgb: 213, 169, 64;
	--bs-link-hover-color: #e6c57a;
	--bs-link-hover-color-rgb: 230, 197, 122;
	--bs-app-sidebar-base-bg-color: #1f1e1e;
	--bs-app-sidebar-base-border-end: 1px solid #2b2a2a;
}

/*
 * Goldene Schrift auf hellem Gold: das Thema nimmt dafür --bs-primary, also
 * 2,41:1. Hier die dunklere Textfarbe. Beim Überfahren greift weiter die Regel
 * des Themas mit dunkler Schrift auf vollem Gold, sie ist spezifischer.
 */
.btn.btn-light-primary,
.badge-light-primary {
	color: var(--bs-text-primary);
}

/* Diese Stellen hat das Thema fest auf sein Blau kompiliert, ohne Variable. */
.form-check-input:checked,
.form-check-input[type=checkbox]:indeterminate {
	background-color: var(--bs-primary);
	border-color: var(--bs-primary);
}

.form-range::-webkit-slider-thumb {
	background-color: var(--bs-primary);
}

.form-range::-moz-range-thumb {
	background-color: var(--bs-primary);
}

/*
 * Das Logo hat anthrazitfarbene Schrift auf durchsichtigem Grund. Auf der
 * dunklen Seitenleiste und im Dunkelmodus wird es umgekehrt. Die Farbdrehung
 * um 180 Grad holt das Gold zurück, das beim reinen Umkehren blau würde.
 */
.app-sidebar-logo img,
[data-bs-theme=dark] img[alt="Logo"] {
	filter: invert(1) hue-rotate(180deg);
}

/*
 * Anmeldeseite: das Logo steht dort mit fester Höhe (h-80px) in einer Spalte
 * von fünf Zwölfteln. Dieses Logo ist breiter als das von SFTPGo, auf 390 px
 * Breite lief es am 18.09.2026 in den Namen daneben. So passt es sich der
 * Spalte an und wird nie größer als vorher.
 */
#sign_in_form img[alt="Logo"] {
	max-width: 100%;
	height: auto !important;
	max-height: 100px;
}

/*
 * Freigabeseite ohne Passwort. Dort zeigt SFTPGo gar keine Kopfzeile, das Logo
 * erscheint nur nach der Anmeldung an einer Freigabe mit Passwort
 * ({{- else if .IsLoggedToShare}} in templates/webclient/base.html). Ein Kunde
 * bekäme sonst eine Dateiliste ohne jeden Absender.
 *
 * Nur per CSS, damit keine Vorlage von SFTPGo kopiert werden muss, die beim
 * nächsten Update veraltet. Die Bedingung trifft Seiten ohne Seitenleiste und
 * ohne eigenes Logo. Angemeldete Nutzer haben die Seitenleiste, Freigaben mit
 * Passwort ihr eigenes Logo, die Anmeldeseiten eine andere Vorlage.
 */
body:not(:has(#kt_app_sidebar)):not(:has(img[alt="Logo"])) #kt_app_wrapper::before {
	content: "";
	display: block;
	height: 50px;
	margin: 1.25rem 30px 0;
	background: url("logo.png") no-repeat left center / contain;
}

[data-bs-theme=dark] body:not(:has(#kt_app_sidebar)):not(:has(img[alt="Logo"])) #kt_app_wrapper::before {
	filter: invert(1) hue-rotate(180deg);
}