:root {
  --color-white: #fff;
  --color-gray:#303841;
  --color-primary: #1d488a;
  --color-secondary: #F59E0B;
}

html {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

.Header {
  display: flex;
  color: var(--color-white);
  justify-content: space-between;
}

.Header-title {
  font-weight: 700;
}

.Frame-panel--sidebar {
  background-color: var(--color-gray);
}

.Tree-title,
.Tree-collectionLabel {
  color: var(--color-white);
}

.Tree-entityLink,
.Tree-collapse {
  color: rgba(255, 255, 255, 0.7);
}

.Tree-entityLink:hover,
.Tree-collectionLabel:hover {
  color: var(--color-white);
  background-color: #46515e;
}

.is-current .Tree-entityLink {
  color: var(--color-white);
  background-color: #738497;
}

.Tree-depth-2 > .Tree-collectionLabel {
  font-weight: bold;
}

.Tree-collectionLabel::before {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgY2xhc3M9ImZlYXRoZXIgZmVhdGhlci1jaGV2cm9uLWRvd24iPjxwb2x5bGluZSBwb2ludHM9IjYgOSAxMiAxNSAxOCA5Ij48L3BvbHlsaW5lPjwvc3ZnPg==");
  background-size: 0.75rem;
}

[dir=ltr] .Tree-collection.is-closed .Tree-collectionLabel::before {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgY2xhc3M9ImZlYXRoZXIgZmVhdGhlci1jaGV2cm9uLXJpZ2h0Ij48cG9seWxpbmUgcG9pbnRzPSI5IDE4IDE1IDEyIDkgNiI+PC9wb2x5bGluZT48L3N2Zz4=");
}

.Pen {
  background-color: #e8ebee;
}

.Browser-tabs {
  background-color: var(--color-white);
  border-bottom: 1px solid rgba(70, 81, 94, 0.25);
}

.Status-dot[style] {
  background-color: #10B981;
  border-color: #10B981 !important;
  width: 0.35rem;
  height: 0.35rem;
}

.Tree-aside {
  opacity: 1;
  color: rgba(255, 255, 255, 0.6);
}

.Search-input {
  background-color: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.2);
  color: var(--color-white);
}

.Badge {
  background-color: var(--color-secondary);
  color: var(--color-white);
  border-radius: 3px;
  padding: 1px 2px;
  font-weight: 700;
  font-size: 12px;
}

.Icon {
  width: 1.5rem;
  margin-right: 1rem;
}