.editor-pane {
  height: 100%;
  width: 100%;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  background-color: white;
  font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  border-radius: 8px;
}

/* Override any fullscreen styles from OVE that might conflict */
.editor-pane .tg-editor-fullscreen {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: 100% !important;
  height: 100% !important;
  z-index: auto !important;
}

/* Make sure the TeselaGen editor container takes full height */
.editor-pane .tg-editor-container,
.editor-pane .ve-editor-container {
  height: 100% !important;
  width: 100% !important;
  display: flex;
  flex-direction: column;
}

/* Ensure panels are properly sized within the container */
.editor-pane .tg-editor-container > div,
.editor-pane .ve-editor-container > div {
  width: 100% !important;
}

/* Force panels to stack vertically instead of horizontally */
.editor-pane .ve-panel-container {
  display: flex !important;
  flex-direction: column !important;
  height: calc(100% - 40px) !important; /* Account for menu bar */
  width: 100% !important;
}

/* Set specific heights for different panels */
.editor-pane .ve-circular-view-container {
  flex: 0 0 auto !important;
  height: 45% !important;
  min-height: 200px !important; /* Ensure a minimum size for better visibility */
  width: 100% !important;
}

.editor-pane .ve-sequence-view-container {
  flex: 1 1 auto !important;
  height: 55% !important;
  min-height: 200px !important; /* Ensure a minimum size for better visibility */
  width: 100% !important;
}

/* Properties panel should be compact */
.editor-pane .ve-properties-container {
  flex: 0 0 auto !important;
  max-height: 300px !important;
  overflow-y: auto !important;
}

/* Ensure menu bar doesn't take too much space */
.editor-pane .ve-menu-bar {
  flex-shrink: 0;
  height: auto !important;
  border-bottom: 1px solid #999 !important;
  margin-bottom: 2px;
  padding-left: 8px;
}

/* Style for the toolbar container */
.editor-pane .veToolbar-outer {
  padding: 0 8px 8px 8px;
  border-bottom: 1px solid #ddd;
  margin-bottom: 8px;
}

/* Menu bar items alignment */
.editor-pane .bp3-menu {
  padding-left: 0;
}

.editor-pane .bp3-navbar {
  padding-left: 0;
}

/* Toolbar items alignment */
.editor-pane .veToolbar {
  padding-left: 0;
}

/* Apply proper overflow handling for sequence view */
.editor-pane .ve-sequence-view {
  overflow: auto;
}

/* Make sure circular view is centered */
.editor-pane .ve-circular-view {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Fix for OVE styling issues */
.tg-menu-bar-container {
  margin-top: 0 !important;
}

.bp3-button {
  font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif !important;
}

.bp3-tab {
  font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif !important;
}

/* Map view styling */
.veMapCircle {
  stroke: #F6F8FA !important;
  fill: white !important;
}

.veCircularView text {
  font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif !important;
}

/* Linear view styling */
.veRowView {
  background-color: white !important;
}

.veRowViewAxis {
  stroke: #DFE1E6 !important;
} 