/* patch file overriding conflicting styles between main site and reports
    SO FAR: bringing reports to REPORTS original style.
    TODO: unite styles
*/
.px-4:has(> .ReportsContainer),
.content:has(> .ReportsContainer),
.px-4:has(> .CreateNewReportContainer),
.content:has(> .CreateNewReportContainer),
.px-4:has(> .setting-wrapper),
.content:has(> .setting-wrapper) {
    padding: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.px-4:has(> .DashboardContainer),
.content:has(> .DashboardContainer) {
    padding: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.ReportsContainer, .DashboardContainer, div.CreateNewReportContainer, div.CreateNewReportContainer.ReportViewerScreen {
    background: var(--bg-body); /*var(--wideScreenGreyHover);*/
}

    .ReportsContainer, .DashboardContainer, div.CreateNewReportContainer, div.CreateNewReportContainer.ReportViewerScreen, .setting-wrapper {
        --inputHeight: 30px;
    }
    /**/
    .dropdownLabel, .NumericTextBoxLabel, .DropdownListLabel, .CustomMultiSelectLabel, .k-floating-label {
        background: var(--white);
    }

.CNR_exportSettingTab, .ListingHeader, .k-dialog-content .k-grid-toolbar {
    background: var(--white);
}

div.k-window.k-alert {
    border-radius: 0px;
    background: var(--white);
}

.ReportsContainer .k-grid td,
.ReportsContainer .k-grid th,
.DashboardContainer .k-grid td,
.DashboardContainer .k-grid th {
    /*border-inline-start-width: 1px !important;*/ /* Reset border */
    /*background: inherit !important;  Reset background */
}

.DashboardContainer div.k-grid-header,
.ReportsContainer div.k-grid-header {
    overflow: visible !important; /* Allow resize handles to overflow */
    padding-right: 17px !important; /* Default scrollbar width approx */
}

.ReportsContainer .k-hierarchy-cell .k-i-plus:before,
.DashboardContainer .k-hierarchy-cell .k-i-plus:before {
    content: "\e11e" !important; /* Caret Right */
}

.ReportsContainer .k-hierarchy-cell .k-i-minus:before,
.DashboardContainer .k-hierarchy-cell .k-i-minus:before {
    content: "\e121" !important; /* Caret Down */
}

.ReportsContainer .k-grid .k-grid-content,
.DashboardContainer .k-grid .k-grid-content {
    overflow: auto !important;
}


.ReportsContainer .k-grid td.k-grid-content-sticky:not(.k-grid-content-sticky + .k-grid-content-sticky),
.ReportsContainer .k-grid th.k-grid-header-sticky:not(.k-grid-header-sticky + .k-grid-header-sticky),
.ReportsContainer .k-grid td.k-grid-header-sticky:not(.k-grid-header-sticky + .k-grid-header-sticky),
.DashboardContainer .k-grid td.k-grid-content-sticky:not(.k-grid-content-sticky + .k-grid-content-sticky),
.DashboardContainer .k-grid th.k-grid-header-sticky:not(.k-grid-header-sticky + .k-grid-header-sticky),
.DashboardContainer .k-grid td.k-grid-header-sticky:not(.k-grid-header-sticky + .k-grid-header-sticky) {
    border-left: 1px solid var(--strokes) !important;
}


.ReportsContainer .CustomGroupTable,
.DashboardContainer .CustomGroupTable { /* overriding stupid calc width */
    width: auto;
}

.setting-wrapper .setting-container div.setting-content {
    padding:0px;
    width:100%;
}

.setting-wrapper div.footer {
    max-width:100%;
}

.CreateNewReportContainer div.k-grid-footer {
    padding-inline-end: 0px;
}

/*.RV_chartsView .grid-stack-item {
    min-width: 40% !important;
}*/

.CreateNewReportContainer .CustomTabsWrapper{
    height:100% !important;
}
/*.CNR_chartsView div.grid-stack-item {
    min-width: 40% !important;
}*/

.CNR_landingChartsWrapper {
    overflow: hidden;
    height: 100%;
}

.CNR_chartsView .ui-resizable-se,
.grid-stack-item > .ui-resizable-se {
    background-image: linear-gradient(135deg, transparent 50%, var(--audit-colors-grey) 50%) !important;
    background-size: 10px 10px !important;
    background-repeat: no-repeat !important;
    background-position: bottom right !important;
    width: 20px !important;
    height: 20px !important;
    bottom: 2px !important;
    right: 2px !important;
    display: block !important;
}

.CNR_chartsView .grid-stack-item-content,
.grid-stack-item-content {
    height: 100% !important;
    overflow-y: auto !important;
}

.CNR_chartsView .ui-resizable-handle,
.grid-stack-item > .ui-resizable-handle {
    z-index: 9999 !important;
    position: absolute !important;
}

.grid-stack-item.ui-draggable-dragging,
.grid-stack-item.grid-stack-item-dragging {
    z-index: 100000 !important;
}

/*.grid-stack-item {
    transform: translate(0, 0);
}*/

.ReportsContainer div.k-grid-header,
.DashboardContainer div.k-grid-header {
    padding-right: revert !important;
    padding-right: unset !important;
}

    .ReportsContainer .k-grid td:first-child:not(.k-hierarchy-cell),
    .ReportsContainer .k-grid th:first-child:not(.k-hierarchy-cell) {
        /*padding-left: 12px !important;*/
    }

.ReportsContainer .k-grid td:last-child,
.ReportsContainer .k-grid th:last-child {
    /*padding-right: 12px !important;*/
}

.CNR_chartsView .grid-stack,
.RV_chartsView .grid-stack {
    width: 100% !important;
    display: block !important;
    position: relative !important;
/*    margin: 0 !important;
    padding: 0 !important;*/
    transform: none !important; /* Parent transforms cause drag offsets; todo:check variants */
}

.CNR_chartsView .grid-stack-item,
.RV_chartsView .grid-stack-item,
.grid-stack-item {
    position: absolute !important;
    top: auto; /* allow inline js calculated style1 */
    left: auto; /* allow inline js calculated style */
    box-sizing: border-box !important;
    /*    margin: 0 !important;*/
}

.grid-stack-item-content {
    inset: 0 !important;
    position: absolute !important;
/*    width: 100% !important;
    height: 100% !important;*/
}

.grid-stack-item.ui-draggable-dragging,
.grid-stack-item.ui-resizable-resizing,
.grid-stack-item.grid-stack-item-dragging {
    z-index: 10000 !important;
    transition: none !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2) !important;
    transform: translateY(-200px) !important;
    opacity: 0.9 !important;
}
.grid-stack-placeholder {
    position: absolute !important;
    z-index: 1 !important;
}

    .grid-stack-placeholder > .placeholder-content {
        background-color: #F9F9FB !important;
        border: 2px dashed var(--grey-light) !important;
        width: 100% !important;
        height: 100% !important;
        position: absolute !important;
        top: 0;
        left: 0;
        box-sizing: border-box !important;
    }