.cc_active,
.not-active {
  display: block;
  width: .5rem;
  height: .5rem;
  border-radius: .5rem;
}

.not-active {
  background-color: rgb(224 36 36);
}

.cc_active {
  background-color: rgb(5 122 85);
}

.hidden-over {
  display: none;
}

.text-gray-900.item-active {
  background-color: var(--blue);
  color: var(--white);
}

.item-active:hover {
  color: var(--filter);
}

.admin-pic {
  height: 4em;
  width: 4em;
  object-fit: contain;
}

.vich-image img {
  height: 8em;
  width: 8em;
  object-fit: contain;
}
.admin-filter-container {
  padding: 1em;
}

.admin-filter-new {
  width: 100%;
}

.icecat-fetch {
  cursor: pointer;
  text-align: center;
  color: #FFF;
  background-color: blue;
  border-radius: 1em;
  padding: .5em;
  margin-top: 1em;
}

.product-choice-feauture {
  display: flex;
  flex-direction: column;
}

.product-choice-feauture input {
  order: 2;
}

.choice-list {
  display: flex;
  gap: 1em;
  flex-wrap: wrap;
  padding: .5em;
}

.choice-item {
  background-color: var(--blue);
  padding: .2em .5em;
  border-radius: .5em;
  cursor: pointer;
  font-size: .8em;
  color: var(--white);
}

.choice-item.selected {
  background-color: var(--green);
}

@media screen and (min-width: 1024px) {
  #admin form > div:not(.map) {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    row-gap: 2em;
  }

  .third {
    width: 30%;
  }

  .half {
    width: 48%;
  }

  .two-thirds {
    width: 65%;
  }

  .admin-filter-container {
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
  }
  
  .admin-filter-container .admin-filter-family {
    width: calc(100% / 4 - 3em);
  }
  
  .admin-filter-new > div {
    margin-left: auto;
    margin-right: auto;
    width: fit-content;
  }
  
  .collection-form {
    display: flex;
    flex-wrap: wrap;
    gap: 2em;
  }
  .collection-form-element {
    width: calc(( 100% - 4em ) / 3);
    border: #91a9c2 1px solid;
    border-radius: 1em;
    padding: 1em;
  }
  
}