.mp-select{display:block;min-width:0;width:100%}.mp-select select{display:flex;background:var(--mp-color-surface,#fff);border:0!important;padding:0!important;box-sizing:border-box;color:var(--mp-color-secondary,#616161);cursor:pointer;font:inherit;font-size:var(--mp-font-size-label,16px);width:100%}.mp-select select:focus-visible{border-color:var(--mp-color-brand,#026c7c);box-shadow: 0 0 0 3px var(--mp-color-brand-14, rgb(2 108 124 / 0.14));outline:none}.mp-select select:disabled{cursor:not-allowed;opacity:.56}@supports (appearance: base-select) {
  .mp-select select,
  .mp-select select::picker(select) {
    appearance: base-select;
  }

  .mp-select select::picker(select) {
    opacity: 0;
    translate: 0;
    transition:
      0.3s,
      display 0.3s allow-discrete,
      overlay 0.3s allow-discrete;
  }

  .mp-select select:open::picker(select) {
    opacity: 1;
    translate: 0;
    @starting-style {
      opacity: 0;
      translate: 0 -8px;
    }
  }

  .mp-select select {
    align-items: center;
    gap: var(--mp-space-2, 8px);
  }

  .mp-select select > button {
    align-items: center;
    background: transparent;
    border: 0;
    color: inherit;
    display: flex;
    font: inherit;
    min-width: 0;
    padding: 0;
    text-align: left;
  }

  .mp-select selectedcontent {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mp-select select::picker-icon {
    content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDI0IDE2Ij4KCTxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0ibTYgOWw2IDZsNi02IiAvPgo8L3N2Zz4K");
    color: var(--mp-color-secondary, #616161);
    margin-inline-start: auto;
    margin-bottom: 0;
    padding-bottom: 0;
    transition: transform var(--mp-transition-fast, 160ms ease);
  }

  /* .mp-select select:open {
    border-color: var(--mp-color-brand, #026c7c);
    box-shadow: 0 0 0 3px var(--mp-color-brand-14, rgb(2 108 124 / 0.14));
  } */

  .mp-select select:open::picker-icon {
    transform: rotate(180deg);
  }

  .mp-select select::picker(select) {
    background: var(--mp-color-surface, #ffffff);
    border: 2px solid var(--mp-color-secondary-24, #d9d9d9);
    border-radius: var(--mp-radius-md, 8px);
    box-shadow: var(--mp-shadow-card, 0 12px 28px rgb(16 24 40 / 0.14));
    margin-block-start: var(--mp-space-2, 8px);
    padding: var(--mp-space-1, 4px);
  }

  .mp-select option {
    align-items: center;
    background: var(--mp-color-surface, #ffffff);
    border-radius: var(--mp-radius-sm, 6px);
    color: var(--mp-color-secondary, #616161);
    cursor: pointer;
    display: flex;
    font: inherit;
    gap: var(--mp-space-2, 8px);
    margin: 2px;
    min-height: 40px;
    padding: var(--mp-space-2, 8px) var(--mp-space-3, 12px);
  }

  .mp-select option:hover,
  .mp-select option:focus-visible {
    background: var(--mp-color-brand-08, rgb(2 108 124 / 0.08));
    color: var(--mp-color-brand, #026c7c);
    outline: none;
  }

  .mp-select option:checked {
    background: var(--mp-color-brand-tint, #d2e6e9);
    color: var(--mp-color-brand, #026c7c);
    font-weight: var(--mp-font-weight-semibold, 600);
  }

  .mp-select option::checkmark {
    content: "•";
    font-weight: 900;
    color: var(--mp-color-brand, #026c7c);
    margin-inline-start: auto;
    order: 2;
  }
}