/**
* Primary Nav Styles
*/
.sw-primary-nav {
  @apply .whitespace-no-wrap .text-pickledBlack .font-bold .appearance-none .leading-normal;
  padding: 0.5rem 1rem;
  transition: all 0.15s cubic-bezier(0.77, 0, 0.175, 1);
  -webkit-appearance: none !important;
  appearance: none !important;
}

.sw-primary-nav span {
  @apply .ml-3 .mr-auto;
  opacity: 1;
  transition: opacity 0.15s cubic-bezier(0.77, 0, 0.175, 1);
}

.sw-primary-nav svg {
  @apply .flex-shrink-0;
  transition: all 0.15s cubic-bezier(0.77, 0, 0.175, 1);
}

.collapsed .sw-primary-nav {
  padding: 0.5rem 11px;
  margin: 0 0.25rem;
}

/* Hover, Open and Focus States */
.sw-primary-nav.open,
.sw-primary-nav:hover,
.sw-primary-nav:focus {
  @apply .bg-secondary-20 .text-secondary-100;
}

.sw-primary-nav.open svg,
.sw-primary-nav:hover > svg,
.sw-primary-nav:focus svg {
  @apply .text-secondary-100;
}

/* Menu Link is Active */
.sw-primary-nav.active {
  @apply .bg-secondary-100 .text-cloudWhite;
}

.sw-primary-nav.active svg {
  @apply .text-cloudWhite;
}

/**
* Secondary Nav Styles
*/
.sw-secondary-nav {
  @apply .text-regentGrey .font-normal .px-4 .py-2 .text-sm .leading-large;
  padding-left: 2.75rem;
}

.sw-secondary-nav span {
  @apply .mr-auto;
}

/* Secondary Focus States */
.sw-secondary-nav:hover,
.sw-secondary-nav:focus {
  @apply .bg-secondary-10 .text-secondary-100;
}

.sw-secondary-nav:hover svg,
.sw-secondary-nav:focus svg {
  @apply .text-secondary-100;
}

/* Secondary Active State */
.sw-secondary-nav.active {
  @apply .text-secondary-100 .bg-cloudWhite;
}

/**
 * Collapsed Nav Styles
 */
.collapsed .nav-items span,
.collapsed .sw-primary-nav .external-link,
.collapsed .arrow {
  @apply .select-none .pointer-events-none;
  opacity: 0;
}

/**
* Icon Styles
*/
svg.arrow,
svg.external-link {
  @apply .fill-current .text-bombayGrey;
}

.sw-primary-nav.open .arrow {
  transform: rotate(180deg);
}