.folder-list.has-account-groups {
  scrollbar-width: thin;
  scrollbar-color: #435249 transparent;
  align-content: start;
  gap: 5px;
  max-height: calc(100dvh - 300px);
  padding-right: 4px;
  overflow-y: auto;
}

.folder-groups-label {
  color: #66746c;
  letter-spacing: .11em;
  justify-content: space-between;
  align-items: center;
  margin: 12px 8px 4px;
  font: 600 9px DM Mono, monospace;
  display: flex;
}

.folder-groups-label b {
  color: #8ba095;
  font-weight: 600;
}

.account-folder-group {
  background: #111512;
  border: 1px solid #29332d;
  border-radius: 11px;
  overflow: hidden;
}

.account-folder-group > summary {
  color: #aebbb4;
  cursor: pointer;
  grid-template-columns: 20px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 58px;
  padding: 9px 10px;
  list-style: none;
  display: grid;
}

.account-folder-group > summary::-webkit-details-marker,
.account-folder-group > summary::marker {
  display: none;
  content: "";
}

.account-folder-group > summary:hover,
.account-folder-group[open] > summary {
  color: #eef6f1;
  background: #18201b;
}

.account-folder-group > summary > span:nth-child(2) {
  min-width: 0;
  display: grid;
}

.account-folder-group > summary strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  line-height: 1.25;
  overflow: hidden;
}

.account-folder-group > summary small {
  color: #68766e;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 4px;
  font: 8px/1.25 DM Mono, monospace;
  overflow: hidden;
}

.account-folder-group > summary > b {
  color: var(--acid);
  background: #0c100e;
  border-radius: 999px;
  min-width: 28px;
  padding: 6px 8px;
  text-align: center;
  font: 600 10px DM Mono, monospace;
}

.account-folder-items {
  border-top: 1px solid #29332d;
  padding: 5px;
  display: grid;
}

.account-folder-items .folder-item {
  border-radius: 8px;
  min-height: 38px;
  padding-left: 9px;
}

.account-folder-items .folder-item span:nth-child(2) {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.account-folder-items .folder-item.active {
  color: #07100d;
  background: var(--acid);
}

.account-all-models {
  margin-bottom: 2px;
}

@media (max-width: 760px) {
  .folder-list.has-account-groups {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    height: auto;
    max-height: min(48dvh, 420px);
    padding: 0 3px 4px 0;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .folder-list.has-account-groups > .folder-item,
  .folder-list.has-account-groups > .account-folder-group {
    width: 100%;
  }
}
