/*
    Copyright:           Titan-Techs.
    Location:            Newtown, PA, USA
    Solution:            Subscription
    Project:             Subscription.Server
    File Name:           material-syncfusion-overrides2.css
    Created On:          2025-11-03

    Summary:
        Syncfusion Material 3 Theme Component Overrides (Part 2)
        This file contains brand color overrides for Syncfusion components
        adapted for the Material 3 theme.
*/

/* ========================================
   PDF VIEWER COMPONENT - START
   ======================================== */

/* Positioning for the PDF Viewer search bar */
.e-pv-search-bar {
    top: 40px !important;
}

/* Padding for notification dialog header and footer within the PDF Viewer */
.e-pv-notification-dialog .e-dlg-header-content,
.e-pv-notification-dialog .e-footer-content {
    padding: 7px 24px !important;
}

/* Background for notification dialog header */
.e-pv-notification-dialog .e-dlg-header-content {
    background: rgb(var(--color-sf-surface-variant)); /* Light gray background */
}

/* Background for notification dialog footer */
.e-pv-notification-dialog .e-footer-content {
    background: rgb(var(--color-sf-surface)); /* Very light gray background */
}

/* Padding for notification dialog content */
.e-pv-notification-dialog .e-dlg-content {
    padding: 15px 24px !important;
}

/* ========================================
   PDF VIEWER COMPONENT - END
   ======================================== */

/* Reduce intensity of PDF Viewer toolbar and background */
.e-pdfviewer .e-pv-toolbar {
    background-color: rgba(var(--color-sf-primary), 0.05) !important; /* Very light primary tint */
}

.e-pdfviewer .e-pv-viewer-container {
    background-color: rgba(var(--color-sf-primary), 0.05) !important; /* Very light primary tint */
}

/* Ensure toolbar icons are dark and readable on the new light background */
.e-pdfviewer .e-pv-toolbar .e-toolbar-item .e-tbar-btn-text,
.e-pdfviewer .e-pv-toolbar .e-toolbar-item .e-tbar-btn .e-btn-icon {
    color: rgb(var(--color-sf-on-surface)) !important;
}

/* ========================================
   AUTOCOMPLETE / DROPDOWN COMPONENT - START
   ======================================== */

/* Clear icon color */
.e-autocomplete.e-input-group .e-input-group-icon.e-clear-icon,
.e-dropdownlist.e-input-group .e-input-group-icon.e-clear-icon,
.e-combobox.e-input-group .e-input-group-icon.e-clear-icon {
    color: rgb(var(--color-sf-primary));
}

/* Focus state for input group (border and box-shadow) */
.e-autocomplete.e-input-group:not(.e-disabled) .e-input-focus,
.e-dropdownlist.e-input-group:not(.e-disabled) .e-input-focus,
.e-combobox.e-input-group:not(.e-disabled) .e-input-focus {
    border-color: rgb(var(--color-sf-primary));
    box-shadow: 0 0 0 1px rgb(var(--color-sf-primary));
}

/* Focus state for input element within input group */
.e-autocomplete.e-input-group:not(.e-disabled) .e-input-focus .e-input,
.e-dropdownlist.e-input-group:not(.e-disabled) .e-input-focus .e-input,
.e-combobox.e-input-group:not(.e-disabled) .e-input-focus .e-input {
    border-color: rgb(var(--color-sf-primary));
}

/* Focus state for input group icons */
.e-autocomplete.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon,
.e-dropdownlist.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon,
.e-combobox.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon {
    border-color: rgb(var(--color-sf-primary));
}

/* Focus state for dropdown icon color */
.e-autocomplete.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-ddl-icon,
.e-dropdownlist.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-ddl-icon,
.e-combobox.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-ddl-icon {
    color: rgb(var(--color-sf-primary));
}

/* Focus state for clear icon color */
.e-autocomplete.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-clear-icon,
.e-dropdownlist.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-clear-icon,
.e-combobox.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-clear-icon {
    color: rgb(var(--color-sf-primary));
}

/* Hover state for dropdown icon in focus */
.e-autocomplete.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-ddl-icon:hover,
.e-dropdownlist.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-ddl-icon:hover,
.e-combobox.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-ddl-icon:hover {
    background: rgba(var(--color-sf-primary), 0.1);
}

/* Hover state for clear icon in focus */
.e-autocomplete.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-clear-icon:hover,
.e-dropdownlist.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-clear-icon:hover,
.e-combobox.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-clear-icon:hover {
    background: rgba(var(--color-sf-primary), 0.1);
}

/* Active state for dropdown icon in focus */
.e-autocomplete.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-ddl-icon:active,
.e-dropdownlist.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-ddl-icon:active,
.e-combobox.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-ddl-icon:active {
    background: rgba(var(--color-sf-primary), 0.2);
}

/* Active state for clear icon in focus */
.e-autocomplete.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-clear-icon:active,
.e-dropdownlist.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-clear-icon:active,
.e-combobox.e-input-group:not(.e-disabled) .e-input-focus .e-input-group-icon.e-clear-icon:active {
    background: rgba(var(--color-sf-primary), 0.2);
}

/* Default dropdown icon color */
.e-autocomplete.e-input-group .e-input-group-icon.e-ddl-icon,
.e-dropdownlist.e-input-group .e-input-group-icon.e-ddl-icon,
.e-combobox.e-input-group .e-input-group-icon.e-ddl-icon {
    color: rgb(var(--color-sf-primary));
}

/* Default clear icon color */
.e-autocomplete.e-input-group .e-input-group-icon.e-clear-icon,
.e-dropdownlist.e-input-group .e-input-group-icon.e-clear-icon,
.e-combobox.e-input-group .e-input-group-icon.e-clear-icon {
    color: rgb(var(--color-sf-primary));
}

/* Hover state for dropdown icon */
.e-autocomplete.e-input-group .e-input-group-icon.e-ddl-icon:hover,
.e-dropdownlist.e-input-group .e-input-group-icon.e-ddl-icon:hover,
.e-combobox.e-input-group .e-input-group-icon.e-ddl-icon:hover {
    background: rgba(var(--color-sf-primary), 0.1);
}

/* Hover state for clear icon */
.e-autocomplete.e-input-group .e-input-group-icon.e-clear-icon:hover,
.e-dropdownlist.e-input-group .e-input-group-icon.e-clear-icon:hover,
.e-combobox.e-input-group .e-input-group-icon.e-clear-icon:hover {
    background: rgba(var(--color-sf-primary), 0.1);
}

/* Active state for dropdown icon */
.e-autocomplete.e-input-group .e-input-group-icon.e-ddl-icon:active,
.e-dropdownlist.e-input-group .e-input-group-icon.e-ddl-icon:active,
.e-combobox.e-input-group .e-input-group-icon.e-ddl-icon:active {
    background: rgba(var(--color-sf-primary), 0.2);
}

/* Active state for clear icon */
.e-autocomplete.e-input-group .e-input-group-icon.e-clear-icon:active,
.e-dropdownlist.e-input-group .e-input-group-icon.e-clear-icon:active,
.e-combobox.e-input-group .e-input-group-icon.e-clear-icon:active {
    background: rgba(var(--color-sf-primary), 0.2);
}

.e-dropdownbase .e-list-item.e-active, .e-dropdownbase .e-list-item.e-active.e-hover {
    background: rgba(var(--color-sf-primary));
    border-color: #e0e0e0;
    color: rgba(var(--color-sf-on-primary));
}

.e-dropdownbase .e-list-item {
    color: #3f3f3f;
}

.e-input-group:not(.e-float-icon-left):not(.e-float-input)::before, .e-input-group:not(.e-float-icon-left):not(.e-float-input)::after, .e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before, .e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::before, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::after, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after, .e-float-input.e-input-group:not(.e-float-icon-left) .e-float-line::before, .e-float-input.e-input-group:not(.e-float-icon-left) .e-float-line::after, .e-float-input.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::before, .e-float-input.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::after, .e-float-input.e-control-wrapper.e-input-group:not(.e-float-icon-left) .e-float-line::before, .e-float-input.e-control-wrapper.e-input-group:not(.e-float-icon-left) .e-float-line::after, .e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::before, .e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::after, .e-filled.e-float-input.e-input-group.e-float-icon-left .e-float-line::before, .e-filled.e-float-input.e-input-group.e-float-icon-left .e-float-line::after, .e-filled.e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-float-line::before, .e-filled.e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-float-line::after {
    -moz-transition: .2s cubic-bezier(0.4, 0, 0.4, 1);
    bottom: -8px;
    content: "";
    height: unset;
    /* position: absolute; */
    transition: .2s cubic-bezier(0.4, 0, 0.4, 1);
    width: 0;
}

.e-input-group:not(.e-float-icon-left):not(.e-float-input)::before, .e-input-group:not(.e-float-icon-left):not(.e-float-input)::after, .e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before, .e-input-group.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::before, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::after, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::before, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input) .e-input-in-wrap::after, .e-float-input.e-input-group:not(.e-float-icon-left) .e-float-line::before, .e-float-input.e-input-group:not(.e-float-icon-left) .e-float-line::after, .e-float-input.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::before, .e-float-input.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::after, .e-float-input.e-control-wrapper.e-input-group:not(.e-float-icon-left) .e-float-line::before, .e-float-input.e-control-wrapper.e-input-group:not(.e-float-icon-left) .e-float-line::after, .e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::before, .e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::after, .e-filled.e-input-group.e-float-icon-left:not(.e-float-input)::before, .e-filled.e-input-group.e-float-icon-left:not(.e-float-input)::after, .e-filled.e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input)::before, .e-filled.e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input)::after, .e-filled.e-float-input.e-input-group.e-float-icon-left .e-float-line::before, .e-filled.e-float-input.e-input-group.e-float-icon-left .e-float-line::after, .e-filled.e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-float-line::before, .e-filled.e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-float-line::after {
    background: transparent;
}

/* Container for the AutoComplete with search icon */
span:has(#autoFilter) {
    position: relative; /* Ensure the container is a positioning context */
}

/* Icon for AutoComplete with search functionality */
span:has(#autoFilter)::before {
    content: '\e754';
    font-family: 'e-icons';
    font-size: 18px;
    opacity: 0.5;
    
    /* Positioning the icon inside the input group */
    position: absolute;
    left: 8px; /* Small padding from the left edge */
    top: 50%; /* Center vertically */
    transform: translateY(-50%); /* Fine-tune vertical centering */
    z-index: 1;
}

/* Indent the text in the AutoComplete to make space for the icon */
span:has(#autoFilter) .e-input {
    padding-left: 30px !important;
}

span:has(#autoFilter) {
    margin-right: 8px;
}

.e-input-group:not(.e-float-icon-left):not(.e-float-input)::before, .e-input-group.e-float-icon-left .e-input-in-wrap:not(.e-float-input)::before, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input)::before, .e-input-group.e-control-wrapper.e-float-icon-left .e-input-in-wrap:not(.e-float-input)::before, .e-float-input.e-input-group:not(.e-float-icon-left) .e-float-line::before, .e-float-input.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::before, .e-float-input.e-control-wrapper.e-input-group:not(.e-float-icon-left) .e-float-line::before, .e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-input-in-wrap .e-float-line::before, .e-filled.e-input-group.e-float-icon-left::before, .e-filled.e-input-group.e-control-wrapper.e-float-icon-left::before, .e-filled.e-float-input.e-input-group.e-float-icon-left .e-float-line::before, .e-filled.e-float-input.e-control-wrapper.e-input-group.e-float-icon-left .e-float-line::before {
    left: 0;
}

.e-input-group:not(.e-float-icon-left):not(.e-float-input).e-input-focus::before, .e-input-group:not(.e-float-icon-left):not(.e-float-input).e-input-focus::after, .e-input-group.e-float-icon-left:not(.e-float-input).e-input-focus .e-input-in-wrap::before, .e-input-group.e-float-icon-left:not(.e-float-input).e-input-focus .e-input-in-wrap::after, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input).e-input-focus::before, .e-input-group.e-control-wrapper:not(.e-float-icon-left):not(.e-float-input).e-input-focus::after, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input).e-input-focus .e-input-in-wrap::before, .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-float-input).e-input-focus .e-input-in-wrap::after, .e-float-input.e-input-group:not(.e-float-icon-left).e-input-focus .e-float-line::before, .e-float-input.e-input-group:not(.e-float-icon-left).e-input-focus .e-float-line::after, .e-float-input.e-input-group.e-float-icon-left.e-input-focus .e-input-in-wrap .e-float-line::before, .e-float-input.e-input-group.e-float-icon-left.e-input-focus .e-input-in-wrap .e-float-line::after, .e-float-input.e-control-wrapper.e-input-group:not(.e-float-icon-left).e-input-focus .e-float-line::before, .e-float-input.e-control-wrapper.e-input-group:not(.e-float-icon-left).e-input-focus .e-float-line::after, .e-float-input.e-control-wrapper.e-input-group.e-float-icon-left.e-input-focus .e-input-in-wrap .e-float-line::before, .e-float-input.e-control-wrapper.e-input-group.e-float-icon-left.e-input-focus .e-input-in-wrap .e-float-line::after, .e-filled.e-float-input.e-input-group.e-float-icon-left.e-input-focus .e-float-line::before, .e-filled.e-float-input.e-input-group.e-float-icon-left.e-input-focus .e-float-line::after, .e-filled.e-float-input.e-control-wrapper.e-input-group.e-float-icon-left.e-input-focus .e-float-line::before, .e-filled.e-float-input.e-control-wrapper.e-input-group.e-float-icon-left.e-input-focus .e-float-line::after {
    width: 0;
}

/* ========================================
   AUTOCOMPLETE / DROPDOWN COMPONENT - END
   ======================================== */

/* ========================================
   INPUT COMPONENTS - START
   ======================================== */

/* Default text color for SfTextBox and other input elements */
.e-input-group, .e-input-group.e-control-wrapper, .e-float-input, .e-float-input.e-input-group, .e-float-input.e-control-wrapper, .e-float-input.e-input-group.e-control-wrapper {
    /*background: rgba(var(--color-sf-secondary), 0.05);*/
    color: #3f3f3f;
}

.e-input-group input::placeholder,
.e-input-group textarea::placeholder,
.e-input-group .e-input::placeholder {
    color: rgb(190, 190, 190) !important; /* Standard Material Design hint text color */
    opacity: 1; /* Ensure full opacity */
}

/* Hover state for input group focus (not success/warning/error/disabled) */
.e-input-group.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-input-group.e-control-wrapper.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-float-input.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-float-input.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) input:not([disabled]),
.e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) input:not([disabled]),
.e-float-input.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) textarea:not([disabled]),
.e-float-input.e-control-wrapper.e-input-focus:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) textarea:not([disabled]) {
    border-color: rgb(var(--color-sf-primary));
}

/* Focus state for input group (not success/warning/error) */
.e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error),
.e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
    border-color: rgb(var(--color-sf-primary));
    border-radius: 2px;
    border-width: 1px;
    box-shadow: 0 0 0 0 rgb(var(--color-sf-primary));
}

/* Active/Focus states for various input types with specific success/error handling */
.e-input-group:active:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-input-group.e-control-wrapper:active:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-float-input:active:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-float-input.e-control-wrapper:active:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled),
.e-float-input:active:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) input:not([disabled]),
.e-float-input.e-control-wrapper:active:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) input:not([disabled]),
.e-float-input:active:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) textarea:not([disabled]),
.e-float-input.e-control-wrapper:active:hover:not(.e-input-group):not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled) textarea:not([disabled]),
.e-input-group.e-input-focus:not(.e-error):not(.e-warning).e-success,
.e-input-group.e-control-wrapper.e-input-focus:not(.e-error):not(.e-warning).e-success,
.e-input-group:not(.e-disabled):active:not(.e-success):not(.e-warning).e-error,
.e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-success):not(.e-warning).e-error,
.e-input-group.e-input-focus:not(.e-success):not(.e-warning).e-error,
.e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning).e-error {
    box-shadow: 0 0 0 0 rgb(var(--color-sf-primary));
}

/* Success state box-shadow */
.e-input-group:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success,
.e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-error):not(.e-warning).e-success {
    box-shadow: 0 0 0 0 #107c10;
}

/* Error state border color */
.e-input-group.e-error,
.e-input-group.e-control-wrapper.e-error,
.e-input-group.e-error:not(.e-float-icon-left),
.e-input-group.e-control-wrapper.e-error:not(.e-float-icon-left) {
    border-color: rgb(var(--color-sf-primary));
}

/* Custom invalid/error styling */
.invalid,
span.invalid {
    display: inline-flex !important; /* Use flexbox for robust alignment. !important to override base theme. */
    align-items: center !important; /* Vertically center items (text and icon). */
    color: rgb(var(--color-sf-primary)) !important; /* Ensure validation message text is readable */
}

.e-error.invalid::after,
span.invalid::after,
.e-multiselect.e-error::after {
    /* --- RESET STYLES (to override Material theme's validation line) --- */
    content: "\ef1b" !important;
    display: inline-block !important;
    height: auto !important;
    width: auto !important;
    background: transparent !important;
    position: static !important;
    border: none !important;

    /* --- ICON STYLES --- */
    font-family: var(--font-icon);
    font-size: 16px; /* Adjusted for better visual balance */
    color: rgb(var(--color-sf-primary)) !important;

    /* --- SPACING --- */
    margin-left: 6px; /* Space between text and icon */
    margin-top: 0; /* Ensure no top margin */
    vertical-align: unset; /* Flexbox handles alignment, so unset this */
}

.e-input-group:not(.e-float-icon-left).e-error:not(.e-float-input)::before, .e-input-group:not(.e-float-icon-left).e-error:not(.e-float-input)::after, .e-input-group.e-float-icon-left.e-error:not(.e-float-input) .e-input-in-wrap::before, .e-input-group.e-float-icon-left.e-error:not(.e-float-input) .e-input-in-wrap::after, .e-input-group.e-control-wrapper:not(.e-float-icon-left).e-error:not(.e-float-input)::before, .e-input-group.e-control-wrapper:not(.e-float-icon-left).e-error:not(.e-float-input)::after, .e-input-group.e-control-wrapper.e-float-icon-left.e-error:not(.e-float-input) .e-input-in-wrap::before, .e-input-group.e-control-wrapper.e-float-icon-left.e-error:not(.e-float-input) .e-input-in-wrap::after, .e-float-input.e-input-group:not(.e-float-icon-left).e-error .e-float-line::before, .e-float-input.e-input-group:not(.e-float-icon-left).e-error .e-float-line::after, .e-float-input.e-input-group.e-float-icon-left.e-error .e-input-in-wrap .e-float-line::before, .e-float-input.e-input-group.e-float-icon-left.e-error .e-input-in-wrap .e-float-line::after, .e-float-input.e-input-group.e-control-wrapper:not(.e-float-icon-left).e-error .e-float-line::before, .e-float-input.e-input-group.e-control-wrapper:not(.e-float-icon-left).e-error .e-float-line::after, .e-float-input.e-input-group.e-control-wrapper.e-float-icon-left.e-error .e-input-in-wrap .e-float-line::before, .e-float-input.e-input-group.e-control-wrapper.e-float-icon-left.e-error .e-input-in-wrap .e-float-line::after, .e-filled.e-input-group.e-float-icon-left.e-error:not(.e-float-input)::before, .e-filled.e-input-group.e-float-icon-left.e-error:not(.e-float-input)::after, .e-filled.e-input-group.e-control-wrapper.e-float-icon-left.e-error:not(.e-float-input)::before, .e-filled.e-input-group.e-control-wrapper.e-float-icon-left.e-error:not(.e-float-input)::after, .e-filled.e-float-input.e-input-group.e-float-icon-left.e-error .e-float-line::before, .e-filled.e-float-input.e-input-group.e-float-icon-left.e-error .e-float-line::after, .e-filled.e-float-input.e-input-group.e-control-wrapper.e-float-icon-left.e-error .e-float-line::before, .e-filled.e-float-input.e-input-group.e-control-wrapper.e-float-icon-left.e-error .e-float-line::after {
    background: transparent;
}

.e-error.invalid .e-float-text {
    color: rgb(var(--color-sf-primary)) !important;
}

/* Default input group border and box-shadow */
.e-input-group:not(.e-success):not(.e-warning):not(.e-error),
.e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error) {
    border-color: rgb(var(--color-sf-outline)); /* Neutral border color */
    box-shadow: none;
}

/* Disabled input styles */
.e-input[disabled],
.e-input-group .e-input[disabled],
.e-input-group.e-control-wrapper .e-input[disabled],
.e-input-group.e-disabled,
.e-input-group.e-disabled input,
.e-input-group.e-disabled input.e-input,
.e-input-group.e-disabled textarea,
.e-input-group.e-disabled textarea.e-input,
.e-input-group.e-control-wrapper.e-disabled,
.e-input-group.e-control-wrapper.e-disabled input,
.e-input-group.e-control-wrapper.e-disabled input.e-input,
.e-input-group.e-control-wrapper.e-disabled textarea,
.e-input-group.e-control-wrapper.e-disabled textarea.e-input,
.e-float-input.e-disabled input,
.e-float-input.e-disabled textarea,
.e-float-input input[disabled],
.e-float-input input.e-disabled,
.e-float-input textarea[disabled],
.e-float-input textarea.e-disabled,
.e-float-input.e-control-wrapper.e-disabled input,
.e-float-input.e-control-wrapper.e-disabled textarea,
.e-float-input.e-control-wrapper input[disabled],
.e-float-input.e-control-wrapper input.e-disabled,
.e-float-input.e-control-wrapper textarea[disabled],
.e-float-input.e-control-wrapper textarea.e-disabled,
.e-input-group.e-disabled span,
.e-input-group.e-control-wrapper.e-disabled span,
.e-input-group:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left).e-disabled,
.e-input-group.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error).e-disabled .e-input-in-wrap,
.e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left).e-disabled,
.e-input-group.e-control-wrapper.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error).e-disabled .e-input-in-wrap {
    cursor: not-allowed;
    background-color: rgb(var(--color-sf-surface-variant)); /* Light gray background */
    color: rgb(var(--color-sf-on-surface-variant)); /* Dark gray text color */
    -webkit-text-fill-color: inherit;
}

.e-input-group:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left), .e-input-group.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap, .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left), .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap, .e-float-input.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap, .e-float-input.e-control-wrapper.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap {
    border-color: rgb(160, 160, 160);
}

/* ========================================
   INPUT COMPONENTS - END
   ======================================== */

/* ========================================
   GRID COMPONENT - START
   ======================================== */

.e-grid {
    border-color: rgb(210, 210, 210);
}

.e-grid .e-gridheader {
    background-color: #3f3f3f !important;
    border-color: rgb(210, 210, 210);
}

.e-gridheader thead tr {
    background: #3f3f3f;
    color: rgb(var(--color-sf-on-primary));
    height: 50px;
}

.e-grid .e-headercell, .e-grid .e-detailheadercell {
    background-color: transparent;
}

.e-gridcontent tbody tr {
    height: 50px;
}

.e-grid .e-gridcontent {
    overflow-y: auto;
}

.e-grid td.e-active {
    background: rgba(var(--color-sf-primary), 0.10); /* Light tint of primary for selection */
}

.e-rowcell:focus {
    outline: none !important;
}

.e-refresh {
    margin-left: 7px;
}

.e-grid th.e-headercell[aria-sort=ascending] .e-headertext, .e-grid th.e-headercell[aria-sort=descending] .e-headertext, .e-grid th.e-headercell[aria-sort=ascending] .e-sortfilterdiv,
.e-grid th.e-headercell[aria-sort=descending] .e-sortfilterdiv, .e-grid .e-icon-ascending::before, .e-grid-menu .e-icon-ascending::before,
.e-grid .e-gridheader .e-icons:not(.e-icon-hide):not(.e-check):not(.e-stop):not(.e-icon-reorderuparrow):not(.e-icon-reorderdownarrow) {
    color: rgb(var(--color-sf-on-primary));
}

.e-grid .e-rowcell:not(.e-editedbatchcell):not(.e-updatedtd), .e-grid .e-detailrowcollapse:not(.e-editedbatchcell):not(.e-updatedtd), .e-grid .e-detailrowexpand:not(.e-editedbatchcell):not(.e-updatedtd), .e-grid .e-gridcontent .e-rowdragdrop:not(.e-editedbatchcell):not(.e-updatedtd), .e-grid .e-gridheader .e-rowdragdrop:not(.e-editedbatchcell):not(.e-updatedtd), .e-grid .e-emptyrow:not(.e-editedbatchcell):not(.e-updatedtd) {
    color: #3f3f3f;
}

.e-grid .e-focused:not(.e-menu-item):not(.e-editedbatchcell) {
    box-shadow: none;
}

.e-grid .e-toolbar {
    border-top: 0;
}

.e-grid .e-rowcell, .e-grid .e-groupcaption, .e-grid .e-indentcell, .e-grid .e-recordplusexpand, .e-grid .e-recordpluscollapse, .e-grid .e-rowdragdropcell, .e-grid .e-detailrowcollapse, .e-grid .e-detailrowexpand, .e-grid .e-detailindentcell, .e-grid .e-detailcell, .e-grid .e-emptyrow.e-show-added-row .e-lastrowcell {
    border-color: rgb(210, 210, 210);
}

.e-grid .e-detailindentcell {
    border-right: none !important;
}

.e-grid .e-verticallines tr th, .e-grid .e-grouptopleftcell, .e-grid .e-rowdragheader, .e-grid .e-gridpopup .e-content, .e-grid .e-filterbarcell, .e-grid .e-filterbarcelldisabled, .e-grid.e-default .e-grouptopleftcell, .e-grid.e-default .e-rowdragheader, .e-grid .e-headercell, .e-grid .e-summarycell, .e-grid .e-detailheadercell, .e-grid [aria-selected] + tr .e-detailindentcell, .e-grid.e-default .e-gridheader .e-headercell.e-firstheader, .e-grid.e-default.e-horizontallines .e-headercell.e-firstheader, .e-grid .e-filterbarcell input, .e-grid .e-headercontent, .e-grid.e-default.e-verticallines .e-headercell.e-stackedheadercell:not(.e-freezeleftborder,.e-freezerightborder), .e-grid.e-default.e-horizontallines .e-grouptopleftcell, .e-grid.e-default .e-gridheader.e-stackedfilter tr:last-child th.e-grouptopleftcell, .e-grid.e-default.e-horizontallines .e-gridheader.e-stackedfilter tr:last-child th.e-grouptopleftcell, .e-grid.e-default .e-gridheader.e-stackedfilter tr:first-child th.e-grouptopleftcell, .e-grid.e-default.e-horizontallines .e-gridheader.e-stackedfilter tr:first-child th.e-grouptopleftcell {
    border-color: rgb(210, 210, 210);
}

.e-grid.e-gridhover .e-frozenhover:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row tr:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row.e-addedrow:not(.e-disable-gridhover):not(.e-detailrow):hover .e-dragindentcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
    background: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.05), rgba(var(--color-sf-on-surface), 0.05)), rgba(var(--color-sf-surface));
    color: #5f5f5f;
}

/* Issue #586 (item 12): ContactPanel, LocationPanel and DocumentPanel all rendered ID="gridCompanyTab".
   Their SfTab uses LoadOn="ContentLoad.Init", so all three mount together and three identical DOM ids
   coexist - invalid HTML, and Syncfusion grid interop keyed by id resolves through getElementById, which
   returns only the FIRST match. The ids are now unique; each selector below repeats its FULL compound
   once per id, so the rendered styling is identical to before. (Unrelated to #gridCompany, no Tab suffix,
   which is deliberately shared across pages that are never co-resident - leave that one alone.) */
#gridCompanyTabContacts_header_table thead th.e-headercell, #gridCompanyTabLocations_header_table thead th.e-headercell, #gridCompanyTabDocuments_header_table thead th.e-headercell {
    height: 40px !important;
}

#gridCompanyTabContacts_content_table tbody tr td div span, #gridCompanyTabLocations_content_table tbody tr td div span, #gridCompanyTabDocuments_content_table tbody tr td div span {
    line-height: 1.5em;
}

#gridCompanyTabContacts_content_table .e-detailindentcell, #gridCompanyTabLocations_content_table .e-detailindentcell, #gridCompanyTabDocuments_content_table .e-detailindentcell, #gridCompany_content_table .e-detailindentcell, #gridRequisitionsTab_content_table .e-detailindentcell, #gridRequisitions_content_table .e-detailindentcell {
    border: none;
    border-top: 1px solid rgb(210, 210, 210); /* Light gray for borders */
}

.e-headercontent.e-lib.e-droppable {
    border-right-width: 0 !important;
}

.e-grid.sf-grid .e-gridcontent .e-content.e-yscroll {
    overflow-x: hidden !important;
}

.e-input-group, .e-input-group.e-control-wrapper, .e-float-input, .e-float-input.e-input-group, .e-float-input.e-control-wrapper, .e-float-input.e-input-group.e-control-wrapper {
    background: white;
    color: rgba(var(--color-sf-black));
}

.e-pager, .e-pager .e-pagercontainer, .e-pager .e-prevpagedisabled, .e-pager .e-prevpage, .e-pager .e-nextpage, .e-pager .e-nextpagedisabled, .e-pager .e-lastpagedisabled, .e-pager .e-lastpage, .e-pager .e-firstpage, .e-pager .e-firstpagedisabled {
    background: transparent;
}

.e-pager div.e-icons.e-disable {
    color: rgba(var(--color-sf-on-surface-variant), 0.15);
}

.e-pager div.e-parentmsgbar {
    font-weight: 500;
    padding-top: 10px;
}

.e-pagerdropdown .e-input {
    text-align: center;
}
/* Grid Detailed Row Arrows */
.e-grid .e-icon-gdownarrow {
    font-size: 12px;
}

.e-grid .e-icon-gdownarrow::before, .e-grid-menu .e-icon-gdownarrow::before {
    content: "\e70d";
}

.e-grid .e-icon-grightarrow {
    font-size: 12px;
}

.e-grid .e-icon-grightarrow::before, .e-grid-menu .e-icon-grightarrow::before {
    content: "\e87e";
}

.e-rowcell a {
    color: rgb(var(--color-sf-primary));
    text-decoration: none;
}

.e-grid .e-groupcaption, .e-grid .e-recordplusexpand, .e-grid .e-recordpluscollapse {
    background-color: rgba(var(--color-sf-secondary), 0.1); /* Light tint of secondary for group captions */
}

.e-grid.e-default .e-detailrow .e-lastrowcell {
    border-bottom: 1px solid;
    border-bottom-color: #d2d2d2;
}

.e-tab .e-row {
    height: 45px !important;
}

/* ========================================
   GRID COMPONENT - END
   ======================================== */