/* Scroll Regions - Unified scroll behavior for the application */

/* ===================================
   SCROLL REGION CONTRACT
   ===================================
   
   HIERARCHY:
   ┌─ body (overflow: hidden)
   │  └─ .app-container (overflow: hidden)
   │     └─ .main-content (overflow: hidden) ← FIXED FRAME
   │        └─ .module-content (overflow: hidden) ← FIXED FRAME
   │           └─ SCROLL REGION ← Content scrolls here
   │              ├─ .dashboard-content (non-tabbed dashboards)
   │              ├─ .tab-content-container (tabbed workspaces)
   │              ├─ .sidebar-nav (navigation)
   │              └─ .detail-container (detail views)
   
   CONTRACT:
   - Everything above SCROLL REGION is a fixed frame (overflow: hidden)
   - SCROLL REGION elements are the ONLY vertical scroll points
   - Each scroll region gets visual scroll indicators (see ScrollIndicator atom)
   - Native scrollbars are hidden, replaced by scroll indicators
   - Horizontal scrolling for grids is separate (see grid.css)
   
   VISUAL INDICATOR:
   - The ScrollIndicator atom provides the visual component
   - See styles/atoms/ScrollIndicator/ for the indicator styling
*/

/* ===================================
   SCROLL REGION - UNIFIED BEHAVIOR
   =================================== */

/* 
   All scroll regions share these properties.
   This is the SINGLE SOURCE OF TRUTH for scroll behavior.
*/
.scroll-region,
.dashboard-content,
.sidebar-nav,
.tab-content-container,
.detail-container {
    /* Enable vertical scrolling */
    overflow-y: auto;
    overflow-x: hidden;
    
    /* Required for flex children to shrink and scroll */
    flex: 1;
    min-height: 0;
    
    /* Required for absolute-positioned scroll indicators */
    position: relative;
    
    /* Smooth scroll for better UX */
    scroll-behavior: smooth;
    
    /* Scroll padding for content visibility */
    scroll-padding-top: var(--space-4);
    scroll-padding-bottom: var(--space-4);
}

/* ===================================
   HIDE NATIVE SCROLLBARS
   =================================== */

/* 
   Native scrollbars are hidden because we use visual scroll indicators.
   This provides a cleaner UI while still indicating scrollability.
*/
.scroll-region,
.dashboard-content,
.sidebar-nav,
.tab-content-container,
.detail-container {
    /* Firefox */
    scrollbar-width: none;
    /* IE/Edge */
    -ms-overflow-style: none;
}

/* Chrome/Safari/WebKit */
.scroll-region::-webkit-scrollbar,
.dashboard-content::-webkit-scrollbar,
.sidebar-nav::-webkit-scrollbar,
.tab-content-container::-webkit-scrollbar,
.detail-container::-webkit-scrollbar {
    display: none;
}

/* Note: Horizontal scrollbars for grids are styled in grid.css and always visible */