/*
 * Copyright OpenSearch Contributors
 * SPDX-License-Identifier: Apache-2.0
 */

//
// LAYOUT
//

$vis-editor-sidebar-min-width: 350px;

.visEditorSidebar {
  min-width: $vis-editor-sidebar-min-width;

  // a hack for IE, issue: https://github.com/elastic/kibana/issues/66586
  >.visEditorSidebar__formWrapper {
    flex-basis: auto;
  }
}

.visEditorSidebar__form {
  @include flex-parent(1, 1, auto);
  max-width: 100%;
}

.visEditorSidebar__config {
  @include euiYScrollWithShadows;
  padding: $euiSizeS;
  overflow-y: auto;
  height: calc(100vh - 398px);
}

.visEditorSidebar__config-isHidden {
  display: none;
}

//
// NAVIGATION
//

.visEditorSidebar__titleContainer {
  padding: $euiSizeS $euiSizeXL $euiSizeS $euiSizeS; // Extra padding on the right for the collapse button
}

.visEditorSidebar__indexPatternPlaceholder {
  min-height: $euiSizeXXL;
  border-bottom: $euiBorderThin;
}

.visEditorSidebar__nav,
.visEditorSidebar__linkedSearch {
  flex-grow: 0;
}

//
// SECTIONS
//

.visEditorSidebar__section {
  background-color: $euiColorEmptyShade;
  padding: $euiSizeS;
  border-radius: $euiBorderRadius;

  +.visEditorSidebar__section {
    margin-top: $euiSizeS;
  }
}

// Collapsible section

.visEditorSidebar__collapsible {
  background-color: lightOrDarkTheme($euiPageBackgroundColor, $euiColorLightestShade);
}

.visEditorSidebar__collapsible--marginBottom {
  margin-bottom: $euiSizeM;
}

//
// FORMS
//

.visEditorSidebar__formRow {
  display: flex;
  align-items: center;
  margin-top: $euiSizeM;
}

.visEditorSidebar__formLabel {
  display: flex;
  align-items: center;
  flex: 1 1 40%;
  padding-right: $euiSizeXS;
}

.visEditorSidebar__formControl {
  display: flex;
  align-items: center;
  flex: 1 1 60%;
}

.visEditorSidebar__aggGroupAccordionButtonContent {
  font-size: $euiFontSizeS;

  span {
    color: $euiColorDarkShade;
  }
}

.visEditorSidebar__controls {
  border-top: $euiBorderThin;
  padding: $euiSizeS;
  display: flex;
  justify-content: flex-end;
  align-items: center;

  .visEditorSidebar__autoApplyButton {
    margin-left: $euiSizeM;
  }
}

.euiComboBoxOptionsList__rowWrap {
  max-height: 250px;
}

.euiComboBoxOptionsList__rowWrap>div {
  height: 250px !important;
}

.cp__rightContainer {
  display: grid;
  
  .cp__rightHeader, .cp__rightSettings {
    padding: 8px;
    background-color: transparent;
  }

  .cp__rightHeader {
    border-bottom: 1px solid #D3DAE6;
    .euiBadge {
      background: transparent;
      border: none;
      font-size: 14px;
    }
  }

  .cp__rightSettings {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
  }
}

.info-icon {
  margin-left: 7px;
  margin-top: 5px;
}

#vis__mainContent .vis__leftPanel {
  overflow-y: unset; // unset default setting
}

.panelItem_button {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-gap: $euiSizeS;
  padding: $euiSizeS $euiSizeM;
  align-items: center;
}

.field_text {
  text-overflow: ellipsis;
  overflow: hidden;
}

.panel_section {
  border-bottom: 1px solid #d3dae6;
}

.panel_title {
  display: block;
}

.panel_title:first-letter {
  text-transform: uppercase;
}

.color-theme-combo-box-option .euiFlexItem.euiFlexItem--flexGrowZero {
  display: none;
}

// dark mode
.explorer-dark {
  .panel_section, .cp__rightHeader {
    border-bottom: 1px solid $border-color-on-dark;
  }
}