styling

src/styles.css

@@ -43,6 +43,7 @@ body.dark-theme {
   --color-text: #ecf0f1;
   --color-text-light: #95a5a6;
   --color-body-bg: #1a202c;
+  --color-body-bg-hover: rgb(34, 41, 56);
   --color-surface: #2d3748;
   --color-border: #4a5568;
 }
@@ -68,16 +69,10 @@ body {
     color var(--transition-speed);
 }
 
-/* Globale Klasse, um das Scrollen zu unterbinden, wenn ein Overlay offen ist */
 body.no-scroll {
   overflow: hidden;
 }
 
-/* =================================================================================
- * 3. GLOBALE HELFER- & UTILITY-KLASSEN
- * Diese Klassen können überall in der Anwendung verwendet werden.
- * ================================================================================= */
-
 /* -- Textausrichtung -- */
 .text-right {
   text-align: right !important;
@@ -89,13 +84,18 @@ body.no-scroll {
   text-align: center !important;
 }
 
-/* -- Dashboard Grid Layout (da es ein grundlegendes Layout-Muster ist) -- */
 .dashboard-grid {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 1.5rem;
 }
 
+main {
+  display: grid;
+  padding: 1rem;
+  gap: 1rem;
+}
+
 .grid-col-span-1 {
   grid-column: span 1;
 }
@@ -112,7 +112,6 @@ body.no-scroll {
   grid-column: span 4;
 }
 
-/* -- Tooltip (muss global sein, da es auf jedes Element angewendet werden kann) -- */
 [data-tooltip] {
   position: relative;
 }
@@ -140,9 +139,6 @@ body.no-scroll {
   transform: translateX(-50%) translateY(-12px);
 }
 
-/* =================================================================================
- * 4. GLOBALE RESPONSIVITÄT
- * ================================================================================= */
 @media (max-width: 1200px) {
   .dashboard-grid {
     grid-template-columns: repeat(2, 1fr);
@@ -152,5 +148,7 @@ body.no-scroll {
   .dashboard-grid {
     grid-template-columns: 1fr;
   }
-  /* Stile für .main-content etc. gehören in die Layout-Komponente (z.B. demo2.component.css) */
 }
+
+/* ========================================================================================== */
+/* ========================================================================================== */