/**
 * Slighti Sports CMS - Main Stylesheet Loader
 *
 * This file imports all modular CSS partials.
 * Do not add direct styles here. Add them to the appropriate file in the subdirectories.
 */

/* 1. Base Styles (variables, browser resets, typography) */
@import url('base/_variables.css');
@import url('base/_reset.css');
@import url('base/_typography.css');

/* 2. Layout Styles (how the page is structured) */
@import url('layout/_page.css');
@import url('layout/_header.css');
@import url('layout/_sidebar.css');
@import url('layout/_footer.css');

/* 3. Component Styles (reusable elements) */
@import url('components/_buttons.css');
@import url('components/_forms.css');
@import url('components/_cards.css');
@import url('components/_alerts.css');
@import url('components/_tables.css');

/* 4. Page-Specific Styles (for one-off pages) */
@import url('pages/_login.css');
@import url('pages/_id-photo.css');

/* 5. Fix for sidebar overlapping main content */
.page-container {
    margin-left: 250px; /* Match the width of the sidebar */
    padding: 20px;
    transition: margin-left 0.3s ease;
}

.main-content {
    width: 100%;
    position: relative;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .page-container {
        margin-left: 60px; /* Match the collapsed sidebar width */
    }
}