
.backgrid thead th {
    color: #46b2e0 !important;
}

.backgrid {
    width: auto;
    max-width: none;
    min-width: 100%;
}

.backgrid th {
    overflow: inherit !important;
    text-overflow: inherit !important;
}
.backgrid th {
    font-size: 12px !important;
}

.backgrid tr {
    font-size: 12px !important;
}

.backgrid tr td {
    overflow: visible !important;
}


th {
    border: 1px solid #4292b5;
}

.backgrid td {
    padding-left: 1px;
    padding-right: 1px;
    font-size: 12px;
    border-right: 0.5px solid #DDD;
    border-left: 0.5px solid #DDD;
    cursor: pointer;
}


.warning {
    background-color: red !important;
    color: #FFFFFF !important;
    font-weight: bold;
}


/*row width classes*/
.heat-row {
    min-width: 70px !important;
}
    .HeatName {
        min-width: 70px !important;
    }
.HeatNameColumn {
    min-width: 70px !important;
}

.start-row {
    min-width: 150px !important;
    width: 150px !important;
    max-width: 150px !important;
}
    .Start {
        min-width: 150px !important;
        width: 150px !important;
        max-width: 150px !important;
    }

.shift-crew-row {
    min-width: 60px !important;
}
    .Shift {
        min-width: 35px !important;
    }
    .CrewId {
        min-width: 35px !important;
    }

.ProcessedWeight {
    min-width: 60px !important;
}


.ladle-times-row {
    min-width: 60px !important;
}
    .LadleWaitTime {
        min-width: 60px !important;
        max-height: 50px !important;
    }
    .LadleOpeningTime {
        min-width: 60px !important;
        max-height: 50px !important;
    }
    .LadleOpenTime {
        min-width: 60px !important;
        max-height: 50px !important;
    }


.tundish-rows { min-width: 60px !important;}
    .MinTundishTemperature { min-width: 60px !important; 
        max-height: 50px !important;}
    .AverageTundishTemperature{ min-width: 60px !important; 
        max-height: 50px !important;
    }
    .MaxTundishTemperature { min-width: 60px !important; 
        max-height: 50px !important;}
    .MinTundishWeight      { min-width: 60px !important; 
        max-height: 50px !important;}
    .AverageTundishWeight  { min-width: 60px !important; 
        max-height: 50px !important;}
    .TundishNumber {
        min-width: 35px !important;
        max-height: 50px !important;
    }


.sx-rows {
    min-width: 50px !important;
}
    .S1AverageSpeed { min-width: 50px !important;
        max-height: 50px !important;}
    .S2AverageSpeed { min-width: 50px !important;
        max-height: 50px !important;}
    .S3AverageSpeed { min-width: 50px !important;
        max-height: 50px !important;}
    .S4AverageSpeed { min-width: 50px !important;
        max-height: 50px !important;}
    .S1StrandLost { min-width: 50px !important;
        max-height: 50px !important;}
    .S2StrandLost { min-width: 50px !important;
        max-height: 50px !important;}
    .S3StrandLost { min-width: 50px !important;
        max-height: 50px !important;}
    .S4StrandLost { min-width: 50px !important;
        max-height: 50px !important;}
    .S1CastedLength { min-width: 50px !important;
        max-height: 50px !important;}
    .S2CastedLength { min-width: 50px !important;
        max-height: 50px !important;}
    .S3CastedLength { min-width: 50px !important;
        max-height: 50px !important;}
    .S4CastedLength { min-width: 50px !important;
        max-height: 50px !important;}
    .S1LubeRunningPercent { min-width: 50px !important;
        max-height: 50px !important;}
    .S2LubeRunningPercent { min-width: 50px !important;
        max-height: 50px !important;}
    .S3LubeRunningPercent { min-width: 50px !important;
        max-height: 50px !important;}
    .S4LubeRunningPercent { min-width: 50px !important;
        max-height: 50px !important;}
    .S1MoldNumber { min-width: 50px !important;
        max-height: 50px !important;}
    .S2MoldNumber { min-width: 50px !important;
        max-height: 50px !important;}
    .S3MoldNumber { min-width: 50px !important;
        max-height: 50px !important;}
    .S4MoldNumber { min-width: 50px !important;
        max-height: 50px !important;}
    .S1Products { min-width: 50px !important;
        max-height: 50px !important;}
    .S2Products { min-width: 50px !important;
        max-height: 50px !important;}
    .S3Products { min-width: 50px !important;
        max-height: 50px !important;}
    .S4Products { min-width: 50px !important;
        max-height: 50px !important;}
    .S1ProductsWeight { min-width: 50px !important;
        max-height: 50px !important;}
    .S2ProductsWeight { min-width: 50px !important;
        max-height: 50px !important;}
    .S3ProductsWeight { min-width: 50px !important;
        max-height: 50px !important;}
    .S4ProductsWeight { min-width: 50px !important;
        max-height: 50px !important;}

.modal{
    width: 650px !important;
}

.selectedItem {
    /*background-color: aliceblue;*/
    background-color: #f8e509 !important;
}

    .selectedItem td {
        font-weight: 700;
    }

.last-heats-grid-container .backgrid td {
    padding-left: 1px;
    padding-right: 1px;
    font-size: 12px;
    border-right: 0.5px solid #DDD;
    border-left: 0.5px solid #DDD;
    cursor: pointer;
}

.last-heats-grid-container .HeatName {
    min-width: 40px !important;
}

.heat-reassigned {
    color: #88c34f !important;
    font-weight: bold;
}

.onRightClickSelectedRow {
    background-color: lightblue !important;
}

    .onRightClickSelectedRow td {
        font-weight: 700;
    }

.MeltOrder{
    max-width: 130px !important;
}

/* AG Grid: header look like product-length-report (background + line below) */
.ag-theme-alpine .ag-header {
    background-color: #f8f8f8;
    border-bottom: 1px solid #babfc7;
}
/* Second header row (leaf columns) when using column groups: separator line */
.ag-theme-alpine .ag-header-row:not(:first-child) .ag-header-cell:not(.ag-header-span-height.ag-header-span-total),
.ag-theme-alpine .ag-header-row:not(:first-child) .ag-header-group-cell.ag-header-group-cell-with-group {
    border-top: 1px solid #babfc7;
}

/* AG Grid: centered headers (group and column) */
.ag-theme-alpine .ag-header-group-cell-label,
.ag-theme-alpine .ag-header-cell-label {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
}

/* AG Grid: avoid excess padding/margin on headers to prevent overlap */
.ag-theme-alpine .ag-header-cell,
.ag-theme-alpine .ag-header-group-cell {
    padding-left: 8px;
    padding-right: 8px;
    margin: 0;
}

/* AG Grid: two-line headers (Quick Shroud, Non Free Open, Proc Weight) */
.ag-theme-alpine .ag-header-cell.header-two-lines .ag-header-cell-label,
.ag-theme-alpine .ag-header-cell.header-two-lines .ag-header-cell-text {
    white-space: pre-line;
    text-align: center;
    line-height: 1.2;
}

/* Grid container: do not force horizontal scroll over pinned columns; match other AG Grid screens */
#caster-production.processes-grid-container,
.processes-grid-container.ag-theme-alpine {
    overflow: visible;
}

/* Taller header rows so two-line headers (Min Temp, Avg Temp, Min Weight, etc.) are not cut off.
   Target the grid root (.ag-theme-alpine) inside the container so --ag-header-height overrides
   the 30px from ag-grid-styles.css (the inner grid element is what .ag-header-row inherits from). */
.processes-grid-container .ag-theme-alpine {
    --ag-header-height: 48px;
}

/* AG Grid loading overlay: same as product-length-report but white (this screen only) */
.ag-theme-alpine .ag-overlay-loading-center {
    background-color: #fff;
    color: #333;
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 5px;
}

/* jQuery UI datepicker: ensure it renders above the filter bar and AG Grid.
   The datepicker div is appended to <body>, so we target it globally by ID. */
#ui-datepicker-div {
    z-index: 1100 !important;
}