/* Make the injected button fill the whole control */
.contact-form-b .cselect { position: relative; width: 100%; }

.contact-form-b .cselect__btn{
  width: 100%;
  /* min-height: 44px; */
  padding: 10px 12px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  /* border: 1px solid lab(0% 0 0 / 0.2); */
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  text-align: left;
}

.contact-form-b .cselect__btn.is-placeholder .cselect__label {
  color: var(--color-gray-500);
}

/* Your injected SVG size = 16x16 */
.contact-form-b .cselect__arrow svg{
  width: 16px;
  height: 16px;
  /* display: block; */
}

/* Opened list (you can fully style this) */
.contact-form-b .cselect__menu{
  position: absolute;
  left: 0; right: 0;
  top: calc( 100% + 2px);
  margin-top: 0;
  padding: 6px;
  list-style: none;
  border: 1px solid lab(0% 0 0 / 0.2);
  border-radius: 12px;
  background: #fff;
  gap: 1px;
  /* box-shadow: 0 12px 28px rgba(0,0,0,.12);
  max-height: 260px;  */
  overflow: auto;
  display: none;
  z-index: 2;
}
.contact-form-b .cselect.is-open .cselect__menu{ 
  display: flex;
  flex-direction: column; 
}

.contact-form-b .cselect__opt{
  padding: 10px 10px;
  border-radius: 10px;
  cursor: pointer;
}
/* rgba(0,0,0,.06) */
.contact-form-b .cselect__opt:hover{ background: var(--accent-2); }
.contact-form-b .cselect__opt.is-active{ background: var(--accent-2); }
.contact-form-b .cselect__opt[aria-selected="true"]{ background: rgba(59,130,246,.15); }
.contact-form-b .cselect__opt[aria-disabled="true"]{
  opacity: .5;
  cursor: not-allowed;
}
.contact-form-b .cselect__opt[aria-disabled="true"]:hover{
  background: transparent;
}