/* public/css/panel.css */

/* .divider */
.MondrianContainer {
  --divider-thickness: 6px;
}
.divider {
  background-color: #333333;
  z-index: 2000;
  position: relative;
}
.MondrianContainer.above > .divider {
  height: var(--divider-thickness);
  width: 100%;
  cursor: row-resize;
}
.MondrianContainer.beside > .divider {
  width: var(--divider-thickness);
  height: 100%;
  cursor: col-resize;
}
.divider::after {
  content: '';
  position: absolute;
  top: -10px;
  left: -10px;
  right: -10px;
  bottom: -10px;
}
.MondrianContainer.demo .divider {
  width: var(--divider-thickness*3);
  background-color: black;
}
.MondrianContainer.demo .MondrianPanel {
  background-color: white;
}

/* VizMenu / KbMenu dropdown content styling (not the summary/trigger) */
.PanelMenu .VizMenu .VisualizationMenuItems,
.PanelMenu .VizMenu .MenuItems {
    background-color: white;
}
.VisualizationMenuItems {
    border: 2.5px solid;
    border-color: var(--aspect-viz, lime);
}
.KbMenu .MenuItems {
    background-color: white;
    border: 2.5px solid;
    border-color: var(--aspect-kb, burlywood);
}

/* Panel internal layout - header + content stacking */
.MondrianPanel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.MondrianPanel > perspec-widget {
  flex-shrink: 0;
  z-index: 100;
}
/* Content areas fill remaining space */
.MondrianPanel > .NuBeViz,
.MondrianPanel > .GoViz,
.MondrianPanel > .LeafletViz,
.MondrianPanel > iframe {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  position: relative;
  z-index: 1;
}