.ga-page-header {
  @apply flex w-full flex-col items-start gap-1 p-0;

  .ga-page-header__global-navigation {
    @apply flex w-full items-center justify-between rounded bg-(--ga-color-surface-primary) px-4 py-3;
  }

  .ga-page-header__menu-breadcrumbs {
    @apply flex shrink-0 grow basis-0 items-center gap-4;
  }

  .ga-page-header__header-actions {
    @apply flex items-center gap-2 bg-(--ga-color-surface-primary);
  }

  .ga-page-header__page-navigation {
    @apply flex w-full items-center justify-between self-stretch px-4 pb-3;
  }

  .ga-page-header__page-nav-start {
    @apply flex items-center gap-3;
  }

  .ga-page-header__page-nav-end {
    @apply flex items-center gap-2;
  }
}

@media (max-width: 767px) {
  .ga-page-header .ga-page-header__global-navigation {
    @apply flex-wrap gap-y-2;
  }

  .ga-page-header .ga-page-header__header-actions {
    @apply ml-auto;
  }

  .ga-page-header .ga-page-header__menu-breadcrumbs {
    @apply contents;
  }

  /* The breadcrumb wraps to row 2 and stretches to full width. */
  .ga-page-header .ga-page-header__menu-breadcrumbs .ga-breadcrumb {
    @apply order-last basis-full;
  }
}

@media (min-width: 768px) {
  .ga-page-header .ga-page-header__global-navigation {
    @apply w-auto self-stretch;
  }

  .ga-page-header .ga-page-header__page-navigation {
    @apply w-auto;
  }
}

@media (min-width: 1440px) {
  .ga-page-header .ga-page-header__header-actions {
    @apply bg-transparent;
  }
}