/* ─── GSOPS Mobile Responsive ─────────────────────────────────────────────── */

/* Top bar: hidden on desktop */
#mob-topbar {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0;
    height: 52px;
    background: #ffffff;
    border-bottom: 1px solid #e8edf2;
    align-items: center;
    padding: 0 0.875rem;
    gap: 0.6rem;
    z-index: 300;
    box-shadow: 0 1px 4px rgba(0,0,0,0.07);
    box-sizing: border-box;
}

/* Overlay: hidden on desktop */
#mob-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 390;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s;
}
#mob-overlay.visible {
    opacity: 1;
    pointer-events: auto;
}

/* ─── Mobile breakpoint ────────────────────────────────────────────────────── */
@media (max-width: 768px) {

    /* Show top bar */
    #mob-topbar { display: flex; }

    /* Show overlay container */
    #mob-overlay { display: block; }

    /* Sidebar: slide-over from left */
    .sidebar {
        transform: translateX(-100%);
        transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
        z-index: 400 !important;
        box-shadow: 4px 0 24px rgba(0,0,0,0.18);
    }
    .sidebar.mob-open {
        transform: translateX(0);
    }

    /* Main content: no left margin, space for top bar */
    .main-content {
        margin-left: 0 !important;
        padding-top: 52px !important;
    }

    /* Reduce main padding */
    .main-content > div {
        padding: 0.75rem !important;
    }

    /* Client profile drawer: full screen */
    #cli_panel {
        width: 100% !important;
    }

    /* Command palette: full width */
    #cmd_modal > div {
        max-width: calc(100% - 2rem) !important;
        margin: 1rem !important;
    }

    /* Safe-area padding for iOS home indicator */
    body {
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }

    /* Tables: ensure horizontal scroll works */
    .overflow-x-auto {
        -webkit-overflow-scrolling: touch;
    }

    /* Smaller base font on very narrow screens */
    .data-table th,
    .data-table td {
        font-size: 0.7rem;
        padding: 0.3rem 0.25rem;
    }
}