/* --- Mobile & Tablet Responsive Styles --- */

@media (max-width: 1024px) {
    :root {
        --sidebar-width: 220px;
    }
    
    .invoice-creator-grid {
        grid-template-columns: 1fr;
    }
    .invoice-preview-container {
        position: static;
    }
}

@media (max-width: 768px) {
    .bos-sidebar {
        transform: translateX(-100%);
    }
    .bos-sidebar.mobile-active {
        transform: translateX(0);
        width: 260px;
    }
    .bos-sidebar.mobile-active .brand-name,
    .bos-sidebar.mobile-active .user-info {
        opacity: 1;
        width: auto;
        display: block;
    }
    
    .main-area, .main-area.expanded {
        margin-left: 0;
    }
    
    .bos-topbar {
        padding: 0 1rem;
    }
    
    .topbar-search {
        display: none; /* Hide search on mobile */
    }
    
    .page-container {
        padding: 1.25rem;
    }
    
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
    
    .chat-container {
        grid-template-columns: 1fr;
        height: auto;
    }
    
    .chat-channels {
        border-right: none;
        border-bottom: 1px solid var(--glass-border);
        padding: 0.5rem 0;
    }
    
    .channels-list {
        display: flex;
        overflow-x: auto;
        padding: 0.5rem;
    }
    
    .channel-item {
        padding: 0.4rem 1rem;
        white-space: nowrap;
        border-left: none;
        border-bottom: 2px solid transparent;
    }
    .channel-item.active {
        border-left: none;
        border-bottom: 2px solid var(--accent-gold);
    }
    
    .ai-panel {
        width: 100%;
        max-width: 100%;
        right: -100%;
        border-radius: 0;
        top: var(--topbar-height);
        height: calc(100vh - var(--topbar-height));
    }
    
    .item-row {
        grid-template-columns: 1fr;
        gap: 0.5rem;
        border-bottom: 1px dashed var(--glass-border);
        padding-bottom: 1rem;
    }
}

@media (max-width: 480px) {
    .topbar-right {
        gap: 0.75rem;
    }
    .company-badge {
        display: none; /* Hide company badge on very small screens */
    }
    .gps-map-container {
        height: 250px;
    }
}