/* ============================================================
   DASHBOARD - CUSTOM THEME
   External CSS file for analytics dashboard styling
   Only affects elements within .analytics-dashboard-wrapper
   ============================================================ */

/* Force wrapper to have proper height */
.analytics-dashboard-wrapper {
    background-color: #f5f5f5 !important;
    min-height: 100vh !important;
    height: auto !important;
}

/* Fix DevExpress height - CRITICAL */
.dx-dashboard-widget-container {
    min-height: 100vh !important;
    height: auto !important;
}

/* Force dashboard surface to expand */
.analytics-dashboard-wrapper .dx-dashboard {
    background-color: #f5f5f5 !important;
    min-height: calc(100vh - 32px) !important;
    height: auto !important;
}

/* Force dashboard surface area */
.analytics-dashboard-wrapper .dx-dashboard-surface,
.analytics-dashboard-wrapper .dxdb-surface {
    min-height: calc(100vh - 32px) !important;
    height: auto !important;
}

/* ========================================
   CARD ITEMS 
   ======================================== */

.analytics-dashboard-wrapper .dx-dashboard-item-container {
    background-color: white !important;
    border: none !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1) !important;
    padding: 3px !important;
    min-height: 0px !important;

}

/* ===================================================
   GLOBAL DASHBOARD SPACING 
   =================================================== */

/* Override the default 3px gap with your own custom spacing */
.analytics-dashboard-wrapper .dx-layout-item-wrapper .dx-layout-item-container {
    margin: 3px !important; 

}


/* Force parameters modal width */
.dx-overlay-content.dx-popup-normal[role="dialog"] {
    width: 1200px !important;
    min-width: 1200px !important;
    max-width: 95vw !important;
    left: 50% !important;
    top: 5% !important;
    transform: translateX(-50%) !important;
    height: auto !important;
}