/*
 * Style for things relevant to the widget/interface editor
 */

.editor-overlay {
  z-index: 50;
}

.editor-overlay.selected {
  z-index: 55;
}

.netlogo-toggle-text {
  font-size:   14px;
  margin-top:   3px;
  user-select: none;
  -moz-user-select: none;
}

.netlogo-toggle-container {
  align-items:    center;
  color:          #4f4f4f;
  display:        flex;
  flex-direction: row;
  flex:           none;
  width:          auto;
  margin:         0px 10px;
}

.netlogo-toggle-container.enabled:hover {
  color:  #000000;
  cursor: pointer;
}

.netlogo-interface-unlocker {
  height: 20px;
  margin: auto 0;
  outline: none;
  width: 20px;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAADu0lEQVR4Xu1b0VHcMBDddQMhFeRSQUgFOTo4KgiW+A+pAKgg8I+sUAGXCnJXQUgFuXRAGvBmlhGZA05aS9YZz0WaYRjGsqx92n270hMIAzVr7T4AfGjbdoqIEwDgv9fbLRGtqqpaAMCyruvbIaaG2/yItXYPAD4R0REAsNExbYWIXwHgsq7ru5gXY/puDQBr7SkRnQAAg9Cn3SHiRV3X530G8b2bHQB2dSK6SVhxyT72iMPcoZEVAGPMESJayZI+z4mo1lpzaGRp2QBwLn+WZVbCIIh4lisksgAwxMo/xSSXJ/QG4OrqalZVFcd8p0ZEvxFxTkTM7Cv+jYj7iLhHRDNEfNNpIABo2/bw+Ph43rX/pn69AOA0R0S/OjL9EhFPJBJzJHrBNUMHwxi8t33SZC8AjDE3iDgLTZSI/lRVNavrmguczs1aO23bdo6Ir4Tx51rrw84DP+mYDABPkIi+C5P7WVXVNHWF2MPatl0g4rvQdxDxIBbgh/GSAWiaho2f+iZGRL2Mfxi3IwgLpdRBihckAWCtnbjY3/hN5/a88lnqeeYF5wnecHBcsIoFIQkAY8wJIn4JrP651jprTWCMOUPE08A3P2utmTyjWhIATdMwoW1kabf6k9S4983ehQKXwz4vWCqlvCHpGzcVAArAfK2U4t1f9tY0DZfAH30DK6Wi7Yl+weXpH75J5ChOfGNLRRcivo/lnRQAgukPEV/ndv+1jBAk35R0mB2AFDeMiZWmabzhNwgAUgZ4SQCIKDoTRHuAlI5eGIDo9FsAiIk/7ls8QKjISggkFCMxXhjKAkRUOCB2D1JIMMb9/ksSdCe+6xsQlrhCMlfU0VfsAoQOYfiQ1f3cD0tE15KGIIaAlPYSDBjslS6kWACQlqN4gFD4SAC+5PMSAh0Ko8IBkosWDtgeB1wS0b1uwOIoX6WRFiP2+Sg5gNVhpxU+Ek2c+MFaYGd1WAJklACEzu266I2S0evPRwcA64Va66fX4x7ZZIxh8SOLF4wOAAD4ppQKyukh1Slm9d1eQDwfGDoNivLVrgPAjO8VTiTVeRc8gLeo3hsd0p2DnQDAGfFMQJWEz1jjx8oBDwcVz8hpGxXnGLNAAYAR2CShS9L3ToXApmowdxU4ag7YdJFBunixUx7gk89Cqk8BIAGBUWaB0IbIGHMr3QqNwWGUAPA/RPmus+XcB4yZBPmavO8GKW+V+/6P0T8nGasHxHhxr74FgHIsLl+YGPpApJdLx75cQqCEQAmB0R2KxoZxr/6FAzpwwF8eSx5uwugU8AAAAABJRU5ErkJggg==');
  background-size: contain;
}

.netlogo-widget-container.interface-unlocked {
  background-color: rgb(234, 255, 225);
}

.netlogo-toggle-container.enabled:hover .netlogo-interface-unlocker {
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAADQElEQVR4Xu2a8bFNMRDGv1cBKuBVgArQARWgAlSAClABKkAFngpQATqgAubn5c7cuXOym01yzsu7k515f7y5e5Lsl91vN9mcaDu5JemOpLuSbkji/335JumnpDNJXyTx/+pysvIMVyU9kfQoGR2ZDjDeSXoj6Xfkw4jumgA8l/RUEiC0CMa/lvSyZZDct2sAgGt/qNhxzz484kHv0OgNAK7+1rOk8ffHKTQahzn/vCcAuPyLLqvyB2GeLiHRC4Atdv4Qli6e0AOA+ynm/X071/gl6WNiduIakoM3IEvGul46UOIExqqWVgBY9I9Cpie3kxW8/A4YsD41gyeAd9qSJlsBgO3ZNUv+JB0KnIhQMLG7V5yP0CE7VEkLACzwszPr91T51RYyeBjA3XTmuZf0wiC0AIDxgJCTVuN345aAAEiAEJZaAKjlif2c4PaA48V76YLhBYy0wgEugFRDUgsAZPbKmIkc3bsmYDxqjZw8S+S5CQDsRo6l2X08pDbucwYQCuxwzgvIMlZILo5b6wF/DZjfp9NfaCcKlTkdPjR0w/aEP0hFy1djEaSkpuLEGNsrum5HeacGAC/9XVvB/XeYeOQbTodrAFAzZmEE/Fezwm8TALwMcJEAhDNBzWK9dFQzZi8PCKffmsVOAJyCpAbU6QEBBCwSnCEQLcFr3HVywOQA+1RW41UBCjALoVU4gBvf/QMI5Sh/OYlefUWMR9c68XFa3L8T4GDGASorJbvlxXzUgC31XY+YABRsx/QAh/ULMLwwlRkCXmE0OaDAOScHrMQBPH3Z9Q249+cpTW8ZkgPoDnO5edg0AQQuUyPdYQ+wIQGw7u28C1fP4MPfhwOAfuHh87jDRVPK9vKC4QD4VNBOt7pOl94DStpXRw0AO2g1TrzGx6X3AAywXnR4bw6OAgCMWGqgeo3PqPHoD0eCOyOWFrZGxTkBGPUwtNRC91rfRxUCS9Vg7ypwaA5YeshAhWg9vDgqD8jdQ1htrwlABQJDZgHrQMQR2XsVGsFhSACs80DPc8CwJMj7wdwL0t2z+cguW7pDekAv40rGmQCMWgmW7F4PnekB0wOcV+uzM1QQaGuc0wum7aIyOWBygMMB/wCoI9hBlHmMqwAAAABJRU5ErkJggg==');
}

.netlogo-interface-unlocker.interface-unlocked {
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAADbklEQVR4Xu2b4VXbMBSFdbVA2w3aCZpOUJgAOkGRPABlgtIJSv9HMp0AMkHDBIUJChuEAcjreSGhqWPJsi2wfSyfk3+SrPfp6j5ZUiBG/mDk8YsEIClgYASstR+5ywAmQojXRHQrhLgFcK+Uuq4bTu+nQJ7nHOQBER0COKwI8JaI5gAutdazEBi9BpDn+TERnfJIhwRTKHMN4EQpNffV7SWAPM8nRHQhhHjbIPBiFVbEJ6XUoqyt3gEwxhwByCMEvt0EewRD2PGIXgEwxnwB8D1y8JvmFgD2ixB6A6DuyBPRHQA2vQmAV4HQGMIHpRRnjtXTCwDrOf/LZ3ZEdA/gnH/FUeRM8fDwsCel5CzxuQIGmyMrYeUJvQBgrf0thOC87npmAI5cRrZdKc/zveVyeQbgvasxIvqWZRlnl+4BVEmfiFSWZeeBEl8VW68duM6Box5PhXcMtHMFWGv/uNIdEZ1kWXZWJ/jtssYYlrtLCT+11kedAmC5EhHP/bJnprWuWvl52bASlsslp8Ayk1xord90CsBay6N7XLpAeZTok1u3UMEpgK+Od+x3DcAl/9ajX5gKPOfLVPCjawBUNjJNjM+nEGvtpcMQrzoDsM79nP52nrVDt5b/pmFjjGsadArAaYBa66gDM51OD6WU/HG1C7upubSt58sAsQH43hWVdB0oCYBnDZAUENkD0hTwqC15QB3jilm2Nya42WePGVxIW7yvT0SuL729TRsA7tp+E3g9wFpbuhwNCeIlymxvXjR9XwLwuM1eqjaMQQE+5SQASQEjMMEXmwJEdANgUfOwwmvuMbLAswPgwKWUvG//dPbm2YSolc16D4BPbKSUk7LFim/TM5RC7wEIIZwbmBXb3kEMeg+gqoNts0xV+0EUPYVirANWJyxl7/BtfIZ2fAgA+MISHznvXD4wxlwE3OsZfhYQQuycu8cwQCYzCAVwR4sqsNby5aTVlbY2z2AAFDcyR6eAIoDRLITW8/Qmy7L/bnhUXXwInRZDmQJXWuunbSwOLsYiaEgmuLMWGBUAl0zbrgIHo4DRAwg1tCblhmKCTWILqpMAbF1qDCJWs1CMr8Gar6xXPCkgKeDfvd562gkrnaZAjMVKGOtmpZ7dA/irrVnXXqaWlHJe9cenNj3p7IZIm07HrJsAxKQ5xLZGr4C/ICqoLrwEHLcAAAAASUVORK5CYII=')
}

.netlogo-toggle-container.enabled:hover .netlogo-interface-unlocker.interface-unlocked {
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAC3klEQVR4Xu2b8TUEMRDGv6sAHVABKuAqQAWoABWgAlSAClABVwEqQAdUwPtW1tu3l2STzaxNLsl7+5cke/ObL5PZSUyQeZtkbj8KgKKA9AhsqZ+8AWAZwLt6vgC8+JqTwhKgkTsAdtVjs5EwngDcA3hwgRE7gCMAZ8rTLvY0+1ANJwqIcWysACjvOwCrvlZr+lMRewA+dXPFCOAAwLWA4c0puDQIYS5GxAbgGMCFsPH1dFTAtA0hJgC+nv9Q0Z/LZckRGiFsqnHVkFgA0IjHjmDHbe5GPW0pc6fYVrvEfgcMjqUSqpgQC4BnAIRgatzSqBBtIGsNIohLAOuW+c7V7hIFgC7pHyqvO6q86kZFUC3MH3SNINcINAYFvFm2O+7j9GbfRrmblHBLVY0NgHLl2tc1yp7ZX0irU2VdkKQKVsYGQO8y29M1SpT7d2hjJnlqmGQ6NgCT/CW837SZ3tap4GpsAN8Gz/QJfDal8ONIFxBnYwLgtsftb0j513OblsGoAGwBUNoxDKb8uJpr0i/yCVj/CcD4rgLAx2XCfYsCLEmQtDLLEjDBlibts0rKEohlCdR1dh/vSfRlImT60qM66lZXfkLeaY0BpnQ05IWSY/+KFwGTZg/AqDYGwRwUYBRPAVAUUJaAaAx4VaVrn8OKruAusQsMHgNoOMvbzQMLWy2uy+jm36MHwBMbelxXwLQVPV0hRA/AVsC05fsLA6DLQ6F5Rtf8riC1/STygOqExfArbIVP1x8ePQAawiNn3QUlFiJDT3eSADB37q6+9EynPq7eZ78kAOhUwLs5Ep/ayQBoV5cktsCkFNAGkE0iRC8xE2zf8Oi6+OAaB5JYAjN1R6dplEQSlMwS0OUCWQEwyTQ0C0xGAdkDcA1offolEQT7GOY6pgCoLzW6EvPpJ/E16PO+Pn2LAooCfv9rZJBWlkA5GBlQXkKaZV2BzyBtzBsigxjkO2kB4Ets0fpnr4Af4sW1RwixQEAAAAAASUVORK5CYII=')
}

.netlogo-widget.interface-unlocked {
  user-select:      none;
  -moz-user-select: none;
  opacity:          0.7;
}

.netlogo-widget.interface-unlocked:hover,
.editor-overlay:hover + .netlogo-widget.interface-unlocked,
.editor-overlay.selected + .netlogo-widget.interface-unlocked {
  cursor:     default;
  opacity:    1;
}

.netlogo-widget.selected {
  z-index: 53;
}


.context-menu-item {
  border-bottom: solid 1px #dfdfdf;
  color:         #0066aa;
  cursor:        pointer;
  font-size:     18px;
  padding:       5px;
  user-select:   none;
  -moz-user-select: none;
}

.context-menu-item.disabled {
  color:  #999;
  cursor: default;
}

.context-menu-item:hover:not(.disabled) {
  background-color: #0066aa;
  color:            white;
}

.context-menu-item:last-child {
  border-bottom: none;
}

.context-menu-list {
  list-style: none;
  margin:     0;
  padding:    0;
}

.widget-context-menu {
  background-color: white;
  border:           solid 1px #dfdfdf;
  box-shadow:       1px 1px 2px #cfcfcf;
  margin:           0;
  padding:          8px 10px;
  position:         absolute;
  width:            200px;
  z-index:          80;
}

.widget-edit-popup {
  background-color: white;
  border:           1px solid black;
  border-radius:    5px;
  box-shadow:       0 0 10px rgba(0,0,0,0.5);
  padding:          10px 10px 0 10px;
  position:         absolute;
  outline:          none;
  width:            510px;
  z-index:          100;
}

.widget-edit-form {
  color:         #1d1d1d;
  margin-bottom: 10px;
}

.widget-edit-form label {
  user-select:      none;
  -moz-user-select: none;
}

.widget-edit-form-overlay {
  background-color: rgba(0, 0, 0, 0.5);
  height: 100%;
  position: relative;
  width: 100%;
  z-index: 95;
}

.widget-edit-form-title {
  color:         #111111;
  cursor:        default;
  font-weight:   bold;
  margin-bottom: 10px;
  text-align:    center;
  user-select:   none;
  -moz-user-select: none;
}

.widget-edit-form-button-container {
  margin-top: 10px;
  text-align: center;
}

.widget-edit-closer {
  color:       #7F7F7F;
  cursor:      pointer;
  font-weight: bold;
  position:    absolute;
  right:       10px;
  top:         10px;
  user-select: none;
  -moz-user-select: none;
}

.widget-edit-closer:hover {
  color: black;
}

.widget-edit-text {
  font-size: 20px;
}

.widget-edit-checkbox-wrapper {
  white-space: nowrap;
}

.widget-edit-checkbox {
  height: 13px;
}

.widget-edit-input-label {
  margin-right: 10px;
  white-space:  nowrap;
}

.widget-edit-input {
  width: 100%;
}

.widget-edit-input[type="number"] {
  text-align: right;
}

.widget-edit-hint-text {
  color:       #4a4a4a;
  font-size:   15px;
  margin:      2px 0 8px 0;
  user-select: none;
}

.widget-edit-dropdown {
  font-size: 14px;
  height:    30px;
  margin:    0 10px;
}

.widget-edit-inputbox {
  font-size:   20px;
  height:      33px;
  margin-left: 10px;
  padding:      4px;
}

.widget-edit-textbox {
  font-size: 14px;
  height:    115px;
  max-width: 100%;
  min-width: 100%;
}

.widget-edit-fieldset {
  border-radius: 8px;
}

.widget-edit-legend {
  user-select: none;
  -moz-user-select: none;
}

.widget-resize-handle {
  background-color: #727272;
  height:           10px;
  width:            10px;
  position:         absolute;
  z-index:          60;
}

.initial-color {
  color: initial;
}

.plot-pen-row {
  border-bottom: 3px solid gray;
  padding:       8px;
}

.plot-pen-row.open {
  transition: all 0.1s ease-in;
}

.expander {
  border:        2px solid #909090;
  border-radius: 26px;
  height:        26px;
  margin-right:  15px;
  text-align:    center;
  transform:     rotate(0deg);
  transition:    transform 0.1s ease-in;
  user-select:   none;
  width:         26px;
}

.expander:hover {
  background-color: #fffbcb;
}

.code-container-label:hover .expander {
  background-color: #fffbcb;
}

.open .expander {
  transform:  rotate(90deg);
  transition: transform 0.1s ease-in;
}

.expander-label {
  height:      25px;
  line-height: 25px;
  margin-left:  8px;
  font-size:   16px;
}

.code-container-label .expander-text {
  line-height: 30px;
}

.plot-pen-delete {
  font-size: 14px;
  height:    33px;
}

.plot-editor .CodeMirror * {
  font-size: 14px;
}

.code-body {
  margin:   0px;
  overflow: hidden;
}