@import (reference) "./../styles/less/core/_typography.less";

// This can't be wrapped in np-popover because styles won't get applied to bottomsheet
//which is opened in a portal hence it won't be contained in np-popover.

.np-popover__container {
  .np-theme-personal & {
    border-radius: var(--radius-medium);
  }

  .np-popover__content {
    color: var(--color-content-secondary);
    font-size: var(--font-size-14);

    p:last-child {
      margin-bottom: 0;
    }
  }

  &.np-panel {
    .np-popover__content {
      padding: var(--size-16) var(--size-24);
      max-width: 276px;

      .np-theme-personal & {
        padding: var(--size-24);
      }
    }
  }

  &.np-bottom-sheet {
    .np-popover__title {
      .np-text-title-section();
    }

    .np-popover__content {
      padding: var(--size-32) var(--size-24);
    }
  }
}