@page {
    size:A4 portrait !important;
    margin: 0;
    -webkit-print-color-adjust: exact !important;
    width: 1000px !important;
    
}
@media print {
    #dashboardNav{
        display: none !important;
    }
    .footer{
        display: none !important;
    }


    /************************************************************************************************************** 
    Custome Css for print only
    ***************************************************************************************************************/
    .view-dashboard.page-title {
        padding: 9px 11px 5px;
        background-color: #F1F5FB;
        border-bottom: solid 1px #ddd;
        -webkit-print-color-adjust: exact !important; 
    }
    
    /******************************* For Widgit Only ********************************************/
    .infowidget{
        border: solid 1px #f5f5f5 !important;
    }
    #sparkline-infowidget-template .card-icon, #simple-infowidget-template .card-icon {
        border-radius: 3px !important;
        background-color: #fff !important;
        font-size: 20px !important;
        top: -11px !important;
        left: 30px !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        width: 50px !important;
        height: 45px !important;
        position: absolute !important;
        color: #666 !important;
        box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(0, 0, 0, 0.4) !important;
    }
    .infowidget .trend-red {
        height: 10px !important;
        border-top-left-radius: 5px !important;
        border-bottom-left-radius: 5px !important;
        border-top-right-radius: 0.50rem !important;
        padding: 5px !important;
        width: 40% !important;
        position: absolute !important;
        right: 0 !important;
        background-image: linear-gradient(to right, #fd225a, #f88466) !important;
    }
    #sparkline-infowidget-template .card-icon i, #simple-infowidget-template .card-icon i {
        color: #8500ff !important;
    }
    .infowidget .sparkline {
        height: 20px !important;
        position: absolute !important;
        bottom: 25px !important;
    }
    div.card-stats{
        -webkit-print-color-adjust: exact !important;
    }

    /******************************* For Plotly Chart Only ********************************************/
    .js-plotly-plot{
        border: solid 1px #f5f5f5 !important;
        -webkit-print-color-adjust: exact !important;
        width: 100% !important;
    }
    .svg-container{
        position: relative !important;
        width: 100% !important;
        height: 100% !important;
    }
    #card_widget_1{
        width: 100% !important;
        height: 100% !important;
        display: block !important;
        page-break-after: always; 
        page-break-inside: avoid;
    }
}