:root {
  --primary: #ff5722;
  --primary-dark: #e64a19;
  --sidebar-bg: #1a1a2e;
  --sidebar-text: #e2e8f0;
  --sidebar-text-muted: #94a3b8;
  --sidebar-icon: #cbd5e1;
  --sidebar-active: #ff9800;
  --sidebar-hover-bg: rgba(255, 255, 255, 0.07);
  --accent: #e91e63;
  --bg-main: #f5f6fa;
  --text-main: #2d2d2d;
  --card-bg: #ffffff;
  --border: #e2e8f0;
}

.btn-primary,
.bg-primary {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
}

.text-primary {
  color: var(--primary) !important;
}

a.text-primary:hover {
  color: var(--primary-dark) !important;
}

/*
 * Main vertical sidebar only — do NOT target .sidebar-horizontal (header),
 * or those menus get a dark background with dark text.
 */
#sidebar.sidebar {
  background-color: var(--sidebar-bg) !important;
  border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
}

@media (max-width: 991.98px) {
  #sidebar.sidebar {
    background: var(--sidebar-bg) !important;
  }
}

/* Menu text & icons on dark background */
#sidebar .sidebar-menu > ul > li > a,
#sidebar .sidebar-menu > ul > li > a span {
  color: var(--sidebar-text) !important;
}

#sidebar .sidebar-menu > ul > li > a svg,
#sidebar .sidebar-menu > ul > li > a i,
#sidebar .sidebar-menu > ul > li > a .ti {
  color: var(--sidebar-icon) !important;
}

#sidebar .sidebar-menu > ul > li ul li a,
#sidebar .sidebar-menu > ul > li ul li a span {
  color: var(--sidebar-text-muted) !important;
}

#sidebar .sidebar-menu > ul > li ul li a i {
  color: var(--sidebar-icon) !important;
}

#sidebar .sidebar-menu > ul li.menu-title {
  color: var(--sidebar-text-muted) !important;
}

#sidebar .sidebar-menu > ul li.menu-title span {
  color: inherit !important;
}

#sidebar .sidebar-menu > ul li .submenu > ul li a {
  color: var(--sidebar-text-muted) !important;
}

#sidebar .sidebar-menu > ul > li > ul > li > a:hover,
#sidebar .sidebar-menu > ul > li > ul > li.submenu > a:hover {
  background: var(--sidebar-hover-bg) !important;
}

#sidebar .sidebar-menu > ul > li > ul > li > a:hover span,
#sidebar .sidebar-menu > ul > li > ul > li > a:hover {
  color: var(--sidebar-text) !important;
}

#sidebar .sidebar-menu > ul li .submenu > a.subdrop,
#sidebar .sidebar-menu > ul li .submenu > a.active {
  background: var(--sidebar-hover-bg) !important;
}

#sidebar .sidebar-menu > ul li .submenu > a.subdrop i,
#sidebar .sidebar-menu > ul li .submenu > a.active i {
  color: var(--sidebar-text) !important;
}

#sidebar .sidebar-menu > ul > li > a.active,
#sidebar .sidebar-menu > ul > li.active > a {
  background: rgba(255, 152, 0, 0.15) !important;
  color: var(--sidebar-active) !important;
}

#sidebar .sidebar-menu > ul > li > a.active span,
#sidebar .sidebar-menu > ul > li.active > a span {
  color: var(--sidebar-active) !important;
}

#sidebar .sidebar-menu > ul > li > a.active svg,
#sidebar .sidebar-menu > ul > li > a.active i,
#sidebar .sidebar-menu > ul > li.active > a svg {
  color: var(--sidebar-active) !important;
}

#sidebar .sidebar-menu > ul > li ul li a.active {
  color: var(--primary) !important;
}

#sidebar .sidebar-menu > ul > li ul li a.active span {
  color: var(--primary) !important;
}

#sidebar .sidebar-menu > ul > li ul > li.active > a,
#sidebar .sidebar-menu > ul > li ul > li.active > a.subdrop {
  background: rgba(255, 152, 0, 0.12) !important;
  color: var(--sidebar-active) !important;
}

#sidebar .sidebar-menu > ul > li ul > li.active > a span {
  color: var(--sidebar-active) !important;
}

#sidebar .sidebar-menu > ul li .submenu > ul li a:hover,
#sidebar .sidebar-menu > ul li .submenu > ul li a.active {
  color: var(--primary) !important;
}

#sidebar .sidebar-menu .menu-arrow::before {
  border-color: var(--sidebar-icon) !important;
}

#sidebar .sidebar-menu > ul > li > a.active .menu-arrow::before,
#sidebar .sidebar-menu > ul li .submenu.submenu-two a.subdrop .menu-arrow::before,
#sidebar .sidebar-menu > ul li .submenu.submenu-two a.active .menu-arrow::before {
  border-color: var(--sidebar-active) !important;
}

#sidebar .sidebar-profile,
#sidebar .sidebar-profile-info,
#sidebar .sidebar-header {
  color: var(--sidebar-text) !important;
}

#sidebar .sidebar-profile .text-muted,
#sidebar .sidebar-header .text-muted {
  color: var(--sidebar-text-muted) !important;
}

/* Stacked / two-column sidebars when those layouts are active */
#two-col-sidebar .sidebar .sidebar-menu a,
#two-col-sidebar .sidebar .sidebar-menu span,
#stacked-sidebar .sidebar .sidebar-menu a,
#stacked-sidebar .sidebar .sidebar-menu span {
  color: var(--sidebar-text) !important;
}

#two-col-sidebar .sidebar,
#stacked-sidebar .sidebar {
  background-color: var(--sidebar-bg) !important;
}

/* TechHiveHR brand logo (replaces legacy SVG marks; PNG is wider) */
.header .header-left .logo img,
.header .header-left .dark-logo img,
.sidebar .sidebar-logo .logo img,
.sidebar .sidebar-logo .dark-logo img {
  max-height: 40px;
  width: auto;
  max-width: 180px;
  object-fit: contain;
  border-radius: 6px;
}

.logo-small img {
  max-height: 34px;
  width: auto;
  max-width: 140px;
  object-fit: contain;
  border-radius: 4px;
}

.menu-horizontal .header .header-left .logo img,
.menu-horizontal .header .header-left .dark-logo img {
  max-height: 36px;
  max-width: 200px;
}

.techhive-brand-login-logo {
  max-width: 240px;
  border-radius: 8px;
}

/* Current company / tenant — badge in dedicated strip (not inside .sidebar-logo: fixed 50px box) */
#sidebar.sidebar .sidebar-tenant-strip {
  position: fixed;
  top: 66px;
  left: 0;
  width: 252px;
  z-index: 1042;
  padding: 6px 12px 10px;
  box-sizing: border-box;
  background-color: var(--sidebar-bg) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* Push menu below logo (66px) + tenant strip (~52px) — default theme margin only clears logo */
#sidebar.sidebar:has(.sidebar-tenant-strip) .sidebar-menu {
  margin-top: 124px !important;
}

@media (max-width: 991.98px) {
  #sidebar.sidebar .sidebar-tenant-strip {
    display: none;
  }

  #sidebar.sidebar:has(.sidebar-tenant-strip) .sidebar-menu {
    margin-top: 66px !important;
  }
}

.mini-sidebar .sidebar#sidebar .sidebar-tenant-strip {
  width: 72px;
  padding-left: 8px;
  padding-right: 8px;
}

.mini-sidebar .sidebar#sidebar:has(.sidebar-tenant-strip) .sidebar-menu {
  margin-top: 124px !important;
}

.expand-menu.mini-sidebar .sidebar#sidebar .sidebar-tenant-strip {
  width: 252px;
}

#sidebar .sidebar-tenant-badge {
  display: inline-block;
  width: 100%;
  max-width: 100%;
  padding: 0.5rem 0.75rem;
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.01em;
  text-align: center;
  color: #fff !important;
  background: linear-gradient(180deg, var(--primary) 0%, var(--primary-dark) 100%) !important;
  border-radius: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.35);
  box-shadow:
    0 2px 12px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  word-break: break-word;
}

#sidebar .sidebar-tenant-strip .sidebar-tenant-badge {
  margin-top: 0;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#sidebar .sidebar-tenant-badge--inline {
  width: auto;
  max-width: 100%;
  padding: 0.3rem 0.55rem;
  font-size: 0.6875rem;
  font-weight: 600;
  text-align: center;
  vertical-align: middle;
}