/*****
 * BASIS-DESIGN-TOKENS der Applikation (historisch "Entwurf 2").
 *
 * Diese Datei wird in index.html IMMER geladen und enthält:
 *  - alle nicht-farblichen Gestaltungs-Tokens (Radien, Schatten-Geometrie,
 *    Abstände, Schriften, Rahmenstärken, Karten-Layout, ...)
 *  - die Farben des Standard-Modus "Low Contrast" (gedämpfte Graustufen
 *    mit violettem Einschlag)
 *
 * Direkt danach wird eine der drei Modus-Dateien geladen, die daraus
 * AUSSCHLIESSLICH Farb-Tokens überschreibt:
 *    theme-variants/mode-lowcontrast.css  (leer - diese Datei ist bereits
 *                                          der Low-Contrast-Modus)
 *    theme-variants/mode-light.css        (helles Erscheinungsbild)
 *    theme-variants/mode-dark.css         (dunkles Erscheinungsbild)
 * Umgeschaltet wird über den Button in der Modulebar (siehe
 * modules/coreframe/coreframe.js + die Modus-Logik in index.html).
 *
 * DARAUS FOLGT: Gestaltungsänderungen (Geometrie/Abstände/Schrift) gehören
 * ausschliesslich hierher - sie gelten dann automatisch für alle drei Modi.
 * Nur echte Farbunterschiede gehören in die mode-*.css.
 *
 * Frühere Vergleichs-Varianten (1. Entwurf "Mobile", "Classic", "Classic mit
 * Hintergrundbildern") liegen samt zugehörigem Switcher-Mechanismus nicht
 * mehr im Einsatz - die Dateien wurden nach theme-variants/_legacy/
 * verschoben.
 */

:root {

	/* --- Primärfarbe (Mobile/Portal: primary-800 = #342375) + Stufen --- */
	--color-primary:				#342375;	/* primary-800 */
	--color-primary-hover:			#5530c7;	/* primary-700 */
	--color-primary-active:		#221860;	/* primary-900 */
	--color-primary-light:			#e4e0ff;	/* primary-100 */
	--color-primary-lighter:		#f0eeff;	/* primary-50  */
	--color-primary-medium:		#ccc5ff;	/* primary-200 */

	--color-modulebar-bg:			var(--color-primary);
	--color-on-accent:				white;	/* Textfarbe auf farbigem Hintergrund (Caption/Tabellenkopf) */

	/* --- Fenster-/Container-Rahmen, Caption --- */
	--color-caption-bg:			var(--color-primary);
	--color-container-border-1:	#e5e7eb;	/* gray-200, neutraler Rahmen statt Farbakzent */
	--color-container-border-2:	#e5e7eb;	/* gray-200 */
	--color-danger:					#dc2626;	/* red-600 */
	--color-danger-strong:			#b91c1c;	/* red-700 */
	--color-danger-bg:				#fef2f2;	/* red-50 */
	--color-rechnung-offen:		#dc2626;	/* red-600 */
	--color-info:					#2563eb;	/* blue-600, für Icon-Farbklasse .icon-info */

	/* --- Warn-Familie (Tailwind amber) --- */
	--color-warning-bg:			#fde68a;	/* amber-200 */
	--color-warning-legend-bg:		#fcd34d;	/* amber-300 */
	--color-warning-light-bg:		#fef3c7;	/* amber-100 */
	--color-warning-light-border:	#f59e0b;	/* amber-500 */
	--color-warning-lighter-bg:	#fffbeb;	/* amber-50 */

	/* --- Flächen / Formulare / Infobar (Tailwind gray) ---
	   3. Korrektur (Nutzer-Feedback "nochmals etwas dunkler"): Body/Container/
	   Fieldset nochmals einen Schritt dunkler. */
	--color-body-bg:				#dde1e6;	/* war #e5e7eb/gray-200 */
	--color-container-bg:			#e9ecef;	/* war #f3f4f6/gray-100 */
	/* Input-Hintergrund hellgelb (Nutzerwunsch, wie das Notizfeld auf der
	   Mobile-Startseite: mobile/start.inc.php, "bg-amber-50"/"border-amber-200"
	   - hier aber bewusst NUR der Hintergrund übernommen, der Rahmen bleibt
	   grau, siehe --color-input-border). */
	--color-input-bg:				#fffbeb;	/* amber-50, war #ffffff */
	--color-input-border:			#d1d5db;	/* gray-300 - bewusst NICHT amber, auf Nutzerwunsch grau belassen */
	--color-input-focus-bg:		#fffbeb;	/* amber-50 - bleibt auch im Fokus gelb, nur der Rahmen ändert sich (siehe unten) */
	--color-input-focus-border:	var(--color-primary-hover);	/* NEU: #5530c7 (primary-700) - analog zum Mobile-Input-Fokus ("ring-2 ring-primary-700") */
	--input-focus-border-width:	2px;	/* NEU: "fett" statt der normalen 1px-Randstärke */
	--input-focus-shadow:			none;	/* Korrektur (Nutzerwunsch): der zusätzliche 3px-Ring wirkte wie ein
						   zweiter Rahmen um den ersten - der dickere violette Rand allein
						   markiert den Fokus ausreichend. */
	--color-fieldset-bg:			#dadee3;	/* war #e5e7eb - deutlich vom helleren Container abgesetzt */
	--color-infobox-bg:			#fffbeb;	/* amber-50 */
	--color-infobox-border:		#fcd34d;	/* amber-300 */
	--color-infobar-bg:			#18181b;	/* NEU: fast schwarz (zinc-900) statt gray-100 */
	--color-infobar-title:			white;		/* NEU: #pagetitle-Textfarbe auf dunkler Infobar */
	--color-separator:				#d1d5db;	/* gray-300 */
	--color-dragdrop-text:			var(--color-primary-hover);
	--dropzone-border:				2px dashed var(--color-border-light);	/* NEU */
	--dropzone-bg:					transparent;							/* NEU */
	--dropzone-radius:				var(--radius-md);						/* NEU */
	--dropzone-height:				3.5rem;									/* NEU */
	--dropzone-text:				var(--color-muted-light);				/* NEU */

	/* --- In-Fenster-Actionbar --- */
	--color-window-actionbar-bg:		var(--color-primary-hover);
	--color-window-actionbar-border:	var(--color-primary-active);

	/* --- Neutral / Text / generische Buttons --- */
	--color-text-muted:			#9ca3af;	/* NEU: hellgrau (gray-400) statt dunkelgrau - Kontrast auf schwarzer Infobar (#username rechts) */
	--color-muted-light:			#9ca3af;	/* gray-400 */
	--color-muted:					#6b7280;	/* gray-500 */
	--color-border-light:			#d1d5db;	/* gray-300 */
	--color-border-lighter:		#f3f4f6;	/* gray-100 */
	--color-hover-highlight:		var(--color-primary-medium);
	--color-highlight-bg:			var(--color-primary-light);
	--color-success:				#16a34a;	/* green-600 */
	--color-signature-muted:		#6b7280;	/* gray-500 */
	--color-placeholder-bg:			#e5e7eb;	/* gray-200 */

	/* --- Tabellen (datatable) --- */
	--color-table-header-bg:		var(--color-primary-light);	/* NEU: #e4e0ff statt gray-100 - Kopfzeile darf hervorstechen */
	--color-table-header-text:		var(--color-primary-active);	/* NEU: #221860 statt hartkodiertem Schwarz (siehe table.css) */
	--color-table-rownum-bg:		var(--color-table-header-bg);	/* Korrektur (Nutzerwunsch): identisch zur Spaltenkopf-Farbe statt dezenter (war --color-primary-lighter) */
	--color-table-rownum-text:		var(--color-table-header-text);	/* NEU: dito für die Schriftfarbe */
	/* Korrektur (Nutzer-Feedback "Alternation zu stark"): odd/even näher
	   aneinander angeglichen (Kontrast reduziert) und dabei leicht violett
	   getönt (Theme-Bezug) statt reines Grau/Weiss. --color-table-border
	   musste dabei kräftiger werden (war fast identisch mit dem alten
	   --color-table-row-even und damit auf geraden Zeilen kaum sichtbar). */
	--color-table-row-odd:			#faf9fc;	/* fast weiss, minimal violett getönt */
	--color-table-row-even:		#eeecf3;	/* helles Violett-Grau, näher an -odd als zuvor */
	--color-table-row-selected:	var(--color-primary-light);
	--color-table-input-bg:		var(--color-primary-medium);
	--color-table-border:			#c9c4d6;	/* NEU: kräftigeres Violett-Grau statt gray-200 - sonst auf den (jetzt ähnlicheren) Zeilenfarben kaum noch als Gitterlinie erkennbar */
	/* Korrektur (Nutzerwunsch): der Default-Fallback von --color-table-header-border
	   ist hartes Schwarz (Altbestand aus dem Ur-Stylesheet) - das wirkte an
	   Kopfzeile und Zeilennummern zu brutal. Jetzt ein Violett-Grau, etwas
	   kräftiger als --color-table-border, damit der Kopf abgegrenzt bleibt.
	   Die Summenzeile hat einen EIGENEN, deutlich kräftigeren Token - sie soll
	   im Gegenteil hervorstechen (siehe .total_row in auftraege/styles.css). */
	--color-table-header-border:	#b3abc7;
	--color-total-row-border:		#6e6690;
	--table-radius:					var(--radius-md);	/* NEU: obere Ecken abrunden */

	/* --- Scrollbalken der Cache-Table (vslider.js/slider.css), NEU: dezenter
	   moderner Look statt altem 3D-Button-Chrome (Redesign auf Nutzerwunsch,
	   Funktionalität/Masse unangetastet, siehe Kommentare in slider.css). --- */
	--slider-appearance:			none;
	--slider-button-bg:			transparent;
	--slider-button-bg-hover:		var(--color-primary-lighter);
	--slider-button-bg-active:		var(--color-primary-light);
	--slider-button-radius:		var(--radius-sm);
	--slider-border-style:			none;
	--slider-border-color:			transparent;
	--slider-arrow-bg:				none;					/* blendet die alte up.png/down.png-Grafik aus */
	--slider-arrow-color:			var(--color-muted, #6b7280);
	--slider-track-bg:				var(--color-border-lighter, #f3f4f6);
	--slider-track-radius:			var(--radius-sm);
	--slider-gleiter-bg:			var(--color-primary-medium);
	--slider-gleiter-bg-hover:		var(--color-primary-hover);
	--slider-gleiter-radius:		var(--radius-sm);

	/* --- Reiter-/Tab-Buttons (personen, moduleswitcher) --- */
	--color-tab-bg:					transparent;	/* NEU: keine eigene Hintergrundfarbe */
	--color-tab-selected-bg:		transparent;	/* NEU: gilt auch für .moduleswitcher .content (teilt sich den Token) */
	--color-tab-active-border:		var(--color-primary);	/* NEU: dicke Unterstreichung statt Hintergrundfarbe */
	--tab-padding-y:				0.625rem;				/* NEU: höhere Reiter */
	--tab-padding-x:				1rem;					/* NEU: bestimmt zugleich die Unterstrich-Einrückung (= Textbreite) */
	--color-tab-text:				var(--color-muted, #6b7280);		/* NEU: inaktiver Reiter-Text heller/dezenter */
	--color-tab-active-text:		var(--color-primary);				/* NEU: aktiver Reiter-Text violett statt schwarz */
	--color-adr-selected-bg:		var(--color-primary-lighter);

	/* --- Karten (personen) --- */
	--color-card-bg:				var(--color-primary-lighter);

	/* --- Dropdown-Menü (tools/menu) --- */
	--color-menu-bg:				#ffffff;
	--color-menu-border:			#e5e7eb;	/* gray-200 */
	--color-menu-hover-bg:			var(--color-primary);

	/* --- Actionbar: hell statt violett, wie Breadcrumb-Leiste in Mobile --- */
	--color-actionbar-bg:			#ffffff;	/* NEU */
	--color-actionbar-text:		#374151;	/* NEU: gray-700, neutral statt weiss-auf-violett */
	--shadow-actionbar:			0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.08);	/* NEU */

	/* --- Kleiner Schatten unter Toolbar/Modulebar --- */
	--shadow-modulebar:			0 2px 4px rgba(0, 0, 0, 0.15);	/* NEU */

	/* --- Buttons (<button>, <input type="submit">): rund, mehr Padding.
	   Korrektur (Jul 2026): volle violette Fläche wirkte auf dem hellen
	   Screen zu dominant ("knallt zu stark hervor") - jetzt zurückhaltender
	   Ghost/Outline-Stil (heller Grund, violette Schrift/Rand) statt
	   Vollton-Fläche. */
	--button-appearance:			none;			/* NEU: natives Chrome abschalten, sonst greifen bg/border nicht überall */
	--color-button-bg:				var(--color-primary-lighter);	/* Korrektur: umgekehrt - Standard jetzt blassviolett, war weiss */
	--color-button-bg-hover:		#ffffff;						/* Korrektur: umgekehrt - Hover jetzt weiss, war blassviolett */
	--color-button-bg-active:		var(--color-primary-light);
	--color-button-text:			var(--color-primary);
	--button-border:				1px solid var(--color-primary);
	--button-radius:				0.5rem;
	--button-padding:				0.5rem 1.25rem;
	--button-padding-icon-only:		0.5rem;	/* NEU: kompakt/quadratisch statt breiter Horizontal-Polsterung */
	--button-min-height:				34px;	/* NEU: reine Text-Buttons (z.B. +/-1% in auftr_avor.js) gleich hoch wie 16px-Icon-Buttons (16px Icon + 2x8px Padding + 2x1px Rand) */

	/* --- Inputs: Höhe/Radius an Buttons angleichen (NEU) --- */
	--input-padding:				0.5rem 0.75rem;
	--input-radius:					var(--button-radius);
	--input-min-height:				var(--button-min-height);	/* NEU: native <select> u.a. sonst niedriger als Buttons daneben (Auftrags-Liste: Filter/Suche) */

	/* --- Fieldsets als Karten (natives <fieldset>/<legend>) --- */
	--fieldset-border:				none;							/* Korrektur: kein Rahmen mehr, nur Fläche + Schatten */
	--shadow-fieldset:				0 2px 6px rgba(0, 0, 0, 0.14);	/* Korrektur: kräftiger (war 0.06 Deckkraft) - auf grauem statt weissem Untergrund braucht es mehr Kontrast, um nicht "verschwommen" zu wirken */
	--fieldset-radius:				var(--radius-lg);				/* NEU: 0.75rem, runder als der bisherige Standard */
	--fieldset-padding:			1.25rem 1.5rem 1.5rem;			/* Korrektur: grosszügiger */
	--fieldset-margin-bottom:		1.25rem;						/* NEU: einheitlicher Abstand zw. Karten (ersetzt die alten <br/>) */
	--color-legend-text:			#6b7280;						/* Korrektur (Screenshot-Feinschliff): heller/dezenter, gray-500 statt gray-700 */
	--legend-text-transform:		uppercase;						/* NEU */
	--legend-letter-spacing:		0.04em;							/* NEU */
	--legend-font-size:			0.9em;							/* Korrektur (Screenshot-Feinschliff): etwas grösser, war 0.8em */
	--legend-margin-bottom:		0.75rem;						/* NEU: Abstand Titel -> Karten-Inhalt */
	--standalone-button-margin:	0.75rem;						/* NEU: Luft um Buttons, die als eigene Reihe direkt in einem Fieldset stehen */

	/* --- Status-Zeilen (Auftragsliste / AVOR-Liste), 2. Korrektur (Nutzer-
	   Feedback "sieht altbacken aus"): volle Pastell-Flächen wirken immer ein
	   wenig nach Excel-Konditionalformatierung, egal wie hell der Ton ist -
	   umgestellt auf dezenten Tint (kaum sichtbar, Tailwind -50-Stufe) + einen
	   3px farbigen Balken am linken Zeilenrand (siehe table.css) als
	   Muster aus modernen Tabellen-UIs (Linear/Notion/Airtable). "normal"
	   (später zu liefernde Teile) ist hellblau getönt,
	   "erledigt" bleibt exklusiv grün. */
	/* Korrektur (Nutzer-Feedback "zu hell gegen den jetzt dunkleren Hintergrund"):
	   von -50 auf -100 angehoben - bleibt dezent (der Farbbalken links trägt
	   weiterhin die Hauptlast der Erkennbarkeit), ist aber gegen die
	   dunkleren Karten/Body-Töne (Phase 10-12) wieder sichtbar. */
	/* Korrektur (Nutzer-Feedback "etwas Sättigung raus, nicht viel"): -100-Töne
	   leicht entsättigt (etwas grauer), Akzent-Balkenfarben unverändert kräftig. */
	--color-status-overdue:		#f8e4e4;	/* red-100, entsättigt (war #fee2e2) */
	--color-status-overdue-accent:	#ef4444;	/* red-500 */
	--color-status-today:			#f8f0d9;	/* amber-100, entsättigt (war #fef3c7) */
	--color-status-today-accent:	#f59e0b;	/* amber-500 */
	--color-status-tomorrow:		#f8f4d6;	/* yellow-100, entsättigt (war #fef9c3) */
	--color-status-tomorrow-accent:	#eab308;	/* yellow-500 - bewusst anderer Ton als "today" (amber) zur Unterscheidung */
	--color-status-thisweek:		#eef4dc;	/* lime-100, entsättigt (war #ecfccb) */
	--color-status-thisweek-accent:	#84cc16;	/* lime-500 */
	--color-status-done:			#e0f0e3;	/* green-100, entsättigt (war #dcfce7) */
	--color-status-done-accent:	#22c55e;	/* green-500 */
	--color-status-normal:			#e3eef6;	/* sky-100, entsättigt - hellblau statt weiss ("später zu liefern" soll
											   sichtbar sein, aber nicht mit dem Grün von "erledigt" verwechselbar) */
	--color-status-normal-accent:	#0ea5e9;	/* sky-500 */
	--color-status-neutral:		#FFFFFF;

	/* --- Dokumente-Anzahl-Badge ("Generierte Dokumente"), NEU: heller/farbiger
	   statt neutralem Grau, damit die Zahl gegen die (Phase 10) dunkleren
	   Karten-Hintergründe deutlicher hervorsticht. --- */
	--color-doc-count-bg:			var(--color-primary-light);	/* #e4e0ff */
	--color-doc-count-text:		var(--color-primary-active);	/* #221860 */

	/* --- Schrift --- */
	--font-base:	system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--font-form:	system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	/* --- Radius / Schatten --- */
	--radius-sm:	0.375rem;
	--radius-md:	0.5rem;
	--radius-lg:	0.75rem;
	--shadow-sm:	0 1px 2px rgba(0, 0, 0, 0.06);
	--shadow-md:	0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.06);

	/* --- Mehr Luft: Captions/Container/Tabellenkopf (NEU) --- */
	--caption-padding:			0.625rem 1rem;
	--container-padding:		1.25rem;
	--table-header-padding:		0.5rem 0.75rem;

}
