.pi-pop-wrap .dx-numberbox .dx-texteditor-input {
    text-align: right;
}

/* ==================== TALL LOG FIELD ==================== */
.txtArea-400 .dx-field-item-content {
    /* Don't set height here - let content determine it */
}

.txtArea-400 .dx-textarea,
.txtArea-400 .dx-texteditor {
    height: 400px !important;  /* ← Changed from 800px */
    min-height: 65px !important;
    max-height: none !important;
}

.txtArea-400 .dx-texteditor-container,
.txtArea-400 .dx-texteditor-input-container {
    height: 400px !important;  /* ← Changed from 800px */
    max-height: none !important;
}

.txtArea-400 textarea,
.txtArea-400 .dx-texteditor-input {
    height: 400px !important;  /* ← Changed from 800px */
    min-height: 65px !important;
    max-height: none !important;
}

/* Asked CoPilot for thicker scrollbars ... no effect */
/* Asked Claude ... CSS works */

/*******************************/
/* For dxScrollBars  */
/* Make horizontal scrollbar thicker */
.dx-datagrid .dx-scrollable-scrollbar.dx-scrollbar-horizontal {
    height: 15px !important; /* Adjust thickness as needed */
}

/* Make the scrollbar thumb (draggable part) thicker */
.dx-datagrid .dx-scrollable-scrollbar.dx-scrollbar-horizontal .dx-scrollable-scroll {
    height: 15px !important;
}

/* Keep scrollbar visible when not focused */
.dx-datagrid .dx-scrollable-scrollbar.dx-scrollbar-horizontal {
    opacity: 1 !important;
}

/* Optional: Style the scrollbar thumb */
.dx-datagrid .dx-scrollable-scrollbar.dx-scrollbar-horizontal .dx-scrollable-scroll-content {
    background-color: #888;
    border-radius: 7px;
}


/* For .UseNative(true) ... is "WebKit"  */
    /* Webkit browsers */
    #dataGrid .dx-scrollable-container::-webkit-scrollbar {
        height: 20px;
        width: 20px;
    }
    
    #dataGrid .dx-scrollable-container::-webkit-scrollbar-track {
        background: #e0e0e0;
    }
    
    #dataGrid .dx-scrollable-container::-webkit-scrollbar-thumb {
        background: #666;
        border-radius: 10px;
    }
    
    #dataGrid .dx-scrollable-container::-webkit-scrollbar-thumb:hover {
        background: #444;
    }
    
    /* Firefox */
    #dataGrid .dx-scrollable-container {
        scrollbar-width: thick;
        scrollbar-color: #666 #e0e0e0;
    }
    

/* ========================================
   FORM LAYOUT - Border Around Entire Gray Block
   ======================================== */

/* Form sections - white container */
.form-section {
    background: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 20px;
    margin-bottom: 20px;
}
.dx-multiview-item-content .form-section {
    border: none;
}



.dx-tabpanel .dx-multiview-wrapper {
    border-radius: 0 0 5px 5px;
}

/* Section titles - blue underline */
.section-title {
    font-size: 16px;
    font-weight: 600;
    color: #2c3e50;
    margin: 0 0 16px 0;
    padding-bottom: 8px;
    border-bottom: 2px solid #3498db;
}


/* WRAPPER: Border around entire row group */
.rows-container {

    max-height: calc(47vh - 120px);
    overflow-y: auto;
    overflow-x: hidden;

    /*  border: 1px solid #e9ecef !important;
    border-radius: 4px !important;
    overflow: hidden;*/ /* Keeps row backgrounds inside border */

    /*
    overflow-y: auto;
    overflow-x: hidden;
    padding: 15px;
    */

}

/* Bootstrap rows - gray background, NO individual borders */
.form-section .row {
    /*    background: #f8f9fa;*/
    border: none !important;
    border-radius: 0 !important;
    /* padding: 8px 5px 12px 5px;*/
    overflow: visible;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
}

/* Remove space between rows */
    .form-section .row + .row {
        margin-top: 0;
         border-top: none !important;
    }

/* Horizontal field layout */
.form-field-horizontal {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    margin-bottom: 0 !important;
    padding: 3px 0 !important;

    min-height: 36px;
}

/* Remove border from last field in each column */
.form-field-horizontal:last-child {
    /*border-bottom: none;*/
}

/* Label - fixed width on left */
.form-field-horizontal > label {
    flex: 0 0 140px !important;
    max-width: 140px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #34495e !important;
    margin: 0 !important;
    padding-right: 10px !important;
    text-align: right !important;
    line-height: 27px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* DevExtreme components - take remaining space */
.form-field-horizontal > .dx-textbox,
.form-field-horizontal > .dx-numberbox,
.form-field-horizontal > .dx-selectbox,
.form-field-horizontal > .dx-datebox {
    flex: 1 !important;
    min-width: 0 !important;
    margin: 2px 0 !important;
}

.required {
    color: #e74c3c;
}

/* Tab Content */
.tab-content {
    padding: 20px;
    background: #ffffff;
}

/* Wrapper for rows in tabs too */
.tab-content .rows-container {
    border: 1px solid #e9ecef !important;
    border-radius: 4px !important;
    overflow: hidden;
}

.tab-content .row {
    background: #f8f9fa;
    border: none !important;
    border-radius: 0 !important;
    padding: 8px 15px;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
}

.tab-content .row + .row {
    margin-top: 0;
    border-top: none !important;
}

/* Grid Section */
.grid-section {
    background: white;
    padding: 15px;
    border-radius: 6px;
    margin-top: 20px;
}

/* Footer */
.extensions-footer {
    padding: 20px;
    background: #f8f9fa;
    border-radius: 6px;
    text-align: center;
}

/* ==================== COMPACT INPUTS (26px) ==================== */

.dx-texteditor,
.dx-numberbox,
.dx-selectbox,
.dx-datebox {


}

.dx-texteditor-container {
    min-height: 27px !important;
    height: 27px !important;
    display: flex !important;
    align-items: center !important;
}

.dx-texteditor-input-container {
    min-height: 27px !important;
    height: 27px !important;
    display: flex !important;
    align-items: center !important;
}

.dx-texteditor-input {
    padding: 3px 8px !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    height: 27px !important;

    color: #2c3e50 !important;
    position: relative !important;
    z-index: 2 !important;

    box-sizing: border-box !important; /* ← ADD THIS */
}

/* Placeholder */
.dx-placeholder {
    line-height: 27px !important;
    top: 0 !important;
    left: 0 !important;
    font-size: 13px !important;
    height: 27px !important;
    padding: 0 8px !important;
    color: #999 !important;
    position: absolute !important;
    z-index: 1 !important;
    pointer-events: none !important;
    display: flex !important;
    align-items: center !important;
}

.dx-texteditor:not(.dx-texteditor-empty) .dx-placeholder {
    opacity: 0 !important;
    visibility: hidden !important;
}

/* Dropdown Icons - Centered */
.dx-dropdowneditor-button {
    width: 27px !important;
    height: 27px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
}

.dx-dropdowneditor-icon {
    font-size: 14px !important;
    line-height: 1 !important;
    margin: 0 !important;
    position: static !important;
}

.dx-dropdowneditor-button-visible .dx-texteditor-input {
    padding-right: 27px !important;
}

/* NumberBox Spin Buttons */
.dx-numberbox-spin-container {
    width: 24px !important;
    display: flex !important;
    flex-direction: column !important;
}

.dx-numberbox-spin-button {
    height: 13px !important;
    width: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.dx-numberbox-spin-icon {
    font-size: 11px !important;
    line-height: 1 !important;
    margin: 0 !important;
    position: static !important;
}

.dx-numberbox-spin-up {
    border-bottom: 1px solid #ddd;
}

/* Focus States */
.dx-textbox.dx-state-focused,
.dx-numberbox.dx-state-focused,
.dx-selectbox.dx-state-focused,
.dx-datebox.dx-state-focused {
    border-color: #3498db;
    box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.1);
}

/* Invalid States */
.dx-invalid {
    border-color: #e74c3c !important;
}

.dx-invalid.dx-state-focused {
    box-shadow: 0 0 0 2px rgba(231, 76, 60, 0.1) !important;
}

/* Responsive */
@media (max-width: 768px) {
    .form-field-horizontal {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
    
    .form-field-horizontal > label {
        text-align: left !important;
        padding-right: 0 !important;
        margin-bottom: 3px !important;
    }
}



/* ==================== TAB SECTIONS ==================== */

/* Tab sections with sub-titles */
.tab-section {
    margin-bottom: 20px;
}

.tab-section-title {
    font-size: 14px;
    font-weight: 600;
    color: #2c3e50;
    margin: 0 0 12px 0;
    padding-bottom: 6px;
    border-bottom: 1px solid #3498db;
}

/* ==================== VERTICAL FIELD LAYOUT (for textarea) ==================== */

.form-field-vertical {
    display: flex;
    flex-direction: column;
    padding: 8px;
}

.form-field-vertical > label {
    font-size: 12px;
    font-weight: 500;
    color: #34495e;
    margin-bottom: 4px;
}

#dGrid_ID{
    margin: 0 15px 0 15px;
}
/* ==================== TEXTAREA SPECIFIC ==================== */

.dx-textarea {
    background: #ffffff ;
}

.dx-textarea .dx-texteditor-container {
}

.dx-textarea .dx-texteditor-input {
    padding: 8px !important;
    line-height: 1.4 !important;
    font-family: 'Courier New', monospace !important;
    font-size: 12px !important;
}





/* ========================================
   COMPACT FORM - 26px Inputs
   Centered placeholders + 2px vertical spacing
   ======================================== */

/* Form container 
.dx-form {
    background: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}*/


/* ==================== GROUP FORMATTING ==================== */

/* Form groups - keep visual separation */
.dx-form-group {
    margin-bottom: 16px;
}

/* Group captions/headers - maintain styling */
.dx-form-group-caption {
    font-size: 16px;
    font-weight: 600;
    color: #2c3e50;
    padding-bottom: 8px;
    border-bottom: 2px solid #3498db;
    margin-bottom: 12px;
}

/* Card-style sections (if using) */
.dx-form-group-with-caption {
    /*    background: #f8f9fa;*/
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 16px;
    margin-bottom: 16px;
}

/* ==================== FIELD SPACING - ULTRA TIGHT ==================== */

/* Individual fields - ONLY 2px total vertical spacing */
.dx-field {
    margin-bottom: 2px !important; /* Only 2px between fields */
    padding: 0 !important;
}

/* Field value containers */
.dx-field-value {
    padding: 0 !important;
    margin: 0 !important;
}

/* Labels - compact, no extra spacing */
.dx-field-label {
    font-weight: 500;
    color: #34495e;
    font-size: 12px;
    padding: 0 !important;
    margin-bottom: 2px !important; /* Minimal spacing */
    margin-top: 0 !important;
    text-align: left !important;
    line-height: 1.2;
}

/* Required field indicator */
.dx-field-label:after {
    content: " *";
    color: #e74c3c;
}

/* ==================== INPUT HEIGHTS - 26px ==================== */

/* All text-based editors - 26px height */
.dx-texteditor:not(.dx-textarea),
.dx-textbox,
.dx-numberbox,
.dx-selectbox,
.dx-datebox,
.dx-lookup,
.dx-autocomplete {
    height: 27px !important;
    min-height: 27px !important;
    max-height: 27px !important;
    background: #ffffff ; /* White input background */
}

/* Editor containers */
.dx-texteditor-container:not(.dx-textarea .dx-texteditor-container) {
    min-height: 27px !important;
    height: 27px !important;
    max-height: 27px !important;
    display: flex !important;
    align-items: center !important;
}

.dx-texteditor-input-container:not(.dx-textarea .dx-texteditor-input-container) {
    min-height: 27px !important;
    height: 27px !important;
    max-height: 27px !important;
    display: flex !important;
    align-items: center !important;
}

/* Input fields themselves - white background, CENTERED */
.dx-texteditor-input:not(.dx-textarea .dx-texteditor-input) {
    padding: 3px 8px !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    height: 27px !important;
    min-height: 27px !important;

    display: flex !important;
    align-items: center !important;
}

/* Placeholder text - CENTERED */
.dx-placeholder {
    line-height: 27px !important; /* Match input height */
    top: 0 !important; /* Reset positioning */
    font-size: 13px !important;
    display: flex !important;
    align-items: center !important;
    height: 27px !important;
    padding: 0 8px !important;
}

/* ==================== DROPDOWN ICONS - CENTERED ==================== */

/* SelectBox/DateBox dropdown buttons - CENTERED */
.dx-dropdowneditor-button {
    width: 27px !important;
    height: 27px !important;
    min-height: 27px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
}

.dx-dropdowneditor-icon {
    font-size: 14px !important;
    line-height: 1 !important;
    margin: 0 !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
}

/* Input with dropdown button - adjust padding */
.dx-dropdowneditor-button-visible .dx-texteditor-input {
    padding-right: 27px !important;
}

/* Clear button (X) - CENTERED */
.dx-clear-button-area {
    width: 27px !important;
    min-width: 27px !important;
    height: 27px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.dx-icon-clear {
    font-size: 14px !important;
    line-height: 1 !important;
    margin: 0 !important;
    position: static !important;
}

/* ==================== NUMBERBOX - CENTERED ICONS ==================== */

/* NumberBox spin buttons - CENTERED */
.dx-numberbox-spin-container {
    width: 24px !important;
    display: flex !important;
    flex-direction: column !important;
}

.dx-numberbox-spin-button {
    height: 13px !important;
    width: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.dx-numberbox-spin-icon {
    font-size: 11px !important;
    line-height: 1 !important;
    margin: 0 !important;
    position: static !important;
}

.dx-numberbox-spin-up {
    border-bottom: 1px solid #ddd;
}

.dx-numberbox-spin-buttons-container .dx-texteditor-input {
    padding-right: 24px !important;
}

/* ==================== TAGBOX ==================== */

/* TagBox - compact tags */
.dx-tagbox {
    min-height: 27px !important;
    height: auto !important;
    background: #ffffff ;
}

.dx-tagbox .dx-texteditor-input {
    min-height: 27px !important;
    padding: 2px 6px !important;
    background: #ffffff ;
}

.dx-tag {
    height: 20px !important;
    margin: 2px !important;
    padding: 2px 8px !important;
    font-size: 12px !important;
    line-height: 16px !important;
    background: #e9ecef !important; /* Light gray tags */
}

.dx-tag-content {
    line-height: 16px !important;
}

.dx-tag-remove-button {
    width: 14px !important;
    height: 14px !important;
    margin-left: 4px !important;
}

/* ==================== TEXTAREA ==================== */

/* TextArea - specific height control */
.dx-textarea {
    min-height: 65px !important;
    background: #ffffff ;
}

    .dx-textarea .dx-texteditor-container {
        min-height: 65px !important;
    }

    .dx-textarea .dx-texteditor-input-container {
        height: auto !important;
        min-height: 65px !important;
    }

    .dx-textarea .dx-texteditor-input {
        min-height: 60px !important;
        padding: 5px 8px !important;
        line-height: 1.4 !important;
        font-size: 13px !important;
        background: #ffffff ;
    }
    /* TextArea - specific height control */
    .dx-textarea,
    .dx-textarea.dx-texteditor {
        max-height: none !important;
        background: #ffffff;
    }

        .dx-textarea .dx-texteditor-container,
        .dx-textarea.dx-texteditor .dx-texteditor-container {
            max-height: none !important;
        }

        .dx-textarea .dx-texteditor-input-container,
        .dx-textarea.dx-texteditor .dx-texteditor-input-container {
            max-height: none !important;
        }

        .dx-textarea .dx-texteditor-input,
        .dx-textarea.dx-texteditor .dx-texteditor-input,
        .dx-textarea textarea {
            max-height: none !important;
            padding: 8px !important;
            line-height: 1.4 !important;
            font-size: 13px !important;
            background: #ffffff ;
        }

/* ==================== CHECKBOX/RADIO ==================== */

/* Checkbox - compact */
.dx-checkbox {
    min-height: 20px !important;
    height: 20px !important;
}

.dx-checkbox-container {
    height: 20px !important;
}

.dx-checkbox-icon {
    width: 16px !important;
    height: 16px !important;
    font-size: 12px !important;
}

.dx-checkbox-text {
    padding-left: 6px !important;
    font-size: 13px !important;
    line-height: 20px !important;
}

/* Radio button - compact */
.dx-radiobutton {
    height: 20px !important;
    min-height: 20px !important;
}

.dx-radiobutton-icon {
    width: 16px !important;
    height: 16px !important;
}

.dx-radiobutton-icon-dot {
    width: 8px !important;
    height: 8px !important;
}

.dx-radiogroup-item {
    margin-bottom: 2px !important; /* Tight spacing */
}

/* Radio group horizontal spacing */
.dx-radiogroup.dx-layout-horizontal .dx-radiogroup-item {
    margin-right: 14px !important;
}

/* ==================== SWITCH ==================== */

/* Switch - compact */
.dx-switch {
    height: 20px !important;
}

.dx-switch-container {
    height: 18px !important;
    width: 34px !important;
}

.dx-switch-handle {
    width: 14px !important;
    height: 14px !important;
    top: 2px !important;
}

.dx-switch-on .dx-switch-handle {
    left: 18px !important;
}

/* ==================== BUTTONS ==================== */

/* Form buttons */
.dx-form .dx-button {
    margin-right: 10px;
    min-width: 90px;
    padding: 5px 14px !important;
    font-weight: 500;
    height: 28px !important;
    font-size: 13px !important;
}

.dx-button-content {
    padding: 0 !important;
    line-height: 18px !important;
}

.dx-button-text {
    font-size: 13px !important;
}

/* Button styling */
.dx-button-success {
    background: #27ae60;
    border-color: #27ae60;
}

.dx-button-success:hover {
    background: #229954;
}

/* ==================== VALIDATION ==================== */

/* Validation messages */
.dx-field-item-validation-msg {
    color: #e74c3c;
    font-size: 11px;
    margin-top: 2px;
    display: flex;
    align-items: center;
    line-height: 1.2;
}

.dx-field-item-validation-msg:before {
    content: "⚠";
    margin-right: 5px;
    font-size: 13px;
}

/* Helper text */
.dx-field-item-help-text {
    color: #7f8c8d;
    font-size: 11px;
    margin-top: 2px;
    font-style: italic;
    line-height: 1.2;
}

.dx-field-item-help-text:before {
    content: "ℹ️ ";
    margin-right: 4px;
}

/* Invalid state */
.dx-invalid {
    border-color: #e74c3c !important;
}

.dx-invalid.dx-state-focused {
    box-shadow: 0 0 0 2px rgba(231, 76, 60, 0.1) !important;
}

/* ==================== FOCUS STATES ==================== */

/* Focus states */
.dx-textbox.dx-state-focused,
.dx-numberbox.dx-state-focused,
.dx-selectbox.dx-state-focused,
.dx-datebox.dx-state-focused {
    border-color: #3498db;
    box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.1);
}

/* ==================== HORIZONTAL COLUMN SPACING ==================== */

/* Column spacing in multi-column layouts - 2px extra per side */
.dx-col-0,
.dx-col-1,
.dx-col-2,
.dx-col-3 {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

/* First column - no left padding */
.dx-col-0 {
    padding-left: 0 !important;
}

/* Last column - no right padding */
.dx-last-col {
    padding-right: 0 !important;
}

/* ==================== LAYOUT OVERRIDES ==================== */

/* Remove default DevExtreme spacing overrides */
.dx-field-item {
    padding: 0 !important;
    margin: 0 !important;
}

.dx-layout-manager .dx-field-item-label-location-top {
    padding-bottom: 0 !important;
}

/* ==================== TABS (if using tabbed forms) ==================== */

/* Tabbed forms */
.dx-tabpanel {
    border: none;
}

.dx-tabpanel .dx-tab {
    border-radius: 4px 4px 0 0;
    margin-right: 4px;
    padding: 7px 14px !important;
    font-size: 13px !important;
}

    .dx-tabpanel .dx-tab-selected {
        background: #99bbd3;
        color: white;
    }

.dx-multiview-wrapper {
    padding-top: 12px;
}

/* ==================== RESPONSIVE ==================== */

/* Mobile responsive */
@media (max-width: 768px) {
    .dx-form {
        padding: 15px;
    }
    
    .dx-field {
        margin-bottom: 2px !important;
    }
    
    .dx-field-label {
        text-align: left !important;
        padding-bottom: 2px;
        font-size: 12px;
    }
    
    .dx-form-group-caption {
        font-size: 15px;
    }

    /* Remove horizontal spacing on mobile */
    .dx-col-0,
    .dx-col-1,
    .dx-col-2,
    .dx-col-3 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* ==================== FILE UPLOADER ==================== */

/* FileUploader button */
.dx-fileuploader-button {
    height: 27px !important;
    padding: 3px 10px !important;
    font-size: 13px !important;
}

/* ==================== COLOR BOX ==================== */

/* ColorBox */
.dx-colorbox {
    height: 27px !important;
    background: #ffffff ;
}

.dx-colorbox-input-container {
    height: 27px !important;
}

/* ==================== LOOKUP ==================== */

/* Lookup field */
.dx-lookup-field {
    padding: 3px 8px !important;
    line-height: 20px !important;
    font-size: 13px !important;
}

/* ==================== TOP MENU ==================== */

#HeaderPane
{
    padding:0;
}

.dxmLite .dxm-main .dxm-hovered {
    background-color: #99bbd3 !important;
    color:black !important;
}

.dxmLite .dxm-main {
    border: none;
    background-color: #f7f7f7;
    padding: 1px;
}

.dxmLite .dxm-popup .dxm-gutter
{
    background-image: none;
}
.dxm-hovered {
    background-color: #f7f7f7;
    color: #1080cb;
    /* border-bottom: none; */
    border: none !important;
}
.dxm-content .dxm-hasText {
    padding: 14px;
}

.dxmLite .dxm-popup .dxm-selected {
    background-color: #99bbd3 !important;
}
/* ==================== SPECIFIC FORM SECTIONS ==================== */
/* If you use custom section classes */
.form-section {
    background: #ffffff;
    border: 1px solid #e1e8ed;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
}

  /*  .form-section:hover {
        box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    }*/

 .dx-multiview-wrapper:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
}
.dx-multiview-item-content {
    min-height: 50vh;
}
.form-section:not(.dx-multiview-wrapper .form-section):hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
/* Financial section example */
.financial-section {
    background: #ffffff ;
    border: 2px solid #3498db;
    border-radius: 8px;
}

.financial-section .dx-field-item-content {
    background: #e3f2fd; /* Light blue tint for financial fields */
}

/* Action buttons area */
.form-actions {
    background: #f8f9fa;
    padding: 16px;
    border-radius: 8px;
    margin-top: 20px;
}

/* Form divider */
.form-divider {
    height: 1px;
    background: linear-gradient(to right, transparent, #ddd, transparent);
    margin: 24px 0;
}



/* Ultra-Tight Vertical Spacing (1px total): */
.dx-field {
    margin-bottom: 1px !important; /* Only 2px between fields */
}

.dx-field-label {
    margin-bottom: 1px !important; /* Minimal label spacing */
}

/*************
## **Vertical Spacing Breakdown:**
Label (12px text)
↓ 2px margin
Input in gray container (26px input + 6px padding top/bottom)
↓ 2px field margin
──────────────────── ← Only 2px gap
Label (next field)
↓ 2px margin
Input
*************/


/* ==================== PLACEHOLDER FIX ==================== */


/* NUCLEAR OPTION: Force placeholder behavior */

/* Hide placeholder by default */
.dx-placeholder {
    display: none !important;
    opacity: 0 !important;
}

/* Only show when input is actually empty */
.dx-texteditor-empty .dx-placeholder {
    display: flex !important;
    opacity: 1 !important;
    line-height: 27px !important;
    top: 0 !important;
    font-size: 13px !important;
    align-items: center !important;
    height: 27px !important;
    padding: 0 8px !important;
    color: #999 !important;
    position: absolute !important;
    z-index: 1 !important;
}

/* Make sure it disappears on focus if value exists */
.dx-texteditor:not(.dx-texteditor-empty) .dx-placeholder {
    display: none !important;
}




/* ==================== REMOVE EDGE PADDING IN GROUPS ==================== */

/* AGGRESSIVE EDGE PADDING REMOVAL */

/* First column - absolutely no left padding */
.dx-col-0,
.dx-first-col {
    padding-left: 0 !important;
    margin-left: 0 !important;
}

/* Last column - absolutely no right padding */
.dx-last-col {
    padding-right: 0 !important;
    margin-right: 0 !important;
}

/* Ensure group container has no extra padding */
.dx-form-group-with-caption {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

/* But remove padding from the layout manager inside */
.dx-form-group .dx-layout-manager {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}


/**************/
/**************/
/**************/
/**************/



.dx-toast-message {
    white-space: pre-line;
}

.col-md-custom {
  width: 50%;
  margin: 0 auto;
  padding: 1rem;
  box-sizing: border-box;
}
@media (max-width: 768px) {
  .col-md-custom {
    width: 75%;
  }
}
.col-md-custom-OLD {
    width: 100%;
    margin-left: 25%;
    margin-right: 25%;
}
.col-md-custom-NO-GOOD {
  width: 50%;
  float: left;
  padding-left: 15px;
  padding-right: 15px;
}

.dx-menu-item a {
    text-decoration: none !important;
}
.dx-menu-item.dx-state-hover,
.dx-menu-item.dx-state-focused {
    color: inherit !important;
    background-color: transparent !important;
}

.aliceBackground {
    background-color: AliceBlue;
    background-color: #edf5fb;
    background-color: #f6f9ff;
}
.smokeBackground {
    background-color: WhiteSmoke;
    background-color: #f7f7f2;
}
.failCell {
    background-color: yellow;
    background-color: bisque;
}


/*.pipeline-grid .dx-datagrid-fixed-column,
.pipeline-grid .dx-header-row .dx-datagrid-fixed-column {
    background-color: WhiteSmoke !important;
}*/

.ColumnReadOnly_PADRIGHT {
  background-color:inherit;
  margin-right: 7px;
}
.dx-datagrid .dx-row .dx-datagrid-fixed-column .smokeBackground {
    background-color: LightGray;
}

.mia-cell-bold {
    font-weight: bold;
    background-color: #d7e4c4 /* lightcyan #eceede*/ !important;
    border-radius: 10px !important;
}
.mia-cell-fail {
    background-color: #eac0b1 !important;
    /*    color: brown;*/
    font-weight: bold;
    border-radius: 10px !important;
}

.bl-align-right .dx-texteditor-input {
    text-align: right !important;
}

.bl-align-right-RED .dx-texteditor-input {
    text-align: right !important;
    background-color:white; /*#f5aa5f #e69647 orange !important;*/
}

.bl-align-right-READONLY .dx-texteditor-input {
    text-align: right !important;
    background-color: ghostwhite !important;
}



td#HtmlEditor1_Email.BodyContent_PreviewCell
{
    border-bottom:none !important;
}
#PortalEmailSaveButton {
    margin-top: 5px;
}
/*
    #HtmlEditor1_Email.BodyContent_MainCell > table {
    width: 100% !important;
}
#HtmlEditor1_Email.BodyContent
{
    width: 100% !important;
}
*/
.rlAnchor:hover {
    text-decoration: none;
    color: black;
    cursor: pointer;
}

.rlAnchor {
    font-size: larger;
    background-color: lightblue;
    padding: 3px 7px;
    border-radius: 5px;
    color: black;

}

.ver-code-selector {
    border: none;
    border-bottom: double #5fb8db;
    padding: 0 15px;
}
    .ver-code-selector:active {
        border: none;
        border-bottom: double #5fb8db;
        padding: 0 15px;
    }

    .ver-code-selector:focus {
        border: none;
        border-bottom: double #5fb8db;
        padding: 0 15px;
    }

.col-md-full {
    max-width: 100%;
    padding-left: 3%;
}
.col-md-mia
{
    max-width:50%;
    padding-left:3%;
}
.btn-plain-link {
    background-color: white;
    border: none;
    color: #007bff;
}
.btn-fid {
    padding: 7px 60px;
    border: none;
    background-color: #70c0df;
    color: #black;
    font-weight: 600;
    background-color: lightblue;
    border-radius: 8px;
}

#P_LoginBoxBOTTOM
{
    margin-top:30px;
}
#AddNewInvestorLoginBtn {
    margin-top: 50px;
    margin-bottom: 20px;
}
.upload-area-brl {
    border: 0px solid black;
    display: inline-block;
    max-width: 200px;
}
.dx-form-group-content-brl {
    margin-top: 3px;
    padding-bottom: 10px;
}
.dx-form-group-caption-brl{
    margin-top:3px;
    padding-bottom:10px;
}

.dxm-content.dxm-hasText.dx, .dxm-content.dxm-hasText {
    text-align: center !important;
    padding: 8px !important;
   font-weight: bold;
}

#RunAssetManagementReportBtn
{
    margin-top:10px;
    background-color:azure;
}

.dx-scheduler-appointment-content {
    background-color: white;
    color: black;
}
.bl-right-tight-red {
    padding-top: 0px !important;
}

.bl-right-tight-red input {
    text-align: right !important;
    color: red !important;
}

#DashBoard_TopDiv2 .dx-data-row * {
    padding: 5px;
}

.dx-header-row * {
    /*  color: red !important;*/
    font-weight: bold;
    /*  background-color: whitesmoke;*/
}

.bl-right-tight {
    padding-top: 0px !important;
}
.bl-right-tight input {
    text-align: right !important;
}



.RehabWireInfoCSS {
    visibility: hidden;
}

body {
    padding-top: 0;
    padding-bottom: 0;
    box-sizing: border-box;
    min-height: 95vh;
}
.form-group-LOGIN {
    margin-bottom: 1rem;
    position: relative;
    left: 10%;
}
.text-primary-FI {
    color: #0f6674 !important;
}

.height-95vh {
    min-height: 100vh;
    box-sizing: border-box;
}

* {
    box-sizing: border-box;
}


/*bootstrap.css (500)*/
h1, h2, h3 {
    margin-top: 3px;
    margin-bottom: 3px;
}

.height-100PCT {
  height: 87vh;
  min-height: 87vh;
  box-sizing: border-box;
}

.ColumnReadOnly2 {
    background-color: whitesmoke !important;
    /*  font-style: italic !important; */
}
.ColumnReadOnly {
   background-color:inherit;
}
.ColumnReadOnly_PADRIGHT {
  background-color:inherit;
  margin-right: 7px;
}
.ColumnOWL {
    background-color: honeydew !important; /* honeydew !important;*/
}
.ColumnEditable {
    background-color: #e4ecf1 !important; /* honeydew !important;*/
}
.ColumnGray {
    background-color: whitesmoke !important;
}


/* https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_tooltip */
.bl_tooltip {
    position: absolute;
    z-index: 125;
    background-color: #5f645e;
    color: #fff;
    text-align: center;
    border-radius: 7px;
    padding: 7px 7px;
    transition-delay: 0.4s;
    transition-duration: 1s;
    /*  opacity: 1;*/
}
.bl_tooltip::after {
    content: "";
    position: absolute;
    top: 0%;
    left: 0%;
    margin-top: -12px;
    margin-left: 7px;
    border-width: 7px;
    border-style: solid;
    border-color: transparent transparent #555 transparent;
}


.bl_gray1 {
    background-color: whitesmoke;
    padding: 2px 4px 2px 4px;
}
.bl_gray2 {
    background-color: gainsboro;
    padding: 2px 4px 2px 4px;
}
.blTextButton {
    /*  background:linear-gradient(to bottom, #44c767 5%, #5cbf2a 100%); 
        background-color: #44c767; 

        gh     658d1b;
        fi     5ab8dc;
    */
    background: linear-gradient(to bottom, #5ab8dc 5%, #51a5c6 100%);
    background-color: #5ab8dc;
    border-radius: 30px;
    border: 3px solid #18ab29;
    display: inline-block;
    cursor: pointer;
    color: transparent;
    font-family: Arial;
    font-size: 12px;
    font-weight: bold;
    font-style: italic;
    padding: 0px 10px;
    vertical-align: top;
    text-decoration: none;
    color: #FFFFFF;
    /*        text-shadow:0px 1px 3px #FFFFFF;*/
}
.blTextButton:hover {
        /*    background:linear-gradient(to bottom, #5cbf2a 5%, #44c767 100%); */
        /* GH background: linear-gradient(to bottom, #5cbf2a 5%, #658d1b 100%); */
        background: linear-gradient(to bottom, #51a5c6 5%, #5ab8dc 100%);
        background-color: #51a5c6;
        color: #FFFFFF;
}
.blTextButton:active {
        position:relative;
        top:1px;
}


.bl-anchor {
    color: #000064;
}
.bl-gh {
    color: #658d1b;
}
.bl-fi {
    color: #5ab8dc;
}
a.bl-anchor {
    color: #000064;
}
a.bl-gh {
    color: #658d1b;
}
a.bl-fi {
    color: #5ab8dc;
}

.btn {
    background-color: gainsboro;
    border: 1px solid;
    border-radius: 0.5rem;
}

.calendar_err {
    background-color: greenyellow;
}
.calendar_verylate {
    background-color: #ff3c1a;
}
.calendar_late {
    background-color: #d049cb;
}
.calendar_done {
    background-color: #189a18;
}
.calendar_na {
    background-color: #6e8091;
}
.calendar_duesoon {
    background-color: #1c41b0;
}
.calendar_futureevent {
    background-color: #2196c4;
}

.allowEditingFalse {
    background-color: lightblue;
}

.breezewaylogic {
    color: #000078;
    font-family: 'HP Simplified';
    font-family: sans-serif;
    font-weight: bold;
    font-size: 1.5em;
}
.breezeway-text {
    font-family: sans-serif;
    font-size-adjust: .60;
}

.headerContainer {
     border-top: 1px solid;
     border-color: inherit;
}

.jumbotron
{background-color: white;
     margin-bottom:0;
     padding:0;
}

/* Footer 
footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 90px;
    background-color: #D0DAEE;
}
*/
/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

.dealImage {
    max-height: 433px;
    max-width: 700px;
}
.dealImage-midsize {
    max-height: 338px;
    max-width: 547px;
}
.dealImage-small {
    max-height: 290px;
    max-width: 470px;
}
.dealImage-smallest {
    max-height: 231px;
    max-width: 374px;
}
.dealImage-evensmaller {
    max-height: 174px;
    max-width: 230px;
}


.miniimage {
    max-height: 80px;
    max-width: 140px;
    padding-right: 10px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column */
.dl-horizontal dt {
    white-space: normal;
}

.container {
    max-width: 98%;
    max-height: 98%;

}

.custom-save-btn {
    width: 300px;
    height: 30px;
    background-color #6bb76b;
}