/*
 * FocalShift Ai Mission Control shell overrides.
 * Source target: Collaborate/FlowCRM app shell uses neutral zinc surfaces,
 * compact Font Awesome Light icons, subtle active fills, and bordered panels.
 */
:root {
  --fs-shell-bg: #f7fafc;
  --fs-shell-surface: #ffffff;
  --fs-shell-surface-soft: #f8fafc;
  --fs-shell-border: #cbd5e1;
  --fs-shell-border-soft: #e6e8ef;
  --fs-shell-text: #0f172a;
  --fs-shell-muted: #64748b;
  --fs-shell-accent: #4f46e5;
  --fs-shell-accent-rgb: 79, 70, 229;
  --sidebar-bg: var(--fs-shell-surface);
  --sidebar-border: var(--fs-shell-border-soft);
  --sidebar-menu-active-item: var(--fs-shell-text);
  --sidebar-icon-active-item: var(--fs-shell-accent);
  --sidebar-icon-active-bg: rgba(var(--fs-shell-accent-rgb), 0.08);
  --topbar-bg: var(--fs-shell-bg);
}

body,
.page-wrapper,
.navbar-header {
  background: var(--fs-shell-bg) !important;
}

.navbar-header {
  padding-top: 16px !important;
  backdrop-filter: blur(16px);
}

.navbar-header .topbar-menu {
  border-color: var(--fs-shell-border-soft) !important;
  padding-bottom: 16px !important;
}

.topbar-link,
.navbar-header .topbar-link,
.topbar-menu .sidenav-toggle-btn.topbar-link {
  width: 38px !important;
  height: 38px !important;
  border-radius: 12px !important;
  color: var(--fs-shell-text) !important;
}

.topbar-menu .topbar-link {
  background: var(--fs-shell-surface) !important;
  border-color: var(--fs-shell-border-soft) !important;
}

.sidebar-twocol.sidebar {
  background: var(--fs-shell-surface) !important;
  border-color: var(--fs-shell-border-soft) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

.sidebar-twocol .twocol-mini {
  border-color: var(--fs-shell-border-soft) !important;
}

.sidebar-twocol.sidebar .sidebar-left {
  width: 70px !important;
  padding: 14px 12px !important;
}

.sidebar-twocol.sidebar .sidebar-left ul {
  padding-block: 6px !important;
}

.sidebar-twocol.sidebar .sidebar-left ul li {
  margin-bottom: 4px !important;
}

.sidebar-twocol.sidebar .sidebar-left ul li a,
.sidebar-profile a {
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: var(--fs-shell-text) !important;
  font-size: 15px !important;
  line-height: 1 !important;
  overflow: visible !important;
}

.sidebar-twocol.sidebar .sidebar-left ul li a.active {
  padding: 0 !important;
  overflow: visible !important;
}

.sidebar-twocol.sidebar .sidebar-left ul li a.active::before {
  content: none !important;
  display: none !important;
  background: transparent !important;
  background-image: none !important;
  animation: none !important;
}

.sidebar-twocol.sidebar .sidebar-left ul li a .sidebar-icon,
.sidebar-profile a {
  width: 100% !important;
  height: 100% !important;
  border: 1px solid transparent !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: var(--fs-shell-text) !important;
}

.sidebar-twocol.sidebar .sidebar-left ul li a .sidebar-icon i,
.sidebar-profile a i {
  font-size: 16px !important;
  line-height: 1 !important;
}

.sidebar-twocol.sidebar .sidebar-left ul li a.active .sidebar-icon,
.sidebar-twocol.sidebar .sidebar-left ul li a .sidebar-icon:hover,
.sidebar-profile a:hover {
  border-color: rgba(var(--fs-shell-accent-rgb), 0.18) !important;
  background: rgba(var(--fs-shell-accent-rgb), 0.08) !important;
  color: var(--fs-shell-accent) !important;
}

.sidebar-twocol.sidebar .sidebar-right {
  width: 228px !important;
  padding: 16px 12px !important;
  background: var(--fs-shell-surface) !important;
}

.sidebar-twocol.sidebar .sidebar-right .sidebar-logo {
  margin-bottom: 22px !important;
}

.sidebar-twocol.sidebar .sidebar-right .menu-title {
  margin-bottom: 8px !important;
  color: var(--fs-shell-muted) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
}

.sidebar-twocol.sidebar .sidebar-right ul li {
  margin-bottom: 2px !important;
}

.sidebar-twocol.sidebar .sidebar-right .tab-item ul > li > a {
  min-height: 40px !important;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  padding: 9px 12px !important;
  color: #334155 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

.sidebar-twocol.sidebar .sidebar-right .tab-item ul > li > a i {
  color: #475569 !important;
  font-size: 16px !important;
}

.sidebar-twocol.sidebar .sidebar-right .tab-item ul > li > a:hover {
  border-color: rgba(var(--fs-shell-accent-rgb), 0.14) !important;
  background: rgba(var(--fs-shell-accent-rgb), 0.07) !important;
  color: var(--fs-shell-text) !important;
}

.sidebar-twocol.sidebar .sidebar-right ul li a.active {
  border-color: rgba(var(--fs-shell-accent-rgb), 0.18) !important;
  background: rgba(var(--fs-shell-accent-rgb), 0.1) !important;
  background-image: none !important;
  box-shadow: inset 3px 0 0 var(--fs-shell-accent) !important;
  color: var(--fs-shell-text) !important;
}

.sidebar-twocol.sidebar .sidebar-right ul li a.active span,
.sidebar-twocol.sidebar .sidebar-right ul li a.active:hover,
.sidebar-twocol.sidebar .sidebar-right ul li a.active:hover span {
  color: var(--fs-shell-text) !important;
}

.sidebar-twocol.sidebar .sidebar-right ul li a.active i {
  color: var(--fs-shell-accent) !important;
}

.sidebar-twocol.sidebar .sidebar-footer {
  border-color: var(--fs-shell-border-soft) !important;
  background: var(--fs-shell-surface) !important;
  box-shadow: 0 18px 45px -36px rgba(15, 23, 42, 0.35);
}

.sidebar-twocol.sidebar .sidebar-footer > img {
  opacity: 0.35 !important;
}

[data-theme="dark"] {
  --fs-shell-bg: #0c1320;
  --fs-shell-surface: #101827;
  --fs-shell-surface-soft: #121d2f;
  --fs-shell-surface-muted: #0f1726;
  --fs-shell-border: rgba(148, 163, 184, 0.12);
  --fs-shell-border-soft: rgba(148, 163, 184, 0.075);
  --fs-shell-text: #eef4ff;
  --fs-shell-muted: #b7c3d7;
  --fs-shell-accent: #a5b4fc;
  --fs-shell-accent-rgb: 165, 180, 252;
  --topbar-input-bg: rgba(16, 24, 39, 0.78);
  --topbar-input-border: rgba(148, 163, 184, 0.14);
  --topbar-item-bg: rgba(16, 24, 39, 0.78);
  --topbar-item-border: rgba(148, 163, 184, 0.14);
  --topbar-item-active-bg: rgba(18, 29, 47, 0.84);
  --topbar-bg: var(--fs-shell-bg);
}

[data-theme="dark"] body,
[data-theme="dark"] .main-wrapper,
[data-theme="dark"] .page-wrapper,
[data-theme="dark"] .navbar-header {
  background: var(--fs-shell-bg) !important;
}

[data-theme="dark"] .page-wrapper > .p-6,
[data-theme="dark"] .page-wrapper.flex-col > .p-6 {
  background: transparent !important;
}

[data-theme="dark"] .navbar-header .topbar-menu,
[data-theme="dark"] .sidebar-twocol.sidebar,
[data-theme="dark"] .sidebar-twocol .twocol-mini {
  border-color: var(--fs-shell-border-soft) !important;
}

[data-theme="dark"] .navbar-header .bg-white,
[data-theme="dark"] .navbar-header .bg-light,
[data-theme="dark"] .navbar-header .hs-dropdown-menu,
[data-theme="dark"] .topbar-menu .bg-white,
[data-theme="dark"] .topbar-menu .bg-light {
  background: linear-gradient(180deg, rgba(18, 29, 47, 0.84), rgba(16, 24, 39, 0.78)) !important;
  color: var(--fs-shell-text) !important;
  box-shadow: 0 18px 48px rgba(2, 6, 23, 0.24) !important;
}

[data-theme="dark"] .navbar-header .border-border-color,
[data-theme="dark"] .topbar-menu .border-border-color,
[data-theme="dark"] .navbar-header .hs-dropdown-menu {
  border-color: rgba(148, 163, 184, 0.10) !important;
}

[data-theme="dark"] .sidebar-twocol.sidebar,
[data-theme="dark"] .sidebar-twocol.sidebar .sidebar-right,
[data-theme="dark"] .sidebar-twocol.sidebar .sidebar-footer {
  background: rgba(16, 24, 39, 0.94) !important;
}

[data-theme="dark"] .sidebar-twocol.sidebar .sidebar-right .menu-title {
  color: #aab7cc !important;
}

[data-theme="dark"] .sidebar-twocol.sidebar .sidebar-right .tab-item ul > li > a {
  color: #d5deeb !important;
  opacity: 1 !important;
}

[data-theme="dark"] .sidebar-twocol.sidebar .sidebar-right .tab-item ul > li > a i {
  color: #b6c2d6 !important;
  opacity: 1 !important;
}

[data-theme="dark"] .sidebar-twocol.sidebar .sidebar-right ul li a.active,
[data-theme="dark"] .sidebar-twocol.sidebar .sidebar-right .tab-item ul > li > a:hover {
  border-color: rgba(var(--fs-shell-accent-rgb), 0.20) !important;
  background: rgba(var(--fs-shell-accent-rgb), 0.10) !important;
  color: #f8fafc !important;
}

[data-theme="dark"] .sidebar-twocol.sidebar .sidebar-right ul li a.active i {
  color: #c4b5fd !important;
}

[data-theme="dark"] .page-wrapper .bg-white,
[data-theme="dark"] .page-wrapper .bg-light,
[data-theme="dark"] .page-wrapper .dark\:bg-dark-card {
  background: linear-gradient(180deg, rgba(18, 29, 47, 0.74), rgba(16, 24, 39, 0.68)) !important;
  border-color: var(--fs-shell-border-soft) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.018) !important;
}

[data-theme="dark"] .page-wrapper .bg-white\/80,
[data-theme="dark"] .page-wrapper .bg-white\/90,
[data-theme="dark"] .page-wrapper .bg-white\/95,
[data-theme="dark"] .page-wrapper [class*="bg-white/"] {
  background-color: rgba(18, 29, 47, 0.62) !important;
  border-color: var(--fs-shell-border-soft) !important;
}

[data-theme="dark"] .page-wrapper .border,
[data-theme="dark"] .page-wrapper .border-border-color,
[data-theme="dark"] .page-wrapper .divide-border-color > :not([hidden]) ~ :not([hidden]) {
  border-color: var(--fs-shell-border-soft) !important;
}

[data-theme="dark"] .page-wrapper .shadow,
[data-theme="dark"] .page-wrapper .shadow-sm,
[data-theme="dark"] .page-wrapper .shadow-lg,
[data-theme="dark"] .page-wrapper .shadow-xl,
[data-theme="dark"] .page-wrapper .shadow-2xl {
  box-shadow: 0 18px 48px rgba(2, 6, 23, 0.18) !important;
}

[data-theme="dark"] .page-wrapper table,
[data-theme="dark"] .page-wrapper thead,
[data-theme="dark"] .page-wrapper tbody,
[data-theme="dark"] .page-wrapper tr,
[data-theme="dark"] .page-wrapper td,
[data-theme="dark"] .page-wrapper th {
  background-color: transparent !important;
  border-color: var(--fs-shell-border-soft) !important;
}

[data-theme="dark"] .page-wrapper .rounded-lg,
[data-theme="dark"] .page-wrapper .rounded-xl,
[data-theme="dark"] .page-wrapper .rounded-2xl {
  border-color: var(--fs-shell-border-soft);
}

[data-theme="dark"] .page-wrapper .text-gray-900,
[data-theme="dark"] .page-wrapper .text-gray-800,
[data-theme="dark"] .page-wrapper .text-dark {
  color: #e5e7eb !important;
}

[data-theme="dark"] .page-wrapper .text-default,
[data-theme="dark"] .page-wrapper .text-gray-700,
[data-theme="dark"] .page-wrapper .text-gray-600,
[data-theme="dark"] .page-wrapper p,
[data-theme="dark"] .page-wrapper td {
  color: #b6c2d5 !important;
}

[data-theme="dark"] .page-wrapper input,
[data-theme="dark"] .page-wrapper select,
[data-theme="dark"] .page-wrapper textarea,
[data-theme="dark"] .page-wrapper .form-control,
[data-theme="dark"] .page-wrapper .form-input {
  background: rgba(11, 18, 32, 0.72) !important;
  border-color: rgba(148, 163, 184, 0.16) !important;
  color: #e5e7eb !important;
}

[data-theme="dark"] .page-wrapper input::placeholder,
[data-theme="dark"] .page-wrapper textarea::placeholder {
  color: #8090a9 !important;
}
