/* Mobile-specific styles */
@media (max-width: 767.98px) {
    /* General */
    .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    /* Typography */
    h1 { font-size: 1.75rem !important; }
    h2 { font-size: 1.5rem !important; }
    h3 { font-size: 1.25rem !important; }
    h4 { font-size: 1.125rem !important; }
    h5 { font-size: 1rem !important; }
    h6 { font-size: 0.875rem !important; }

    /* Cards */
    .card {
        margin-bottom: 1rem;
    }
    .card-body {
        padding: 1rem;
    }

    /* Buttons */
    .mud-button-filled {
        width: 100%;
        margin-bottom: 0.5rem;
    }

    /* Navigation */
    .navbar-brand {
        max-width: 200px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        display: none;
    }

    .nav-link {
        padding: 0.5rem 1rem;
    }

    /* Forms */
    .mud-input {
        width: 100%;
    }

    .mud-select {
        width: 100%;
    }

    /* Tables */
    .mud-table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Dialogs */
    .mud-dialog {
        margin: 1rem;
        max-height: calc(100vh - 2rem);
        width: calc(100vw - 2rem) !important;
    }

    /* Footer */
    .footer {
        padding: 1rem 0;
    }
    
    /* Spacing */
    .mt-mobile-3 {
        margin-top: 1rem !important;
    }
    
    .mb-mobile-3 {
        margin-bottom: 1rem !important;
    }
    
    /* Text */
    .text-truncate-mobile {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Internal Client Specific */
    .main {
    }

    .content {
        padding: 1rem;
    }

    .mud-drawer {
        width: 100% !important;
        max-width: 100% !important;
    }

    .mud-drawer-header {
        padding: 1rem;
    }

    .mud-drawer-content {
        padding: 0;
    }

    .mud-nav-link {
        padding: 0.75rem 1rem;
    }

    .mud-nav-group > .mud-nav-link {
        padding-left: 2rem;
    }

    /* Dashboard specific */
    .dashboard-card {
        margin-bottom: 1rem;
    }

    .dashboard-stats {
        flex-direction: column;
    }

    .stat-item {
        width: 100%;
        margin-bottom: 1rem;
    }

    /* Admin pages */
    .admin-container {
        padding: 0.5rem;
    }

    .admin-toolbar {
        flex-direction: column;
        gap: 0.5rem;
    }

    .admin-toolbar .mud-button {
        width: 100%;
    }

    /* Session pages */
    .session-controls {
        flex-direction: column;
        gap: 0.5rem;
    }

    .session-grid {
        overflow-x: auto;
    }
}

/* Small devices (landscape phones) */
@media (min-width: 576px) and (max-width: 767.98px) {
    .container {
        max-width: 540px;
    }

    .admin-toolbar {
        flex-direction: row;
    }

    .admin-toolbar .mud-button {
        width: auto;
    }
}

/* Tablet devices */
@media (min-width: 768px) and (max-width: 991.98px) {
    .container {
        max-width: 720px;
    }
    
    .mud-button-filled {
        width: auto;
    }

    .mud-drawer {
        width: 240px !important;
    }
}