UPageCard custom title width

<UPageCard
  description="Maak en beheer API keys voor toegang tot de API."
  variant="naked"
  orientation="horizontal"
  class="mb-4"
>
  <template #title>
    <div class="flex items-center justify-between bg-purple-200">
      <span>API keys</span>
      <UModal v-model:open="modalOpen">
        <UButton
          label="Nieuwe API key"
          color="neutral"
          class="w-fit lg:ms-auto"
          @click="modalOpen = true"
        />

        <template #content>
          <UForm
            :schema="schema"
            :state="state"
            class="space-y-4 p-5"
            @submit="onSubmit"
          >
            <UFormField
              label="Naam"
              name="name"
              :ui="{ container: 'w-full' }"
            >
              <UInput v-model="state.name" class="w-full" />
            </UFormField>
            <UFormField
              label="Verlooptijd"
              name="expiration"
              :ui="{ container: 'w-full' }"
            >
              <URadioGroup
                orientation="horizontal"
                v-model="state.expiration"
                value-key="id"
                :items="items"
              />
            </UFormField>

            <UButton type="submit"> Aanmaken </UButton>
          </UForm>
        </template>
      </UModal>
    </div>
  </template>
</UPageCard>