/* shadcn Resizable withHandle-style navigation handles */
:root {
  --pd-resizable-handle-line: var(--border, #e4e4e7);
  --pd-resizable-handle-bg: var(--background, #ffffff);
  --pd-resizable-handle-fg: var(--muted-foreground, #71717a);
  --pd-resizable-handle-ring: color-mix(in srgb, var(--ring, #a1a1aa) 48%, transparent);
  --pd-resizable-handle-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
  --pd-resizable-grip:
    radial-gradient(circle, currentColor 1px, transparent 1.5px),
    radial-gradient(circle, currentColor 1px, transparent 1.5px);
}

.sidebar-resize-handle[data-slot="resizable-handle"],
.resize-handle[data-slot="resizable-handle"] {
  --pd-resizable-handle-size: 12px;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: var(--pd-resizable-handle-size) !important;
  min-width: var(--pd-resizable-handle-size) !important;
  border: 0 !important;
  outline: none !important;
  background: transparent !important;
  color: var(--pd-resizable-handle-fg) !important;
  cursor: col-resize !important;
  touch-action: none !important;
  user-select: none !important;
}

.sidebar-resize-handle[data-slot="resizable-handle"]::before,
.resize-handle[data-slot="resizable-handle"]::before {
  content: "" !important;
  position: absolute !important;
  inset-block: 0 !important;
  left: 50% !important;
  width: 1px !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--pd-resizable-handle-line) !important;
  opacity: 1 !important;
  transform: translateX(-50%) !important;
}

.sidebar-resize-handle[data-slot="resizable-handle"]::after,
.resize-handle[data-slot="resizable-handle"]::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  z-index: 1 !important;
  width: 12px !important;
  height: 28px !important;
  border: 1px solid var(--pd-resizable-handle-line) !important;
  border-radius: 4px !important;
  background-color: var(--pd-resizable-handle-bg) !important;
  background-image: var(--pd-resizable-grip) !important;
  background-position: 3px 5px, 7px 5px !important;
  background-size: 6px 6px, 6px 6px !important;
  background-repeat: repeat-y !important;
  box-shadow: var(--pd-resizable-handle-shadow) !important;
  opacity: 0.88 !important;
  transform: translate(-50%, -50%) !important;
}

.sidebar-resize-handle[data-slot="resizable-handle"]:hover::after,
.sidebar-resize-handle[data-slot="resizable-handle"]:focus-visible::after,
.resize-handle[data-slot="resizable-handle"]:hover::after,
.resize-handle[data-slot="resizable-handle"]:focus-visible::after,
body.sidebar-resizing .sidebar-resize-handle[data-slot="resizable-handle"]::after,
body.right-navigation-resizing .resize-handle[data-slot="resizable-handle"]::after,
.content-grid.resizing .resize-handle[data-slot="resizable-handle"]::after {
  border-color: var(--ring, #a1a1aa) !important;
  box-shadow: 0 0 0 3px var(--pd-resizable-handle-ring), var(--pd-resizable-handle-shadow) !important;
  color: var(--foreground, #18181b) !important;
  opacity: 1 !important;
}

.sidebar-resize-handle[data-slot="resizable-handle"]:focus-visible,
.resize-handle[data-slot="resizable-handle"]:focus-visible {
  outline: none !important;
}

.app-shell:not(.sidebar-collapsed) .sidebar-resize-handle[data-slot="resizable-handle"],
body[class$="-theme"] .app-shell:not(.sidebar-collapsed) .sidebar-resize-handle[data-slot="resizable-handle"] {
  position: absolute !important;
  top: 0 !important;
  right: -6px !important;
  bottom: 0 !important;
  left: auto !important;
  z-index: 3000 !important;
  display: flex !important;
  height: 100% !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.app-shell:not(.sidebar-collapsed) .sidebar-resize-handle[data-slot="resizable-handle"]::before,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed) .sidebar-resize-handle[data-slot="resizable-handle"]::before {
  inset-block: 0 !important;
  left: 50% !important;
  width: 1px !important;
  height: auto !important;
  background: var(--pd-resizable-handle-line) !important;
  opacity: 1 !important;
  transform: translateX(-50%) !important;
}

.app-shell:not(.sidebar-collapsed) .sidebar-resize-handle[data-slot="resizable-handle"]::after,
body[class$="-theme"] .app-shell:not(.sidebar-collapsed) .sidebar-resize-handle[data-slot="resizable-handle"]::after {
  top: 50% !important;
  left: 50% !important;
  width: 12px !important;
  height: 28px !important;
  background-image: var(--pd-resizable-grip) !important;
  background-position: 3px 5px, 7px 5px !important;
  background-size: 6px 6px, 6px 6px !important;
  background-repeat: repeat-y !important;
  transform: translate(-50%, -50%) !important;
}

.app-shell.sidebar-collapsed .sidebar-resize-handle[data-slot="resizable-handle"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.content-grid:not(.dashboard-mode):not(.detail-collapsed) .resize-handle[data-slot="resizable-handle"],
body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.detail-collapsed) .resize-handle[data-slot="resizable-handle"] {
  position: fixed !important;
  top: 0 !important;
  right: var(--right-drawer-push-width) !important;
  bottom: 0 !important;
  left: auto !important;
  z-index: 10055 !important;
  display: flex !important;
  width: 12px !important;
  min-width: 12px !important;
  height: 100vh !important;
  pointer-events: auto !important;
}

.content-grid:not(.dashboard-mode):not(.detail-collapsed) .resize-handle[data-slot="resizable-handle"]::before,
body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.detail-collapsed) .resize-handle[data-slot="resizable-handle"]::before {
  inset-block: 0 !important;
  left: 50% !important;
  width: 1px !important;
  height: auto !important;
  background: var(--pd-resizable-handle-line) !important;
  opacity: 1 !important;
  transform: translateX(-50%) !important;
}

.content-grid:not(.dashboard-mode):not(.detail-collapsed) .resize-handle[data-slot="resizable-handle"]::after,
body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.detail-collapsed) .resize-handle[data-slot="resizable-handle"]::after {
  top: 50% !important;
  left: 50% !important;
  width: 12px !important;
  height: 28px !important;
  background-image: var(--pd-resizable-grip) !important;
  background-position: 3px 5px, 7px 5px !important;
  background-size: 6px 6px, 6px 6px !important;
  background-repeat: repeat-y !important;
  transform: translate(-50%, -50%) !important;
}

.content-grid.dashboard-mode.global-search-mode .resize-handle[data-slot="resizable-handle"],
.content-grid.dashboard-mode.ai-decision-mode .resize-handle[data-slot="resizable-handle"] {
  display: flex !important;
  width: 12px !important;
  min-width: 12px !important;
  pointer-events: auto !important;
}

.content-grid.detail-collapsed .resize-handle[data-slot="resizable-handle"],
.content-grid.dashboard-mode.global-search-mode.detail-collapsed .resize-handle[data-slot="resizable-handle"],
.content-grid.dashboard-mode.ai-decision-mode.detail-collapsed .resize-handle[data-slot="resizable-handle"] {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  pointer-events: none !important;
}

body.sidebar-resizing,
body.sidebar-resizing *,
.content-grid.resizing,
body.right-navigation-resizing,
body.right-navigation-resizing * {
  cursor: col-resize !important;
  user-select: none !important;
}

body.dark-theme,
body.midnight-theme,
body.deep-navy-theme,
body.charcoal-theme,
body.dark-emerald-theme {
  --pd-resizable-handle-line: var(--border, #3f3f46);
  --pd-resizable-handle-bg: var(--background, #09090b);
  --pd-resizable-handle-fg: var(--muted-foreground, #a1a1aa);
  --pd-resizable-handle-shadow: 0 1px 2px rgba(0, 0, 0, 0.38);
}

/* USER FIX: Remove the right-navigation resize handle from the visible UI. */
.resize-handle.right-navigation-resize-handle-removed,
.resize-handle.right-navigation-resize-handle-removed[data-slot="resizable-handle"],
.content-grid:not(.dashboard-mode):not(.detail-collapsed) .resize-handle.right-navigation-resize-handle-removed[data-slot="resizable-handle"],
body.right-detail-drawer-open .content-grid:not(.dashboard-mode):not(.detail-collapsed) .resize-handle.right-navigation-resize-handle-removed[data-slot="resizable-handle"],
.content-grid.dashboard-mode.global-search-mode .resize-handle.right-navigation-resize-handle-removed[data-slot="resizable-handle"],
.content-grid.dashboard-mode.ai-decision-mode .resize-handle.right-navigation-resize-handle-removed[data-slot="resizable-handle"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
}

.resize-handle.right-navigation-resize-handle-removed::before,
.resize-handle.right-navigation-resize-handle-removed::after,
.resize-handle.right-navigation-resize-handle-removed[data-slot="resizable-handle"]::before,
.resize-handle.right-navigation-resize-handle-removed[data-slot="resizable-handle"]::after {
  content: none !important;
  display: none !important;
}