
/* Perfex SAP Sidebar Customization */
.sap-group-header {
    text-align: center;
    font-weight: 700;
    padding: 8px 0;
    margin-top: 15px;
    margin-bottom: 5px;
    margin-left: 10px;
    margin-right: 10px;
    border-radius: 6px;
    font-size: 13px !important;
    text-transform: none !important;
    letter-spacing: 0.3px;
    color: #333 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.sap-child-item { margin-bottom: 3px !important; }
.sap-child-item > a { border-radius: 6px; margin: 0 10px; }
.sap-child-item > a i.menu-icon { color: inherit !important; }

/* HR - Flow Light Blue */
.sap-bg-hr { background-color: #e0f2fe !important; border-left: 4px solid #0284c7; color: #0c4a6e !important;}
.sap-bg-hr-item > a { background-color: rgba(224, 242, 254, 0.6) !important; color: #0369a1 !important; border-left: 3px solid transparent; }
.sap-bg-hr-item > a:hover, .sap-bg-hr-item > a:focus { background-color: #bae6fd !important; border-left: 3px solid #0284c7 !important;}

/* CRM - Mint Green */
.sap-bg-crm { background-color: #dcfce7 !important; border-left: 4px solid #16a34a; color: #14532d !important; }
.sap-bg-crm-item > a { background-color: rgba(220, 252, 231, 0.6) !important; color: #15803d !important; border-left: 3px solid transparent;}
.sap-bg-crm-item > a:hover, .sap-bg-crm-item > a:focus { background-color: #bbf7d0 !important; border-left: 3px solid #16a34a !important;}

/* Sales - Soft Indigo */
.sap-bg-sales { background-color: #e0e7ff !important; border-left: 4px solid #4f46e5; color: #312e81 !important; }
.sap-bg-sales-item > a { background-color: rgba(224, 231, 255, 0.6) !important; color: #4338ca !important; border-left: 3px solid transparent;}
.sap-bg-sales-item > a:hover, .sap-bg-sales-item > a:focus { background-color: #c7d2fe !important; border-left: 3px solid #4f46e5 !important; }

/* Projects - Pastel Rose */
.sap-bg-projects { background-color: #ffe4e6 !important; border-left: 4px solid #e11d48; color: #881337 !important;}
.sap-bg-projects-item > a { background-color: rgba(255, 228, 230, 0.5) !important; color: #be123c !important; border-left: 3px solid transparent; }
.sap-bg-projects-item > a:hover, .sap-bg-projects-item > a:focus { background-color: #fecdd3 !important; border-left: 3px solid #e11d48 !important;}

/* Finance - Warm Yellow */
.sap-bg-finance { background-color: #fef3c7 !important; border-left: 4px solid #d97706; color: #78350f !important;}
.sap-bg-finance-item > a { background-color: rgba(254, 243, 199, 0.6) !important; color: #b45309 !important; border-left: 3px solid transparent;}
.sap-bg-finance-item > a:hover, .sap-bg-finance-item > a:focus { background-color: #fde68a !important; border-left: 3px solid #d97706 !important; }

/* System - Cool Gray */
.sap-bg-system { background-color: #f1f5f9 !important; border-left: 4px solid #475569; color: #0f172a !important;}
.sap-bg-system-item > a { background-color: rgba(241, 245, 249, 0.6) !important; color: #334155 !important; border-left: 3px solid transparent;}
.sap-bg-system-item > a:hover, .sap-bg-system-item > a:focus { background-color: #e2e8f0 !important; border-left: 3px solid #475569 !important; }

/* Others - Slate */
.sap-bg-others { background-color: #f8fafc !important; border-left: 4px solid #94a3b8; color: #1e293b !important;}
.sap-bg-others-item > a { background-color: rgba(248, 250, 252, 0.6) !important; color: #475569 !important; border-left: 3px solid transparent;}
.sap-bg-others-item > a:hover, .sap-bg-others-item > a:focus { background-color: #f1f5f9 !important; border-left: 3px solid #94a3b8 !important; }

#side-menu .sap-child-item ul.nav-second-level {
    background: transparent !important;
}
#side-menu .sap-child-item ul.nav-second-level li a {
    color: inherit;
    opacity: 0.9;
}

/* Premium Dark Navy Header Customization (Global) */
#header {
  background-color: #17253f !important; /* Xanh đen sáng hơn một chút */
  border-bottom: 1px solid #24375b !important;
}
#header, 
#header a, 
#header button, 
#header i, 
#header svg, 
#header .tw-text-neutral-600, 
#header .tw-text-neutral-500, 
#header .tw-text-neutral-400,
#header .settings,
#header .settings i,
#header .logout,
#header .logout i,
#header #logo a,
#header #logo span {
  color: #e2e8f0 !important;
}
#header a:hover, 
#header button:hover, 
#header a:focus, 
#header button:focus,
#header .hide-menu:hover,
#header .mobile-menu-toggle:hover {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.08) !important;
}
#header #search_input {
  background-color: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
#header #search_input::placeholder {
  color: #94a3b8 !important;
}
#header .tw-bg-primary-600 {
  background-color: #2563eb !important;
}
#header .tw-bg-primary-600 i {
  color: #ffffff !important;
}

/* Custom Sidebar Width & Indent Adjustment to prevent subtabs text wrapping */
.sidebar {
  width: 280px !important;
}
#wrapper {
  margin-left: 280px !important;
}

/* Sidebar Toggle & Responsive Shift Adjustments for 280px Width */
body.hide-sidebar:not(.show-sidebar) #menu {
  margin-left: -280px !important;
}
body.page-small #menu {
  margin-left: -280px !important;
}
body.page-small.show-sidebar #wrapper {
  margin-left: 280px !important;
}

/* RTL Layout Compatibility for 280px Width */
[dir="rtl"] #wrapper {
  margin-right: 280px !important;
  margin-left: 0 !important;
}
[dir="rtl"] body.hide-sidebar:not(.show-sidebar) .sidebar {
  margin-right: -280px !important;
  margin-left: auto !important;
}
[dir="rtl"] body.page-small .sidebar {
  margin-right: -280px !important;
  margin-left: auto !important;
}
[dir="rtl"] body.page-small.show-sidebar #wrapper {
  margin-right: 280px !important;
  margin-left: 0 !important;
}

/* Subtab (Secondary Navigation) Styling Adjustments */
#side-menu .sap-child-item ul.nav-second-level li a,
.sidebar ul.nav li .nav-second-level li a {
  padding: 6px 10px 6px 36px !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Slightly adjust spacing for nested subtab icons */
#side-menu .sap-child-item ul.nav-second-level li a i.menu-icon,
.sidebar ul.nav li .nav-second-level li a i.menu-icon {
  margin-right: 8px !important;
}


/* ============================================ */
/*  Sidebar Menu — Premium Dark Theme           */
/* ============================================ */

/* --- Active Parent: glow left border + tinted bg --- */
#side-menu > li.active > a:first-child {
  border-left: 3px solid #60a5fa !important;
  background: rgba(96, 165, 250, 0.12) !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  box-shadow: inset 3px 0 0 #60a5fa, 0 1px 3px rgba(0,0,0,0.1) !important;
}

/* --- Hover Parent: subtle light up --- */
#side-menu > li:not(.active) > a:first-child:hover {
  background: rgba(255, 255, 255, 0.06) !important;
  border-radius: 8px !important;
}

/* --- Active Submenu: pill highlight + dot --- */
#side-menu li .nav-second-level li.active > a {
  background: rgba(96, 165, 250, 0.1) !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
  position: relative !important;
}
#side-menu li .nav-second-level li.active > a::before {
  content: "" !important;
  position: absolute !important;
  left: 22px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 6px !important;
  height: 6px !important;
  background: #60a5fa !important;
  border-radius: 50% !important;
  box-shadow: 0 0 6px rgba(96, 165, 250, 0.5) !important;
}

/* --- Hover Submenu: gentle highlight --- */
#side-menu li .nav-second-level li:not(.active) > a:hover {
  background: rgba(255, 255, 255, 0.04) !important;
  border-radius: 6px !important;
}

/* --- Smooth transitions (only safe properties) --- */
#side-menu > li > a,
#side-menu li .nav-second-level li > a {
  transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* --- Group header polish --- */
.sap-group-header {
  opacity: 0.7;
  letter-spacing: 0.5px !important;
  font-size: 12px !important;
  text-transform: none !important;
}
#side-menu li.sap-group-header,
.sidebar ul.nav li.sap-group-header,
#menu .sap-group-header,
li.sap-group-header {
  text-transform: none !important;
}

/* TopCV Badge */
.topcv-badge { display:inline-block; background:#00b14f; color:#fff; font-size:10px; padding:2px 8px; border-radius:4px; font-weight:600; margin-left:6px; vertical-align:middle; }
.topcv-badge i { margin-right:3px; }
