#root .css-gwq172 {
  margin: 0;
  padding: 24px 24px 32px;
}

#root .css-32o4gv {
  max-width: 200px !important;
}

#storybook-explorer-menu {
}

#root .css-ohbggj {
  margin: 0;
}

#root .css-1iruc8t {
  padding: 0 20px;
}

#root .search-result-recentlyOpened {
  margin: 0;
}

#root .css-d3imve {
  padding: 16px 0;
}

#root .sidebar-item {
  border-radius: 0;
  color: #000;
}

#root .sidebar-item:hover {
  background: none;
}

#root .sidebar-item > button {
  justify-content: flex-start;
  align-items: center;
  padding: 6px 16px;
}

#root .sidebar-item > button[aria-expanded="true"] {
  background-color: #b2b5ba !important;
}

#root .sidebar-item > button:before {
  content: "";
  background: #000;
  width: 12px;
  height: 12px;
  mask-image: url(../assets/img/cube.svg);
  mask-size: contain;
  mask-position: center;
  mask-repeat: no-repeat;
}

#root .sidebar-item > button > div {
  order: 2;
  margin-left: auto;
}

#root .sidebar-item > button > div > svg {
  display: none;
}

#root .sidebar-item .css-caedy5 {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 6px 20px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
  font-weight: 600;
}

#root .sidebar-item .css-caedy5:after {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
  margin: 0 0 0 auto;
  background: #000;
  mask-image: url(../assets/img/chevron-right.svg);
  mask-size: contain;
  mask-position: center;
  mask-repeat: no-repeat;
}

#root .sidebar-item .css-caedy5 .css-99l9qv {
  display: none !important;
}

#root .sidebar-item[data-selected="true"] {
  background: #141414;
  color: #fff;
}

#root .sidebar-item[data-selected="true"] .css-caedy5:after {
  background: #fff;
}

#root .sidebar-item .css-154pbrb {
  background: #d9dbde !important;
  border-radius: 0;
}

#root .sidebar-subheading {
  margin: 0;
  border-top: solid 1px #d4d4d4;
}

#root .sidebar-subheading button {
  width: 100%;
  padding: 16px;
  font-size: 0.875rem;
  line-height: 1.7142857143;
  font-weight: 600;
  color: #000;
}

#root .sidebar-subheading button:before,
#root .sidebar-subheading button:after {
  content: "";
  background: #000;
  mask-size: contain;
  mask-position: center;
  mask-repeat: no-repeat;
}

#root .sidebar-subheading button:before {
  width: 20px;
  height: 20px;
  mask-image: url(../assets/img/components-nav-icon.svg);
}

#root .sidebar-subheading button:after {
  width: 12px;
  height: 12px;
  margin: 0 0 0 auto;
  mask-image: url(../assets/img/chevron-right.svg);
}

#root .sidebar-subheading button:hover,
#root .sidebar-subheading button:focus {
  background: none;
}

#root .sidebar-subheading button[aria-expanded="true"]:after {
  transform: rotate(90deg);
}

#root .sidebar-subheading .sidebar-subheading-action {
  display: none !important;
}

#root .sidebar-subheading button > div {
  display: none !important;
}

#root .sidebar-subheading#foundations button:before {
  mask-image: url(../assets/img/foundations-nav-icon.svg);
}

#root .sidebar-subheading#tokens button:before {
  mask-image: url(../assets/img/tokens-nav-icon.svg);
}

#root .sidebar-subheading#patterns button:before {
  mask-image: url(../assets/img/patterns-nav-icon.svg);
}

#root .sidebar-subheading#layouts {
  display: none !important;
}

#root .sidebar-item + .sidebar-subheading {
  margin: 16px 0 0;
}

button[title="Change the background of the preview"] {
  display: none;
}

.css-gwq172 {
  display: none !important;
}

.driver-popover-prev-btn {
  display: none !important;
}

.driver-popover-next-btn {
  border-radius: 8px !important;
  border: 2px solid black !important;
  background-color: none !important;
  color: black !important;
  text-shadow: none !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 6px 12px !important;
  margin: 0 !important;
  transition: all 0.2s ease-in-out !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

.driver-popover-next-btn:hover {
  background-color: black !important;
  color: white !important;
}

.driver-popover-description {
  ul {
    list-style: disc !important;
    padding-left: 20px !important;
  }

  li {
    margin-bottom: 10px !important;
  }

  strong {
    font-weight: 600 !important;
  }
}