/**
 * FIX MOBILE HEADER SPACING - Final Override
 * This file MUST load LAST to override all other mobile CSS
 * Ensures content starts immediately below the 60px header with NO gap
 */

@media (max-width: 768px) {
    /* Fixed header at top - 60px height */
    header,
    .app-header {
        display: flex !important;
        height: 60px !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 1000 !important;
        padding: 0 1rem !important;
        margin: 0 !important;
    }

    /* ALL page containers - start at 60px (header height) */
    main,
    #app > div,
    .page-content,
    .page,
    .dashboard-page,
    .nutrition-page,
    .training-page,
    .rehab-page,
    .community-page,
    .timetable-page,
    .profile-page {
        padding-top: 60px !important;
        margin-top: 0 !important;
        padding-bottom: calc(70px + env(safe-area-inset-bottom, 0)) !important;
    }

    /* ALL first-child elements - NO extra spacing */
    main > *:first-child,
    .page > *:first-child,
    .dashboard-page > *:first-child,
    .nutrition-page > *:first-child,
    .training-page > *:first-child,
    .rehab-page > *:first-child,
    .timetable-page > *:first-child,
    .profile-page > *:first-child,
    .page-content > *:first-child {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    /* Dashboard specific elements - NO gaps */
    .db-new {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }

    .db-topbar {
        padding: 0.5rem 1rem 0.75rem 1rem !important;
        margin-top: 0 !important;
    }

    .db-identity,
    .db-greeting-line,
    .db-dayname,
    .db-datestr {
        margin-top: 0 !important;
    }

    /* Page headers - NO extra spacing */
    .page-header,
    h1.page-title,
    .page-title-wrapper {
        margin-top: 0 !important;
        padding-top: 0.5rem !important;
    }

    /* Community layout */
    .dc-layout {
        top: 60px !important;
        bottom: 70px !important;
    }
}