@import "../../variables";

.layerControlPanel--show {
  pointer-events: auto;
  width: $euiSizeL * 11;

  .layerControlPanel__title {
    padding: $euiSizeM $euiSizeM
  }

  .layerControlPanel__selected {
    background-color: $euiColorLightShade;
  }

  .layerControlPanel__layerFunctionButton {
    height: $euiSizeL;
    width: $euiSizeL;
  }

  .layerControlPanel__layerTypeIcon {
    padding-left: $euiSizeM;
  }

  .euiListGroupItem__label {
    width: $euiSizeL * 6;
  }

  .euiDroppable {
    overflow-y: auto;
    overflow-x: hidden;
  }

  .euiFlexGroup--directionColumn {
    max-height: calc(100vh - #{$mapHeaderOffset} - #{$euiSizeL});
  }
}

.layerControlPanel--hide {
  pointer-events: auto;

  .layerControlPanel__visButton {
    background-color: $euiColorEmptyShade;
    color: $euiTextColor;
    border-color: $euiColorLightShade;
  }
}