/* ============================================================================
   MASTER CSS - Städtisches Stiftsgymnasium Xanten
   ============================================================================
   
   Version: 2.0
   Datum: 2026-03-08
   Autor: Stef
   
   WICHTIG: Die Reihenfolge der Imports ist kritisch!
   
   1. base_font_size.css   - Setzt html-Basisgröße und DPI-Schutz
   2. variables.css        - Definiert alle CSS-Variablen
   3. breakpoints.css      - Responsive Breakpoints und Media Queries
   4. foundation.css       - Framework (optional, falls verwendet)
   5. step.css            - UI-Komponenten (optional)
   6. app.css             - Haupt-Anwendungs-Styles
   7. klassenbuch.css     - Klassenbuch-spezifische Styles
   8. raumplan.css        - Raumplan-Visualisierung
   9. bewertung.css       - Bewertungs-System
   
   ============================================================================ */

/* === SCHRITT 1: BASIS FONT-SIZE & DPI-SCHUTZ === */
@import 'base_font_size.css';

/* === SCHRITT 2: CSS-VARIABLEN === */
@import 'variables.css';

/* === SCHRITT 3: RESPONSIVE BREAKPOINTS === */
@import 'breakpoints.css';

/* === SCHRITT 4: FRAMEWORK (falls verwendet) === */
@import 'foundation.min.css?v=2'; /*/ Optional - nur bei Bedarf aktivieren */

/* === SCHRITT 5: UI-KOMPONENTEN (falls verwendet) === */
/* @import 'step.css'; */ /* Optional - nur bei Bedarf aktivieren */

/* === SCHRITT 7: MODULE === */
@import 'klassenbuch.css';
@import 'raumplan.css';
@import 'bewertung.css';

/* === SCHRITT 6: HAUPT-ANWENDUNG === */
@import 'app.css?v=8';


/*@import 'willk-modern.css';*/

/* === UTILITY CLASSES === */

/* Text-Utilities */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

/* Display-Utilities */
.hidden { display: none !important; }
.visible { display: block !important; }

/* Spacing-Utilities */
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: var(--spacing-xs) !important; }
.mt-2 { margin-top: var(--spacing-sm) !important; }
.mt-3 { margin-top: var(--spacing-md) !important; }
.mt-4 { margin-top: var(--spacing-lg) !important; }

.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: var(--spacing-xs) !important; }
.mb-2 { margin-bottom: var(--spacing-sm) !important; }
.mb-3 { margin-bottom: var(--spacing-md) !important; }
.mb-4 { margin-bottom: var(--spacing-lg) !important; }

/* === DEBUGGING (nur für Entwicklung) === */

/* Aktiviere diese Klasse, um das Grid-System sichtbar zu machen */
/*
.debug-grid * {
	outline: 1px solid rgba(255, 0, 0, 0.2);
}
*/

/* Zeige die aktuelle Breakpoint-Kategorie an */
/*
body::before {
	content: 'Mobile';
	position: fixed;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.8);
	color: white;
	padding: 0.5rem;
	z-index: 9999;
	font-size: 12px;
}

@media screen and (min-width: 40rem) {
	body::before { content: 'Tablet'; }
}

@media screen and (min-width: 64rem) {
	body::before { content: 'Desktop'; }
}

@media screen and (min-width: 90rem) {
	body::before { content: 'Large Desktop'; }
}
*/