/* Load after the copied prototype styles. Base UI previously supplied these
   structural defaults through utility classes; native controls need them too. */
[data-mv-tabs] [role="tab"],
.contact-chooser .mv-choice-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid transparent;
  background: transparent;
  font-family: inherit;
  font-weight: 500;
  cursor: pointer;
}
[data-mv-tabs] [role="tab"] svg { flex-shrink: 0; }
[data-mv-tabs] [role="tabpanel"] { outline-offset: 5px; }
[data-mv-tabs] [role="tab"]:focus-visible,
.contact-chooser .mv-choice-button:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 3px;
}
.plan-explorer[data-mv-tabs], .service-tabs[data-mv-tabs] {
  display: flex;
  flex-direction: column;
}
[data-mv-tabs] > .mv-tabs,
.contact-chooser .mv-tabs {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  justify-content: center;
}
.plan-tabs [role="tab"],
.mv-tabs [role="tab"],
.contact-chooser .mv-choice-button { flex: 1; }
.contact-chooser .mv-choice-button {
  border-radius: 40px;
  min-height: 52px;
  padding: 15px 27px;
  font-size: 15px;
  color: var(--green);
}
.contact-chooser .mv-choice-button[aria-pressed="true"] {
  background: var(--green);
  color: #fff;
}
[data-mv-tabs] [role="tabpanel"][hidden],
[data-mv-contact] [hidden] { display: none !important; }
@media (max-width: 1150px) {
  .contact-chooser .mv-choice-button { padding-inline: 17px; }
}
@media (max-width: 800px) {
  .contact-chooser .mv-tabs { width: 100%; }
  .contact-chooser .mv-choice-button {
    font-size: 13px;
    padding: 13px 10px;
    min-height: 53px;
    line-height: 1.4;
    white-space: normal;
  }
}

