  /* Dark theme styles */
  :root {
    --primary-dark: #141415;
    --secondary-dark: #1D1D1E;
    --secondary-dark1: #1e1e1e;
    --primary-text-color: #EEEEEE;
    --Secondary-text-color: #141415;
    --border: 1px solid #343435;
    --border1: 1px solid #484b4e;
    --card-shadow: box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.12),
      0px 3px 1px rgba(0, 0, 0, 0.04);
    --header-shadow: 0 0 10px rgba(255, 255, 255, 0);
  }

  .dark-mode {
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
  }

  .dark-mode .main-menu ul li a {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .user-info p {
    opacity: 0.7;
    color: var(--primary-text-color) !important;

  }

  .dark-mode .filter-sidebar {
    background: var(--secondary-dark1);
    border: var(--border);
  }



  .dark-mode .header_background {
    background: #333;
    border-radius: 12px;
    font-size: 18px;
    color: rgb(255, 255, 255);
    font-weight: 500;
  }

  .dark-mode .header_rgb_color {
    background: #333;
    border-radius: 12px;
    color: rgb(255, 255, 255);
    flex-wrap: wrap;
    box-shadow: 0 4px 8px rgba(252, 251, 251, 0.1);
  }

  .dark-mode .header-container {
    background-color: var(--secondary-dark1) !important;
    border: var(--border) !important;
    box-shadow: inset -2px -2px 4px 0 rgba(0, 0, 0, 0.12), inset 1px 1px 8px 0 rgba(255, 255, 255, 0.08) !important;

  }

  .dark-mode .header-container1 {
    background-color: var(--secondary-dark1) !important;
    border: var(--border) !important;
    box-shadow: inset -2px -2px 4px 0 rgba(0, 0, 0, 0.12), inset 1px 1px 8px 0 rgba(255, 255, 255, 0.08) !important;

  }

  .dark-mode .dark-back {
    background-color: var(--secondary-dark1) !important;
    color: var(--primary-text-color) !important;
    border: var(--border);
  }

  .dark-mode .p-card {
    border: 1.2px solid rgba(255, 255, 255, 0.08) !important;
    background: linear-gradient(180deg, rgb(57, 57, 57) 0%, rgb(33, 33, 33) 100%) !important;
    box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.25), -2px -2px 4px rgba(255, 255, 255, 0.04), inset 4px 4px 8px rgba(0, 0, 0, 0.25), inset -2px -2px 8px rgba(246, 246, 246, 0.12);
  }

  .p-tabview .p-tabview-nav .p-highlight .p-tabview-nav-link {
    color: #20add0 !important;
  }

  .dark-mode .p-tabview .p-tabview-nav-content {
    border-bottom: 1px solid #333;
  }

  .p-tabview .p-tabview-nav .p-highlight {
    background-color: transparent !important;
    border: none;
    border-bottom: 1px solid #20add0 !important;
    border-radius: 0px !important;
  }

  .dark-mode .pi {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .p-menuitem-icon {
    color: #fff !important;
  }

  .dark-mode a {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .app-header,
  .dark-mode .sub-header {
    background-color: var(--secondary-dark) !important;
    color: var(--primary-text-color) !important;
    box-shadow: var(--header-shadow);
    border: var(--border);
  }

  .dark-mode .header-icons .ui-button-rounded {
    background-color: var(--secondary-dark) !important;
    color: var(--primary-text-color) !important;
    border: var(--border) !important;
  }

  .dark-mode .user-email,
  .dark-mode .user-organization {
    color: var(--primary-text-color) !important;
  }


  .dark-mode .p-datatable .p-datatable-tbody>tr {
    background-color: var(--secondary-dark) !important;
    color: var(--primary-text-color) !important;
    border-bottom: 1px solid #4a454594 !important;
    border-bottom: 1px solid transparent !important;
  }


  .dark-mode .p-datatable .p-datatable-tbody>tr:nth-child(odd) {
    background-color: #282730 !important;
    box-shadow: 0px 1px 5px 0px #F3EFEF1A inset;
  }

  .dark-mode .p-datatable-table .p-datatable-tbody>tr:hover {
    background-color: #505051 !important;
    color: var(--primary-text-color) !important;
  }


  .dark-mode .product-table {
    background-color: var(--secondary-dark1) !important;
    border: var(--border) !important;
    box-shadow:
      inset -2px -2px 4px 0 rgba(0, 0, 0, 0.12),
      inset 1px 1px 8px 0 rgba(255, 255, 255, 0.08) !important;
  }

  .dark-mode .Sync-clss {

    color: var(--primary-text-color) !important;
  }


  .dark-mode .p-paginator {
    background-color: var(--secondary-dark1) !important;
    color: var(--primary-text-color) !important;

  }

  .dark-mode .p-datatable .p-datatable-thead>tr>th {
    color: var(--primary-text-color);
    background: var(--secondary-dark) !important;
  }

  .dark-mode .p-toolbar {
    background-color: #00000000 !important;
    color: var(--primary-text-color) !important;
  }

  .dark-mode .personal-info {
    color: var(--primary-text-color) !important;
    background: linear-gradient(180deg, #242424 100%, #1C1C1C 100%) !important;
    border: 1px solid #444444 !important;
    box-shadow: inset -4px -4px 8px 0 rgba(0, 0, 0, 0.12), inset 2px 2px 10px 0 rgba(255, 255, 255, 0.12) !important;
  }

  .dark-mode .personal-info .form-control {
    background-color: var(--secondary-dark) !important;
    border: var(--border) !important;
  }

  .dark-mode label {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .form-control {
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
    border: var(--border) !important;
  }

  .dark-mode textarea {
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
    border: var(--border) !important;
  }

  .dark-mode .p-dropdown {
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
    border: 1px solid #1F2228 !important;
  }

  .dark-mode .p-inputtext {
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
    border: var(--border) !important;
  }

  .dark-mode .p-dropdown-filter-container .p-inputtext {
    background-color: #cfcfcf !important;
    color: var(--primary-dark) !important;
  }

  .dark-mode .p-calendar .p-inputtext {
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
    border: var(--border) !important;

  }

  .dark-mode .p-dropdown-panel {
    background: #333;
  }

  .dark-mode .p-dropdown-panel .p-dropdown-header {
    background: #333;
    color: var(--primary-text-color) !important;

  }

  .dark-mode .p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight {
    color: var(--primary-text-color) !important;
    background: #494b4c !important;
  }



  /* popup */

  .dark-mode .p-dialog {
    border: none !important;
    background-color: var(--primary-dark) !important;
    box-shadow: 0px 11px 15px -7px rgb(251 249 249 / 6%), 0px 24px 38px 3px rgb(255 255 255 / 12%), 0px 9px 46px 8px rgb(255 255 255 / 7%);
  }

  .dark-mode .p-dialog .p-dialog-header {
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
  }

  .dark-mode .p-dialog .p-dialog-content {
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
  }

  .dark-mode .p-dialog .p-dialog-header .p-dialog-header-icon {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .input-group-append button {
    border: none;
    background: var(--secondary-dark) !important;
  }

  .dark-mode .btn-option {
    background: var(--secondary-dark) !important;
    border: var(--border) !important;
  }

  .dark-mode .day-btn {
    background: var(--secondary-dark) !important;
    color: var(--primary-text-color) !important;
    border: var(--border) !important;
  }


  .dark-mode .day-btn.active {
    background-color: #136FB6 !important;
    color: var(--primary-text-color) !important;
    border-color: #136FB6 !important;
    box-shadow: inset 0px 2px 4px 0px rgba(237, 239, 255, 0.57), 0px 4px 5px 0px rgba(0, 0, 0, 0.4) !important;
  }

  .dark-mode .time-ipt {
    border: var(--border) !important;

  }



  .dark-mode .card-design {
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
    border: var(--border) !important;
  }

  .dark-mode .card-design .form-control {
    background-color: var(--primary-dark) !important;

  }

  .dark-mode .p-menu.p-menu-overlay {
    /* background: #0a0a0a; */
    background: #414141;
  }


  .dark-mode .email-change-form {
    background-color: #333 !important;
    color: var(--primary-text-color) !important;
  }


  .set-colr {
    color: #333 !important;
  }



  .dark-mode ::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px transparent;
    -webkit-border-radius: 10px;
    border-radius: 10px;
  }

  .dark-mode ::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: transparent;
    -webkit-box-shadow: inset 0 0 6px transparent
  }

  .dark-mode ::-webkit-scrollbar-thumb:window-inactive {
    background: transparent
  }


  .dark-mode .fa-regular,
  .dark-mode .fa-solid {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .clear-link {
    color: var(--primary-text-color) !important;

  }

  .dark-mode .search-container input {
    border: 1px solid #37363e;
    background-color: #37363e !important;
  }

  .dark-mode .card-search .p-inputtext {
    border: 1px solid #4d4d4d;
    background-color: #333 !important;
  }


  .dark-mode .section li:hover {
    background-color: #6f6a6a !important;
  }

  .dark-mode .icon-container {
    background-color: var(--secondary-dark) !important;
    border: var(--border) !important;
  }

  .dark-mode ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-highlight {
    background: black;
    border-color: #00335559;
    color: var(--primary-text-color);
  }


  .dark-mode .user-type-label {
    color: rgba(255, 255, 255, 0.5) !important;
    background-color: var(--primary-dark) !important;
    border: 1px solid #1F2228 !important;
  }



  .dark-mode .product-card {
    background: linear-gradient(180deg, #242424 100%, #1C1C1C 100%) !important;
    border: 1px solid #444444 !important;
    box-shadow: inset -4px -4px 8px 0 rgba(0, 0, 0, 0.12), inset 2px 2px 10px 0 rgba(255, 255, 255, 0.12) !important;

  }

  .dark-mode .product-card .product-info p,
  .dark-mode .product-card .product-info h2 {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .product-price p,
  .dark-mode .product-price h2 {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .payment-details .detail-item p {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .quantity-container input {
    border: var(--border) !important;
    background-color: var(--secondary-dark1) !important;
    color: var(--primary-text-color) !important;
  }

  .dark-mode .card-righthand {
    border: var(--border) !important;
    background-color: var(--secondary-dark1) !important;
  }


  .dark-mode .label-summary-size {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .text-container p {
    color: #9f9f9f !important;
  }

  .dark-mode .order-summary-section h2 {
    color: #333 !important;
  }

  .dark-mode .payment-title {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .dark-card {
    background: linear-gradient(180deg, #242424 100%, #1C1C1C 100%) !important;
    border: 1px solid #444444 !important;
    box-shadow: inset -4px -4px 8px 0 rgba(0, 0, 0, 0.12), inset 2px 2px 10px 0 rgba(255, 255, 255, 0.12) !important;

  }



  /* user-approval */
  .dark-mode .button-group {
    background-color: rgba(120, 120, 128, 0.12) !important;
  }

  .dark-mode .form-control1 {
    border: none !important;
  }


  .dark-mode .uc-drak {
    background-color: var(--primary-dark) !important;
    border: var(--border) !important;
    background: none !important;
    box-shadow: none !important;
  }

  .dark-mode .light-apprl-dsng {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0px !important;
    border-radius: 0px !important;
    margin-top: 0px !important;
  }

  .dark-mode .uploaded-files {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
  }

  .dark-mode .user-name {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .p-avatar-text {
    color: #333 !important;
  }

  .dark-mode .organization-name {
    background-color: #7e7d7dde !important;
    color: var(--primary-text-color) !important;

  }


  .dark-mode .address-card {
    background-color: #7e7d7dde !important;
  }

  .dark-mode .address-info,
  .dark-mode .address-text {
    color: var(--primary-text-color) !important;

  }

  .dark-mode .file-item {
    background-color: #333 !important;
    color: var(--primary-text-color) !important;
    background: none !important;
    border: none !important;

  }

  .dark-mode .uploaded-files {
    border: var(--border) !important;
  }



  /* user-group */
  .dark-mode .cdlabel {
    background-color: #F0E6F3 !important;
    color: var(--primary-dark) !important;
  }



  /* user-permission */
  .dark-mode .Permission .p-dropdown {
    background-color: var(--secondary-dark) !important;
    border: var(--border1) !important;
  }

  .dark-mode .Permission .form-control {
    background-color: var(--secondary-dark) !important;
    border: var(--border1) !important;
  }

  .dark-mode .Permission {
    background: #141414 !important;
    border: 1px solid #363636 !important;
    box-shadow: 0px 0px 19.1px 0px #FFFFFF1F !important;
  }


  /* popup */
  .dark-mode .custom-popup {
    background: linear-gradient(180deg, rgb(76 76 76) 0%, rgb(16 16 16) 100%) !important;
    color: hsl(0deg 0% 100%) !important;
    border: 1px solid #444444;
    box-shadow: 0px 0px 40px 0px #FFFFFF29;
  }

  .dark-mode .custom-popup1 {
    background: linear-gradient(180deg, rgb(76 76 76) 0%, rgb(16 16 16) 100%) !important;
    color: hsl(0deg 0% 100%) !important;
    border: 1px solid #444444;
    box-shadow: 0px 0px 40px 0px #FFFFFF29;
  }

  .dark-mode .custom-text {
    color: #B4B4B4 !important;

  }

  .dark-mode .custom-title-success {
    color: #FFFFFF !important;
  }

  .dark-mode .custom-title-alert {
    color: #FFFFFF !important;
  }

  .dark-mode .custom-title-error {
    color: #FFFFFF !important;
  }

  .dark-mode .custom-title-conform {
    color: #FFFFFF !important;
  }

  .dark-mode div:where(.swal2-container).swal2-backdrop-show,
  .dark-mode div:where(.swal2-container).swal2-noanimation {
    background: rgb(0 0 0 / 54%) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }

  .dark-mode :where(.swal2-container) button:where(.swal2-close) {
    background: #87878740 !important;
    color: #FFFFFF !important;
  }

  /* toaster */
  .dark-mode .p-toast .p-toast-message.p-toast-message-success {
    background: var(--primary-dark) !important;
    border-color: var(--border) !important;
    color: #585757 !important;
  }

  .dark-mode .p-toast .p-toast-message .p-toast-message-content .p-toast-detail {
    color: #a3a3a3 !important;
  }

  .dark-mode .p-toast .p-toast-message .p-toast-message-content .p-toast-summary {
    color: var(--primary-text-color);
  }

  /* product  */
  .dark-mode .checkbox-card {
    border: var(--border1) !important;
    background-color: #8b898924 !important;
  }


  .dark-mode .checkmark-card {
    fill: var(--primary-text-color) !important;
  }

  .dark-mode .card-text {
    color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
  }

  .dark-mode .category-card {
    background: #1A1A1A !important;
  }


  .dark-mode .selected-count {
    border: var(--border) !important;
  }


  .dark-mode .go-button {
    color: var(--primary-text-color) !important;
    border: var(--border1) !important;
    background-color: var(--secondary-dark) !important;

  }

  .dark-mode .p-slider .p-slider-handle {
    background: var(--primary-dark) !important;
  }

  .dark-mode .slider-wrapper .p-slider {
    background: #555758 !important
  }

  .dark-mode .bubble {
    background: var(--primary-dark) !important;
    color: #8f8f8f !important;
  }

  .dark-mode .price-input {
    background-color: var(--secondary-dark1) !important;
    border: var(--border) !important;
  }

  .dark-mode .checkmark {

    background-color: var(--secondary-dark1) !important;
    border: var(--border1) !important;
  }



  .dark-mode .checkbox-container input~.checkmark {
    background-color: var(--secondary-dark1) !important;
  }

  .dark-mode .checkbox-container input:checked~.checkmark {
    background-color: #2196F3;
  }

  /* shopping cart  */

  .dark-mode .discount {
    color: var(--Secondary-text-color) !important;
  }

  .dark-mode .payment-card .form-control {
    background-color: var(--secondary-dark) !important;
    border: var(--border1) !important;
  }

  .dark-mode .payment-card-header svg path {
    fill: var(--primary-text-color) !important;
  }




  ::ng-deep .dark-mode .p-sidebar-right {
    background-color: var(--primary-dark) !important
  }


  .dark-mode .card-header1 label {
    color: rgba(255, 255, 255, 1) !important;
  }










  .dark-mode .apexcharts-tooltip.apexcharts-theme-light {
    border: 1px solid #444444 !important;
    background: rgb(40 40 40 / 96%) !important;
  }

  .dark-mode .apexcharts-menu {
    background: #404040 !important;
    border: 1px solid #585353 !important;
  }

  .dark-mode .grid-action-red-btn {
    /* border: 1px solid #a3a3a3 !important; */
    color: #d9d7d7 !important;
  }

  .dark-mode .grid-action-btn {
    /* border: 1px solid #a3a3a3 !important; */
    color: #d9d7d7 !important;
  }

  .dark-mode .green-btn {
    /* border: 1px solid #a3a3a3 !important; */
    color: #d9d7d7 !important;
  }

  .dark-mode .outline-common {
    background-color: #212121 !important;
    border: 1px solid #444444 !important;
    box-shadow:
      inset -2px -2px 4px 0 rgba(0, 0, 0, 0.12),
      inset 1px 1px 8px 0 rgba(255, 255, 255, 0.08) !important;
  }



  .dark-mode .card-righthand {
    background: linear-gradient(180deg, #242424 100%, #1C1C1C 100%) !important;
    border: 1px solid #444444 !important;
    box-shadow: inset -4px -4px 8px 0 rgba(0, 0, 0, 0.12), inset 2px 2px 10px 0 rgba(255, 255, 255, 0.12) !important;
  }

  .dark-mode .address-continer-bg {
    background: none !important;
    background-color: #212121 !important;
    border: 1px solid #292929 !important;
    border-radius: 6px !important;
    box-shadow: inset 1px 1px 4px 0px rgba(255, 255, 255, 0.08), 0px 0px 8px 0px rgba(0, 0, 0, 0.5) !important;
  }

  .dark-mode .Address-continer-parent {
    background-color: #141414 !important;
    border: 1px solid #363636 !important;
  }

  .dark-mode .p-menu .p-menuitem>.p-menuitem-content .p-menuitem-link .p-menuitem-text {
    color: #ffff;
  }

  .dark-mode .p-menu .p-menuitem:not(.p-highlight):not(.p-disabled)>.p-menuitem-content a:hover {
    color: black !important;
    background: transparent;
  }

  .dark-mode .p-menuitem-content:hover .p-menuitem-link .p-menuitem-icon {
    color: black !important;
  }

  .dark-mode .p-menuitem-content:hover .p-menuitem-link .p-menuitem-text {
    color: black !important;
  }

  .dark-mode .days {
    background-color: #141415 !important;
    border: none !important
  }


  .dark-mode .swal2-cancel {
    color: #ffffff !important;
  }


  .dark-mode .p-password .p-inputtext {
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
    border: var(--border) !important;
  }

  .dark-mode .p-inputotp .p-inputtext {
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
    border: var(--border) !important;
  }

  .dark-mode .option-card {
    border: 1.2px solid rgba(255, 255, 255, 0.08) !important;
    background: linear-gradient(180deg, rgb(57, 57, 57) 0%, rgb(33, 33, 33) 100%) !important;
    box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.25), -2px -2px 4px rgba(255, 255, 255, 0.04), inset 4px 4px 8px rgba(0, 0, 0, 0.25), inset -2px -2px 8px rgba(246, 246, 246, 0.12);
  }

  .dark-mode .register-btn {
    margin-top: 28px !important;
  }


  .dark-mode .email-reset-form {
    background-color: #212121 !important;
    border: 1px solid #444444 !important;
    box-shadow:
      inset -2px -2px 4px 0 rgba(0, 0, 0, 0.12),
      inset 1px 1px 8px 0 rgba(255, 255, 255, 0.08) !important;
  }

  .dark-mode .email-reset-form h3 {
    color: #e3e3e3 !important;
  }


  /* Shared Job Post Styles - Dark Mode Overrides */
  .dark-mode .bg-success-subtle {
    background-color: rgba(34, 197, 94, 0.2) !important;
    color: #4ade80 !important;
    border-color: rgba(34, 197, 94, 0.3) !important;
  }

  .dark-mode .bg-warning-subtle {
    background-color: rgba(249, 115, 22, 0.2) !important;
    color: #fb923c !important;
    border-color: rgba(249, 115, 22, 0.3) !important;
  }

  .dark-mode .bg-danger-subtle {
    background-color: rgba(239, 68, 68, 0.2) !important;
    color: #f87171 !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
  }

  .dark-mode .vertical-divider {
    background-color: #434343 !important;

  }

  .dark-mode .footer-vertical {
    border-right: 1px solid #434343 !important;

  }


  .dark-mode .login-pg-btn {

    background: #0c0c0c;
    color: #fff;
    padding: 0.5rem 1.5rem;
    /* border: none; */
    border-radius: 5px;
    font-size: 0.8rem;
    cursor: pointer;
    transition: background 0.2s;
    box-shadow: inset 0px 2px 4px 0px rgb(69 69 69 / 57%), 0px 4px 5px 0px rgba(0, 0, 0, 0.4);
    font-weight: 600;
    color: white;
    border: 1px solid #4b4a4a !important;
    letter-spacing: 0.5px;
  }



  .dark-mode .common-btn {
    /* box-shadow: 0px 2px 4px 0px #EDEFFF91 inset, 0px 4px 4px 0px #0000001F; */
    background: #136FB6;
    border: none;
    color: #d9d7d7 !important;

    /* box-shadow: inset 0px 2px 4px 0px rgba(237, 239, 255, 0.57), 0px 4px 5px 0px rgba(0, 0, 0, 0.4); */
  }

  .dark-mode .delete-btn,
  .dark-mode .update-btn {
    color: #d9d7d7 !important;

    /* box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.4), inset 0px 2px 4px 0px rgba(237, 239, 255, 0.57) !important; */
  }


  .dark-mode .success-card-btn {
    /* box-shadow: 2px 2px 8px 0px #00000080 inset,
    -1px -1px 8px 0px #FFFFFF40 inset,
    0px 0px 4px 0px #000000; */
    color: #0bb7af80;
    /* background-color: #2b4645 !important; */
    /* border-color: #2b4645 !important; */
    font-weight: 700;
  }

  .dark-mode .error-card-btn {
    /* box-shadow: 2px 2px 8px 0px #00000080 inset,
    -1px -1px 8px 0px #FFFFFF40 inset,
    0px 0px 4px 0px #000000; */
    /* background-color: #523338 !important; */
    /* border-color: #523338 !important; */
    color: #f64e60 !important;
  }

  .dark-mode .Pending-card-btn {
    /* box-shadow: 2px 2px 8px 0px #00000080 inset,
    -1px -1px 8px 0px #FFFFFF40 inset,
    0px 0px 4px 0px #000000; */
    /* background-color: #3c372e !important; */
    /* border-color: #3c372e !important; */
    color: #ee9d01 !important;
  }

  .dark-mode .Decline-card-btn {
    /* box-shadow: 2px 2px 8px 0px #00000080 inset,
    -1px -1px 8px 0px #FFFFFF40 inset,
    0px 0px 4px 0px #000000; */
    /* background-color: #523338 !important; */
    /* border-color: #523338 !important; */
    color: #f64e60 !important;
  }

  .dark-mode .Counter-card-btn {
    /* box-shadow: 2px 2px 8px 0px #00000080 inset,
    -1px -1px 8px 0px #FFFFFF40 inset,
    0px 0px 4px 0px #000000; */
    /* background-color: #3b2c4b !important; */
    /* border-color: #3b2c4b !important; */
    color: #a24ef6 !important;
  }

  .dark-mode .gray-button {
    background: #d9d9d9 !important;
    /* box-shadow: 0px 4px 5px 0px #00000066,1px 1px 4px 0px #00000091 inset !important; */
  }

  .dark-mode svg .svg-icon-path {
    stroke: #ffffff !important;
  }

  .dark-mode svg .svg-icon-path-fill {
    fill: #ffffff !important;
  }


  .dark-mode .dd-profile .dropdown-item:focus,
  .dark-mode .dd-profile .dropdown-item:hover {
    stroke: #000000a3 !important;
    fill: #000000a3 !important;

  }

  .dark-mode .dd-profile .submenu .dropdown-item:focus svg .svg-icon-path-fill,
  .dark-mode .dd-profile .submenu .dropdown-item:hover svg .svg-icon-path-fill {
    fill: #000000a3 !important;

  }

  .dark-mode .dd-profile .submenu .dropdown-item:focus svg .svg-icon-path,
  .dark-mode .dd-profile .submenu .dropdown-item:hover svg .svg-icon-path {
    stroke: #000000a3 !important;

  }

  .dark-mode .delete-btn.disabled,
  .dark-mode .delete-btn:disabled {
    color: #fff !important;
    background-color: #808080b8 !important;
    border-color: transparent !important;
  }

  .dark-mode .update-btn.disabled,
  .dark-mode .update-btn:disabled {
    color: #fff !important;
    background-color: #808080b8 !important;
    border-color: transparent !important;
  }

  .dark-mode .common-btn.disabled,
  .dark-mode .common-btn:disabled {
    color: #fff !important;
    background-color: #808080b8 !important;
    border-color: transparent !important;
  }


  /* new product  */
  .dark-mode .header-product {
    background-color: var(--secondary-dark) !important;
    color: #fff !important;
  }

  .dark-mode .sidebar__section-header_active {
    /* background: rgb(85, 85, 85) !important; */
    background: rgb(54 54 54) !important;
    /* background: #282730 !important; */
    /* background: linear-gradient(180deg, rgba(85, 85, 85, 1) 0%, rgba(44, 44, 44, 1) 100%) !important; */
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25) !important;
    border-radius: 8px !important;
    color: #ffffff !important;
  }

  .dark-mode .sidebar-product {
    background-color: var(--secondary-dark) !important;
    border-right: none !important
  }

  .dark-mode .sidebar__section-header_inactive {
    background: #282730 !important;
    /* background: linear-gradient(90deg, rgba(33, 32, 41, 1) 0%, rgba(33, 32, 41, 1) 100%) !important; */
    /* box-shadow: 0px 0px 1px 1px rgb(108 108 108 / 25%) !important; */
    color: #fff !important;
  }

  .dark-mode .sidebar__list label {
    color: #FFFFFF !important;
  }

  .dark-mode .dashboard__content {
    background-color: var(--primary-dark) !important;
  }

  .dark-mode .apexcharts-tooltip.apexcharts-theme-light {
    border: 1px solid #444444 !important;
    background: rgb(40 40 40 / 96%) !important;
  }

  ::ng-deep .dark-mode .p-sidebar-right {
    background-color: var(--secondary-dark) !important;
    border: var(--border) !important;
    box-shadow: inset 0px 1px 1px 0 rgba(237, 239, 255, 0.57), inset 2px 3px 6px 0 rgba(255, 255, 255, 0.16), 1px 1px 9px 0 rgba(0, 0, 0, 0.4);
  }

  ::ng-deep .dark-mode .p-sidebar {
    color: var(--primary-text-color);
  }


  .dark-mode .sell_Rate_cls {
    border: 1px solid #d57269 !important;
  }

  .dark-mode .last-trade-fild {
    color: #ffffff !important;
  }

  .dark-mode .product-details-card {
    border: 1px solid rgb(0 0 0 / 24%) !important;
    background: linear-gradient(0deg, rgba(57, 57, 57, 1) 0%, rgba(33, 33, 33, 1) 100%) !important;
    box-shadow: inset 0px 1px 1px 0 rgba(237, 239, 255, 0.57), inset 3px 3px 10px 0 rgba(255, 255, 255, 0.16), 1px 1px 9px 0 rgba(0, 0, 0, 0.4) !important;
  }

  .dark-mode .product-details-table-card {
    border: 1px solid rgb(0 0 0 / 24%) !important;
    background: linear-gradient(0deg, rgba(57, 57, 57, 1) 0%, rgba(33, 33, 33, 1) 100%) !important;
    box-shadow: inset 0px 1px 1px 0 rgba(237, 239, 255, 0.57), inset 3px 3px 10px 0 rgba(255, 255, 255, 0.16), 1px 1px 9px 0 rgba(0, 0, 0, 0.4) !important;
  }

  .dark-mode .card-header1 h3 {
    color: rgb(255, 255, 255) !important;
  }

  .dark-mode .company-details p {
    color: rgb(255, 255, 255) !important;
  }

  .dark-mode .attribute {
    background: linear-gradient(0deg, rgba(57, 57, 57, 1) 0%, rgba(33, 33, 33, 1) 100%) !important;
    box-shadow:
      2px 2px 4px 0px rgba(0, 0, 0, 0.2),
      -2px -2px 4px 0px rgba(255, 255, 255, 0.08),
      inset 1px 1px 2px 0px rgba(0, 0, 0, 0.25),
      inset -1px -1px 4px 0px rgba(255, 255, 255, 0.16) !important;
    color: white !important;
    border: none !important;
  }

  .dark-mode .number-input-container {
    background: #1e1e1e !important;
    border: 1px solid #444 !important;
  }

  .dark-mode .number-input-container .input-field {
    background: #1e1e1e !important;
    color: #FFFFFF !important;
  }

  .dark-mode .btn-shoping-input {
    background: linear-gradient(to bottom, #242424 0%, #1C1C1C 100%) !important;
    color: white !important;
    box-shadow: inset -2px -1px 4px 0px rgba(0, 0, 0, 0.12), inset 1px 1px 8px 0px rgba(255, 255, 255, 0.08) !important;
    border: 1px solid #444444 !important;

  }


  .dark-mode .order-summary-totals .total-line {
    color: #fff !important;
  }


  .dark-mode .order-status {
    border-bottom: 1px solid #4D4D4D !important;
  }

  .dark-mode .status-text {
    color: #333 !important;
    border: 1px solid #20add0;
    padding: 1px 10px;
    border-radius: 20px;
    background-color: #20add0;
  }

  .dark-mode .status-text1 {
    color: #dbdbdb !important;
  }


  .dark-mode .tab-button-myOrder.active {
    background: #F6F6F6 !important;
    color: #000 !important;
    /* background: linear-gradient(180deg, #F6F6F6 0%, #B4B4B4 100%) !important; */
    /* box-shadow: 2px 2px 4px rgba(255, 255, 255, 0.16) !important; */
    /* box-shadow: inset -2px -2px 8px rgba(0, 0, 0, 0.16), 2px 2px 4px rgba(255, 255, 255, 0.16) !important; */
  }

  .dark-mode .tab-button-myOrder {
    border: 1px solid #e6e6e675 !important;
    color: #fff !important;
  }

  .dark-mode .card2 {
    border: 1px solid rgb(0 0 0 / 24%) !important;
    background: linear-gradient(0deg, rgba(57, 57, 57, 1) 0%, rgba(33, 33, 33, 1) 100%) !important;
    box-shadow: inset 0px 1px 1px 0 rgba(237, 239, 255, 0.57), inset 3px 3px 10px 0 rgba(255, 255, 255, 0.16), 1px 1px 9px 0 rgba(0, 0, 0, 0.4) !important;
  }



  .dark-mode .serch_box:hover,
  .dark-mode .serch_box:focus-within,
  .dark-mode .serch_box.active {
    background: #37363e !important;
  }


  .dark-mode .arrow-green {
    color: #33ff33 !important;
  }

  .dark-mode .user-name .cdlabel1 {
    color: #ffff !important;
  }

  .dark-mode .checkbox-group .highlight {
    background-color: #545454 !important;
  }

  /* .dark-mode .strength-card{
    background: none !important;
    border: none !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.05)!important;
  } */

  .dark-mode .dealEndIn-Color {
    color: #ffa3a3 !important;
  }

  .dark-mode tr td.seller-dg {
    background: #472D3C !important;
    /* box-shadow: 0px 1px 5px 0px #F3EFEF1A inset !important; */
  }

  .dark-mode tr:nth-child(odd) td.seller-dg {
    background: #582E46 !important;
    /* box-shadow: 0px 1px 5px 0px #F3EFEF1A inset !important; */
  }

  .dark-mode tr td.buyer-dg {
    background: #1B2836 !important;
    /* box-shadow: 0px 1px 5px 0px #F3EFEF1A inset !important; */
  }

  .dark-mode tr:nth-child(odd) td.buyer-dg {
    background: #263F59 !important;
    /* box-shadow: 0px 1px 5px 0px #F3EFEF1A inset !important; */
  }

  .dark-mode tr td .pending-seller-dg {
    box-shadow: 0px 4px 4px 0px #00000040 !important;
    /* background: #00640099 !important; */
    background: #00520099 !important;

  }

  .dark-mode tr td .sd-seller-dg {
    box-shadow: 0px 4px 4px 0px #00000040 !important;
    background: #8B000099 !important;
  }

  .dark-mode tr td .accept-seller-dg {
    box-shadow: 0px 4px 4px 0px #00000040 !important;
    background: #00666699 !important;
  }

  .dark-mode tr td .bd-seller-dg {
    box-shadow: 0px 4px 4px 0px #00000040 !important;
    background: #B4282899 !important;
  }


  .dark-mode .dd-profile {
    background: #414141 !important;
  }


  .dd-profile .dropdown-item:focus,
  .dd-profile .dropdown-item:hover {
    background-color: #e9ecef !important;
    color: var(--primary-dark) !important;
  }

  /* .dd-profile .dropdown-item:focus, 
.dd-profile .dropdown-item:hover{
  background-color: #83888d !important;
  color: var(--primary-dark) !important;

} */
  /* .dark-mode .dd-profile .dropdown-item:focus, 
.dark-mode .dd-profile .dropdown-item:hover{
  background-color: #e9ecef !important;
  color: var(--primary-dark) !important;
}

.dark-mode .dd-profile .dropdown-item:focus, 
.dark-mode .dd-profile .dropdown-item:hover{
  background-color: #e9ecef !important;
  color: var(--primary-dark) !important;

} */

  .dark-mode .p-datatable .p-datatable-tbody>tr.exp-tr-chart {
    background-color: #505051 !important;

  }

  .dark-mode .p-datatable .p-datatable-tbody>tr:nth-child(odd).exp-tr-chart {
    background-color: #505051 !important;

  }

  .dark-mode .p-tieredmenu.p-tieredmenu-overlay {
    background: #414141 !important;

  }

  .dark-mode .p-tieredmenu .p-submenu-list {
    background: #414141 !important;
  }

  .dark-mode .p-tieredmenu .p-menuitem>.p-menuitem-content .p-menuitem-link .p-menuitem-text,
  .dark-mode .p-tieredmenu .p-menuitem>.p-menuitem-content .p-menuitem-link .p-menuitem-icon {
    color: #ffffff !important
  }

  .dark-mode .p-tieredmenu .p-menuitem.p-highlight>.p-menuitem-content .p-menuitem-link .p-menuitem-icon,
  .dark-mode .p-tieredmenu .p-menuitem.p-highlight>.p-menuitem-content .p-menuitem-link .p-menuitem-text {
    color: #333 !important
  }

  .dark-mode .p-tieredmenu .p-menuitem:not(.p-highlight):not(.p-disabled)>.p-menuitem-content:hover .p-menuitem-link .p-menuitem-icon,
  .dark-mode .p-tieredmenu .p-menuitem:not(.p-highlight):not(.p-disabled)>.p-menuitem-content:hover .p-menuitem-link .p-menuitem-text {
    color: #333 !important
  }

  .dark-mode .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link.p-menuitem-link-active {
    background: gray !important;
  }

  .dark-mode .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link .p-menuitem-text {
    color: #fff !important;
  }

  .dark-mode .p-panelmenu .p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content {
    /* background: #232323 !important;
  border-color: #3b3b3c !important; */
    background: #e9ecef !important;
    border-color: #e9ecef !important;
    color: #161616 !important;
  }

  .dark-mode .p-panelmenu .p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content .p-panelmenu-header-action {
    color: black !important;
    background: transparent;
  }

  .dark-mode .p-panelmenu .p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content .p-panelmenu-header-action .p-menuitem-icon {
    color: black !important;
    background: transparent;
  }

  .dark-mode .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content {
    border: 1px solid #414141 !important;
    color: #495057 !important;
    background: #414141 !important;
  }

  .dark-mode .logo .pi .p-button-icon-only .p-button-icon {
    color: #fff !important;
  }


  .dark-mode .dd-profile .dropdown-item:hover .pi {
    color: #000000a3 !important;
  }

  .dark-mode .dd-profile .dropdown-item:hover .fa-solid {
    color: #000000a3 !important;
  }

  .dark-mode .dd-profile .submenu {
    background: #656464 !important;
  }

  .dark-mode .scrolling-text {
    /* color: #6bff6b !important; */
    color: #FFBF00 !important;

  }


  /* Style for PanelMenu headers */
  .dark-mode .p-panelmenu .p-panelmenu-header {
    background-color: #3a3a3a !important;
    color: white !important;
    font-weight: bold !important;
  }

  /* Style for PanelMenu content (inside items) */
  .dark-mode .p-panelmenu .p-panelmenu-content {
    background-color: #4a4a4a !important;
    color: white !important;
    border: none !important;
  }

  /* Style for individual menu items (links) */
  .dark-mode .p-panelmenu .p-menuitem-link {
    color: white !important;
    text-decoration: none !important;
  }

  /* Active item styling (optional) */
  .dark-mode .p-panelmenu .p-menuitem-link.router-link-active {
    font-weight: bold !important;
    color: #ffffff !important;
    background-color: #5a5a5a !important;
  }

  /* Optional - hover effect */
  .dark-mode .p-panelmenu .p-menuitem-link:hover {
    background-color: #555 !important;
  }



  .dark-mode .toggle-btn-product.active {
    background-color: #FFFFFF !important;
    color: #050505 !important;

    /* color: #000 !important;
  background: #FFFFFF !important; */
    /* box-shadow: 4px 4px 5px 0px #00000066,2px 2px 6px 0px #00000080 inset !important; */
  }


  .dark-mode .toggle-container {
    /* background: #333333 !important; */
    /* border: 1px solid #444444 !important; */
    /* box-shadow: 0px 0px 16px 0px #00000066,4px 4px 4px 0px #00000066 inset,-2px -2px 8px 0px #00000066 inset !important; */
  }

  .dark-mode .toggle-btn-product {

    /* border: 1px solid white !important; */
    color: white !important;
    /* color: #fff  !important; */
  }


  .dark-mode .b-active {
    background: #136FB6 !important;
    border: none !important;
  }

  .dark-mode .s-active {
    background: rgba(255, 42, 66, 0.69) !important;
    border: none !important;
  }

  /* .dark-mode .toggle-btn-product:not(.active):hover {
  background-color: #222  !important;
} */


  .dark-mode .Icon-Background {
    background: #37363e !important;
  }

  .dark-mode tr td.selected-row {
    background-color: #505051 !important;
  }


  .dark-mode .b-active {
    background: #136FB6 !important;
    border: none !important;
  }

  .dark-mode .s-active {
    background: rgba(255, 42, 66, 0.69) !important;
    border: none !important;
  }



  .dark-mode .close-icon-expend {
    color: #37363e !important;
    background: #ffffff !important;
    border: 1px solid #37363e !important;
  }

  .dark-mode .close-icon-expend-add {
    color: #37363e !important;
    background: #ffffff !important;
    border: 1px solid #37363e !important;
  }

  .dark-mode .close-icon-expend-add1 {
    color: #37363e !important;
    background: #ffffff !important;
    border: 1px solid #37363e !important;
  }

  .dark-mode .close-icon-expend-add1-refresh {
    background: #ffffff !important;
    border: 1px solid #37363e !important;
    color: #37363e !important;
  }


  .dark-mode .serch_text {
    color: #fff !important;
  }

  .dark-mode .row-filter-search {
    color: white !important;
  }


  .dark-mode .contact-sup-footer {
    background: var(--primary-dark) !important;
  }






  .dark-mode .p-button:not(:disabled):hover {
    color: rgb(255, 255, 255) !important;
  }
















  .dark-mode .notifications-dropdown {
    background: #414141 !important;
    border: 1px solid #414141 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;


  }

  .dark-mode .notifications-dropdown .notification-items .notification-item {
    background-color: #272727 !important;
    border: 1px solid #272727 !important;
  }


  .dark-mode .username-display h6 {
    color: #f5f5f5 !important;
  }





  .dark-mode .toggle-group {
    background: #282828 !important;
    box-shadow: 0 1px 4px rgb(145 145 145 / 27%) !important;
    border: 1px solid #343434 !important;
  }


  .dark-mode .spinner_overlay {
    background-color: #0000009e;
  }



  /* Shared Form & UI Components - Dark Mode */
  .dark-mode .section-title {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .custom-radio-card {
    background: var(--secondary-dark);
    border-color: var(--border);
  }

  .dark-mode .custom-radio-card:hover {
    background: #333;
  }

  .dark-mode .custom-radio-card.selected {
    background: rgba(37, 87, 167, 0.2);
    border-color: #60a5fa;
  }

  .dark-mode .custom-radio-card .form-check-label {
    color: #e2e8f0;
  }

  .dark-mode .custom-chip {
    background: #333 !important;
    color: #ccc !important;
  }

  .dark-mode .custom-chip.active {
    border-color: #fff !important;
    color: #fff !important;
  }

  .dark-mode .custom-chip:hover {
    background: #444 !important;
  }

  /* MultiSelect & Dropdown Filter Triggers (Pills) */
  .dark-mode .small-filter {
    background-color: var(--secondary-dark1) !important;
    border: var(--border) !important;
    color: var(--primary-text-color) !important;
    box-shadow: inset -2px -2px 4px 0 rgba(0, 0, 0, 0.12), inset 1px 1px 8px 0 rgba(255, 255, 255, 0.08) !important;
  }

  .dark-mode .small-filter .p-multiselect-label,
  .dark-mode .small-filter .p-dropdown-label {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .small-filter .p-multiselect-trigger,
  .dark-mode .small-filter .p-dropdown-trigger {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .small-filter:not(.p-disabled).p-focus {
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), inset -2px -2px 4px 0 rgba(0, 0, 0, 0.12), inset 1px 1px 8px 0 rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
  }




  /* Job Create & Common Component Overrides */
  .dark-mode .btn-white {
    background-color: var(--secondary-dark1) !important;
    border: var(--border) !important;
    color: var(--primary-text-color) !important;
  }

  .dark-mode .btn-white:hover {
    background-color: #333 !important;
  }

  .dark-mode .custom-stepper .p-inputnumber .p-inputnumber-button,
  .dark-mode .custom-stepper .p-inputnumber button.p-inputnumber-button {
    background-color: var(--secondary-dark) !important;
    border-color: var(--border1) !important;
    color: var(--primary-text-color) !important;
  }

  .dark-mode .custom-stepper .p-inputnumber .p-inputnumber-button:hover {
    background-color: #333 !important;
  }

  .dark-mode .p-inputgroup-addon {
    background-color: var(--secondary-dark) !important;
    border: var(--border) !important;
    color: var(--primary-text-color) !important;
  }

  .dark-mode .custom-stepper .p-inputnumber {
    background-color: var(--primary-dark) !important;
    border-color: var(--border1) !important;
  }

  .dark-mode .custom-stepper .p-inputnumber .p-inputtext {
    color: var(--primary-text-color) !important;
  }

  .dark-mode .editor-container .ql-container.ql-snow,
  .dark-mode .editor-container .ql-editor {
    border-color: var(--border1) !important;
    background-color: var(--primary-dark) !important;
    color: var(--primary-text-color) !important;
  }

  .dark-mode .editor-container .ql-editor.ql-blank::before {
    color: #888 !important;
  }

  .dark-mode .custom-chip {
    background: #2a2a2a !important;
    border: 1px solid #444 !important;
    color: #ddd !important;
  }

  .dark-mode .custom-chip.active {
    background: rgba(37, 87, 167, 0.3) !important;
    border-color: #2557a7 !important;
    color: #fff !important;
  }

  .dark-mode .custom-chip:hover:not(.active) {
    background: #333 !important;
  }

  .dark-mode .dashboard-home {
    height: 90vh;
    width: 100%;
    display: flex;
    align-items: center;
    background: url('/assets/img/Dashboard2.png') no-repeat center center !important;
    background-size: cover;
  }

  /* PrimeNG Dropdowns & MultiSelect Dark Mode */
  .dark-mode .p-multiselect-panel,
  .dark-mode .p-dropdown-panel {
    background: #1e1e1e !important;
    border: 1px solid #333 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5) !important;
  }

  .dark-mode .p-multiselect-panel .p-multiselect-items .p-multiselect-item,
  .dark-mode .p-dropdown-panel .p-dropdown-items .p-dropdown-item {
    color: #eee !important;
    background: transparent !important;
  }

  .dark-mode .p-multiselect-panel .p-multiselect-items .p-multiselect-item:not(.p-highlight):not(.p-disabled):hover,
  .dark-mode .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-focus,
  .dark-mode .p-dropdown-panel .p-dropdown-items .p-dropdown-item:not(.p-highlight):not(.p-disabled):hover,
  .dark-mode .p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-focus,
  .dark-mode .p-multiselect-panel .p-multiselect-items .p-multiselect-item:focus,
  .dark-mode .p-dropdown-panel .p-dropdown-items .p-dropdown-item:focus {
    background: #2a2a2a !important;
    color: #fff !important;
    box-shadow: none !important;
  }

  .dark-mode .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight,
  .dark-mode .p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight {
    background: rgba(19, 111, 182, 0.25) !important;
    color: #fff !important;
  }

  .dark-mode .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight.p-focus,
  .dark-mode .p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight.p-focus,
  .dark-mode .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight:hover,
  .dark-mode .p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight:hover {
    background: rgba(19, 111, 182, 0.35) !important;
    color: #fff !important;
  }

  .dark-mode .p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
    margin-right: 8px;
  }

  /* Footer Section in MultiSelect */
  .dark-mode .p-multiselect-panel .border-top {
    border-top: 1px solid #333 !important;
  }

  .dark-mode .p-multiselect-panel .btn-white {
    background: #282828 !important;
    border: 1px solid #444 !important;
    color: #eee !important;
  }

  .dark-mode .p-multiselect-panel .btn-white:hover {
    background: #333 !important;
  }

  .dark-mode .p-checkbox .p-checkbox-box {
    border: 1px solid #444 !important;
    background: #1e1e1e !important;
  }

  .dark-mode .p-checkbox .p-checkbox-box.p-highlight {
    background: #2557a7 !important;
    border-color: #2557a7 !important;
  }

  .dark-mode .p-checkbox .p-checkbox-box .p-checkbox-icon {
    color: #fff !important;
  }
  /* Job Status Badges (Draft, etc.) */
  .dark-mode .job-status-badge {
    border-radius: 2rem !important;
    padding: 0.4rem 0.8rem !important;
    font-weight: 500 !important;
    font-size: 0.75rem !important;
    display: inline-flex !important;
    align-items: center !important;
    white-space: nowrap !important;
  }

  .dark-mode .badge-draft {
    background-color: rgba(249, 115, 22, 0.15) !important;
    color: #fb923c !important;
    border: 1px solid rgba(249, 115, 22, 0.3) !important;
  }

