/*!***************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./scss/templates/saved-search.scss ***!
  \***************************************************************************************************************************/
:host .saved-search {
  cursor: pointer;
  margin-bottom: 1rem;
  min-height: 5rem;
  overflow: hidden;
  user-select: none;
  width: 100%;
}
:host .saved-search * {
  line-height: 1;
}
:host .saved-search.no-tags .tags {
  display: none;
}
:host .saved-search.no-keyword:not(.no-tags) .keyword {
  display: none;
}
:host .saved-search.no-keyword:not(.no-tags) .tags {
  font-size: 120%;
}
:host .saved-search.no-soundcloud .soundcloud {
  display: none;
}
:host .saved-search.no-callback-url .callback-url {
  display: none;
}
:host .saved-search > *:hover {
  background: rgba(90, 50, 150, 0.5);
}
:host .saved-search > div {
  background: rgba(0, 0, 0, 0.43);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 1rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 1rem;
  transition: background 0.3s;
}
:host .saved-search > div > div {
  color: rgb(255, 255, 255);
  display: block;
  text-align: left;
  width: 100%;
}
:host .saved-search > div > div.header {
  align-items: flex-start;
  display: flex;
  flex-flow: row wrap;
  gap: 1rem;
  justify-content: flex-start;
  width: 100%;
}
:host .saved-search > div > div.header > div.date-btns {
  display: flex;
  flex-flow: column wrap;
  gap: 0.5rem;
  justify-content: flex-end;
  text-align: right;
}
:host .saved-search > div > div.header > div.date-btns > .date {
  font-size: 80%;
}
:host .saved-search > div > div.header > div.date-btns > .btns > div.btn.delete > button {
  background: rgb(90, 50, 150);
  border: #713fbc;
  border-radius: 0.5rem;
  color: rgb(255, 255, 255);
  cursor: pointer;
  padding: 0.5rem 0.75rem;
  transition: background 0.5s, border 0.5s;
}
:host .saved-search > div > div.header > div.date-btns > .btns > div.btn.delete > button:hover {
  background: #713fbc;
  border: #8d63cb;
}
:host .saved-search > div > div.header > div.keyword-tags {
  display: flex;
  flex: 1;
  flex-flow: column wrap;
  font-weight: bold;
  gap: 0.5rem;
}
:host .saved-search > div > div.header > div.keyword-tags > .keyword {
  font-size: 120%;
}
:host .saved-search > div > div.header > div.keyword-tags > .tags {
  color: #8d63cb;
}
:host .saved-search > div > div.parameters {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgb(255, 255, 255);
  display: flex;
  flex-flow: row wrap;
  font-size: 100%;
  gap: 1rem;
  margin-top: 1rem;
  padding-top: 1rem;
}
:host .saved-search > div > div.parameters > div {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}
:host .saved-search > div > div.parameters > div > span:first-child {
  color: rgba(255, 255, 255, 0.5);
  font-weight: normal;
  text-decoration: underline;
}
:host .saved-search > div > div.parameters > div > span:last-child {
  font-weight: bold;
  text-decoration: none;
}
:host .saved-search > div > div.parameters > div > span:last-child, :host .saved-search > div > div.parameters > div > span:last-child * {
  color: rgb(255, 255, 255);
}
:host .saved-search > div > div.parameters > div > span:last-child a {
  font-weight: normal;
}