body {
  background: #0f1115;
  color: #fff;
  font-family: sans-serif;
}
table {
  width: 100%;
  border-collapse: collapse;
}
td,
th {
  padding: 8px;
  border-bottom: 1px solid #333;
}
tr.bundle {
  background: #1a1f2b;
}
tr.item {
  background: #111;
}
.modal {
  display: none;
  position: fixed;
  inset: 0;
  background: #000a;
}

.filters {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.filters .filter {
    border: solid 1px;
    border-radius: 8px;
    cursor: pointer;
    padding: 4px 8px;
    transition: all 200ms ease-in-out;
}

.filters .filter:hover, .filters .filter.active {
    background-color: #fff;
    color: #000;
}

.filters .filter.active {
    pointer-events: none;
}

.modal {
    position:fixed; 
    background:#252525;
     padding:20px;
     /* border:1px solid #ccc; */
}