/* Shelf */
div[role=shelf] {
  background: rgb(26,32,43);
  color: gray;
  border-top: 1px solid rgb(48,83,110);
  box-sizing: border-box;
  font-size: 15px;
  transition: height .1s ease-in;

  flex: 0 0 0px;

  user-select: none;
  position: relative;
}

div[role=shelf].expanded {
  flex: 0 0 160px;
}

div[role=shelf] div[role=shelf-container] {
  box-sizing: border-box;
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: auto;
}

div[role=shelf] > div[role=shelf-tab] {
  position: absolute;
  top: -31px;
  right: 0;
  display: block;
  padding: 5px 10px;
  box-sizing: border-box;
  background: rgb(26,32,43);
  z-index: 100;
  border-top: 1px solid rgb(48,83,110);
  border-left: 1px solid rgb(48,83,110);
  border-radius: 2px 0 0 0;
  white-space: nowrap;
  cursor: pointer;
}

div[role=shelf] > div[role=shelf-tab]:hover {
  color: white;
}

div[role=shelf] > div[role=shelf-tab] > i + i {
  padding-left: 6px;
}

div[role=shelf] ul[role=sections] {
  margin: 0;
  padding: 0;
}

div[role=shelf] ul[role=sections] > li[role=section] {
  padding: 10px 0;
  margin-left: 20px;
  text-transform: uppercase;
  list-style-type: none;
  font-size: 11px;
  color: #ddd;
  text-shadow: 1px 1px 1px black;
  letter-spacing: 1px;
  font-weight: bolder;
  float: left;
}

div[role=shelf] ul[role=sections] > li[role=section] > ul[role=items] {
  padding-left: 0;
  margin-left: 0;
  margin-top: 13px;
  padding-right: 10px;
  min-height: 56px;
}

div[role=shelf]:not(.expanded) ul[role=sections] > li[role=section] > ul[role=items] {
  display: none;
}

div[role=shelf]:not(.expanded) ul[role=sections] > li[role=section] {
  padding-right: 20px;
}

div[role=shelf] ul[role=sections] > li[role=section] > ul[role=items] > li {
  clear: both;
}

div[role=shelf] ul[role=sections] > li[role=section].methods > ul[role=items] > li {
  clear: none;
}

div[role=shelf] ul[role=sections] > li[role=section].methods > ul[role=items] > li:nth-of-type(2n+1) {
  clear: both;
}

div[role=shelf] ul[role=sections] > li[role=section] > ul[role=items] > li {
  background-color: rgb(15,18,23);
  border-radius: 25px;
  color: gray;
  cursor: pointer;
  float: left;
  font-family: "Lucida Console", Monaco, monospace;
  font-size: 12px;
  font-weight: lighter;
  letter-spacing: 0.3px;
  list-style-type: none;
  margin: 2px 0;
  padding: 5px 7px 4px 6px;
  text-shadow: 0 0;
  text-transform: none;
  transition: background-color 0.1s;
}

div[role=shelf] ul[role=sections] > li[role=section] > ul[role=items] > li > span {
  margin-left: 5px;
}

div[role=shelf] ul[role=sections] > li[role=section] > ul[role=items] > li:hover {
  color: white;
}

div[role=raml-editor].light {
  background: rgb(128,128,132);
}

div[role=raml-editor].light div[role=editor] {
  background: rgb(103,103,106);
}

div[role=raml-editor].light div[role=actions] {
  color: rgb(202,204,212);
}

div[role=raml-editor].light div[role=shelf] {
  background: rgb(202,204,212);
}

div[role=raml-editor].light div[role=shelf] > div[role=shelf-tab] {
  background: rgb(202,204,212);
}

div[role=raml-editor].light div[role=shelf] ul[role=sections] > li[role=section] > ul[role=items] > li {
  background-color: rgb(174,176,190);
  color: rgb(72,74,89);
  text-shadow: 1px 1px 1px #ddd;
}

div[role=raml-editor].light div[role=shelf] ul[role=sections] > li[role=section] {
  color: #444;
  text-shadow: 1px 1px 1px #ddd;
}

ul[role=items] > li > i{
  text-shadow: 0 0 2px #000;
}

/* Category colors */
/* TODO: extract color on less files */
/*li.parameters > ul[role=items] > li > i.fa-reply {
  color: #1f77b4;
}
li.security > ul[role=items] > li > i.fa-reply {
  color: #ff7f0e;
}
li.root > ul[role=items] > li > i.fa-reply {
  color: #2ca02c;
}
li.docs > ul[role=items] > li > i.fa-reply {
  color: #d62728;
}
li.methods > ul[role=items] > li > i.fa-reply {
  color: #9467bd;
}
li.responses > ul[role=items] > li > i.fa-reply {
  color: #e377c2;
}
li.resources > ul[role=items] > li > i.fa-reply {
  color: #bcbd22;
}
li.traits-and-types ul[role=items] > li > i.fa-reply {
  color: #17becf;
}*/
li.main > ul[role=items] > li > i.fa-reply {
  color: #859900;
}
li.parameters > ul[role=items] > li > i.fa-reply {
  color: #17becf;
}
li.security > ul[role=items] > li > i.fa-reply {
  color: #d33682;
}
li.root > ul[role=items] > li > i.fa-reply {
  color: #ff7f0e;
}
li.docs > ul[role=items] > li > i.fa-reply {
  color: #ff7f0e;
}
li.methods > ul[role=items] > li > i.fa-reply {
  color: #1f77b4;
}
li.responses > ul[role=items] > li > i.fa-reply {
  color: #17becf;
}
li.body > ul[role=items] > li > i.fa-reply {
  color: #17becf;
}
li.resources > ul[role=items] > li > i.fa-reply {
  color: #d62728;
}
li.traits-and-types ul[role=items] > li > i.fa-reply {
  color: #d33682;
}
