// Using a ridiculously high z-index so the Radix popover menu
// will appear above other content when it is NOT in a portal.
// This is needed so we don't need to do weird stuff in the ThemeProvider
// to get around the Portal not being part of the ThemeProvider's
// DOM ancestors.
.amplify-menu-content-wrapper {
  z-index: 999999;
}
.amplify-menu-trigger {
  display: flex;
  justify-content: center;
  align-items: center;
}
.amplify-menu-content {
  background-color: var(--amplify-components-menu-background-color);
  border-radius: var(--amplify-components-menu-border-radius);
  box-shadow: var(--amplify-components-menu-box-shadow);
  flex-direction: var(--amplify-components-menu-flex-direction);
  gap: var(--amplify-components-menu-gap);
  min-width: var(--amplify-components-menu-min-width);
  max-width: var(--amplify-components-menu-max-width);
  border-color: var(--amplify-components-menu-border-color);
  border-width: var(--amplify-components-menu-border-width);
  border-style: var(--amplify-components-menu-border-style);
}
.amplify-menu-content__item {
  min-height: var(--amplify-components-menu-item-min-height);
  padding-inline-start: var(
    --amplify-components-menu-item-padding-inline-start
  );
  padding-inline-end: var(--amplify-components-menu-item-padding-inline-end);
}

// Remove Button border radius to fit within content wrapper
// but only the menu items in between first and last
.amplify-menu-content__item:not(:first-child):not(:last-child) {
  border-radius: 0;
}

// Remove Button bottom border radius from first menu item
.amplify-menu-content__item:first-child {
  border-end-end-radius: 0; // border-bottom-right-radius (ltr reading mode)
  border-end-start-radius: 0; // border-bottom-left-radius (ltr reading mode)

  // required for Safari 14 and below
  // see: https://caniuse.com/mdn-css_properties_border-end-end-radius
  @supports not (border-end-end-radius: 0) {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }
}

// Remove Button top border radius from last menu item
.amplify-menu-content__item:last-child {
  border-start-end-radius: 0; // border-top-right-radius (ltr reading mode)
  border-start-start-radius: 0; // border-top-left-radius (ltr reading mode)

  // required for Safari 14 and below
  // see: https://caniuse.com/mdn-css_properties_border-end-end-radius
  @supports not (border-end-end-radius: 0) {
    border-top-right-radius: 0;
    border-top-left-radius: 0;
  }
}