/* central-app.css — extracted from app/Providers/AppServiceProvider.php inline <style> blocks (2026-08-02). */
                /* Add padding to the bottom of every page */
                body {
                    padding-bottom: 30px !important;
                }
                
                /* Animation for SKU copy notification */
                @keyframes slideInUp {
                    from {
                        transform: translateY(100%);
                        opacity: 0;
                    }
                    to {
                        transform: translateY(0);
                        opacity: 1;
                    }
                }
                
                /* Pop-in animation for assignment badges */
                @keyframes assignmentBadgePopIn {
                    0% {
                        transform: scale(0);
                        opacity: 0;
                    }
                    50% {
                        transform: scale(1.1);
                    }
                    100% {
                        transform: scale(1);
                        opacity: 1;
                    }
                }
                
                /* Pop-out animation for assignment badges */
                @keyframes assignmentBadgePopOut {
                    0% {
                        transform: scale(1);
                        opacity: 1;
                    }
                    100% {
                        transform: scale(0);
                        opacity: 0;
                    }
                }
                
                /* Ensure dropdown is visible with proper height */
                .fi-fo-select .choices__list--dropdown {
                    max-height: 300px !important;
                    overflow-y: auto !important;
                }
                
                /* Add right margin to note-text cells */
                .note-text {
                    margin-right: 10px !important;
                }
                
                /* Hide notes_data column completely */
                .cell-notes-data,
                td.cell-notes-data,
                th.cell-notes-data,
                .fi-table-header-cell-notes-data,
                .fi-table-header-cell-notes_data,
                th.fi-table-header-cell-notes-data,
                th.fi-table-header-cell-notes_data {
                    width: 0px !important;
                    min-width: 0px !important;
                    max-width: 0px !important;
                    padding: 0 !important;
                    margin: 0 !important;
                    border: none !important;
                    overflow: hidden !important;
                    visibility: hidden !important;
                    display: none !important;
                }

                /* FIX: Stacking context issue - ensure filter header has proper stacking context */
                .fi-ta-header-ctn {
                    position: relative !important;
                    z-index: auto !important;
                }
                
                /* Ensure the table content has proper stacking context */
                .fi-ta-content {
                    position: relative !important;
                    z-index: auto !important;
                }
                
                /* Force dropdowns in filter area to be on top only when active */
                .fi-ta-filters .choices__list--dropdown.is-active {
                    z-index: 50 !important;
                    position: absolute !important;
                }
                
                /* Ensure dropdown parent containers allow proper stacking */
                .fi-ta-filters .fi-fo-field-wrp {
                    position: relative !important;
                    z-index: auto !important;
                }
                
                .fi-ta-filters .choices {
                    position: relative !important;
                }
                
                /* Assign dropdown menu - absolute highest z-index */
                .assign-dropdown {
                    z-index: 2147483647 !important;
                    position: fixed !important;
                }
                
                /* Fix modal stacking - use Filament's default z-index values */
                /* The modal components should use their default stacking */
                .fi-modal-window {
                    z-index: 40 !important;
                }
                
                .fi-modal-close-overlay {
                    z-index: 30 !important;
                }
                
                /* Ensure dropdown is always on top when visible */
                .assign-dropdown[style*="display: block"] {
                    z-index: 2147483647 !important;
                    position: fixed !important;
                }
                
                /* Lower z-index for assignment badges to prevent overlap */
                .assigned-user-tag,
                .assigned-dept-tag {
                    position: relative;
                    z-index: 1;
                    cursor: pointer !important;
                }
                
                .assigned-users-display,
                .assigned-departments-display,
                .order-assignments-cell {
                    position: relative;
                    z-index: 1;
                }
                
                /* Ensure the filter form fields have proper stacking */
                .fi-ta-filters .fi-fo-field-wrp {
                    position: relative;
                    z-index: 10;
                }
                
                /* Fade animations for updated order items */
                @keyframes fadeOut {
                    from {
                        opacity: 1;
                    }
                    to {
                        opacity: 0;
                    }
                }
                
                @keyframes fadeIn {
                    from {
                        opacity: 0;
                    }
                    to {
                        opacity: 1;
                    }
                }
                
                @keyframes highlightNew {
                    0% {
                        background-color: rgba(16, 185, 129, 0.2);
                    }
                    100% {
                        background-color: transparent;
                    }
                }
                
                /* Center align form action buttons on Create Order page */
                .fi-ac-btn-action {
                    margin: 0 auto !important;
                }
                
                .fi-form-actions {
                    display: flex !important;
                    justify-content: center !important;
                    margin-top: 20px !important;
                    width: 100% !important;
                }
                
                /* Add spacing between the 3 column sections */
                .fi-fo-component-ctn.gap-6 {
                    gap: 20px !important;
                    column-gap: 20px !important;
                }
                
                /* Target the specific create order page grid */
                .fi-page-create-record .fi-fo-component-ctn {
                    gap: 20px !important;
                    column-gap: 20px !important;
                }
                
                /* Ensure Order Items section has proper spacing above */
                .fi-resource-orders-create .fi-fo-section:last-child {
                    margin-top: 20px !important;
                }
                
                /* Fix state dropdown height */
                .state-dropdown-tall .choices__list--dropdown {
                    max-height: 400px !important;
                }
                
                .state-dropdown-tall .fi-fo-select .choices__list--dropdown {
                    max-height: 400px !important;
                }
                
                /* Ensure dropdown is visible */
                .fi-fo-select .choices__list--dropdown {
                    max-height: 300px !important;
                    overflow-y: auto !important;
                }
                
                /* Compact table styles for Orders page */
                /* Force fixed table layout on orders page when sidebar is OPEN */
                .fi-main-ctn-sidebar-open .fi-ta-content .fi-ta-table,
                .fi-main-ctn-sidebar-open .fi-resource-orders .fi-ta-table {
                    table-layout: fixed !important;
                    width: 100% !important;
                    min-width: 100% !important;
                }
                
                /* For collapsed sidebar - use auto layout to allow columns to flex */
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-content .fi-ta-table,
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-resource-orders .fi-ta-table {
                    table-layout: auto !important;
                    width: 100% !important;
                    min-width: 100% !important;
                }
                
                /* Remove table-auto class effects when sidebar is open */
                .fi-main-ctn-sidebar-open .fi-ta-table.table-auto {
                    table-layout: fixed !important;
                }
                
                /* Ensure columns don't resize on filter changes when sidebar is open */
                .fi-main-ctn-sidebar-open .fi-ta-table.divide-y {
                    table-layout: fixed !important;
                }
                
                /* Override Tailwind's table-auto class when sidebar is open */
                .fi-main-ctn-sidebar-open .fi-resource-orders .fi-ta-table.table-auto {
                    table-layout: fixed !important;
                }
                
                /* Ensure table containers use full width */
                .fi-resource-orders .fi-ta-ctn,
                .fi-resource-orders .fi-ta-content {
                    width: 100% !important;
                    max-width: none !important;
                }
                
                .fi-resource-orders .fi-ta-table thead th,
                .fi-resource-orders .fi-ta-table tbody td {
                    padding: 0.5rem 0.5rem !important;
                    /* Removed white-space: nowrap to allow text wrapping */
                }
                
                /* Left align table headers */
                .fi-resource-orders .fi-ta-table thead th button {
                    width: 100% !important;
                    justify-content: flex-start !important;
                    padding-left: 15px !important;
                }
                
                /* Left align the sortable button content */
                .fi-resource-orders .fi-ta-table thead th button span {
                    margin: 0 !important;
                }
                
                /* For non-sortable headers */
                .fi-resource-orders .fi-ta-table thead th > span {
                    display: block !important;
                    text-align: left !important;
                    width: 100% !important;
                    padding-left: 15px !important;
                }
                
                
                /* Order # column (1st) - fixed width - INCREASED by 50px */
                .fi-resource-orders .fi-ta-table th:nth-child(1),
                .fi-resource-orders .fi-ta-table td:nth-child(1),
                .fi-ta-table th:nth-child(1),
                .fi-ta-table td:nth-child(1) {
                    width: 220px !important;
                    min-width: 220px !important;
                    max-width: 220px !important;
                }
                
                /* Make order numbers bold on orders page */
                .fi-resource-orders .fi-ta-table td:nth-child(1) a,
                .fi-resource-orders .fi-ta-table td:nth-child(1) span {
                    font-weight: 600 !important;
                }
                
                /* Style order numbers with rounded rectangle - light theme */
                .fi-resource-orders .order-number-enhanced {
                    background-color: rgb(255, 255, 255);
                    color: rgb(17, 24, 39);
                    border: 1px solid rgb(229, 231, 235);
                    border-radius: 8px;
                    padding: 3px 10px;
                    display: inline-block;
                }
                
                /* Dark theme - black background */
                .dark .fi-resource-orders .order-number-enhanced {
                    background-color: rgb(0, 0, 0);
                    color: rgb(255, 255, 255);
                    border-color: rgb(55, 65, 81);
                }
                
                /* FULFILLMENT PAGE STYLES */
                /* Order # column on fulfillment page - INCREASED by 50px and bold */
                .fi-resource-fulfillment .fi-ta-table th:nth-child(1),
                .fi-resource-fulfillment .fi-ta-table td:nth-child(1),
                body[class*="fulfillment"] .fi-ta-table th:nth-child(1),
                body[class*="fulfillment"] .fi-ta-table td:nth-child(1) {
                    width: 220px !important;
                    min-width: 220px !important;
                }
                
                /* Make order numbers bold on fulfillment page */
                .fi-resource-fulfillment .fi-ta-table td:nth-child(1) a,
                .fi-resource-fulfillment .fi-ta-table td:nth-child(1) span,
                body[class*="fulfillment"] .fi-ta-table td:nth-child(1) a,
                body[class*="fulfillment"] .fi-ta-table td:nth-child(1) span {
                    font-weight: 600 !important;
                }
                
                /* Style order numbers on fulfillment page - light theme */
                .fi-resource-fulfillment .order-number-enhanced,
                body[class*="fulfillment"] .order-number-enhanced {
                    background-color: rgb(255, 255, 255);
                    color: rgb(17, 24, 39);
                    border: 1px solid rgb(229, 231, 235);
                    border-radius: 8px;
                    padding: 3px 10px;
                    display: inline-block;
                }
                
                /* Dark theme - black background on fulfillment */
                .dark .fi-resource-fulfillment .order-number-enhanced,
                .dark body[class*="fulfillment"] .order-number-enhanced {
                    background-color: rgb(0, 0, 0);
                    color: rgb(255, 255, 255);
                    border-color: rgb(55, 65, 81);
                }
                
                /* Shipping Address column on fulfillment page - DECREASED by 50px */
                .fi-resource-fulfillment .fi-ta-table th:nth-child(4),
                .fi-resource-fulfillment .fi-ta-table td:nth-child(4),
                body[class*="fulfillment"] .fi-ta-table th:nth-child(4),
                body[class*="fulfillment"] .fi-ta-table td:nth-child(4) {
                    width: 245px !important;
                    min-width: 245px !important;
                    max-width: 245px !important;
                }
                
                /* Source column (2nd) - fixed width and reduce padding */
                .fi-resource-orders .fi-ta-table th:nth-child(2),
                .fi-resource-orders .fi-ta-table td:nth-child(2) {
                    width: 110px !important;
                    min-width: 110px !important;
                    padding-left: 0.25rem !important;
                    padding-right: 0.25rem !important;
                }
                
                /* Further reduce Source column header padding */
                .fi-resource-orders .fi-ta-table th:nth-child(2) > span {
                    padding-left: 7.5px !important;
                }
                
                /* Date column (8th) - fixed width */
                .fi-resource-orders .fi-ta-table th:nth-child(8) {
                    white-space: nowrap !important;
                    width: 135px !important;
                    min-width: 135px !important;
                }
                
                .fi-resource-orders .fi-ta-table th:nth-child(8) button {
                    white-space: nowrap !important;
                    display: inline-flex !important;
                    align-items: center !important;
                }
                
                /* Ensure the sort icon stays inline */
                .fi-resource-orders .fi-ta-table th:nth-child(8) button svg {
                    display: inline-block !important;
                    margin-left: 0.25rem !important;
                }
                
                
                /* Halve the padding for Billing/Shipping column */
                .fi-resource-orders .fi-ta-table td:nth-child(4) .fi-ta-col-wrp {
                    padding-left: 0.25rem !important;
                    padding-right: 0.25rem !important;
                }
                
                /* Reduce padding around Source badges (2nd column) */
                .fi-resource-orders .fi-ta-table td:nth-child(2) .fi-ta-col-wrp {
                    padding-left: 0.125rem !important;
                    padding-right: 0.125rem !important;
                }
                
                /* Make Source badges more compact */
                .fi-resource-orders .fi-ta-table td:nth-child(2) .fi-badge {
                    padding-left: 0.375rem !important;
                    padding-right: 0.375rem !important;
                }
                
                /* Reduce padding between Status and Date Placed columns */
                /* Commented out - consolidated in Status column section
                .fi-resource-orders .fi-ta-table td:nth-child(6) .fi-ta-col-wrp {
                    padding-right: 0.25rem !important;
                }
                */
                
                /* Remove all padding from order-notes-row and its contents */
                .fi-resource-orders .order-notes-row {
                    margin-top: 0 !important;
                    padding-top: 0 !important;
                    border-top: none !important;
                    background: transparent !important;
                }
                
                .fi-resource-orders .order-notes-row td {
                    padding-top: 0 !important;
                    padding-bottom: 0 !important;
                    padding-left: 0 !important;
                    padding-right: 0 !important;
                    border-top: none !important;
                    background: transparent !important;
                }
                
                .fi-resource-orders .order-notes-row > td > div:first-child {
                    /* Allow the margin and padding from the general rule */
                }
                
                /* Also target any Filament table row spacing */
                .fi-resource-orders .fi-ta-table tbody tr.order-notes-row {
                    margin-top: 0 !important;
                    border-top: none !important;
                }
                
                .fi-resource-orders .fi-ta-table tbody tr.order-notes-row > td:first-child {
                    padding-top: 0 !important;
                    border-top: none !important;
                }
                
                /* Remove extra margins from Date Placed column (7th column) */
                .fi-resource-orders .fi-ta-table th:nth-child(7) button,
                .fi-resource-orders .fi-ta-table th:nth-child(7) > span {
                    margin-left: 0 !important;
                }
                .fi-resource-orders .fi-ta-table td:nth-child(7) .fi-ta-col-wrp {
                    margin-left: 0 !important;
                }
                
                /* Status column (6th column) - fixed width with text wrapping */
                .fi-resource-orders .fi-ta-table th:nth-child(6) {
                    text-align: center !important;
                    width: 175px !important;
                    min-width: 175px !important;
                }
                .fi-resource-orders .fi-ta-table th:nth-child(6) button {
                    justify-content: center !important;
                    width: 100% !important;
                    padding-left: 0.5rem !important;
                    padding-right: 0.5rem !important;
                    text-align: center !important;
                }
                .fi-resource-orders .fi-ta-table th:nth-child(6) button span {
                    margin: 0 auto !important;
                    text-align: center !important;
                    width: 100% !important;
                }
                .fi-resource-orders .fi-ta-table td:nth-child(6) {
                    text-align: center !important;
                    width: 175px !important;
                    min-width: 175px !important;
                    padding: 0.5rem 0.5rem !important;
                }
                .fi-resource-orders .fi-ta-table td:nth-child(6) .fi-ta-col-wrp {
                    justify-content: center !important;
                    display: flex !important;
                    width: 100% !important;
                    padding: 0 !important;
                    align-items: center !important;
                }
                
                /* Center the status badges within the Status column (6th column) */
                .fi-resource-orders .fi-ta-table td:nth-child(6) .fi-badge {
                    margin: 0 auto !important;
                    display: inline-block !important;
                    white-space: normal !important; /* Allow text wrapping in status badges */
                    word-wrap: break-word !important;
                }
                
                /* Ensure Status badges are truly centered and have pointer cursor (column 7 now) */
                .fi-resource-orders .fi-ta-table td:nth-child(7) .fi-badge {
                    margin: 0 auto !important;
                    display: inline-block !important;
                    cursor: pointer !important;
                }
                
                /* Also apply pointer cursor to the cell itself */
                .fi-resource-orders .fi-ta-table td.order-status-badge {
                    cursor: pointer !important;
                }
                
                /* Ensure all status badges have pointer cursor */
                .order-status-badge .fi-badge,
                .order-status-badge {
                    cursor: pointer !important;
                }
                
                /* Customer column - fixed width */
                .fi-resource-orders .fi-ta-table th:nth-child(3),
                .fi-resource-orders .fi-ta-table td:nth-child(3) {
                    width: 260px !important;
                    min-width: 260px !important;
                }
                
                /* Set Assigned column width - column 4 */
                .fi-resource-orders .fi-ta-table th:nth-child(4),
                .fi-resource-orders .fi-ta-table td:nth-child(4) {
                    min-width: 100px !important;
                    max-width: 150px !important;
                    text-align: center !important;
                }
                
                /* Limit Customer cell content width */
                .fi-resource-orders .fi-ta-table td:nth-child(3) .fi-ta-col-wrp {
                    max-width: 350px !important;
                }
                
                /* Allow wrapping for specific columns */
                .fi-resource-orders .fi-ta-table td:nth-child(3),  /* Customer column */
                .fi-resource-orders .fi-ta-table td:nth-child(4) { /* Billing/Shipping column */
                    white-space: normal !important;
                }
                
                /* Ensure text wraps properly in Billing/Shipping column */
                .fi-resource-orders .fi-ta-table td:nth-child(4) div {
                    word-wrap: break-word !important;
                    word-break: break-word !important;
                }
                
                /* Shipping Address column - fixed width - DECREASED by 50px */
                .fi-resource-orders .fi-ta-table th:nth-child(4),
                .fi-resource-orders .fi-ta-table td:nth-child(4) {
                    width: 245px !important;
                    min-width: 245px !important;
                    max-width: 245px !important;
                    white-space: normal !important;
                    word-wrap: break-word !important;
                }
                
                /* Ensure Shipping Address content uses full width */
                .fi-resource-orders .fi-ta-table td:nth-child(4) .fi-ta-col-wrp {
                    width: 100% !important;
                    max-width: 100% !important;
                }
                
                /* Ensure inner text wrapper uses full width */
                .fi-resource-orders .fi-ta-table td:nth-child(4) .fi-ta-text {
                    width: 100% !important;
                    max-width: 100% !important;
                }
                
                /* Remove any max-width constraints on inner content */
                .fi-resource-orders .fi-ta-table td:nth-child(4) .fi-ta-text > div {
                    max-width: none !important;
                }
                
                /* Override Filament's max-w-max class in shipping column */
                .fi-resource-orders .fi-ta-table td:nth-child(4) .max-w-max {
                    max-width: 100% !important;
                }
                
                /* Hide the 10th column (hidden notes data column) - updated after adding Assigned column */
                .fi-resource-orders .fi-ta-table th:nth-child(10),
                .fi-resource-orders .fi-ta-table td:nth-child(10) {
                    display: none !important;
                    width: 0 !important;
                    padding: 0 !important;
                    margin: 0 !important;
                    border: 0 !important;
                }
                
                /* Order Total column - fixed width (5th) */
                .fi-resource-orders .fi-ta-table th:nth-child(5),
                .fi-resource-orders .fi-ta-table td:nth-child(5) {
                    width: 130px !important;
                    min-width: 130px !important;
                    text-align: center !important;
                }
                
                /* Center align Order Total header */
                .fi-resource-orders .fi-ta-table th:nth-child(5) {
                    text-align: center !important;
                }
                
                .fi-resource-orders .fi-ta-table th:nth-child(5) button {
                    justify-content: center !important;
                    width: 100% !important;
                    text-align: center !important;
                    padding-left: 0 !important;
                    padding-right: 0 !important;
                }
                
                .fi-resource-orders .fi-ta-table th:nth-child(5) button span,
                .fi-resource-orders .fi-ta-table th:nth-child(5) > span {
                    margin: 0 auto !important;
                    margin-left: -5px !important;
                    text-align: center !important;
                    width: 100% !important;
                }
                
                /* Remove padding from Order Total column content */
                .fi-resource-orders .fi-ta-table thead th:nth-child(5),
                .fi-resource-orders .fi-ta-table thead th:nth-child(5) > *,
                .fi-resource-orders .fi-ta-table tbody td:nth-child(5) {
                    padding-left: 0 !important;
                    padding-right: 0 !important;
                }
                
                .fi-resource-orders .fi-ta-table tbody td:nth-child(5) .fi-ta-col-wrp,
                .fi-resource-orders .fi-ta-table tbody td:nth-child(5) .fi-ta-text,
                .fi-resource-orders .fi-ta-table tbody td:nth-child(5) .fi-ta-text-item {
                    padding-left: 0 !important;
                    padding-right: 0 !important;
                }
                
                /* Center the Order Total column content */
                .fi-resource-orders .fi-ta-table td:nth-child(5) .fi-ta-col-wrp {
                    display: flex !important;
                    justify-content: center !important;
                    align-items: center !important;
                }
                
                /* Center-align Source column (2nd column) */
                .fi-resource-orders .fi-ta-table th:nth-child(2),
                .fi-resource-orders .fi-ta-table td:nth-child(2) {
                    text-align: center !important;
                }
                
                .fi-resource-orders .fi-ta-table td:nth-child(2) .fi-ta-col-wrp {
                    display: flex !important;
                    justify-content: center !important;
                    align-items: center !important;
                    width: 100% !important;
                }
                
                .fi-resource-orders .fi-ta-table td:nth-child(2) .fi-ta-text {
                    text-align: center !important;
                    justify-items: center !important;
                    display: flex !important;
                    justify-content: center !important;
                    align-items: center !important;
                    width: 100% !important;
                }
                
                /* Center the badge/inline-flex items in Source column */
                .fi-resource-orders .fi-ta-table td:nth-child(2) .fi-ta-text-item {
                    margin: 0 auto !important;
                }
                
                .fi-resource-orders .fi-ta-table td:nth-child(2) .inline-flex {
                    margin: 0 auto !important;
                }
                
                /* Override the flex justify-start that's pushing content to the left */
                .fi-resource-orders .fi-ta-table td:nth-child(2) .flex.justify-start {
                    justify-content: center !important;
                }
                
                /* Target the fi-ta-cell directly in Source column */
                .fi-resource-orders .fi-ta-cell:nth-child(2) {
                    text-align: center !important;
                }
                
                .fi-resource-orders .fi-ta-cell:nth-child(2) .fi-ta-col-wrp {
                    display: flex !important;
                    justify-content: center !important;
                    align-items: center !important;
                    width: 100% !important;
                }
                
                .fi-resource-orders .fi-ta-cell:nth-child(2) .fi-ta-text {
                    display: flex !important;
                    justify-content: center !important;
                    width: 100% !important;
                }
                
                /* Force all flex containers in Source column to center */
                .fi-resource-orders .fi-ta-cell:nth-child(2) .flex {
                    justify-content: center !important;
                }
                
                /* Remove left padding but add right padding to fi-ta-text in Source column */
                .fi-resource-orders .fi-ta-cell:nth-child(2) .fi-ta-text,
                .fi-resource-orders td:nth-child(2) .fi-ta-text {
                    padding-left: 0 !important;
                    padding-right: 10px !important;
                }
                
                /* Add right padding to Source column header */
                .fi-resource-orders .fi-ta-table th:nth-child(2) {
                    padding-right: 10px !important;
                }
                
                /* Remove padding from the column wrapper itself */
                .fi-resource-orders .fi-ta-cell:nth-child(2) .fi-ta-col-wrp {
                    padding-left: 0 !important;
                    padding-right: 0 !important;
                }
                
                /* Remove left padding from Order Number column (first column) */
                .fi-resource-orders .fi-ta-cell:first-child,
                .fi-resource-orders td:first-child {
                    padding-left: 0 !important;
                }
                
                /* Set Status column (6th) width */
                /* Commented out - using flexible width for proper centering
                .fi-resource-orders .fi-ta-table th:nth-child(6),
                .fi-resource-orders .fi-ta-table td:nth-child(6) {
                    max-width: 80px !important;
                    text-align: center !important;
                }
                */
                
                
                /* Ensure all copy tooltips have white text and highest z-index */
                .copy-tooltip {
                    color: white !important;
                    z-index: 999999 !important;
                }
                
                .copy-tooltip * {
                    color: white !important;
                }
                
                /* Center all badges in table cells */
                .fi-resource-orders .fi-ta-table td .fi-badge {
                    margin-left: auto !important;
                    margin-right: auto !important;
                    display: inline-flex !important;
                }
                
                /* Center the cell content for Source column (2nd column) */
                .fi-resource-orders .fi-ta-table td:nth-child(2) {
                    text-align: center !important;
                }
                
                /* Ensure badge containers are centered for Source column only */
                .fi-resource-orders .fi-ta-table td:nth-child(2) .fi-ta-col-wrp {
                    display: flex !important;
                    justify-content: center !important;
                    align-items: center !important;
                }
                
                /* Actions column (7th) - fixed width and center content */
                .fi-resource-orders .fi-ta-table th:nth-child(7),
                .fi-resource-orders .fi-ta-table td:nth-child(7) {
                    width: 110px !important;
                    min-width: 110px !important;
                    text-align: center !important;
                }
                
                .fi-resource-orders .fi-ta-table td:nth-child(7) {
                    padding-right: 18px !important; /* Default 8px + 10px extra */
                }
                
                .fi-resource-orders .fi-ta-table td:nth-child(7) .fi-ta-col-wrp {
                    display: flex !important;
                    justify-content: center !important;
                    align-items: center !important;
                }
                
                /* Center Date Placed column content - now column 8 */
                .fi-resource-orders .fi-ta-table td:nth-child(8) {
                    text-align: center !important;
                    width: 135px !important;
                    min-width: 135px !important;
                }
                
                .fi-resource-orders .fi-ta-table td:nth-child(8) .fi-ta-col-wrp {
                    display: flex !important;
                    justify-content: center !important;
                    align-items: center !important;
                }
                
                .fi-resource-orders .fi-ta-cell-wrp {
                    padding: 0.25rem !important;
                }
                
                /* Remove extra spacing from the table wrapper */
                .fi-resource-orders .fi-ta {
                    gap: 0 !important;
                }
                
                /* Reduce header spacing */
                .fi-resource-orders .fi-ta-header {
                    gap: 0.5rem !important;
                }
                
                /* Make bold text in notes extra bold - adaptive for light/dark mode */
                .note-text b, .note-text strong {
                    font-weight: 900 !important; /* Maximum boldness */
                    text-shadow: 0 0 0.5px currentColor; /* Subtle text shadow to make it appear even bolder */
                }
                
                /* Light mode - darker bold text */
                :root:not(.dark) .note-text b, 
                :root:not(.dark) .note-text strong {
                    color: rgb(17 24 39) !important; /* Very dark gray */
                }
                
                /* Dark mode - brighter bold text */
                .dark .note-text b, 
                .dark .note-text strong {
                    color: rgb(248 250 252) !important; /* Almost white */
                }
                
                /* Fix textarea styling in modal */
                .note-textarea {
                    font-family: inherit;
                    line-height: 1.5;
                }
                
                /* US state abbreviation styling for light/dark mode */
                .us-state-abbr {
                    font-weight: 700 !important;
                    color: rgb(17 24 39) !important; /* Dark color for light mode */
                }
                
                .dark .us-state-abbr {
                    color: rgb(209 213 219) !important; /* Light gray for dark mode */
                }
                
                /* Rich text editor styles */
                .note-editor {
                    width: 100%;
                    min-height: 50px;
                    max-height: 300px;
                    padding: 6px;
                    border: 1px solid rgb(229, 231, 235);
                    border-radius: 0.375rem;
                    font-size: 0.8rem;
                    line-height: 1.5;
                    background: white;
                    outline: none;
                    overflow-y: auto;
                    overflow-x: hidden;
                    position: relative;
                    z-index: auto;
                    pointer-events: auto !important;
                    user-select: text !important;
                    -webkit-user-select: text !important;
                    -moz-user-select: text !important;
                    -ms-user-select: text !important;
                    word-wrap: break-word !important;
                    overflow-wrap: break-word !important;
                    white-space: pre-wrap !important;
                    word-break: break-word !important;
                }
                
                .dark .note-editor {
                    background: #18181b;
                    border-color: rgb(75, 85, 99);
                    color: rgb(229, 231, 235) !important;
                }

                /* Force all text in dark mode editor to be white */
                .dark .note-editor * {
                    color: rgb(229, 231, 235) !important;
                }

                .dark .note-editor b,
                .dark .note-editor strong,
                .dark .note-editor i,
                .dark .note-editor em,
                .dark .note-editor u {
                    color: rgb(229, 231, 235) !important;
                }
                
                .note-editor:focus {
                    border-color: rgb(59, 130, 246) !important;
                    box-shadow: 0 0 0 2px rgb(59, 130, 246) !important;
                    outline: none !important;
                    caret-color: rgb(59, 130, 246) !important;
                }
                
                .note-editor b {
                    font-weight: 700;
                    color: inherit;
                }
                
                .note-editor i {
                    font-style: italic;
                }
                
                .note-editor u {
                    text-decoration: underline;
                }
                
                /* Placeholder for contenteditable */
                .note-editor:empty::before {
                    content: attr(placeholder);
                    color: rgb(156, 163, 175);
                    font-style: italic;
                }
                
                .dark .note-editor:empty::before {
                    color: rgb(107, 114, 128);
                }
                
                /* Formatting toolbar styles */
                .format-toolbar {
                    display: flex;
                    gap: 4px;
                    margin-bottom: 6px;
                    padding: 4px;
                    background: rgba(0, 0, 0, 0.05);
                    border-radius: 0.25rem;
                }
                
                .dark .format-toolbar {
                    background: rgba(255, 255, 255, 0.05);
                }
                
                .format-btn {
                    padding: 4px 8px;
                    border: 1px solid rgba(0, 0, 0, 0.1);
                    background: white;
                    border-radius: 0.25rem;
                    cursor: pointer;
                    font-size: 0.875rem;
                    font-weight: 500;
                    transition: all 0.15s;
                }
                
                .dark .format-btn {
                    background: rgb(31, 41, 55);
                    border-color: rgba(255, 255, 255, 0.1);
                    color: rgb(209, 213, 219);
                }
                
                .format-btn:hover {
                    background: rgb(243, 244, 246);
                    border-color: rgba(0, 0, 0, 0.2);
                }
                
                .dark .format-btn:hover {
                    background: rgb(55, 65, 81);
                    border-color: rgba(255, 255, 255, 0.2);
                }
                
                .format-btn.bold { font-weight: 700; }
                .format-btn.italic { font-style: italic; }
                .format-btn.underline { text-decoration: underline; }
                
                /* Highlight button - subtle in light mode */
                .format-btn.highlight-btn {
                    background: #fefce8 !important; /* Very pale yellow in light mode */
                    color: #a16207 !important; /* Medium amber text */
                    border-color: #fef3c7 !important;
                    position: relative;
                }
                
                .format-btn.highlight-btn:hover {
                    background: #fef08a !important;
                    border-color: #fde047 !important;
                }
                
                /* Highlight button - subtle in dark mode */
                .dark .format-btn.highlight-btn {
                    background: rgba(254, 240, 138, 0.1) !important; /* Very subtle yellow */
                    color: rgb(156, 163, 175) !important; /* Light gray text */
                    border-color: rgba(254, 240, 138, 0.2) !important;
                }
                
                .dark .format-btn.highlight-btn:hover {
                    background: rgba(254, 240, 138, 0.2) !important;
                    border-color: rgba(254, 240, 138, 0.3) !important;
                }
                
                /* Remove old tooltip styles - now using title attribute */
                
                /* Subtle delete checkboxes */
                .delete-label {
                    opacity: 0.5;
                    transition: all 0.2s;
                }
                
                .delete-label:hover {
                    opacity: 1;
                }
                
                .delete-label input[type="checkbox"] {
                    opacity: 0.6;
                    transform: scale(0.85);
                    transition: all 0.2s;
                }
                
                /* Active filter highlighting - ONLY for filters, not forms */
                /* Target only elements within .fi-ta-filters (table filters) */
                /* Add body to increase specificity over Filament's rules */
                /* Use :not(.filter-tooltip) to exclude tooltip spans */
                body .fi-ta-filters .fi-fo-field-wrp.filter-active label.fi-fo-field-wrp-label,
                body .fi-ta-filters .fi-fo-field-wrp.filter-active label.fi-fo-field-wrp-label span:not(.filter-tooltip),
                body .fi-ta-filters .filter-active > label.fi-fo-field-wrp-label,
                body .fi-ta-filters .filter-active > label.fi-fo-field-wrp-label > span:not(.filter-tooltip),
                body .fi-ta-filters .filter-active label,
                body .fi-ta-filters .filter-active label span:not(.filter-tooltip) {
                    color: rgb(251, 146, 60) !important;
                    font-weight: 900 !important;
                    text-shadow: 0 0 1px rgba(251, 146, 60, 0.3) !important;
                }
                
                .dark body .fi-ta-filters .fi-fo-field-wrp.filter-active label.fi-fo-field-wrp-label,
                .dark body .fi-ta-filters .fi-fo-field-wrp.filter-active label.fi-fo-field-wrp-label span:not(.filter-tooltip),
                .dark body .fi-ta-filters .filter-active > label.fi-fo-field-wrp-label,
                .dark body .fi-ta-filters .filter-active > label.fi-fo-field-wrp-label > span:not(.filter-tooltip),
                .dark body .fi-ta-filters .filter-active label,
                .dark body .fi-ta-filters .filter-active label span:not(.filter-tooltip) {
                    color: rgb(34, 197, 94) !important;
                    font-weight: 900 !important;
                    text-shadow: 0 0 1px rgba(34, 197, 94, 0.5) !important;
                }
                
                /* Special highlighting for search filter placeholder text */
                body .fi-ta-filters .search-filter-active .fi-fo-placeholder,
                body .fi-ta-filters .fi-fo-placeholder.search-filter-active,
                body .fi-ta-filters div.search-filter-active,
                body div.search-filter-active {
                    color: rgb(251, 146, 60) !important;
                    font-weight: 900 !important;
                    text-shadow: 0 0 1px rgba(251, 146, 60, 0.3) !important;
                }
                
                .dark body .fi-ta-filters .search-filter-active .fi-fo-placeholder,
                .dark body .fi-ta-filters .fi-fo-placeholder.search-filter-active,
                .dark body .fi-ta-filters div.search-filter-active,
                .dark body div.search-filter-active {
                    color: rgb(34, 197, 94) !important;
                    font-weight: 900 !important;
                    text-shadow: 0 0 1px rgba(34, 197, 94, 0.5) !important;
                }
                
                /* Filter tooltips */
                .filter-tooltip {
                    position: fixed;
                    margin-bottom: 8px;
                    padding: 10px 14px;
                    background: #333;
                    color: white;
                    border-radius: 4px;
                    font-size: 0.875rem;
                    font-weight: normal;
                    white-space: nowrap;
                    pointer-events: none;
                    opacity: 0;
                    transition: opacity 0.3s;
                    z-index: 10000;
                }
                
                .filter-tooltip::after {
                    content: '';
                    position: absolute;
                    top: 100%;
                    left: 50%;
                    transform: translateX(-50%);
                    border: 5px solid transparent;
                    border-top-color: #333;
                }
                
                /* When checkbox is checked, make it bright and bold */
                .delete-label:has(input[type="checkbox"]:checked) {
                    opacity: 1;
                    font-weight: 700;
                    color: rgb(239, 68, 68);
                }
                
                .dark .delete-label:has(input[type="checkbox"]:checked) {
                    color: rgb(248, 113, 113);
                }
                
                .delete-label input[type="checkbox"]:checked {
                    opacity: 1;
                    transform: scale(1);
                }
                
                /* Modal styling for light mode - gray backgrounds */
                :root:not(.dark) .edit-notes-modal-content {
                    background: rgb(243 244 246) !important; /* Light gray instead of white */
                    color: rgb(17 24 39);
                    position: relative;
                    z-index: 1000001;
                    pointer-events: auto !important;
                }
                
                .dark .edit-notes-modal-content {
                    background: rgba(24, 24, 27, 1); /* Updated dark mode background */
                    color: rgb(229 231 235);
                    position: relative;
                    z-index: 1000001;
                    pointer-events: auto !important;
                }
                
                /* Removed the pointer-events rule that was interfering with text selection */
                
                /* Ensure text selection works in note editors */
                .note-editor {
                    user-select: text !important;
                    -webkit-user-select: text !important;
                    -moz-user-select: text !important;
                    -ms-user-select: text !important;
                }
                
                
                /* Item Return modal - match Filament colors */
                :root:not(.dark) .item-return-modal-content {
                    background: rgb(243 244 246) !important;
                    color: rgb(17 24 39);
                }
                
                .dark .item-return-modal-content {
                    background: rgba(24, 24, 27, 1) !important;
                    color: rgb(229 231 235);
                }
                
                /* Status modal - match Filament colors */
                :root:not(.dark) .status-modal.modal-content {
                    background: rgb(243 244 246) !important;
                    color: rgb(17 24 39);
                }
                
                .dark .status-modal.modal-content {
                    background: rgba(24, 24, 27, 1) !important;
                    color: rgb(229 231 235);
                }
                
                /* Filament modals in light mode */
                :root:not(.dark) .fi-modal-window {
                    background: rgb(243 244 246) !important;
                }
                
                :root:not(.dark) .fi-modal-content,
                :root:not(.dark) [x-ref="modalContainer"] {
                    background: rgb(243 244 246) !important;
                }
                
                /* Fix focus border cutoff in modals */
                .status-modal select,
                .status-modal input,
                .status-modal textarea {
                    margin-left: 2px !important;
                    width: calc(100% - 4px) !important;
                }
                
                /* Expand Orders panel to be closer to right edge */
                .fi-main-ctn-sidebar-open {
                    padding-right: 0 !important;
                    max-width: calc(100vw - 165px) !important; /* Reduce right space by 155px */
                    width: calc(100vw - 165px) !important;
                }
                
                .fi-main-ctn-sidebar-open .fi-main {
                    max-width: 100% !important;
                    width: 100% !important;
                    padding-right: 1rem !important;
                }
                
                /* Shrink table when sidebar is open to fit within viewport */
                .fi-main-ctn-sidebar-open .fi-ta-ctn {
                    overflow-x: hidden !important;
                    max-width: 100% !important;
                }
                
                .fi-main-ctn-sidebar-open .fi-ta-content {
                    overflow-x: hidden !important;
                }
                
                .fi-main-ctn-sidebar-open .fi-ta-table {
                    width: 100% !important;
                    table-layout: fixed !important;
                }
                
                /* Fix header background extending issue with pseudo-element */
                .fi-main-ctn-sidebar-open .fi-ta-table thead tr {
                    position: relative;
                }
                
                .fi-main-ctn-sidebar-open .fi-ta-table thead tr::after {
                    content: '';
                    position: absolute;
                    top: 0;
                    right: -50px;
                    bottom: 0;
                    width: 50px;
                    background: inherit;
                    pointer-events: none;
                }
                
                /* Reduce column widths when sidebar is open */
                .fi-main-ctn-sidebar-open .fi-ta-table th,
                .fi-main-ctn-sidebar-open .fi-ta-table td {
                    padding-left: 0.5rem !important;
                    padding-right: 0.5rem !important;
                    font-size: 0.875rem !important;
                }
                
                /* Force table header to use full width and space-between layout */
                .fi-ta-header {
                    width: 100% !important;
                }
                
                .fi-ta-header-toolbar {
                    width: 100% !important;
                }
                
                .fi-ta-header-toolbar > div {
                    width: 100% !important;
                }
                
                /* Main actions container - use flex with space-between */
                .fi-ta-actions {
                    display: flex !important;
                    width: 100% !important;
                    justify-content: space-between !important;
                    align-items: center !important;
                    gap: 2rem !important;
                }
                
                /* Target ALL possible wrapping divs and force them to participate in flex */
                .fi-ta-actions > * {
                    flex-shrink: 0 !important;
                }
                
                /* Needs Order Stats - Force to the left */
                .fi-ta-actions > *:nth-child(1) {
                    margin-right: auto !important;
                    margin-left: 0 !important;
                    align-self: center !important;
                }
                
                /* Reset link - positioned before Load/Save */
                .fi-ta-actions > *:nth-child(2) {
                    margin-left: auto !important;
                    margin-right: 10px !important;
                    align-self: center !important;
                }

                /* Load/Save Filter Settings button */
                .fi-ta-actions > *:nth-child(3) {
                    margin-left: 0 !important;
                    margin-right: 0 !important;
                    align-self: center !important;
                }
                
                /* More specific targeting for the disabled button (Needs Order) */
                .fi-ta-actions button:disabled {
                    text-align: left !important;
                    display: inline-block !important;
                }
                
                /* More specific targeting for the enabled button (Load/Save) */
                .fi-ta-actions button.fi-btn {
                    text-align: center !important;
                }
                
                /* Remove any center alignment from action containers */
                .fi-ta-actions .fi-ac {
                    margin-left: 0 !important;
                    margin-right: 0 !important;
                    justify-content: unset !important;
                }
                
                /* If actions are wrapped in additional divs, handle those too */
                .fi-ta-actions > div > .fi-ac:has(button:disabled) {
                    display: inline-block !important;
                }
                
                .fi-ta-actions > div > .fi-ac:has(.fi-btn) {
                    display: inline-block !important;
                }
                
                /* Hide the "Filters" label text */
                .fi-ta-filters-dropdown > button > span.fi-dropdown-trigger-label,
                .fi-ta-filters > div > span:first-child,
                .fi-ta-filters-ctn > div > span:first-child,
                .fi-section-header-heading,
                .fi-ta-filters-form > div:first-child > span,
                .fi-ta-filters > :first-child:not(form):not(div.fi-ta-filters-form),
                .fi-ta-filters > header,
                .fi-ta-filters-header {
                    display: none !important;
                }
                
                /* Target the filters section heading specifically */
                .fi-section-heading,
                .fi-ta-filters h3,
                .fi-ta-filters h2,
                .fi-ta-filters h4 {
                    display: none !important;
                }
                
                /* Hide any standalone text nodes in filters container */
                .fi-ta-filters > span:first-child {
                    display: none !important;
                }
                
                /* Keep the filter form visible but hide just the label */
                .fi-ta-filters-form {
                    display: block !important;
                }
                
                /* Needs Order label - black in light theme, white in dark theme */
                .needs-order-label {
                    color: black;
                    font-weight: normal !important;
                }
                
                .dark .needs-order-label {
                    color: white;
                    font-weight: normal !important;
                }
                
                /* Remove all rings, borders, and outlines from the Needs Order button */
                button[class*="pointer-events-none"][class*="cursor-default"] {
                    box-shadow: none !important;
                    outline: none !important;
                    border: none !important;
                }
                
                button[class*="pointer-events-none"][class*="cursor-default"]:focus,
                button[class*="pointer-events-none"][class*="cursor-default"]:focus-visible {
                    box-shadow: none !important;
                    outline: none !important;
                    border: none !important;
                    ring: none !important;
                }
                
                /* More specific selector for the Needs Order button */
                .fi-ta-header button.pointer-events-none.cursor-default {
                    box-shadow: none !important;
                    outline: none !important;
                    border: none !important;
                }
                
                .fi-ta-header button.pointer-events-none.cursor-default:focus-visible {
                    box-shadow: none !important;
                    outline: none !important;
                    border: none !important;
                }
                
                
                
                /* Make specific columns narrower when sidebar is open */
                .fi-main-ctn-sidebar-open .fi-ta-col-source {
                    width: 80px !important;
                    max-width: 80px !important;
                }
                
                .fi-main-ctn-sidebar-open .fi-ta-col-order_total {
                    width: 100px !important;
                    max-width: 100px !important;
                }
                
                .fi-main-ctn-sidebar-open .fi-ta-col-status {
                    width: 120px !important;
                    max-width: 120px !important;
                }
                
                .fi-main-ctn-sidebar-open .fi-ta-col-date_placed {
                    width: 140px !important;
                    max-width: 140px !important;
                }
                
                /* Allow customer and shipping columns to shrink */
                .fi-main-ctn-sidebar-open .fi-ta-col-customer,
                .fi-main-ctn-sidebar-open .fi-ta-col-shipping_address {
                    max-width: 200px !important;
                    overflow: hidden !important;
                    text-overflow: ellipsis !important;
                }
                
                /* Order items styling */
                .order-items-section {
                    margin-bottom: 0.25rem;
                }
                
                .dark .order-items-section h4 {
                    color: rgb(156 163 175);
                }
                
                .dark .order-items-section .order-items-list {
                    color: rgb(156 163 175);
                }
                
                /* B2B toggle bar styling */
                .b2b-toggle-bar {
                    background-color: rgb(243, 244, 246);
                    color: rgb(107, 114, 128);
                }
                
                .dark .b2b-toggle-bar {
                    background-color: rgb(31, 41, 55);
                    color: rgb(156, 163, 175);
                }
                
                /* Order item box styling */
                .order-item-box {
                    border: 1px solid rgb(229 231 235);
                    background-color: white;
                    max-width: 100%;
                    box-sizing: border-box;
                }
                
                .dark .order-item-box {
                    border: 1px solid rgba(75, 85, 99, 0.5);
                    background-color: #000000;
                    max-width: 100%;
                    box-sizing: border-box;
                }
                
                /* Ensure order item content doesn't overflow */
                .order-item-content {
                    max-width: 100%;
                    box-sizing: border-box;
                }
                
                /* Ensure order item wrapper doesn't overflow */
                .order-item-wrapper {
                    max-width: 100%;
                    box-sizing: border-box;
                }
                
                /* Remove negative margin - all order items should have same height */
                .order-item-wrapper:first-child .order-item-box {
                    margin-top: 0 !important;
                }
                
                /* Remove negative margin for order-item-boxes within B2B containers to prevent clipping */
                .b2b-items-container .order-item-wrapper:first-child .order-item-box {
                    margin-top: 0 !important;
                }
                
                /* Item action button styles */
                .item-action-btn {
                    font-size: 11px !important;
                    padding: 3px 6px !important;
                    border-radius: 3px !important;
                    cursor: pointer !important;
                    transition: all 0.2s !important;
                }
                
                /* Active buttons (green) - balanced subtle */
                .item-action-btn.action-btn-active {
                    background: rgba(16, 185, 129, 0.25) !important;
                    color: #059669 !important;
                    box-shadow: 0 1px 2px rgba(0,0,0,0.06) !important;
                    border: 1px solid rgba(16, 185, 129, 0.4) !important;
                    font-weight: 500 !important;
                }
                
                .item-action-btn.action-btn-active:hover {
                    background: rgba(16, 185, 129, 0.35) !important;
                    border-color: rgba(16, 185, 129, 0.6) !important;
                    color: #047857 !important;
                }
                
                /* Inactive buttons - Light theme */
                .item-action-btn.action-btn-inactive {
                    background: #f9fafb !important;
                    color: #111827 !important;
                    border: 1px solid #d1d5db !important;
                }
                
                .item-action-btn.action-btn-inactive:hover {
                    background: #e5e7eb !important;
                }
                
                /* Inactive buttons - Dark theme */
                .dark .item-action-btn.action-btn-inactive {
                    background: #374151 !important;
                    color: #9ca3af !important;
                    border: 1px solid #4b5563 !important;
                }
                
                .dark .item-action-btn.action-btn-inactive:hover {
                    background: #4b5563 !important;
                }
                
                /* Fix dark mode table overflow */
                .dark .fi-ta-content {
                    overflow-x: hidden !important;
                }
                
                /* Force table to use full width when sidebar is collapsed */
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table {
                    width: 100% !important;
                    table-layout: auto !important;
                }
                
                /* Adjust column widths when sidebar is collapsed - use percentages to ensure they fit */
                /* Order # column (1st) - 16% */
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table thead th:nth-child(1),
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table tbody td:nth-child(1) {
                    width: 16% !important;
                    min-width: 150px !important;
                    max-width: none !important;
                }
                
                /* Customer column (2nd) - 20% */
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table thead th:nth-child(2),
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table tbody td:nth-child(2) {
                    width: 20% !important;
                    min-width: 180px !important;
                    max-width: none !important;
                }
                
                /* Make company names NOT wrap in Customer column - allow overflow */
                .fi-ta-table tbody td:nth-child(2) .fi-ta-text:not(.truncate-email),
                .fi-ta-table tbody td:nth-child(2) .fi-ta-text-item:not(.truncate-email),
                .fi-ta-table tbody td:nth-child(2) div:not(.truncate-email):not(.text-sm) {
                    white-space: nowrap !important;
                    overflow: visible !important;
                    max-width: none !important;
                }
                
                /* Keep email truncation with ellipsis */
                .fi-ta-table tbody td:nth-child(2) .truncate-email {
                    display: block !important;
                    max-width: 235px !important;
                    overflow: hidden !important;
                    text-overflow: ellipsis !important;
                    white-space: nowrap !important;
                    word-wrap: normal !important;
                    word-break: normal !important;
                }
                
                /* Ensure Customer column content doesn't overflow */
                .fi-ta-table tbody td:nth-child(2) {
                    /* Removed max-width to allow column to flex */
                    overflow: hidden !important;
                }
                
                /* Shipping Address column (3rd) - 22% */
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table thead th:nth-child(3),
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table tbody td:nth-child(3) {
                    width: 22% !important;
                    min-width: 200px !important;
                    max-width: none !important;
                }
                
                /* Auto-truncate address text in collapsed view */
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table td:nth-child(4) .fi-ta-text {
                    overflow: hidden !important;
                    text-overflow: ellipsis !important;
                    white-space: nowrap !important;
                }
                
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table td:nth-child(4) .fi-ta-text-item {
                    overflow: hidden !important;
                    text-overflow: ellipsis !important;
                    white-space: nowrap !important;
                }
                
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table td:nth-child(4) .address-enhanced {
                    overflow: hidden !important;
                    text-overflow: ellipsis !important;
                    white-space: nowrap !important;
                    max-width: 100% !important;
                }
                /* Order Total column (4th) - 11% */
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table thead th:nth-child(4),
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table tbody td:nth-child(4) {
                    width: 11% !important;
                    min-width: 90px !important;
                    max-width: none !important;
                }
                
                /* Status column (5th) - 13% */
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table thead th:nth-child(5),
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table tbody td:nth-child(5) {
                    width: 13% !important;
                    min-width: 130px !important;
                    max-width: none !important;
                }
                
                /* Item Count column (6th) - 10% */
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table thead th:nth-child(6),
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table tbody td:nth-child(6) {
                    width: 10% !important;
                    min-width: 80px !important;
                    max-width: none !important;
                }
                
                /* Date column (7th) - 8% (Total: 100%) */
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table thead th:nth-child(7),
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table tbody td:nth-child(7) {
                    width: 8% !important;
                    min-width: 120px !important;
                    max-width: none !important;
                }
                
                /* Hide the 8th column (notes_data) completely */
                .fi-ta-table thead th:nth-child(8),
                .fi-ta-table tbody td:nth-child(8) {
                    display: none !important;
                    width: 0 !important;
                    min-width: 0 !important;
                    max-width: 0 !important;
                    padding: 0 !important;
                    margin: 0 !important;
                    border: 0 !important;
                }
                
                /* Move Edit button 10px to the right when sidebar is collapsed */
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .edit-button-wrapper {
                    padding-left: 10px !important;
                }
                
                /* Add margin above and below company name in Customer column */
                .fi-ta-table tbody td:nth-child(3) > div > div:first-child {
                    margin-top: 3px !important;
                    margin-bottom: 3px !important;
                }
                
                /* Add spacing between Company, Name, and Email in Customer column */
                .fi-ta-table tbody td:nth-child(3) .fi-ta-text {
                    margin-bottom: 3px !important;
                    display: block !important;
                }
                
                .fi-ta-table tbody td:nth-child(3) .fi-ta-text:last-child {
                    margin-bottom: 0 !important;
                }
                
                /* Add padding to the inner content of the last column (actions) when sidebar is collapsed */
                /* Removed - no padding needed
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table thead th:last-child > *,
                .fi-main-ctn:not(.fi-main-ctn-sidebar-open) .fi-ta-table tbody td:last-child > * {
                    margin-left: 10px !important;
                    margin-right: 10px !important;
                }
                */
                
                /* Supplier prices section */
                .supplier-prices-section {
                    background-color: rgba(0, 0, 0, 0.02);
                }
                
                .dark .supplier-prices-section {
                    background-color: rgba(255, 255, 255, 0.02);
                }
                
                /* Supplier price badges - light mode */
                .supplier-cheapest {
                    background-color: rgba(134, 239, 172, 0.3);
                    color: rgb(21 128 61);
                }
                
                .supplier-instock {
                    background-color: rgba(59, 130, 246, 0.1);
                    color: rgb(29 78 216);
                }
                
                .supplier-outstock {
                    background-color: rgba(239, 68, 68, 0.1);
                    color: rgb(185 28 28);
                }
                
                /* Supplier price badges - dark mode */
                .dark .supplier-cheapest {
                    background-color: rgba(134, 239, 172, 0.4);
                    color: white;
                }
                
                .dark .supplier-instock {
                    background-color: rgba(59, 130, 246, 0.3);
                    color: white;
                }
                
                .dark .supplier-outstock {
                    background-color: rgba(239, 68, 68, 0.3);
                    color: white;
                }
                
                .dark .supplier-prices-inline span {
                    color: white !important;
                }
                
                /* Supplier badge selection styles for fulfillment page */
                .supplier-badge-selectable {
                    cursor: pointer !important;
                    transition: all 0.2s !important;
                }
                
                .supplier-badge-selectable:hover {
                    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
                }
                
                .supplier-badge-oos {
                    opacity: 0.5 !important;
                    cursor: not-allowed !important;
                    pointer-events: none !important;
                }
                
                .supplier-badge-selected {
                    border: 2px solid rgb(59, 130, 246) !important;
                    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
                }
                
                /* Make supplier price bold text extra bold */
                .supplier-prices-inline strong {
                    font-weight: 900 !important;
                    text-shadow: 0 0 0.5px currentColor;
                }
                
                /* Light mode notes section styling - warm orangish tint */
                :root:not(.dark) .order-notes-row > td > div {
                    background-color: rgb(255 247 237);
                }
                
                /* Dark mode notes section styling - blue-ish tint */
                .dark .order-notes-row > td > div {
                    background-color: rgb(17 24 39);
                }
                
                
                /* Light mode - pure white page background */
                :root:not(.dark) body,
                :root:not(.dark) .fi-body,
                :root:not(.dark) .fi-layout,
                :root:not(.dark) .fi-main,
                :root:not(.dark) .fi-page {
                    background-color: white !important;
                }
                
                /* Light mode - filters panel with same gray as notes */
                :root:not(.dark) .fi-ta-filters,
                :root:not(.dark) .fi-ta-filters-ctn,
                :root:not(.dark) .fi-ta-filters-above-content-ctn,
                :root:not(.dark) .fi-section,
                :root:not(.dark) .fi-ta-header,
                :root:not(.dark) .fi-ta-header-ctn,
                :root:not(.dark) .fi-ta-content,
                :root:not(.dark) .fi-ta-ctn,
                :root:not(.dark) .fi-resource-orders > div,
                :root:not(.dark) .fi-resource-orders .fi-page-wrapper,
                :root:not(.dark) .fi-main-ctn > div:first-child {
                    background-color: rgb(243 244 246) !important;
                }
                
                /* Light mode - make table background match notes background */
                :root:not(.dark) .fi-ta-table {
                    background-color: rgb(243 244 246);
                    border-radius: 0.5rem !important;
                    overflow: hidden;
                }
                
                :root:not(.dark) .fi-ta-table tbody,
                :root:not(.dark) .fi-ta-table tbody tr:not(.order-notes-row),
                :root:not(.dark) .fi-ta-table tbody tr:not(.order-notes-row) td {
                    background-color: rgb(243 244 246);
                }
                
                /* Force ALL notes text to be dark blue in light mode - very specific */
                :root:not(.dark) .order-notes-row .note-text,
                :root:not(.dark) .order-notes-row .note-text span,
                :root:not(.dark) .order-notes-row td span.note-text,
                :root:not(.dark) span.note-text,
                :root:not(.dark) .order-notes-row .note-text b,
                :root:not(.dark) .order-notes-row .note-text strong,
                :root:not(.dark) .note-text b,
                :root:not(.dark) .note-text strong {
                    color: rgb(30 58 138) !important;
                }
                
                /* Remove bold text color override - let it inherit from parent */
                .note-text b,
                .note-text strong {
                    color: inherit !important;
                }
                
                /* Hide Filters text - use very broad selector */
                .fi-ta-filters h3:first-child,
                .fi-section > :first-child > h3,
                h3.fi-section-heading {
                    display: none !important;
                    visibility: hidden !important;
                    opacity: 0 !important;
                    height: 0 !important;
                    margin: 0 !important;
                    padding: 0 !important;
                }
                
                /* Light mode - dark blue for ALL filter text elements */
                :root:not(.dark) .fi-ta-filters label,
                :root:not(.dark) .fi-ta-filters .fi-fo-field-wrp-label,
                :root:not(.dark) .fi-ta-filters .fi-fo-field-wrp-label > span,
                :root:not(.dark) .fi-ta-filters .fi-input-wrp label,
                :root:not(.dark) .fi-ta-filters .fi-select label,
                :root:not(.dark) .fi-ta-filters legend,
                :root:not(.dark) .fi-ta-filters fieldset > div > label,
                :root:not(.dark) [class*="fi-fo"] label,
                :root:not(.dark) .fi-fo-field-wrp:not([data-field-wrapper]) > label {
                    color: rgb(30 58 138) !important;
                }
                
                /* Table headers and order numbers */
                :root:not(.dark) .fi-ta-header-cell span:not(.filter-tooltip),
                :root:not(.dark) .fi-ta-table thead th span:not(.filter-tooltip),
                :root:not(.dark) .fi-ta-table tbody tr:not(.order-notes-row) td:first-child,
                :root:not(.dark) .fi-ta-table tbody tr:not(.order-notes-row) td:first-child a,
                :root:not(.dark) .fi-ta-table tbody tr:not(.order-notes-row) td:first-child span:not(.copy-tooltip):not(.filter-tooltip) {
                    color: rgb(30 58 138) !important;
                }
                
                /* Make date/time column text gray - target the actual content */
                .fi-ta-col-date_placed,
                .fi-ta-col-date_placed *,
                .fi-ta-col-date_placed .fi-ta-text,
                .fi-ta-col-date_placed .fi-ta-text-item,
                .fi-ta-col-date_placed .fi-ta-text-item > *:first-child,
                td.fi-ta-col-date_placed > div > div > div:first-child {
                    color: rgb(75 85 99) !important;
                }
                
                .dark .fi-ta-col-date_placed,
                .dark .fi-ta-col-date_placed *,
                .dark .fi-ta-col-date_placed .fi-ta-text,
                .dark .fi-ta-col-date_placed .fi-ta-text-item,
                .dark .fi-ta-col-date_placed .fi-ta-text-item > *:first-child,
                .dark td.fi-ta-col-date_placed > div > div > div:first-child {
                    color: rgb(209 213 219) !important;
                }
                
                /* Keep the description (X days ago) in lighter gray and add padding below */
                .fi-ta-col-date_placed .fi-ta-text-item > *:last-child,
                .fi-ta-col-date_placed .text-sm {
                    color: rgb(107 114 128) !important;
                    padding-bottom: 5px !important;
                    display: block !important;
                }
                
                .dark .fi-ta-col-date_placed .fi-ta-text-item > *:last-child,
                .dark .fi-ta-col-date_placed .text-sm {
                    color: rgb(156 163 175) !important;
                    padding-bottom: 5px !important;
                    display: block !important;
                }
                
                .dark .order-items-list .item-name {
                    color: rgb(209 213 219) !important;
                }
                
                /* Return Entries button maintains same styling in both light and dark modes */
                /* Removed dark mode override to keep consistent appearance */
                
                /* Partslink number styling */
                .partslink-number {
                    color: #000000 !important; /* Pure black in light mode */
                }
                
                .dark .partslink-number {
                    color: #FFFFFF !important; /* Pure white in dark mode */
                }
                
                /* Copy tooltip text color - ensure white in light mode with higher specificity */
                span.copy-tooltip,
                .copy-tooltip,
                .partslink-number .copy-tooltip,
                td .copy-tooltip,
                .fi-ta-table .copy-tooltip {
                    color: white !important;
                }
                
                /* Keep dark mode unchanged */
                .dark span.copy-tooltip,
                .dark .copy-tooltip,
                .dark .partslink-number .copy-tooltip,
                .dark td .copy-tooltip,
                .dark .fi-ta-table .copy-tooltip {
                    color: white !important;
                }
                
                /* Filter tooltips - ensure white text in light mode with highest specificity */
                .filter-tooltip,
                span.filter-tooltip,
                .fi-ta-filters .filter-tooltip,
                :root:not(.dark) .filter-tooltip,
                :root:not(.dark) span.filter-tooltip,
                :root:not(.dark) .fi-ta-filters .filter-tooltip,
                :root:not(.dark) .fi-ta-filters span.filter-tooltip,
                :root:not(.dark) label .filter-tooltip {
                    color: white !important;
                }
                
                /* Keep dark mode unchanged for filter tooltips */
                .dark .filter-tooltip,
                .dark span.filter-tooltip,
                .dark .fi-ta-filters .filter-tooltip {
                    color: white !important;
                }
                
                /* Highlight active filters with orange color and bold text */
                /* For select filters with values */
                .fi-ta-filters .fi-fo-field-wrp:has(select option:checked:not([value=""]):not([value="all"])) label.fi-fo-field-wrp-label,
                .fi-ta-filters .fi-fo-field-wrp:has(select option:checked:not([value=""]):not([value="all"])) label.fi-fo-field-wrp-label span,
                .fi-ta-filters .fi-fo-field-wrp:has(input[type="text"]:not(:placeholder-shown)) label.fi-fo-field-wrp-label,
                .fi-ta-filters .fi-fo-field-wrp:has(input[type="text"]:not(:placeholder-shown)) label.fi-fo-field-wrp-label span,
                .fi-ta-filters .fi-fo-field-wrp:has(input[type="date"][value]:not([value=""])) label.fi-fo-field-wrp-label,
                .fi-ta-filters .fi-fo-field-wrp:has(input[type="date"][value]:not([value=""])) label.fi-fo-field-wrp-label span,
                .fi-ta-filters .fi-fo-field-wrp:has(.choices__list--multiple .choices__item) label.fi-fo-field-wrp-label,
                .fi-ta-filters .fi-fo-field-wrp:has(.choices__list--multiple .choices__item) label.fi-fo-field-wrp-label span {
                    color: rgb(251, 146, 60) !important;
                    font-weight: 900 !important;
                    text-shadow: 0 0 1px rgba(251, 146, 60, 0.3) !important;
                }
                
                /* Dark mode active filters */
                .dark .fi-ta-filters .fi-fo-field-wrp:has(select option:checked:not([value=""]):not([value="all"])) label.fi-fo-field-wrp-label,
                .dark .fi-ta-filters .fi-fo-field-wrp:has(select option:checked:not([value=""]):not([value="all"])) label.fi-fo-field-wrp-label span:not(.filter-tooltip),
                .dark .fi-ta-filters .fi-fo-field-wrp:has(input[type="text"]:not(:placeholder-shown)) label.fi-fo-field-wrp-label,
                .dark .fi-ta-filters .fi-fo-field-wrp:has(input[type="text"]:not(:placeholder-shown)) label.fi-fo-field-wrp-label span:not(.filter-tooltip),
                .dark .fi-ta-filters .fi-fo-field-wrp:has(input[type="date"][value]:not([value=""])) label.fi-fo-field-wrp-label,
                .dark .fi-ta-filters .fi-fo-field-wrp:has(input[type="date"][value]:not([value=""])) label.fi-fo-field-wrp-label span:not(.filter-tooltip),
                .dark .fi-ta-filters .fi-fo-field-wrp:has(.choices__list--multiple .choices__item) label.fi-fo-field-wrp-label,
                .dark .fi-ta-filters .fi-fo-field-wrp:has(.choices__list--multiple .choices__item) label.fi-fo-field-wrp-label span:not(.filter-tooltip) {
                    color: rgb(34, 197, 94) !important;
                    font-weight: 900 !important;
                    text-shadow: 0 0 1px rgba(34, 197, 94, 0.5) !important;
                }
                
                /* Prevent table flicker during updates */
                .table-loading .fi-ta-content {
                    position: relative;
                }
                
                .table-loading .fi-ta-content::after {
                    content: '';
                    position: absolute;
                    top: 0;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    background: transparent;
                    z-index: 1;
                    pointer-events: none;
                }
                
                /* Keep old content visible during update */
                .table-loading .fi-ta-table {
                    opacity: 1 !important;
                }
                
                .dark .order-items-list button {
                    color: rgb(96 165 250);
                }
                
                /* Dark mode badge styles */
                .dark .ps-badge {
                    background-color: rgba(59, 130, 246, 0.2) !important;
                    color: rgb(96 165 250) !important;
                    border-color: rgba(59, 130, 246, 0.3) !important;
                }

                .dark .used-badge {
                    background-color: rgba(34, 197, 94, 0.2) !important;
                    color: rgb(74 222 128) !important;
                    border-color: rgba(34, 197, 94, 0.3) !important;
                }

                .dark .status-badge {
                    opacity: 0.9;
                }
                
                /* Status badge pop animation */
                @keyframes statusBadgePop {
                    0% {
                        transform: scale(1);
                    }
                    50% {
                        transform: scale(1.2);
                    }
                    100% {
                        transform: scale(1);
                    }
                }
                
                @keyframes supplierPulse {
                    0% {
                        box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7);
                    }
                    70% {
                        box-shadow: 0 0 0 10px rgba(59, 130, 246, 0);
                    }
                    100% {
                        box-shadow: 0 0 0 0 rgba(59, 130, 246, 0);
                    }
                }
                
                @keyframes shimmer {
                    0% {
                        background-position: -200% 0;
                    }
                    100% {
                        background-position: 200% 0;
                    }
                }
                
                /* Product notes tooltip */
                .product-with-notes:hover {
                    color: rgb(59 130 246) !important;
                }
                
                .dark .product-with-notes:hover {
                    color: rgb(96 165 250) !important;
                }
                
                .dark .product-notes-tooltip {
                    background: #1f2937 !important;
                }
                
                .dark .product-notes-tooltip > div {
                    border-top-color: #1f2937 !important;
                    border-bottom-color: #1f2937 !important;
                }
                
                /* Cursor styles for products */
                .product-linkable {
                    cursor: pointer !important;
                }

                /* Blue hover effect for all linkable products (including hollander/PS items) */
                .product-linkable:hover {
                    color: rgb(59 130 246) !important;
                }

                .dark .product-linkable:hover {
                    color: rgb(96 165 250) !important;
                }

                .product-not-linkable {
                    cursor: default !important;
                }
                
                /* Reduce padding in main order table cells */
                .fi-ta-table tbody td {
                    padding-top: 0.25rem !important;
                    padding-bottom: 0.25rem !important;
                }
                
                /* Override ALL Filament table padding aggressively */
                .fi-ta-text-item,
                .fi-ta-text-item-label,
                .fi-ta-col-wrp,
                div[class*="fi-ta-col"],
                .fi-ta-text,
                .fi-ta-text > div,
                .fi-ta-content,
                [class*="gap-y"] {
                    padding-top: 0 !important;
                    padding-bottom: 0 !important;
                    margin-top: 0 !important;
                    margin-bottom: 0 !important;
                }
                
                /* Override grid gaps */
                .fi-ta-text.grid,
                .grid,
                [class*="gap-y-1"],
                [class*="gap-y-2"],
                [class*="gap-y-3"],
                [class*="gap-y-4"] {
                    gap: 0.25rem !important;
                    row-gap: 0.25rem !important;
                }
                
                /* Force minimal line height */
                .fi-ta-text,
                .fi-ta-text-item {
                    line-height: 1.2 !important;
                }
                
                /* Remove any min-height */
                .fi-ta-table tbody tr,
                .fi-ta-table tbody td,
                .fi-ta-table tbody td > div {
                    min-height: unset !important;
                }
                
                /* Add subtle separator between order groups */
                .fi-ta-table tbody tr.order-notes-row {
                    border-bottom: 2px solid rgba(59, 130, 246, 0.3) !important;
                }
                
                .dark .fi-ta-table tbody tr.order-notes-row {
                    border-bottom: 2px solid rgba(96, 165, 250, 0.2) !important;
                }
                
                /* Remove padding from order notes section */
                .order-notes-row > td > div {
                    padding-bottom: 5px !important;
                }
                
                /* Reduce spacing in Customer column to match phone number spacing */
                .fi-ta-table tbody tr td:nth-child(3) .fi-ta-text-item {
                    line-height: 1 !important;
                }
                
                .fi-ta-table tbody tr td:nth-child(3) .fi-ta-text-item > div {
                    margin-bottom: 0 !important;
                    padding-bottom: 0 !important;
                    margin-top: 0 !important;
                    padding-top: 0 !important;
                    line-height: 1 !important;
                }
                
                /* Target the text items specifically in Customer column */
                .fi-ta-table tbody tr td:nth-child(3) .fi-ta-text {
                    gap: 0 !important;
                }
                
                .fi-ta-table tbody tr td:nth-child(3) .fi-ta-text .fi-ta-text-item-label {
                    margin-bottom: 0 !important;
                    padding-bottom: 0 !important;
                    line-height: 1 !important;
                }
                
                /* Add small spacing above customer name (second item) */
                .fi-ta-table tbody tr td:nth-child(3) .fi-ta-text-item:nth-child(2) {
                    margin-top: 3px !important;
                }
                
                /* Copy tooltip styles */
                .copy-tooltip {
                    z-index: 10000;
                }
                
                /* Remove underline from partslink numbers */
                .partslink-number {
                    text-decoration: none !important;
                }
                
                /* No hover effect for partslink numbers */
                .partslink-number:hover {
                    color: inherit !important;
                }
                
                /* Order number hover effect */
                .order-number-enhanced:hover {
                    color: rgb(59 130 246) !important;
                }
                
                /* Clickable text hover effect */
                .clickable-text:hover {
                    color: rgb(59 130 246) !important;
                    cursor: pointer;
                }
                
                /* Fulfillment page button styling enhancements */
                .fi-btn.fi-color-success {
                    background-color: rgb(34, 197, 94) !important;
                    color: white !important;
                    font-weight: 600 !important;
                }
                
                .fi-btn.fi-color-success:hover {
                    background-color: rgb(22, 163, 74) !important;
                }
                
                .dark .fi-btn.fi-color-success {
                    background-color: rgb(21, 128, 61) !important;
                }
                
                .dark .fi-btn.fi-color-success:hover {
                    background-color: rgb(34, 197, 94) !important;
                }
                
                /* Orange button styles for B2C/B2B dropdowns */
                .fi-btn[style*="rgb(251, 146, 60)"] {
                    background-color: rgb(251, 146, 60) !important;
                    color: white !important;
                    font-weight: 600 !important;
                }
                
                .fi-btn[style*="rgb(251, 146, 60)"]:hover {
                    background-color: rgb(234, 88, 12) !important;
                }
                
                .dark .fi-btn[style*="rgb(251, 146, 60)"] {
                    background-color: rgb(234, 88, 12) !important;
                }
                
                .dark .fi-btn[style*="rgb(251, 146, 60)"]:hover {
                    background-color: rgb(251, 146, 60) !important;
                }
                
                /* Supplier dropdown item hover effects */
                .supplier-dropdown-item:hover {
                    background-color: rgb(254, 237, 220) !important; /* orange-100 */
                    color: rgb(154, 52, 18) !important; /* orange-900 */
                }
                
                .dark .supplier-dropdown-item:hover {
                    background-color: rgba(251, 146, 60, 0.15) !important; /* orange with low opacity */
                    color: rgb(254, 215, 170) !important; /* orange-200 */
                }
                
                /* Scrollbar styling for dropdown menus */
                .max-h-60::-webkit-scrollbar {
                    width: 8px;
                }
                
                .max-h-60::-webkit-scrollbar-track {
                    background: #f3f4f6;
                    border-radius: 4px;
                }
                
                .max-h-60::-webkit-scrollbar-thumb {
                    background: #9ca3af;
                    border-radius: 4px;
                }
                
                .max-h-60::-webkit-scrollbar-thumb:hover {
                    background: #6b7280;
                }
                
                .dark .max-h-60::-webkit-scrollbar-track {
                    background: #374151;
                }
                
                .dark .max-h-60::-webkit-scrollbar-thumb {
                    background: #6b7280;
                }
                
                .dark .max-h-60::-webkit-scrollbar-thumb:hover {
                    background: #9ca3af;
                }
                
                /* FORCE Order # column width on all table pages - ultimate override */
                .fi-ta-table th:nth-child(1),
                .fi-ta-table td:nth-child(1),
                table th:first-child,
                table td:first-child {
                    width: 220px !important;
                    min-width: 220px !important;
                    max-width: 220px !important;
                }
                
                /* Ensure order numbers are bold everywhere */
                .fi-ta-table td:nth-child(1) a,
                .fi-ta-table td:nth-child(1) span,
                table td:first-child a,
                table td:first-child span {
                    font-weight: 600 !important;
                }
                
                /* Order numbers - rounded rectangle with background - ULTIMATE OVERRIDE */
                .order-number-enhanced {
                    background-color: rgb(255, 255, 255) !important;
                    color: rgb(17, 24, 39) !important;
                    border: 1px solid rgb(229, 231, 235) !important;
                    border-radius: 8px !important;
                    padding: 3px 10px !important;
                    display: inline-block !important;
                }
                
                /* Dark theme - black background with white text */
                .dark .order-number-enhanced {
                    background-color: rgb(0, 0, 0) !important;
                    color: rgb(255, 255, 255) !important;
                    border-color: rgb(55, 65, 81) !important;
                }
                
                /* Remove right margin on orders/fulfillment pages when viewport is 1466px or smaller */
                @media (max-width: 1466px) {
                    .fi-resource-orders .fi-main,
                    .fi-resource-fulfillment .fi-main,
                    body[class*="orders"] .fi-main,
                    body[class*="fulfillment"] .fi-main {
                        padding-right: 0 !important;
                        margin-right: 0 !important;
                    }
                    
                    .fi-resource-orders .fi-page,
                    .fi-resource-fulfillment .fi-page,
                    body[class*="orders"] .fi-page,
                    body[class*="fulfillment"] .fi-page {
                        padding-right: 0 !important;
                        margin-right: 0 !important;
                    }
                    
                    .fi-resource-orders .fi-ta-ctn,
                    .fi-resource-fulfillment .fi-ta-ctn,
                    body[class*="orders"] .fi-ta-ctn,
                    body[class*="fulfillment"] .fi-ta-ctn {
                        padding-right: 0 !important;
                        margin-right: 0 !important;
                    }
                }
