.colmena-V .c-c-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  /* Color oscuro con opacidad */
  z-index: 1000;
  /* Z-index superior al del modal */
  backdrop-filter: blur(5px);
  /* Efecto de desenfoque (opcional) */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: none;
}

.colmena-V .c-c-modal__container {
  position: relative;
  width: 85%;
  height: 336px;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.5);
  box-shadow: 0px 20px 20px 0px #00000014;
}

@media (min-width: 400px) {
  .colmena-V .c-c-modal__container-S{
    width: 326px;
    height: 336px;
  }
  .colmena-V .c-c-modal__container-M{
    width: 326px;
    height: 336px;
  }
  .colmena-V .c-c-modal__container-L{
    width: 326px;
    height: 336px;
  }
  .colmena-V .c-c-modal__container-XL{
    width: 326px;
    height: 336px;
  }
}

@media (min-width: 700px) {
  .colmena-V .c-c-modal__container-S{
    width: 326px;
    height: 336px;
  }
  .colmena-V .c-c-modal__container-M{
    width: 600px;
    height: 400px;
  }
  .colmena-V .c-c-modal__container-L{
    width: 600px;
    height: 400px;
  }
  .colmena-V .c-c-modal__container-XL{
    width: 600px;
    height: 400px;
  }
}

@media (min-width: 1024px) {
  .colmena-V .c-c-modal__container-S{
    width: 465px;
    height: 357px;
  }
  .colmena-V .c-c-modal__container-M{
    width: 600px;
    height: 400px;
  }
  .colmena-V .c-c-modal__container-L{
    width: 800px;
    height: 400px;
  }
  .colmena-V .c-c-modal__container-XL{
    width: 1000px;
    height: 400px;
  }
}

.colmena-V .c-c-modal__info,
.colmena-V .c-c-modal__buttons {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 70%;
}

.colmena-V .c-c-modal__buttons {
  margin-bottom: 1rem;
}

.colmena-V .c-c-modal__button {
  margin: .4rem;
  padding: 14px;
  border-radius: 10px;
  border: none;
  width: 100%;
  font-size: var(--cp-size-12);
  line-height: var(--height-cp-size-12);
  font-family: var(--font-family-project);
}

.colmena-V .c-c-modal__button--close {
  position: absolute;
  top: 5px;
  width: 10px;
  height: 10px;
  margin-right: 1rem;
  border-radius: 50%;
  align-self: flex-end;
}

.colmena-V .c-c-modal__button:hover {
  cursor: pointer;
}

@media (min-width: 1024px) {
  .colmena-V .c-c-modal__button {
    font-size: var(--b-size-14);
    line-height: var(--height-b-size-14);
    font-family: var(--font-family-project);
  }
}

.colmena-V .c-c-modal__close-icon {
  position: absolute;
  top: 33%;
  bottom: 50%;
  right: 20%;
  left: 32%;
}

.colmena-V .c-c-modal__message {
  font-size: var(--sb-m-size-18);
  line-height: var(--height-sb-m-size-18);
  font-family: var(--font-family-project);
  margin: 20px auto 0;
  font-weight: 500;
}

@media (min-width: 1024px) {
  .colmena-V .c-c-modal__message {
    font-size: var(--sb-d-size-22);
    line-height: var(--height-sb-d-size-22);
    font-family: var(--font-family-project);
  }
}

.colmena-V .c-c-modal__description {
  font-size: var(--cp-size-12);
  line-height: var(--height-cp-size-12);
  font-family: var(--font-family-project);
  margin-top: 5px;
}

@media (min-width: 1024px) {
  .colmena-V .c-c-modal__description {
    font-size: var(--b-size-14);
    line-height: var(--height-b-size-14);
    font-family: var(--font-family-project);
  }
}