/* (c) 2017-2018 The Shodor Education Foundation, Inc. All rights reserved. */

/* Selectors are arranged alphabetically. */
#agent-attrs-window .agent-attr-box,
#sim-props-window .sim-prop-box {
  padding: 15px;
}

#agent-attrs-window .agent-attr-input,
#sim-props-window .sim-prop-input {
  display: inline-block;
  margin-left: 15px;
  margin-right: 15px;
}

#agent-attrs-window .agent-attr-name-box,
#sim-props-window .sim-prop-name-box {
  display: inline-block;
}

#agent-attrs-window,
#sim-props-window {
  position: absolute;
  background-color: white;
  border: 1px solid black;
  z-index: 9999;
}

#agent-attrs-window .window-header,
.gui-window .window-header,
#sim-props-window .window-header {
  text-align: center;
  background-color: lightgray;
  cursor: move;
  /* Disable text highlighting --
    See https://tinyurl.com/no-text-highlighting-20180227 */
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
   -khtml-user-select: none; /* Konqueror HTML */
     -moz-user-select: none; /* Firefox */
      -ms-user-select: none; /* Internet Explorer/Edge */
          user-select: none; /* Non-prefixed version, currently
                                supported by Chrome and Opera */
}

#agent-model-gui-container .agent-box {
  position: absolute;
  cursor: pointer;
}

#agent-model-gui-container .agent-name-box {
  margin-bottom: 5px;
}

#agent-model-gui-container .color-box {
  width: 32px;
  height: 32px;
}

#agent-model-gui-container .gui-world {
  position: relative;
  display: inline-block;
  border: 1px solid black;
}

#agent-model-gui-container .mai-box {
  border: 5px solid rgba(0, 0, 255, 0.5);
  pointer-events: none;
  position: absolute;
  z-index: 9998;
}

#agent-model-gui-container .shape-box {
  margin-bottom: 10px;
  cursor: pointer;
}

#agent-model-gui-container .shape-box > * {
  display: inline-block;
  margin-right: 5px;
  vertical-align: middle;
}

#agent-model-gui-container .shape-box.selected {
  background-color: lightgray;
  margin: -2px -2px 8px -2px;
  border: 2px solid black;
  cursor: pointer;
}

#agent-model-gui-container .shape-list {
  display: inline-block;
  margin-right: 5px;
  vertical-align: top;
}

#agent-model-gui-container .shape-list-heading {
  font-weight: bold;
  font-size: 1.25em;
  margin-bottom: 10px;
}

#agent-model-gui-container .slider-handle {
  background-color: white;
  border: 1px solid black;
  cursor: pointer;
  height: 16px;
  left: 0;
  padding: 5px;
  position: absolute;
  top: -7px;
  width: 16px;
}

#agent-model-gui-container .slider-track {
  border: 1px solid black;
  display: inline-block;
  height: 5px;
  margin: 10px;
  padding: 5px;
  position: relative;
  width: 90px;
}

#agent-model-gui-container .top-bar-btn {
  border: 1px solid black;
  cursor: pointer;
  display: inline-block;
  height: 16px;
  margin: 5px;
  padding: 5px;
  width: 16px;
}

#agent-model-gui-container .top-bar-btn.selected {
  background-color: gray;
}

#agent-model-gui-container .world-cell {
  position: absolute;
  border: 1px solid gray;
  cursor: pointer;
}

.gui-window {
  position: absolute;
  width: 300px;
  height: 300px;
  background-color: white;
  border: 1px solid black;
  z-index: 9999;
}

.gui-window .window-hide-btn {
  float: right;
  border: 1px solid black;
  cursor: pointer;
  height: 10px;
  padding: 2px;
  width: 10px;
}

.selected-agent {
  background-image: url("icons/selected-agent.png");
  background-size: contain;
}