/* Warcut Phase 10.2 - real collapsible right panel deck.
   This file intentionally loads after the main stylesheet and overrides all earlier Phase 8/10 dock rules. */
html[data-phase="10-workbench-integration"] .workspace{
  grid-template-columns:94px minmax(0,1fr) clamp(420px, 28vw, 520px) !important;
}
html[data-phase="10-workbench-integration"] .dock{
  display:flex !important;
  flex-direction:column !important;
  gap:7px !important;
  grid-template-rows:none !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  min-height:0 !important;
  padding-right:5px !important;
  scrollbar-width:thin !important;
  scrollbar-color:#4a4a4a #1f1f1f !important;
}
html[data-phase="10-workbench-integration"] .dock::-webkit-scrollbar{width:9px;height:9px;}
html[data-phase="10-workbench-integration"] .dock::-webkit-scrollbar-track{background:#1f1f1f;}
html[data-phase="10-workbench-integration"] .dock::-webkit-scrollbar-thumb{background:#4a4a4a;border:2px solid #1f1f1f;border-radius:999px;}

/* Base deck panels */
html[data-phase="10-workbench-integration"] .dock .dock-panel{
  flex:0 0 auto !important;
  min-height:0 !important;
  max-height:none !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  border:1px solid #4d4d4d !important;
  background:#2a2a2a !important;
  box-shadow:none !important;
}
html[data-phase="10-workbench-integration"] .dock .dock-panel[data-deck-state="expanded"]{
  border-color:#64737b !important;
  box-shadow:0 4px 18px rgba(0,0,0,.22) !important;
}
html[data-phase="10-workbench-integration"] .dock .dock-panel[data-deck-state="collapsed"]{
  border-color:#3f3f3f !important;
}
html[data-phase="10-workbench-integration"] .dock .dock-panel[data-deck-state="solo"]{
  flex:1 1 auto !important;
  min-height:clamp(520px, 74vh, 900px) !important;
  border-color:#79dcff !important;
}
html[data-phase="10-workbench-integration"] .dock .dock-panel[data-deck-state="hidden"]{
  display:none !important;
}

/* Header is always visible and clickable. */
html[data-phase="10-workbench-integration"] .dock .dock-panel > .dock-head{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto auto !important;
  align-items:center !important;
  gap:7px !important;
  min-height:32px !important;
  padding:6px 8px !important;
  cursor:pointer !important;
  user-select:none !important;
  background:#303030 !important;
  border-bottom:1px solid #444 !important;
}
html[data-phase="10-workbench-integration"] .dock .dock-panel[data-deck-state="collapsed"] > .dock-head{
  border-bottom:0 !important;
  opacity:.94 !important;
}
html[data-phase="10-workbench-integration"] .dock .dock-panel[data-deck-state="collapsed"] > .dock-head::after{
  content:"collapsed";
  grid-column:3;
  font-size:9px;
  color:#8ebbd0;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.78;
}
html[data-phase="10-workbench-integration"] .dock .dock-panel[data-deck-state="expanded"] > .dock-head::after,
html[data-phase="10-workbench-integration"] .dock .dock-panel[data-deck-state="solo"] > .dock-head::after{
  content:"";
  display:none;
}

/* Normalize all possible header contents without depending on old injected wrappers. */
html[data-phase="10-workbench-integration"] .dock .deck-panel-title,
html[data-phase="10-workbench-integration"] .dock .dock-head-main,
html[data-phase="10-workbench-integration"] .dock .layer-tabs{
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
}
html[data-phase="10-workbench-integration"] .dock .dock-meta{
  grid-column:3 !important;
  min-width:0 !important;
  max-width:120px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  justify-self:end !important;
  margin-left:0 !important;
}
html[data-phase="10-workbench-integration"] .dock .deck-actions{
  grid-column:4 !important;
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  justify-self:end !important;
}
html[data-phase="10-workbench-integration"] .dock .deck-btn{
  width:27px !important;
  height:23px !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  border:1px solid #606060 !important;
  border-radius:5px !important;
  background:linear-gradient(180deg,#343434,#242424) !important;
  color:#bdefff !important;
  font:700 12px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}
html[data-phase="10-workbench-integration"] .dock .deck-btn:hover{
  border-color:#79dcff !important;
  color:#fff !important;
  background:linear-gradient(180deg,rgba(56,189,248,.2),rgba(56,189,248,.06)) !important;
}

/* The important part: collapsed bodies are gone. These selectors beat every previous dock-body rule. */
html[data-phase="10-workbench-integration"] .dock .dock-panel[data-deck-state="collapsed"] > .dock-body,
html[data-phase="10-workbench-integration"] .dock .dock-panel.deck-collapsed > .dock-body{
  display:none !important;
  visibility:hidden !important;
  max-height:0 !important;
  height:0 !important;
  min-height:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  pointer-events:none !important;
}
html[data-phase="10-workbench-integration"] .dock .dock-panel[data-deck-state="expanded"] > .dock-body{
  display:block !important;
  visibility:visible !important;
  height:auto !important;
  max-height:clamp(220px, 45vh, 650px) !important;
  min-height:0 !important;
  padding:8px !important;
  overflow:auto !important;
  pointer-events:auto !important;
}
html[data-phase="10-workbench-integration"] .dock .dock-panel[data-deck-state="solo"] > .dock-body{
  display:block !important;
  visibility:visible !important;
  flex:1 1 auto !important;
  height:auto !important;
  max-height:none !important;
  min-height:0 !important;
  padding:10px !important;
  overflow:auto !important;
  pointer-events:auto !important;
}
html[data-phase="10-workbench-integration"] .dock .layers-panel[data-deck-state="expanded"] > .dock-body,
html[data-phase="10-workbench-integration"] .dock .imaging-panel[data-deck-state="expanded"] > .dock-body,
html[data-phase="10-workbench-integration"] .dock .workbench-panel[data-deck-state="expanded"] > .dock-body{
  max-height:clamp(260px, 50vh, 760px) !important;
}

/* Hide previous broken controls so only the Phase 10.2 deck buttons appear. */
html[data-phase="10-workbench-integration"] .dock .dock-head-actions,
html[data-phase="10-workbench-integration"] .dock .hard-panel-actions,
html[data-phase="10-workbench-integration"] .dock [data-panel-toggle],
html[data-phase="10-workbench-integration"] .dock [data-panel-solo]{
  display:none !important;
}
