/* ------------------------------------------------------------------
   SalaryX Pro – Unified Theme Stylesheet
   Revision : 2025-06-07 (R4 – complete)
   ------------------------------------------------------------------ */

/* ================================================================
   1. GLOBAL TOKENS
   ================================================================ */
:root{
  --sx-primary:#02364E;
  --sx-primary-dark:#035074;
  --sx-secondary:#6c757d;
  --sx-success:#0284A8;
  --sx-info:#0284A8;
  --sx-warning:#D79E00;
  --sx-danger:#C0392B;
  --sx-light:#f8f9fa;
  --sx-striping:#f2f2f2;
  --sx-hover-row:#e9ecef;
   --sx-secondary-hover:#5a6268;
   --sx-success-hover:#026C7A;
   --sx-info-hover:#026C7A;
   --sx-warning-hover:#B07D00;
   --sx-danger-hover:#96281B;
   --sx-outline-hover-bg:#03507463;
   --sx-focus-shadow:0 0 0 .2rem rgba(2,54,78,.25);

   /* Sidebar tokens (defaults match existing dark sidebar) */
   --sx-sidebar-bg: var(--sx-primary);
   --sx-sidebar-border: rgba(255,255,255,.08);
   --sx-sidebar-text: #ffffff;
   --sx-sidebar-muted: rgba(255,255,255,.72);
   --sx-sidebar-hover-bg: rgba(255,255,255,.08);
   --sx-sidebar-hover-text: #ffffff;
   --sx-sidebar-active-bg: var(--sx-primary-dark);
   --sx-sidebar-active-text: #ffffff;
   --sx-sidebar-brand-bg: var(--sx-primary);
   --sx-sidebar-brand-text: #ffffff;
   --sx-sidebar-search-bg: #606060;
   --sx-sidebar-search-text: #ffffff;
   --sx-sidebar-search-placeholder: rgba(255,255,255,.75);
  --chatSidebar-width-desktop:25%;
  --chatSidebar-width-tablet:50%;
  --chatSidebar-width-mobile:100%;
  --chat-widget-offset:20px;
  --chat-widget-width:350px;
  --chat-widget-height:500px;
  --chat-header-height:55px;
}

/* ================================================================
   2. UTILITIES
   ================================================================ */
.hover-effect:hover{background:#989393;cursor:pointer;}
.table-responsive{position:relative;}

/* ================================================================
   3. TABLES (generic + worktrack)
   ================================================================ */
.table th,.table td{font-size:13px;padding:5px 8px;text-align:center;}
.table-striped tbody tr:nth-child(even){background:var(--sx-striping);}  
.table-hover   tbody tr:hover{background:var(--sx-hover-row);}  
#worktrack thead th{position:sticky;top:0;background:var(--sx-light);z-index:2;}

/* ================================================================
   4. BUTTONS (solid + outline)
   ================================================================ */
.btn-primary,.btn-custom{background:var(--sx-primary)!important;border-color:var(--sx-primary)!important;color:#fff!important;}
.btn-primary:hover,.btn-custom:hover{background:var(--sx-primary-dark)!important;border-color:var(--sx-primary-dark)!important;}
.btn-secondary{background:var(--sx-secondary)!important;border-color:var(--sx-secondary)!important;color:#fff!important;}
.btn-secondary:hover{background:var(--sx-secondary-hover)!important;border-color:var(--sx-secondary-hover)!important;}
.btn-success{background:var(--sx-success)!important;border-color:var(--sx-success)!important;color:#fff!important;}
.btn-success:hover{background:var(--sx-success-hover)!important;border-color:var(--sx-success-hover)!important;}
.btn-info{background:var(--sx-info)!important;border-color:var(--sx-info)!important;color:#fff!important;}
.btn-info:hover{background:var(--sx-info-hover)!important;border-color:var(--sx-info-hover)!important;}
.btn-warning{background:var(--sx-warning)!important;border-color:var(--sx-warning)!important;color:#fff!important;}
.btn-warning:hover{background:var(--sx-warning-hover)!important;border-color:var(--sx-warning-hover)!important;}
.btn-danger{background:var(--sx-danger)!important;border-color:var(--sx-danger)!important;color:#fff!important;}
.btn-danger:hover{background:var(--sx-danger-hover)!important;border-color:var(--sx-danger-hover)!important;}

[class*="btn-outline-"]{background:transparent;}
.btn-outline-primary{color:var(--sx-primary)!important;border-color:var(--sx-primary)!important;}
.btn-outline-secondary{color:var(--sx-secondary)!important;border-color:var(--sx-secondary)!important;}
.btn-outline-success{color:var(--sx-success)!important;border-color:var(--sx-success)!important;}
.btn-outline-info{color:var(--sx-info)!important;border-color:var(--sx-info)!important;}
.btn-outline-warning{color:var(--sx-warning)!important;border-color:var(--sx-warning)!important;}
.btn-outline-danger{color:var(--sx-danger)!important;border-color:var(--sx-danger)!important;}
.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show>.btn-outline-primary.dropdown-toggle {background:var(--sx-primary)!important;color:#fff!important;border-color:var(--sx-primary)!important;}
.btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, .show>.btn-outline-secondary.dropdown-toggle {background:var(--sx-secondary)!important;color:#fff!important;border-color:var(--sx-secondary)!important;}
[class*="btn-outline-"]:hover{background:var(--sx-outline-hover-bg)!important;}

.content-header .btn-outline-primary{color:var(--sx-primary);border-color:var(--sx-primary);}  
.content-header .btn-outline-primary:hover{background:var(--sx-primary);color:#fff;border-color:var(--sx-primary);}  

/* ================================================================
   5. DATATABLES PAGINATION
   ================================================================ */
.dataTables_wrapper .page-item.active .page-link{background:var(--sx-primary)!important;border-color:var(--sx-primary)!important;color:#fff!important;}
.dataTables_wrapper .page-link{color:var(--sx-primary)!important;background:#fff!important;}

/* ================================================================
   6. CARDS, NAV-TABS & NAV-PILLS
   ================================================================ */
.small-box.sx-small-box{
   --sx-box-a: var(--sx-primary);
   --sx-box-b: var(--sx-primary-dark);
   position: relative;
   overflow: hidden;
   border-radius: .6rem;
   border: 1px solid rgba(2,54,78,.16);
   box-shadow: 0 6px 18px rgba(2,54,78,.10);
   transition: transform .15s ease, box-shadow .15s ease;
}

.small-box.sx-small-box.bg-info{--sx-box-a: var(--sx-info); --sx-box-b:var(--sx-info-hover);}
.small-box.sx-small-box.bg-success{--sx-box-a: var(--sx-success); --sx-box-b:var(--sx-success-hover);}
.small-box.sx-small-box.bg-warning{--sx-box-a: var(--sx-warning); --sx-box-b:var(--sx-warning-hover);}
.small-box.sx-small-box.bg-danger{--sx-box-a: var(--sx-danger); --sx-box-b:var(--sx-danger-hover);}

.small-box.sx-small-box,
.small-box.sx-small-box.bg-info,
.small-box.sx-small-box.bg-success,
.small-box.sx-small-box.bg-warning,
.small-box.sx-small-box.bg-danger{
   background: linear-gradient(135deg, var(--sx-box-a), var(--sx-box-b)) !important;
   color: #fff !important;
}

.small-box.sx-small-box:hover{
   transform: translateY(-1px);
   box-shadow: 0 10px 26px rgba(2,54,78,.16);
}

.small-box.sx-small-box .inner h3{font-weight:700; letter-spacing:.2px;}
.small-box.sx-small-box .inner p{opacity:.92; margin-bottom:0;}
.small-box.sx-small-box .icon{color: rgba(255,255,255,.65) !important;}
.small-box.sx-small-box .icon>i{opacity:.95;}
.small-box.sx-small-box .small-box-footer{color:#fff !important;}

.card-primary{color:var(--sx-primary)!important;}
.card-primary.card-outline{border-color:var(--sx-primary)!important;}
.card-primary>.card-header{background:var(--sx-primary)!important;color:#fff!important;}
.card-primary>.card-header a{color:#fff!important;}
.card-primary>.card-header #custom-tabs-four-tab {background:#fff!important;color:var(--sx-primary)!important;}
.card-primary>.card-header #custom-tabs-four-tab  a{color:var(--sx-primary)!important}
.card-primary>.card-header #custom-tabs-four-tab  a.active{color:#fff!important;}

.nav-tabs .nav-link{color:var(--sx-primary);border:1px solid transparent;border-top-left-radius:.25rem;border-top-right-radius:.25rem;}
.nav-tabs .nav-link:hover{background:var(--sx-light);color:var(--sx-primary-dark);}  
.nav-tabs .nav-link.active{background:var(--sx-primary);color:#fff;border-color:var(--sx-primary) var(--sx-primary) var(--sx-light);}  

.card.card-outline-tabs .card-header a{color:var(--sx-primary)!important;}
.card.card-outline-tabs .card-header a.active{background:var(--sx-primary)!important;color:#fff!important;border-top:3px solid var(--sx-primary)!important;}

.nav-pills .nav-link{color:var(--sx-primary);}  
.nav-pills .nav-link:hover{background:var(--sx-light);color:var(--sx-primary-dark);}  
.nav-pills .nav-link.active{background:var(--sx-primary)!important;color:#fff!important;}

.nav-item .nav-link.active{background:var(--sx-primary)!important;color:#fff!important;}

/* ================================================================
   7. SIDEBAR & BRAND
   ================================================================ */
.main-sidebar{background:var(--sx-sidebar-bg)!important;border-right:1px solid var(--sx-sidebar-border)!important;}
.main-sidebar .brand-link{background:var(--sx-sidebar-brand-bg)!important;color:var(--sx-sidebar-brand-text)!important;border-bottom:1px solid var(--sx-sidebar-border)!important;}
.main-sidebar .brand-link::after{content:"";display:block;clear:both;}
.main-sidebar .brand-link .brand-text{color:var(--sx-sidebar-brand-text)!important;}
.main-sidebar .sidebar a{color:var(--sx-sidebar-text)!important;}
.main-sidebar .nav-sidebar>.nav-item>.nav-link{color:var(--sx-sidebar-text)!important;}
.main-sidebar .nav-sidebar>.nav-item>.nav-link:hover{background:var(--sx-sidebar-hover-bg)!important;color:var(--sx-sidebar-hover-text)!important;}
.main-sidebar .nav-sidebar>.nav-item>.nav-link.active,
.main-sidebar .nav-sidebar .nav-treeview>.nav-item>.nav-link.active{background:var(--sx-sidebar-active-bg)!important;color:var(--sx-sidebar-active-text)!important;}
.main-sidebar .nav-sidebar .nav-treeview>.nav-item>.nav-link{color:var(--sx-sidebar-muted)!important;}
.main-sidebar .nav-sidebar .nav-treeview>.nav-item>.nav-link:hover{background:var(--sx-sidebar-hover-bg)!important;color:var(--sx-sidebar-hover-text)!important;}
.main-sidebar .nav-sidebar .nav-icon,
.main-sidebar .nav-sidebar .fa,
.main-sidebar .nav-sidebar .fas,
.main-sidebar .nav-sidebar .far{color:inherit!important;}

/* Neutral theme UX: no leading icons; framed first-level menu items */
.sx-theme-neutral .main-sidebar .nav-sidebar .nav-link > i{display:none!important;}
.sx-theme-neutral .main-sidebar .nav-sidebar .nav-link p{margin-left:0!important;}
.sx-theme-neutral .main-sidebar .nav-sidebar>.nav-item>.nav-link{
   border:1px solid var(--sx-sidebar-border)!important;
   border-radius:.25rem!important;
   margin:.25rem .5rem!important;
}
.sx-theme-neutral .main-sidebar .sx-sidebar-search{display:none!important;}

/* Neutral theme: indent submenu items for clearer hierarchy */
.sx-theme-neutral .main-sidebar .nav-sidebar .nav-treeview > .nav-item > .nav-link{
   padding-left:2rem!important;
}
.sx-theme-neutral .main-sidebar .nav-sidebar .nav-treeview .nav-treeview > .nav-item > .nav-link{
   padding-left:3rem!important;
}

/* Light/neutral toggle for non-partnership: make sidebar brand text SalaryX Pro use the original dark brand color */
html[data-sx-theme="neutral"] .main-sidebar .brand-link .brand-text,
html[data-sx-theme="neutral"] .main-sidebar .brand-link .brand-text b{
   color:#02364E!important;
}

/* Neutral theme: footer ERC logo (partnership mode) */
.sx-theme-neutral .main-footer .sx-footer-erc-logo{
   height:18px!important;
   width:auto!important;
   margin-right:.35rem!important;
   vertical-align:middle!important;
   opacity:.85!important;
}

/* Neutral theme: navbar user menu (initials dropdown) */
.sx-theme-neutral .main-header.navbar{
   background:var(--sx-surface-section)!important;
   border-bottom:1px solid var(--sx-surface-border)!important;
}
.sx-theme-neutral .main-header.navbar .sx-user-trigger{padding-top:.25rem!important;padding-bottom:.25rem!important;}
.sx-theme-neutral .main-header.navbar .sx-user-trigger::after{display:none!important;}
.sx-theme-neutral .main-header.navbar .sx-user-initials{
   display:inline-flex!important;
   align-items:center!important;
   justify-content:center!important;
   width:34px!important;
   height:34px!important;
   border-radius:999px!important;
   border:1px solid var(--sx-surface-border)!important;
   background:var(--sx-surface-card)!important;
   color:var(--sx-text)!important;
   font-weight:700!important;
   letter-spacing:.4px!important;
}
.sx-theme-neutral .main-header.navbar .sx-user-trigger:hover .sx-user-initials{
   background:var(--sx-surface-hover)!important;
}
.sx-theme-neutral .main-header.navbar .sx-user-menu{
   border:1px solid var(--sx-surface-border)!important;
   background:var(--sx-surface-overlay)!important;
}
.sx-theme-neutral .main-header.navbar .sx-user-menu .dropdown-item{color:var(--sx-text)!important;}
.sx-theme-neutral .main-header.navbar .sx-user-menu .dropdown-item:hover{background:var(--sx-surface-hover)!important;}

/* Neutral theme: dashboard cards & charts containers */
.sx-theme-neutral .sx-dashboard .card{
   background:var(--sx-surface-card)!important;
   color:var(--sx-text)!important;
   border:1px solid var(--sx-surface-border)!important;
   box-shadow:none!important;
}
.sx-theme-neutral .sx-dashboard .card .card-header{
   background:var(--sx-surface-section)!important;
   color:var(--sx-text)!important;
   border-bottom:1px solid var(--sx-surface-border)!important;
}
.sx-theme-neutral .sx-dashboard .card .card-title,
.sx-theme-neutral .sx-dashboard .card .card-title i{
   color:var(--sx-text)!important;
}
.sx-theme-neutral .sx-dashboard .card .btn-tool{
   color:var(--sx-text-secondary)!important;
}
.sx-theme-neutral .sx-dashboard .card-primary,
.sx-theme-neutral .sx-dashboard .card-info{
   color:inherit!important;
}
.sx-theme-neutral .sx-dashboard .card-primary.card-outline,
.sx-theme-neutral .sx-dashboard .card-info.card-outline{
   border-top:3px solid var(--sx-surface-border)!important;
}
.sx-theme-neutral .sx-dashboard .card-primary>.card-header,
.sx-theme-neutral .sx-dashboard .card-info>.card-header{
   background:var(--sx-surface-section)!important;
   color:var(--sx-text)!important;
}

/* Neutral theme: dashboard stat boxes (keep semantic hint but muted) */
.sx-theme-neutral .sx-dashboard .small-box.sx-small-box{
   color:var(--sx-text)!important;
   border:1px solid var(--sx-surface-border)!important;
   box-shadow:none!important;
}
.sx-theme-neutral .sx-dashboard .small-box.sx-small-box .icon{
   color:rgba(0,0,0,.18)!important;
}
.sx-theme-neutral .sx-dashboard .small-box.sx-small-box .small-box-footer{
   color:var(--sx-link)!important;
}

.sx-theme-neutral .sx-dashboard .small-box.sx-small-box.bg-info{
   background:linear-gradient(135deg,var(--cyan-50),var(--cyan-100))!important;
   border-color:var(--cyan-200)!important;
}
.sx-theme-neutral .sx-dashboard .small-box.sx-small-box.bg-danger{
   background:linear-gradient(135deg,var(--red-50),var(--red-100))!important;
   border-color:var(--red-200)!important;
}
.sx-theme-neutral .sx-dashboard .small-box.sx-small-box.bg-success{
   background:linear-gradient(135deg,var(--green-50),var(--green-100))!important;
   border-color:var(--green-200)!important;
}
.sx-theme-neutral .sx-dashboard .small-box.sx-small-box.bg-warning{
   background:linear-gradient(135deg,var(--yellow-50),var(--yellow-100))!important;
   border-color:var(--yellow-200)!important;
}

.main-sidebar .form-control-sidebar{background:var(--sx-sidebar-search-bg)!important;color:var(--sx-sidebar-search-text)!important;border:none!important;}
.main-sidebar .form-control-sidebar::placeholder{color:var(--sx-sidebar-search-placeholder)!important;}
.main-sidebar .btn-sidebar{color:var(--sx-sidebar-search-text)!important;}

a{color:var(--sx-primary)!important;text-decoration:none!important;}

/* ================================================================
    7.5 NAVBAR LAYOUT FIX
    When the sidebar expands, the header has less horizontal space.
    Allow flex children (company selector / select2) to shrink so the
    navbar doesn't overflow and create horizontal scroll.
    ================================================================ */
.main-header .container-fluid,
.main-header .navbar-collapse,
.main-header .navbar-collapse > .flex-grow-1{
   min-width:0!important;
}
.main-header .select2-container{
   max-width:100%!important;
   min-width:0!important;
}
.main-header .select2-container .select2-selection--single,
.main-header .select2-container .select2-selection--multiple{
   min-width:0!important;
}

/* ================================================================
   8. FORMS & SWITCHES
   ================================================================ */
input[type=checkbox],input[type=radio]{accent-color:var(--sx-primary)!important;}
select.form-control,.custom-select,.select2-selection--single{background:#fff!important;color:var(--sx-primary)!important;border:1px solid var(--sx-primary)!important;border-radius:.25rem!important;}
select.form-control:focus,.custom-select:focus,.select2-container--open .select2-selection--single{border-color:var(--sx-primary-dark)!important;box-shadow:var(--sx-focus-shadow)!important;}
.select2-selection__rendered{line-height:1.5!important;padding-left:.5rem;margin-top: 0px!important;color: var(--sx-primary)!important;font-size: 1rem;}
.select2-selection__arrow b{border-color:var(--sx-primary) transparent transparent transparent!important;}
.select2-results__option--highlighted[aria-selected]{background:var(--sx-primary)!important;color:#fff!important;}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary{background:var(--sx-primary)!important;color:#fff!important;}
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary{background:var(--sx-light)!important;color:var(--sx-primary)!important;}
.select2-container--default .select2-selection--single,
.select2-container--bootstrap4 .select2-selection--single {
  display: flex !important;
  align-items: center !important;
}

input.form-control,textarea.form-control,select.form-control,.custom-select,.select2-selection--single{background:#fff!important;color:var(--sx-primary)!important;border:1px solid var(--sx-primary)!important;border-radius:.25rem!important;line-height:1.5!important;padding:.375rem .75rem!important;transition:border-color .2s ease,box-shadow .2s ease!important;}
input.form-control:focus,textarea.form-control:focus,select.form-control:focus,.custom-select:focus,.select2-container--open .select2-selection--single{border-color:var(--sx-primary-dark)!important;box-shadow:var(--sx-focus-shadow)!important;outline:none!important;}
input.form-control,textarea.form-control{display:flex!important;align-items:center!important;}
input.form-control::placeholder,textarea.form-control::placeholder{color:var(--sx-primary-dark)!important;opacity:0.6!important;}


/* ================================================================
   9. SUSPENSION TABLES
   ================================================================ */
#table-suspension,#table-suspension-subtable,#table-suspension .expandable-body table{width:100%;border-collapse:collapse;border:1px solid var(--sx-primary);border-radius:.375rem;overflow:hidden;}
#table-suspension thead th,#table-suspension-subtable thead th,#table-suspension .expandable-body thead th{background:var(--sx-primary);color:#fff;border-bottom:2px solid var(--sx-primary-dark);padding:.75rem;vertical-align:middle;}
#table-suspension tbody td,#table-suspension-subtable td{padding:.65rem;vertical-align:middle;border-top:1px solid #e9ecef;}
#table-suspension tbody tr:nth-child(odd),#table-suspension-subtable tbody tr:nth-child(odd),#table-suspension .expandable-body tbody tr:nth-child(odd){background:rgba(2,54,78,.03);}  
#table-suspension tbody tr:nth-child(even),#table-suspension-subtable tbody tr:nth-child(even){background:#fff;}
#table-suspension tbody tr:hover,#table-suspension-subtable tbody tr:hover,#table-suspension .expandable-body tbody tr:hover{background:rgba(2,54,78,.07)!important;}
[data-widget="expandable-table"] i{color:var(--sx-primary);transition:transform .2s ease;}

/* Neutral theme – suspension UI should be neutral */
.sx-theme-neutral #table-suspension,
.sx-theme-neutral #table-suspension-subtable,
.sx-theme-neutral #table-suspension .expandable-body table{
   border:1px solid var(--sx-sidebar-border)!important;
}
.sx-theme-neutral #table-suspension thead th,
.sx-theme-neutral #table-suspension-subtable thead th,
.sx-theme-neutral #table-suspension .expandable-body thead th{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-bottom:1px solid var(--sx-sidebar-border)!important;
}
.sx-theme-neutral #table-suspension tbody td,
.sx-theme-neutral #table-suspension-subtable td{
   border-top:1px solid var(--sx-sidebar-border)!important;
}
.sx-theme-neutral #table-suspension tbody tr:nth-child(odd),
.sx-theme-neutral #table-suspension-subtable tbody tr:nth-child(odd),
.sx-theme-neutral #table-suspension .expandable-body tbody tr:nth-child(odd){
   background:var(--sx-sidebar-hover-bg)!important;
}
.sx-theme-neutral #table-suspension tbody tr:nth-child(even),
.sx-theme-neutral #table-suspension-subtable tbody tr:nth-child(even){
   background:var(--sx-sidebar-bg)!important;
}
.sx-theme-neutral #table-suspension tbody tr:hover,
.sx-theme-neutral #table-suspension-subtable tbody tr:hover,
.sx-theme-neutral #table-suspension .expandable-body tbody tr:hover{
   background:var(--sx-sidebar-hover-bg)!important;
}
.sx-theme-neutral #table-suspension tbody tr.table-info{
   background:var(--sx-sidebar-hover-bg)!important;
}

/* Expand (+/-) icon in "Tip obustave" column */
.sx-theme-neutral #table-suspension [id^="expand_plus_minus-"]{
   display:inline-flex!important;
   align-items:center!important;
   justify-content:center!important;
   width:1.5rem!important;
   height:1.5rem!important;
   border:1px solid var(--sx-sidebar-border)!important;
   border-radius:.25rem!important;
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
}

/* Expandable body surfaces */
.sx-theme-neutral #table-suspension .expandable-body td.bg-light{
   background:var(--sx-sidebar-bg)!important;
}
.sx-theme-neutral #table-suspension .callout.callout-info{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border:1px solid var(--sx-sidebar-border)!important;
}
.sx-theme-neutral #table-suspension .callout.callout-info a,
.sx-theme-neutral #table-suspension .callout.callout-info .text-muted{
   color:var(--sx-sidebar-muted)!important;
}

/* Scheduler subtable (table-primary + bg-primary in template) */
.sx-theme-neutral #table-suspension .expandable-body table.table-primary{
   color:var(--sx-sidebar-text)!important;
}
.sx-theme-neutral #table-suspension .expandable-body .bg-primary,
.sx-theme-neutral #table-suspension .expandable-body .sticky-top.bg-primary{
   background:var(--sx-sidebar-bg)!important;
}
.sx-theme-neutral #table-suspension .expandable-body .sticky-top.bg-primary th{
   color:var(--sx-sidebar-text)!important;
   border-bottom:1px solid var(--sx-sidebar-border)!important;
}

/* Neutral theme – suspension action buttons must be neutral */
.sx-theme-neutral #table-suspension .action-btns .btn,
.sx-theme-neutral #table-suspension .btn.btn-outline-primary,
.sx-theme-neutral #table-suspension .btn.btn-outline-secondary,
.sx-theme-neutral #table-suspension .btn.btn-outline-success,
.sx-theme-neutral #table-suspension .btn.btn-outline-info,
.sx-theme-neutral #table-suspension .btn.btn-outline-warning,
.sx-theme-neutral #table-suspension .btn.btn-outline-danger{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border:1px solid var(--sx-sidebar-border)!important;
}
.sx-theme-neutral #table-suspension .action-btns .btn:hover,
.sx-theme-neutral #table-suspension .btn.btn-outline-primary:hover,
.sx-theme-neutral #table-suspension .btn.btn-outline-secondary:hover,
.sx-theme-neutral #table-suspension .btn.btn-outline-success:hover,
.sx-theme-neutral #table-suspension .btn.btn-outline-info:hover,
.sx-theme-neutral #table-suspension .btn.btn-outline-warning:hover,
.sx-theme-neutral #table-suspension .btn.btn-outline-danger:hover{
   background:var(--sx-sidebar-hover-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-color:var(--sx-sidebar-border)!important;
}

/* Neutral theme – DataTables pagination should be neutral */
.sx-theme-neutral .dataTables_wrapper .dataTables_paginate .pagination .page-link{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border:1px solid var(--sx-sidebar-border)!important;
   font-family:inherit!important;
}
.sx-theme-neutral .dataTables_wrapper .dataTables_paginate .pagination .page-link:hover{
   background:var(--sx-sidebar-hover-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-color:var(--sx-sidebar-border)!important;
}
.sx-theme-neutral .dataTables_wrapper .dataTables_paginate .pagination .page-link:focus{
   box-shadow:var(--sx-focus-shadow)!important;
}
.sx-theme-neutral .dataTables_wrapper .dataTables_paginate .pagination .page-item.active .page-link{
   background:var(--sx-sidebar-hover-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-color:var(--sx-sidebar-border)!important;
}
.sx-theme-neutral .dataTables_wrapper .dataTables_paginate .pagination .page-item.disabled .page-link{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-muted)!important;
   border-color:var(--sx-sidebar-border)!important;
}

/* Fallback for non-Bootstrap DataTables markup */
.sx-theme-neutral .dataTables_wrapper .dataTables_paginate .paginate_button{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border:1px solid var(--sx-sidebar-border)!important;
}
.sx-theme-neutral .dataTables_wrapper .dataTables_paginate .paginate_button:hover{
   background:var(--sx-sidebar-hover-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-color:var(--sx-sidebar-border)!important;
}
.sx-theme-neutral .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.sx-theme-neutral .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
   background:var(--sx-sidebar-hover-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-color:var(--sx-sidebar-border)!important;
}
.sx-theme-neutral .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.sx-theme-neutral .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-muted)!important;
   border-color:var(--sx-sidebar-border)!important;
}

.badge.bg-success{background:var(--sx-success)!important;color:#fff!important;}
.badge.bg-warning{background:var(--sx-warning)!important;color:#fff!important;}
.badge.bg-danger{background:var(--sx-danger)!important;color:#fff!important;}

/* ================================================================
   10. NOTIFICATIONS
   ================================================================ */
#notification-items{max-height:350px;overflow-y:auto;}
.dropdown-item.unread{font-weight:600;background:#f0f6ff;}
.dropdown-item.read{font-weight:400;}
.dropdown-item:hover{background:#e9f2ff;}
.modal-header.info{background:var(--sx-info);}  
.modal-header.warning{background:var(--sx-warning);color:#212529;}  
.modal-header.error{background:var(--sx-danger);}  

/* ================================================================
   11. TOOLTIP
   ================================================================ */
.tooltip .tooltip-inner{background:var(--sx-primary);color:#fff;font-size:14px;padding:8px 10px;border-radius:5px;}
.tooltip.bs-tooltip-top .arrow::before{border-top-color:var(--sx-primary);}  
.tooltip-inner ul{padding-left:1rem;}
.tooltip-inner li{list-style:disc;}

/* ================================================================
   12. LOADER
   ================================================================ */
#loader{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:9999;background:rgba(255,255,255,.8);border-radius:10px;padding:20px;box-shadow:0 4px 8px rgba(0,0,0,.2);}

/* ================================================================
   13. CHAT (sidebar + widget)
   ================================================================ */
#chat-toggle{position:fixed;bottom:var(--chat-widget-offset);right:var(--chat-widget-offset);width:50px;height:50px;display:flex;align-items:center;justify-content:center;border-radius:50%;z-index:2150;transition:right .3s ease;}
#chatSidebar{position:fixed;top:0;right:0;transform:translateX(100%);width:var(--chatSidebar-width-desktop);height:100vh;background:#fff;border-left:1px solid #dee2e6;box-shadow:-2px 0 8px rgba(0,0,0,.15);transition:transform .3s ease;z-index:2000;overflow-y:auto;overflow-x:hidden;}
#chatSidebar.open{transform:translateX(0);}  
#chatSidebar.open~#chat-toggle{right:calc(var(--chatSidebar-width-desktop)+var(--chat-widget-offset));}
#chat-widget{position:fixed;bottom:var(--chat-widget-offset);right:var(--chat-widget-offset);width:var(--chat-widget-width);height:var(--chat-widget-height);display:none;z-index:2100;overflow:hidden;transition:right .3s ease,transform .3s ease;left:auto;}
#chatSidebar.open~#chat-widget{right:calc(var(--chatSidebar-width-desktop)+var(--chat-widget-offset));}
#chat-widget.collapsed-card{transform:translateY(calc(var(--chat-widget-height) - var(--chat-header-height)));}
#chat-widget.collapsed-card .card-body,#chat-widget.collapsed-card .card-footer{visibility:hidden;}
#chat-widget-body{display:flex;flex-direction:column;padding:0;height:calc(100% - 120px);overflow:hidden;}
#chat-widget-body .direct-chat-messages{flex:1 1 auto;overflow-y:auto;padding:1rem;background:var(--sx-light);}
#chat-widget .card-footer{padding:.5rem 1rem;}
#chat-widget .card-footer .form-control{border-top-left-radius:0;border-bottom-left-radius:0;}
#chat-widget-unread{margin-right:.5rem;}

@media (max-width:767.98px){#chatSidebar{width:var(--chatSidebar-width-mobile);}#chatSidebar.open~#chat-toggle,#chatSidebar.open~#chat-widget{right:calc(var(--chatSidebar-width-mobile)+var(--chat-widget-offset));}}
@media (min-width:768px) and (max-width:991.98px){#chatSidebar{width:var(--chatSidebar-width-tablet);}#chatSidebar.open~#chat-toggle,#chatSidebar.open~#chat-widget{right:calc(var(--chatSidebar-width-tablet)+var(--chat-widget-offset));}}

/* ================================================================
   14. MODALS & SECTION HEADERS
   ================================================================ */
.modal-lg{max-width:80%;}
.modal-body{max-height:100vh;overflow-y:auto;}
.modal-footer .btn{font-size:16px;padding:10px 20px;border-radius:8px;transition:.3s;}
.modal-footer .btn-outline-danger:hover{background:var(--sx-danger)!important;color:#fff!important;border-color:var(--sx-danger)!important;}
.modal-footer .btn-outline-secondary:hover{background:var(--sx-secondary);color:#fff;border-color:var(--sx-secondary);}  
.section-header{font-size:1.75rem;font-weight:bold;color:#343a40;border-bottom:2px solid var(--sx-primary);padding-bottom:10px;margin-bottom:20px;text-transform:uppercase;letter-spacing:1px;}
.section-subheader{font-size:1.25rem;font-weight:600;color:#6c757d;margin-bottom:15px;}
@media(max-width:768px){.btn span{display:none;}.table th,.table td{font-size:12px;padding:5px;}.btn{font-size:12px;padding:5px 8px;}.modal-lg{max-width:95%;}.modal-content{margin:0 10px;}}
@media(max-width:576px){.section-header{font-size:1.5rem;}.section-subheader{font-size:1rem;}#loader{width:80%;padding:10px;}.form-row .form-group{flex:0 0 100%;max-width:100%;}}

/* ================================================================
   15. CELL STATE INDICATORS
   ================================================================ */
.cell-has-data{--bg1:#e6f9e9;--bg2:#d1e7dd;--br:#28a745;--tx:#155724;}
.cell-has-absence{--bg1:#fdeaea;--bg2:#f8d7da;--br:#dc3545;--tx:#721c24;}
.cell-has-multiple{--bg1:#fff8e1;--bg2:#ffeeba;--br:#ffc107;--tx:#856404;}
.cell-has-nonsick-absence{--bg1:#fff4e6;--bg2:#ffddcc;--br:#ff8c1a;--tx:#663d00;}
.cell-has-data,.cell-has-absence,.cell-has-multiple,.cell-has-nonsick-absence{background:linear-gradient(to bottom,var(--bg1),var(--bg2));border:1px solid var(--br);color:var(--tx);font-size:12px;font-weight:500;border-radius:4px;padding:3px 5px;box-shadow:0 1px 3px rgba(0,0,0,.1);transition:.2s;cursor:pointer;}
.cell-has-data:hover,.cell-has-absence:hover,.cell-has-multiple:hover,.cell-has-nonsick-absence:hover{transform:translateY(-3px);box-shadow:0 3px 6px rgba(0,0,0,.2);opacity:.9;}

/* Neutral theme – Worktrack cells should be neutral */
.sx-theme-neutral #worktrack td.cell-has-data,
.sx-theme-neutral #worktrack td.cell-has-absence,
.sx-theme-neutral #worktrack td.cell-has-nonsick-absence{
   background:var(--sx-sidebar-bg)!important;
   border:1px solid var(--sx-sidebar-border)!important;
   color:var(--sx-sidebar-text)!important;
   box-shadow:none!important;
}

/* Neutral theme – multi-entry days should still read as "multiple" (muted amber) */
.sx-theme-neutral #worktrack td.cell-has-multiple{
   background-color:var(--sx-sidebar-bg)!important;
   background-image:linear-gradient(to bottom,var(--yellow-50),var(--yellow-100))!important;
   border:1px solid var(--yellow-200)!important;
   color:var(--sx-sidebar-text)!important;
   box-shadow:none!important;
}
.sx-theme-neutral #worktrack td.cell-has-data:hover,
.sx-theme-neutral #worktrack td.cell-has-absence:hover,
.sx-theme-neutral #worktrack td.cell-has-multiple:hover,
.sx-theme-neutral #worktrack td.cell-has-nonsick-absence:hover{
   transform:none!important;
   box-shadow:var(--sx-focus-shadow)!important;
   opacity:1!important;
}

/* Ensure links + icons inside day-cells stay neutral */
.sx-theme-neutral #worktrack td.cell-has-data a,
.sx-theme-neutral #worktrack td.cell-has-absence a,
.sx-theme-neutral #worktrack td.cell-has-multiple a,
.sx-theme-neutral #worktrack td.cell-has-nonsick-absence a{
   color:inherit!important;
}
.sx-theme-neutral #worktrack td.cell-has-data .text-success,
.sx-theme-neutral #worktrack td.cell-has-data .text-danger,
.sx-theme-neutral #worktrack td.cell-has-data .text-info,
.sx-theme-neutral #worktrack td.cell-has-absence .text-success,
.sx-theme-neutral #worktrack td.cell-has-absence .text-danger,
.sx-theme-neutral #worktrack td.cell-has-absence .text-info,
.sx-theme-neutral #worktrack td.cell-has-multiple .text-success,
.sx-theme-neutral #worktrack td.cell-has-multiple .text-danger,
.sx-theme-neutral #worktrack td.cell-has-multiple .text-info,
.sx-theme-neutral #worktrack td.cell-has-nonsick-absence .text-success,
.sx-theme-neutral #worktrack td.cell-has-nonsick-absence .text-danger,
.sx-theme-neutral #worktrack td.cell-has-nonsick-absence .text-info{
   color:var(--sx-sidebar-text)!important;
}

/* Also neutralize icon colors inside presence-variant cells in worktrack */
.sx-theme-neutral #worktrack td[class*="presence-variant-"] a{
   color:inherit!important;
}
.sx-theme-neutral #worktrack td[class*="presence-variant-"] .text-success,
.sx-theme-neutral #worktrack td[class*="presence-variant-"] .text-danger,
.sx-theme-neutral #worktrack td[class*="presence-variant-"] .text-info,
.sx-theme-neutral #worktrack td[class*="presence-variant-"] .text-warning,
.sx-theme-neutral #worktrack td[class*="presence-variant-"] .text-primary,
.sx-theme-neutral #worktrack td[class*="presence-variant-"] .text-secondary{
   color:var(--sx-sidebar-text)!important;
}

/* Multi-entry badge should be neutral too */
.sx-theme-neutral #worktrack .cell-icon[data-count]::after{
   background:var(--sx-sidebar-hover-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border:1px solid var(--sx-sidebar-border)!important;
}

/* If the multi-entry badge is shown inside a multi-entry cell, tint it slightly */
.sx-theme-neutral #worktrack td.cell-has-multiple .cell-icon[data-count]::after{
   background:var(--yellow-100)!important;
   border-color:var(--yellow-200)!important;
}

/* Neutral theme – Worktrack total badge should be neutral */
.sx-theme-neutral #worktrack .wt-total-badge{
   background:var(--sx-sidebar-bg)!important;
   border:1px solid var(--sx-sidebar-border)!important;
   color:var(--sx-sidebar-text)!important;
}
.sx-theme-neutral #worktrack tbody tr:hover .wt-total-badge{
   background:var(--sx-sidebar-hover-bg)!important;
   border-color:var(--sx-sidebar-border)!important;
}
.sx-theme-neutral #worktrack .wt-total-badge .wt-total-unit{
   color:var(--sx-sidebar-muted)!important;
   opacity:1!important;
}

/* Neutral theme – Tooltip/Popover should be neutral */
.sx-theme-neutral .tooltip .tooltip-inner{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border:1px solid var(--sx-sidebar-border)!important;
   box-shadow:var(--sx-focus-shadow)!important;
   font-family:inherit!important;
}
.sx-theme-neutral .tooltip.bs-tooltip-top .arrow::before{border-top-color:var(--sx-sidebar-bg)!important;}
.sx-theme-neutral .tooltip.bs-tooltip-right .arrow::before{border-right-color:var(--sx-sidebar-bg)!important;}
.sx-theme-neutral .tooltip.bs-tooltip-bottom .arrow::before{border-bottom-color:var(--sx-sidebar-bg)!important;}
.sx-theme-neutral .tooltip.bs-tooltip-left .arrow::before{border-left-color:var(--sx-sidebar-bg)!important;}

.sx-theme-neutral .tooltip .text-success,
.sx-theme-neutral .tooltip .text-danger,
.sx-theme-neutral .tooltip .text-info,
.sx-theme-neutral .tooltip .text-warning,
.sx-theme-neutral .tooltip .text-primary,
.sx-theme-neutral .tooltip .text-secondary{
   color:var(--sx-sidebar-text)!important;
}

.sx-theme-neutral .popover{
   background:var(--sx-sidebar-bg)!important;
   border:1px solid var(--sx-sidebar-border)!important;
   box-shadow:var(--sx-focus-shadow)!important;
}
.sx-theme-neutral .popover .popover-header{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-bottom:1px solid var(--sx-sidebar-border)!important;
}
.sx-theme-neutral .popover .popover-body{
   color:var(--sx-sidebar-text)!important;
}
.sx-theme-neutral .popover .text-success,
.sx-theme-neutral .popover .text-danger,
.sx-theme-neutral .popover .text-info,
.sx-theme-neutral .popover .text-warning,
.sx-theme-neutral .popover .text-primary,
.sx-theme-neutral .popover .text-secondary{
   color:var(--sx-sidebar-text)!important;
}

/* ================================================================
   16. PRESENCE VARIANTS (1-15)
   ================================================================ */
.presence-variant-1 {background:linear-gradient(to bottom,#E7F0FE,#C0D9FD);border:1px solid var(--sx-primary);color:var(--sx-primary);}  
.presence-variant-2 {background:linear-gradient(to bottom,#E0FFFA,#BAFFF3);border:1px solid #008080;color:#005959;}  
.presence-variant-3 {background:linear-gradient(to bottom,#D1E7DD,#A1CFBB);border:1px solid #198754;color:#155724;}  
.presence-variant-4 {background:linear-gradient(to bottom,#D1F2FF,#A1E7FF);border:1px solid #0DCAF0;color:#055160;}  
.presence-variant-5 {background:linear-gradient(to bottom,#FFF9D1,#FFF3A1);border:1px solid #FFC107;color:#664D03;}  
.presence-variant-6 {background:linear-gradient(to bottom,#F8D7DA,#F1B5BB);border:1px solid #DC3545;color:#721C24;}  
.presence-variant-7 {background:linear-gradient(to bottom,#FFE8D1,#FFD3A1);border:1px solid #FD7E14;color:#663D00;}  
.presence-variant-8 {background:linear-gradient(to bottom,#EAE0FF,#C8C1FF);border:1px solid #6F42C1;color:#3E2167;}  
.presence-variant-9 {background:linear-gradient(to bottom,#FFE0F0,#FFC1E1);border:1px solid #D63384;color:#6B1A42;}  
.presence-variant-10{background:linear-gradient(to bottom,#E0E0E0,#C0C0C0);border:1px solid #343A40;color:#212529;}  
.presence-variant-11{background:linear-gradient(to bottom,#F0F7FF,#D0EFFF);border:1px solid #0D6EFD;color:#073A8F;}  
.presence-variant-12{background:linear-gradient(to bottom,#E6F4EA,#CDE9D5);border:1px solid #20C997;color:#0F5132;}  
.presence-variant-13{background:linear-gradient(to bottom,#E0F7FF,#C0EFFE);border:1px solid #17A2B8;color:#0C525D;}  
.presence-variant-14{background:linear-gradient(to bottom,#FFFDE0,#FFFBC0);border:1px solid #FFCA2C;color:#665C00;}  
.presence-variant-15{background:linear-gradient(to bottom,#FFE0E0,#FFC0C0);border:1px solid #FF6B6B;color:#7A1F1F;}  
.presence-variant-1:hover,.presence-variant-2:hover,.presence-variant-3:hover,.presence-variant-4:hover,.presence-variant-5:hover,.presence-variant-6:hover,.presence-variant-7:hover,.presence-variant-8:hover,.presence-variant-9:hover,.presence-variant-10:hover,.presence-variant-11:hover,.presence-variant-12:hover,.presence-variant-13:hover,.presence-variant-14:hover,.presence-variant-15:hover{transform:translateY(-2px);box-shadow:0 3px 6px rgba(0,0,0,.15);opacity:.9;}

/* Neutral theme – presence variants in a muted spectrum */
.sx-theme-neutral .presence-variant-1,
.sx-theme-neutral .presence-variant-2,
.sx-theme-neutral .presence-variant-3,
.sx-theme-neutral .presence-variant-4,
.sx-theme-neutral .presence-variant-5,
.sx-theme-neutral .presence-variant-6,
.sx-theme-neutral .presence-variant-7,
.sx-theme-neutral .presence-variant-8,
.sx-theme-neutral .presence-variant-9,
.sx-theme-neutral .presence-variant-10,
.sx-theme-neutral .presence-variant-11,
.sx-theme-neutral .presence-variant-12,
.sx-theme-neutral .presence-variant-13,
.sx-theme-neutral .presence-variant-14,
.sx-theme-neutral .presence-variant-15{
   background-color:var(--sx-sidebar-bg)!important;
   border:1px solid var(--sx-sidebar-border)!important;
   color:var(--sx-sidebar-text)!important;
}

/* Muted multi-hue spectrum: uses provided scales from palette-neutral.css */
.sx-theme-neutral .presence-variant-1{background-image:linear-gradient(to bottom,var(--blue-50),var(--blue-100))!important;}
.sx-theme-neutral .presence-variant-2{background-image:linear-gradient(to bottom,var(--teal-50),var(--teal-100))!important;}
.sx-theme-neutral .presence-variant-3{background-image:linear-gradient(to bottom,var(--green-50),var(--green-100))!important;}
.sx-theme-neutral .presence-variant-4{background-image:linear-gradient(to bottom,var(--cyan-50),var(--cyan-100))!important;}
.sx-theme-neutral .presence-variant-5{background-image:linear-gradient(to bottom,var(--yellow-50),var(--yellow-100))!important;}
.sx-theme-neutral .presence-variant-6{background-image:linear-gradient(to bottom,var(--orange-50),var(--orange-100))!important;}
.sx-theme-neutral .presence-variant-7{background-image:linear-gradient(to bottom,var(--red-50),var(--red-100))!important;}
.sx-theme-neutral .presence-variant-8{background-image:linear-gradient(to bottom,var(--purple-50),var(--purple-100))!important;}
.sx-theme-neutral .presence-variant-9{background-image:linear-gradient(to bottom,var(--pink-50),var(--pink-100))!important;}
.sx-theme-neutral .presence-variant-10{background-image:linear-gradient(to bottom,var(--gray-50),var(--gray-100))!important;}
.sx-theme-neutral .presence-variant-11{background-image:linear-gradient(to bottom,var(--bluegray-50),var(--bluegray-100))!important;}
.sx-theme-neutral .presence-variant-12{background-image:linear-gradient(to bottom,var(--indigo-50),var(--indigo-100))!important;}
.sx-theme-neutral .presence-variant-13{background-image:linear-gradient(to bottom,var(--cyan-100),var(--cyan-200))!important;}
.sx-theme-neutral .presence-variant-14{background-image:linear-gradient(to bottom,var(--green-100),var(--green-200))!important;}
.sx-theme-neutral .presence-variant-15{background-image:linear-gradient(to bottom,var(--yellow-100),var(--yellow-200))!important;}

.sx-theme-neutral .presence-variant-1:hover,
.sx-theme-neutral .presence-variant-2:hover,
.sx-theme-neutral .presence-variant-3:hover,
.sx-theme-neutral .presence-variant-4:hover,
.sx-theme-neutral .presence-variant-5:hover,
.sx-theme-neutral .presence-variant-6:hover,
.sx-theme-neutral .presence-variant-7:hover,
.sx-theme-neutral .presence-variant-8:hover,
.sx-theme-neutral .presence-variant-9:hover,
.sx-theme-neutral .presence-variant-10:hover,
.sx-theme-neutral .presence-variant-11:hover,
.sx-theme-neutral .presence-variant-12:hover,
.sx-theme-neutral .presence-variant-13:hover,
.sx-theme-neutral .presence-variant-14:hover,
.sx-theme-neutral .presence-variant-15:hover{
   box-shadow:var(--sx-focus-shadow)!important;
   opacity:1!important;
}

/* ================================================================
   17. NEUTRAL THEME – UNIFIED NEUTRAL UI
    Goal: buttons/inputs/cards/tabs use the same look as sidebar tokens,
    regardless of primary/secondary/etc.
    ================================================================ */
.sx-theme-neutral,
.sx-theme-neutral .content-wrapper,
.sx-theme-neutral .content,
.sx-theme-neutral .card,
.sx-theme-neutral .modal-content{color:var(--sx-sidebar-text)!important;font-family:inherit!important;}

.sx-theme-neutral a{color:var(--sx-sidebar-text)!important;}
.sx-theme-neutral a:hover{color:var(--sx-sidebar-text)!important;}

/* Buttons (all variants) */
.sx-theme-neutral .btn,
.sx-theme-neutral .btn-primary,
.sx-theme-neutral .btn-custom,
.sx-theme-neutral .btn-secondary,
.sx-theme-neutral .btn-success,
.sx-theme-neutral .btn-info,
.sx-theme-neutral .btn-warning,
.sx-theme-neutral .btn-danger{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border:1px solid var(--sx-sidebar-border)!important;
   font-family:inherit!important;
}
.sx-theme-neutral .btn:hover,
.sx-theme-neutral .btn:focus,
.sx-theme-neutral .btn:active{
   background:var(--sx-sidebar-hover-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-color:var(--sx-sidebar-border)!important;
   box-shadow:var(--sx-focus-shadow)!important;
}

/* Inputs / selects / select2 */
.sx-theme-neutral input.form-control,
.sx-theme-neutral textarea.form-control,
.sx-theme-neutral select.form-control,
.sx-theme-neutral .custom-select,
.sx-theme-neutral .select2-selection--single,
.sx-theme-neutral .select2-selection--multiple,
.sx-theme-neutral .input-group-text{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border:1px solid var(--sx-sidebar-border)!important;
   font-family:inherit!important;
}
.sx-theme-neutral input.form-control::placeholder,
.sx-theme-neutral textarea.form-control::placeholder{color:var(--sx-sidebar-search-placeholder)!important;opacity:1!important;}
.sx-theme-neutral input.form-control:focus,
.sx-theme-neutral textarea.form-control:focus,
.sx-theme-neutral select.form-control:focus,
.sx-theme-neutral .custom-select:focus,
.sx-theme-neutral .select2-container--open .select2-selection--single,
.sx-theme-neutral .select2-container--open .select2-selection--multiple{
   border-color:var(--sx-sidebar-border)!important;
   box-shadow:var(--sx-focus-shadow)!important;
   outline:none!important;
}
.sx-theme-neutral .select2-selection__rendered{color:var(--sx-sidebar-text)!important;font-family:inherit!important;}
.sx-theme-neutral .select2-results__option--highlighted[aria-selected]{background:var(--sx-sidebar-hover-bg)!important;color:var(--sx-sidebar-text)!important;}

/* Card headers / outlines */
.sx-theme-neutral .card-header,
.sx-theme-neutral .card-primary>.card-header{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-bottom:1px solid var(--sx-sidebar-border)!important;
}
.sx-theme-neutral .card-primary,
.sx-theme-neutral .card-primary.card-outline{color:var(--sx-sidebar-text)!important;border-color:var(--sx-sidebar-border)!important;}

/* Employee card: parent tabs have ID-specific primary styles earlier in this file */
.sx-theme-neutral .card-primary>.card-header #custom-tabs-four-tab{
   background:var(--sx-sidebar-bg)!important;
   color:var(--sx-sidebar-text)!important;
}
.sx-theme-neutral .card-primary>.card-header #custom-tabs-four-tab a{
   background:transparent!important;
   color:var(--sx-sidebar-text)!important;
   font-family:inherit!important;
}
.sx-theme-neutral .card-primary>.card-header #custom-tabs-four-tab a:hover,
.sx-theme-neutral .card-primary>.card-header #custom-tabs-four-tab a.active{
   background:var(--sx-sidebar-hover-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-color:var(--sx-sidebar-border)!important;
   border-top:3px solid var(--sx-sidebar-border)!important;
}

/* Active tabs/pills */
.sx-theme-neutral .nav-tabs .nav-link,
.sx-theme-neutral .nav-pills .nav-link,
.sx-theme-neutral .card.card-outline-tabs .card-header a{color:var(--sx-sidebar-text)!important;font-family:inherit!important;}
.sx-theme-neutral .nav-tabs .nav-link:hover,
.sx-theme-neutral .nav-pills .nav-link:hover,
.sx-theme-neutral .card.card-outline-tabs .card-header a:hover{
   background:var(--sx-sidebar-hover-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-color:var(--sx-sidebar-border)!important;
}
.sx-theme-neutral .nav-tabs .nav-link.active,
.sx-theme-neutral .nav-pills .nav-link.active,
.sx-theme-neutral .nav-item .nav-link.active,
.sx-theme-neutral .card.card-outline-tabs .card-header a.active{
   background:var(--sx-sidebar-hover-bg)!important;
   color:var(--sx-sidebar-text)!important;
   border-color:var(--sx-sidebar-border)!important;
}

/* ------------------------------------------------------------------
   End of stylesheet – no truncated blocks
   ------------------------------------------------------------------ */